I'm looking for a multiple image uploader. I prefer to not use MySQL database and no flash.
Also if it is possible to use some javascript (jQuery maybe?) to perform some cropping and scaling.
The best in all worlds would be to have a nice jQuery plugin which perform all that.
Can you please give me your suggestions?
B.R Carl
Take look at http://www.plupload.com/ which provides fallback engines if certain plugins are not available.
Depending on the engine used, it also provides functionality for resizing images on the client side.
And Yes, it's using jquery.
I've never used it, but I know a lot of people who have been using noSWFUpload, although I'm not sure if this is being maintained anymore.
As far as jQuery for cropping is concerned, you can follow a method like here...
Related
I need to select multiple files and I found one way to do this. But that way only works on newest browsers, using attribute "multiple" on input.
I didnt found any solution on internet.
Can anyone help me to find a solution?
I'm able to use HTML, PHP, JavaScript (jQuery).
Thanks for attention.
There is no native solution to multiple file selection uploading in older browsers. This requires some kind of plugin technology, typically Flash or Java.
I personally use Plupload. It will seamlessly switch between HTML5 and Flash (among others) based on the user's browser. There are plenty of other Flash or Java multi-file upload solutions out there as well.
I think the traditional solution to this is to allow multiple file input elements; like this.
File 1: [_____] (Browse...)
File 2: [_____] (Browse...)
Upload more files...
If the user needs more, just have them click a button at the bottom to create them. At some points, YouTube would allow you to use a Java applet-based upload dialog as well; but since then the opinion of Java applet security has faded quite a lot and most people avoid it entirely.
Having multi-selection is a real benefit to modern browsers, and one that's not really so easy to emulate in the older ones.
I'd like to know which up-and-crop tools you suggest to me. I tried couple of scripts like JCrop but I always get stack with some type of format like bmp. I either can't upload or I can upload but can't crop. If you use (or know) one that works well with different formats, then please just give me its name and I'll be strongly appreciated!
Well, i dont know much about JCrop but you can build it up with several tools.
I think image processing kind of works should be done on server side.
There is a good OOP Library called Imagine. It's mostly based on Python's Imaging Library which is awesome and has decent documentation. And this is its crop functions documentation.
On client side you can use some kind of image area selection tool to let the user determine desired area to crop. imgAreaSelect is good to go. Then you can send crop area to php by JQuery's post function or any other way.
It's amassing that in all this time this haven't got any other answers, I hope this helps.
Like stated in the other answer you should combine a few tools to solve each part of the problem.
To let the user select the cropping area:
If you don't like jCrop you can try Guillotine. It's very lightweight, easy to set up and allows to crop, zoom and rotate images. It has touch support and it's responsive (fluid).
Keep in mind that you can't display image types that the browser doesn't support, but you can convert them in step 3.
To upload the images:
For most cases, once you have the cropping area, with a simple file input will suffice.
Now, if you want to upload files asynchronously check out
this
for a quick and easy set up or this
for a more complex solution.
To actually crop and process the image:
Once uploaded you can crop, convert and process the images on the server, ImageMagick is a great tool for this. It's Open Source and many languages have wrappers for it.
You've tagged the question with PHP so here is a PHP wrapper for ImageMagick.
What is the best way to upload an image, save it temporary, and let some user resize and crop it in some ajaxy interface?
Any serious librarys with PHP?
Brad is right, separate your problem into its independent pieces.
I had some luck with Imagemagick as the backend. Also see here.
For Ajaxy UI tricks, JQuery seems to be the stock advice, although I've hardly used it myself.
Rather than storing temporary, I would store it permanently and do some default resizing/cropping initially. Then, if user wants to edit the default results, there would be additional interface for this.
Users are often lazy and it is OK to have some default processing for such users.
You can upload an image and store the it (the original) in the filesystem permanently. You can then use an image manipulation library (I would recommend having a look at phpThumb) to do the resizing. As for the interface, you can use jQuery or any other user interface library of your choice (see this link). The interface would merely allow user to specify the resize/crop parameters -- phpThumb will do the rest.
For a PHP Image Transformation Library, I always found class.upload.php to be quite handy. It handles resizing/cropping/filling and other basic transformations quite well.
I was trying to upload a photo on facebook using a browser with no flash, and could see that it didn't work.
I am pretty confident in handling files and related issues using Php and have done some sites allowing users to upload and manage files (images, docs etc). But I never thought about the above flash approach. I googled a bit and saw that there are few scripts available on which I can look how it works using flash.
But my questions are, when I should decide to use flash for user uploads. What are the advantages of using this approach? or disadvantages?
Thanks
It isn't a choice between Flash and PHP. You need something on the client to send the data and something on the server to receive it.
Ask yourself the following question:
Does Flash offer anything useful for my project?
The obvious things it lets you do are having a nice UI for selecting multiple files at once, and a simple method for seeing the progress of uploads.
If you decide that it does offer features, then implement it using progressive enhancement. Flickr is an example of this — with Flash you get the fancy uploader, without it you still get a series of regular file inputs. They aren't as nice to use, but they are functional and what would have been used if Flash wasn't an option in the first place
Depends on your audience: If you are pretty sure that your users have flash installed, there is nothing against it. It even gives some neat advantages, like:
Upload of multiple files at once
Progress bar while uploading
Instant preview of uploaded media
etc.
Well, with flash, the obvious letdown is that it will only work when a user has flash (although, you could display something in its place if they didn't). If your a flash programmer and comfortable with flash, I can see how it would be better. You could generate a file list, multiple uploads ect. I would say it's just an alternative to JavaScript for providing interactivity and allowing users to upload content dynamically.
when I should decide to use flash for
user uploads.
use it when the whole website is flash, but that is not professional and you can't count a lot on flash security, while you can write/use a lot of classes for hardening and checking files uploaded by php scripts..
on the other hand, some people like flash upload for progress bars, but you can do such stuff with php and jquery. for example check uplodify
Correction
I don't have flash support on my current browser so when watching uploadify demos I only see the fallback, thanks to soulmerge for making this clear
Has anyone any reources for learning how to implement SVG with php/mysql (and possibly with php-gtk)? I am thinking of making a top-down garden designer, with drag and drop predefined elements (such as trees/bushes) and definable areas of planting (circles/squares). Gardeners could then track over time how well planting did in a certain area.
I don´t really want to get into flash...
I'm looking for a similar solution, and the two relevant questions here are Scripting SVG and Displaying vector graphics in a browser.
Neither of them give much hope, though, as each browser has different vector capabilities. Dojox.gfx appears to be a cross browser javascript graphics library which may do everything you need, but it won't necesarily do it in SVG. Canvas is gaining a lot of support and interest.
-Adam
Here's what I found I guess in some other question, not sure though.
raphael
It's a javascript library for working with svg.
There's an example, but try using browsershots to see if you are actually happy with the support of browsers (IE for example does not have native svg support).
Me personally have decided not to use svg, rather implement images + js solution as I don't think svg is supported enough nowadays.