matheussl / django_multiuploader Goto Github PK
View Code? Open in Web Editor NEWThis project forked from garmoncheg/django_multiuploader
django multiple file uploader plugin AJAX (no flash)
Home Page: http://garmoncheg.blogspot.com/
This project forked from garmoncheg/django_multiuploader
django multiple file uploader plugin AJAX (no flash)
Home Page: http://garmoncheg.blogspot.com/
Django Multiuploader Plugin ---------------------------------------------------------------------- Readme for plugin of Django Multiuploader using jQuery Plugin by Sebastian Tschan(https://blueimp.net/). This is a plugin, made using multiupload form from Sebastian Tschan. It uses jQuey UI and jQuery instead of Flash uploader. On Django side it uses sorl-thumbnails and PIL. You can use it in your applications with simple inclusion tag Requirements: ---------------------------------------------------------------------- - PIL(Python Imaging Library) (for sorl) - sorl-thumbnail's(http://thumbnail.sorl.net/) (for thumbnails generation) - Django 1.2.5 + Tested: ---------------------------------------------------------------------- Currently Tested full functionality under Chrome, Firefox and Safari. Opera somehow fails to add multiple Photos. Will try to fix them as soon as possible. Example usage: ---------------------------------------------------------------------- Adding this AJAX form to your web site is as simple, as adding this 2 tags to your template: {% load multiuploader %} {% multiupform %} Also I've done a demo app repo here at my github. It's called django_multiuploader_usage_demo. For those who can not figure out this manual.) Also feel free to comment it on my blog or send me a e-mail with your troubles/suggestions and usage experience... https://github.com/garmoncheg/django_multiuploader_example_usage/ Installation: ---------------------------------------------------------------------- 1.Install an app. Do it by adding: 'multiuploader', string to your settings.py -> INSTALLED_APPS = () dictionary. Note that is has to have 'sorl.thumbnail', working already. 2.Register urls in your root urlconf urls.py adding string to your urlpatterns like so : url(r'', include('multiuploader.urls')), 3.Copy or symlink files from plugins "media/" directory to your MEDIA_ROOT. 4.Edit templates and styles to meet your needs. (Optional) (for e.g. changing the form design and/or behavior) 5. Include the following js/css. <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/base/jquery-ui.css" id="theme"> <link rel="stylesheet" href="{{ static_url }}multiuploader/styles/jquery.fileupload-ui.css"> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="js/vendor/jquery.ui.widget.js"></script> <script src="http://blueimp.github.com/JavaScript-Templates/tmpl.min.js"></script> <script src="http://blueimp.github.com/JavaScript-Load-Image/load-image.min.js"></script> <script src="http://blueimp.github.com/JavaScript-Canvas-to-Blob/canvas-to-blob.min.js"></script> <script src="{{ static_url }}multiuploader/scripts/jquery.fileupload.js"></script> <script src="{{ static_url }}multiuploader/scripts/jquery.fileupload-fp.js"></script> <script src="{{ static_url }}multiuploader/scripts/jquery.fileupload-ui.js"></script> Settings: ---------------------------------------------------------------------- You can override plugin behavior by adding those settings to your root settings.py: *File delete url to use in your app. default value is 'multi_delete' MULTI_FILE_DELETE_URL = 'multi_delete' *Url to show uploaded image, default is 'multi_image' + key to identify image (about 80 characters long): MULTI_IMAGE_URL = 'multi_image' *Folder to store uploaded pictures inside your MEDIA_ROOT folder MULTI_IMAGES_FOLDER = 'multiuploader_images' Model Usage: ---------------------------------------------------------------------- Plugin stores Uploaded images to a simple model. It has some those fields: * "MultiuploaderImage.filename" CharField to store original (uploaded) file filename * "MultiuploaderImage.file" FileField to store file link to uploaded file in file system * "MultiuploaderImage.key_data" CharField with randomly generated key to use in your model * "MultiuploaderImage.upload_date" DateTimeField to store file upload data with auto now adding You can use it directly in your code like so: #views.py def multi_show_uploaded(request, key): image = get_object_or_404(MultiuploaderImage, key_data=key) url = settings.MEDIA_URL+image.image.name return render_to_response('multiuploader/one_image.html', {"multi_single_url":url,}) And then in template: #'multiuploader/one_image.html' <img src="{{ multi_single_url }}"> I will not stop on model usage here for long. Fell free to ask me any questions appeared... Development plans: ---------------------------------------------------------------------- - Add a way to specify which model to use to store files. Changes: ---------------------------------------------------------------------- See CHANGELOG file for additional changes upon versions.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.