Hi
I have had a request to put a facility on a website to upload pictures by by the person browsing the site. This is so my client can then produce prints from the files.
Can anyone tell me how to achieve this?
Thanks in anticipation -
Kevin
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
FormsToGo can build this for you, although you want to spend a fair
amount of time reading about the very many scary server attacks which
can be easily mounted through an insecure file upload facility.
You can lay out the form in Freeway, no trouble. Make the following
two changes to your form:
In the Form Setup dialog, click on the Extended control, then New,
then add this Name/Value pair in the sub-sub-dialog:
Then draw a text input where you want your file select control to
appear, and while it is selected, choose Item/Extended from the main
menu. Click new, then add:
Be sure to name this new “file” control exactly the way that FormsToGo
recommends in their manual. The PHP standard is to call it ‘userfile’,
and you set that on the Output tab of the Inspector in the Name field.
(The Title field, in the left-most tab of the Inspector, does not set
the actual form element name, except if you’re lucky.)
Finally, you’re going to need an FTP or SFTP application to access
your server, and you’ll need to read up on setting file permissions on
the folder that will be receiving the files. You will want to have
this file outside of the server’s Web root, as this is how an XSS
attack is usually mounted: malicious person uploads a script,
cunningly named fluffyBunny.jpg, into a folder, then requests that
file with a carefully-written URL later on. If you want people to be
able to upload files and then see them on Web pages, you need to be
sure to run those files through a server-side process, like maybe an
image resizing script, which will certainly root out any non-image
files. So the final workflow would be: 1. Customer uploads file, 2.
Server stores the full-size file somewhere outside of the publicly-
visible Web root. 3. Server resizes the image to make a thumbnail to
show for confirmation, and moves that copy into the public folder, and
4. Client downloads the full-size file for printing.
Oh, and by default, most hosts are set up to only accept a 2MB or
smaller upload, so you’ll need to change that on your server using the
control panel.
File uploads are a lot of work to do correctly.
Walter
On Oct 6, 2010, at 9:12 AM, Kevin McElligott wrote:
Hi
I have had a request to put a facility on a website to upload
pictures by by the person browsing the site. This is so my client
can then produce prints from the files.
Can anyone tell me how to achieve this?Thanks in anticipation -
Kevin
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Thanks Walter. This sounds quite complicated but I’ll give it a try. Really appreciate your detailed reply.
Kevin
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Hi Walter
So far so good. I have set up the choose file button and it works fine. Do you know how to set up the ‘upload’ button?
How do you know this stuff?
Regards
Kevin
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
The Upload button would be a normal Submit button added to the same
form. You can change the text on the button to Upload using the Value
setting in the Button Inspector. But the actual text on this button is
not relevant to the file being uploaded. The file will be uploaded as
long as there is an enctype set appropriately and there is a file
input on the page.
Did you get FormsToGo working? You must have a program installed on
your server to “catch” this uploaded file, and FTG can write that
program for you. Otherwise, you will upload the file, and it will
disappear into dev/null almost immediately. (That’s the artificial
singularity at the heart of any Unix filesystem, where all files go
when they aren’t wanted any more.)
I have been programming Web applications since 1997. I started because
I was the only person at the stodgy medical advertising agency where I
worked who was flat-out fascinated with this stuff. I partnered with
our IT guy, who wrote all of my first sites’ form handlers and
database access functions using Microsoft ASP. In the process of
integrating that code with the output of Freeway 1 and soon thereafter
Freeway 2, I learned a lot about how servers process code. Then in
1999, I started teaching myself PHP/MySQL, and had a splash of cold
water about how desperately wrong (and horribly insecure) all of that
ASP had been. I’ve been learning ever since.
Walter
On Oct 14, 2010, at 6:35 AM, Kevin McElligott wrote:
Hi Walter
So far so good. I have set up the choose file button and it works
fine. Do you know how to set up the ‘upload’ button?How do you know this stuff?
Regards
Kevin
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Many thanks Walt.
I have purchased Forms To Go and tested it on my own site but not on the site in question yet as I am still working through the design.
I was handed this job because the client was unhappy with his previous designer not producing things when promised. I am sticking to their design (which is quite nice) but have rebuilt the site totally in Freeway. I was planning to use Mal’s e-commerce for the shop side but it looks pretty clunky compared with what the previous designer produced - this can be viewed at http://www.a1snapz.co.uk/newhtml/orderpictures.php
any suggestions on how to achieved this?
Regards
Kevin
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Is this what the previous designer made, or what you did with the
Mal’s e-commerce stuff? Also, if you use FTG AND Mal’s together,
you’re going to need to split this up into multiple forms, and this is
all starting to look like it’s more complex a problem. Does the
original designer’s work actually function, or is it just a layout
without working back-end at this point?
Walter
On Oct 14, 2010, at 9:47 AM, Kevin McElligott wrote:
I was handed this job because the client was unhappy with his
previous designer not producing things when promised. I am sticking
to their design (which is quite nice) but
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
This is the previous designers page. It seems to function, the files upload to the server which I can see and the ‘Add to Cart’ takes you to a PayPal window showing what you have ordered and a reference number for the file that was uploaded to the server.
Kevin
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
What happens if you add to cart without uploading a file? Does it
display an error?
Walter
On Oct 14, 2010, at 10:08 AM, Kevin McElligott wrote:
This is the previous designers page. It seems to function, the files
upload to the server which I can see and the ‘Add to Cart’ takes you
to a PayPal window showing what you have ordered and a reference
number for the file that was uploaded to the server.Kevin
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
No, it doesn’t give an error, it goes to Paypal and this is on the order
Sizes: A0 (118.9 cm x 84.1 cm)
Colour: Colour
Image Ref: No Picture Uploaded
Wording:
Kev
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Okay, that’s one way to do it. I haven’t done anything with the Mal’s
cart stuff, so I can’t offer any specifics there. Perhaps one of the
other weezards could pipe up? How would you create a hidden form
element in Mal’s that could carry over the photo ID? My napkin-
scratching idea is that you would nest two forms on the page. One
would go to the FTG processor, and would actually post-back to the
same form page. But inside the Mal’s cart, there would be some hidden
form elements populated with PHP, like this:
`<input type=“hidden” name=“photo_id” value="<?= $FTG_form_result_id ?
" />`
That’s completely made-up, I have no idea what FTG’s form handler
does, whether it can assign a serial number to an uploaded file or
not. But the idea is that you would then be submitting that key to the
Mal’s server as a sort of “note field” attached to the rest of the
form. I think that might work, but I rely on Tim or someone else who
really knows the Mal’s cart inside and out to step in here and tell me
whether I’m inventing stuff or not.
Walter
On Oct 14, 2010, at 10:18 AM, Kevin McElligott wrote:
No, it doesn’t give an error, it goes to Paypal and this is on the
orderSizes: A0 (118.9 cm x 84.1 cm)
Colour: Colour
Image Ref: No Picture Uploaded
Wording:Kev
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Hi Walt
Thanks again for your help. I have just been investigating Paypal Merchant Services and they provide a form generating service which looks exactly like the previous designers page.
Paypal then generates html to be pasted into the web page.
Would I put this in using Insert - Mark-up Item? Or is there another way of adding html into the page?
Kev
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Yes, this is precisely how you would do that. But don’t forget, you
also have to integrate that code with the result of the file upload
(processed through FTG). So you will need to work through that part of
the application first, and make sure that FTG gives you some unique
identifier for the uploaded file. Then you’ll need to inject that into
the cart form code so it gets passed through to the commerce side of
things and keeps everything stitched together.
Walter
On Oct 14, 2010, at 10:40 AM, Kevin McElligott wrote:
Would I put this in using Insert - Mark-up Item? Or is there another
way of adding html into the page?
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Wow - heavy
I’ll work my way through it and let you know the outcome.
Thanks again, you’ve been a great help and given me the confidence to tackle this one.
Cheers
Kev
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Hi Walter
Finally got there with some help from the support team at FTG.
One thing I’d like to add to this page is a progress bar - is this possible?
Kev
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Not without a LOT of work. You will need to “catch” the file on your
server using Perl (PHP doesn’t interrupt the upload process to update
progress) and then use an Ajax callback to poll the server for the
file size periodically.
Much simpler is to put a “barber pole” or “spinny-thing” indeterminate
progress indicator on the page, covering the form. Add a floating HTML
box over the top of your form, containing an animated GIF. In the
box’s Extended / DIV Style dialog, add a new pair:
Make a note of the name Freeway has given this floating box (item24 or
something equally useful – change it if you like!).
(Download and install the Protaculous Action from ActionsForge first,
if you don’t have it already.)
Then click once on your Upload button. Open the Item/Extended dialog,
make sure it is targeting the INPUT rather than any other surrounding
tag. Add the following (and make sure this ID is unique on your page):
Add the Protaculous Action to your page and choose the Prototype-
packed library. Click on the first Function Body button and enter the
following (modify to suit the name of your floating box and the ID you
added to your Submit button):
$('myFileUploadButton').observe('mousedown',function(evt){
$('item24').show();
});
What this will do is cause the floating bar to appear the moment
anyone clicks down on the button to submit the form. If you make your
barber-pole image large and background-colored, with the pole
animation centered, it will cover over the upload form and keep people
interested. It will also cover the button so they can’t click again.
Another way to do this is to set the barber-pole GIF as the background
image of your floating cover DIV (center center no-repeat), and set a
solid background color. That keeps your image small and fast to load.
The trick will work either way.
Walter
On Oct 21, 2010, at 9:45 AM, Kevin McElligott wrote:
Hi Walter
Finally got there with some help from the support team at FTG.
One thing I’d like to add to this page is a progress bar - is this
possible?Kev
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Hi Walter
Done this successfully but it has stopped the actual upload function from working.
Kev
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Do you have a link? I am not sure why that would happen.
Walter
On Oct 21, 2010, at 12:06 PM, Kevin McElligott wrote:
Hi Walter
Done this successfully but it has stopped the actual upload function
from working.Kev
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Try changing the event to mouseup. That observer should definitely not
be stopping the click event from happening, but that does appear to be
what is going on.
If you set your form action to Reflector
you can see a diagnostic readout of the entire form input, what came
from where.
Walter
On Oct 21, 2010, at 12:06 PM, Kevin McElligott wrote:
Hi Walter
Done this successfully but it has stopped the actual upload function
from working.Kev
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Thanks Walt, I’ll try this in the morning.
Kev
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options