From: Charles Connell Date: Tue, 17 Dec 2013 05:27:48 +0000 (-0500) Subject: Remove unused code: ajaxuploader, lightboxes, and other things X-Git-Tag: release-20150131~386^2~10^2 X-Git-Url: https://git.librecmc.org/?a=commitdiff_plain;h=a73c589b8a7e64480ef8ab6e8c86878f76f3ad39;p=oweals%2Fkarmaworld.git Remove unused code: ajaxuploader, lightboxes, and other things --- diff --git a/karmaworld/apps/ajaxuploader/README.md b/karmaworld/apps/ajaxuploader/README.md deleted file mode 100644 index 4027161..0000000 --- a/karmaworld/apps/ajaxuploader/README.md +++ /dev/null @@ -1,329 +0,0 @@ -`django-ajax-uploader` provides a useful class you can use to easily implement ajax uploads. - -It uses valum's great uploader: https://github.com/valums/file-uploader, and draws heavy inspiration and some code from -https://github.com/alexkuhl/file-uploader - -In short, it implements a callable class, `AjaxFileUploader` that you can use to handle uploads. By default, `AjaxFileUploader` assumes you want to upload to local storage, but you can select any other backend if desired or write your own (see backends section below). Pull requests welcome! - -Updates -======= - -Version 0.2.1 is released, and contains: - -* JSON parsing of `extra_context` now properly handles datetimes. (Thanks to onyxfish) - - -Version 0.2 is released, and contains: - -* Optional `fileLimit` param for the uploader, to limit the number of allowed files. (Thanks to qnub) -* fhahn's `default_storage` backend. - - -Version 0.1.1 is released, and contains: - -* Support for a CouchDB backend -* A backwards-incompatible change to the location of the ajaxuploader static files. I try to avoid backwards incompatibilities, but since /js and /css are the proper conventions and the lib is relatively young, it seemed better to get things right now, instead of waiting. The static files are now at: - * `{{STATIC_URL}}ajaxuploader/js/fileuploader.js` - * `{{STATIC_URL}}ajaxuploader/css/fileuploader.css` - - -Usage -===== -Step 1. Install django-ajax-uploader. -------------------------------------- -It's in pypi now, so simply: - -- `pip install ajaxuploader` - -You may also need to install backend-specific dependences. - - - For the S3 backend, you will need [boto](https://github.com/boto/boto). ( `pip install boto` ) - - For the MongoDB GridFS backend, you will need [pymongo](https://github.com/AloneRoad/pymongo) ( `pip install pymongo` ) - -Step 2. (Django 1.3 only) -------------------------- -For Django 1.3 you will need to have the app in your installed apps tuple for collect static to pick up the files. - -First Add 'ajaxuploader' to you installed apps in settings.py - -``` -INSTALLED_APPS = ( - ... - "ajaxuploader", -) -``` - -Then: - -``` -$ python manage.py collectstatic -``` - -Step 3. Include it in your app's views and urls. ------------------------------------------------- -You'll need to make sure to meet the csrf requirements to still make valum's uploader work. Code similar to the following should work: - -views.py - -```python -from django.middleware.csrf import get_token -from django.shortcuts import render_to_response -from django.template import RequestContext - -from ajaxuploader.views import AjaxFileUploader - - -def start(request): - csrf_token = get_token(request) - return render_to_response('import.html', - {'csrf_token': csrf_token}, context_instance = RequestContext(request)) - -import_uploader = AjaxFileUploader() -``` - -urls.py - -``` -url(r'start$', views.start, name="start"), -url(r'ajax-upload$', views.import_uploader, name="my_ajax_upload"), -``` - -Step 4. Set up your template. ------------------------------ -This sample is included in the templates directory, but at the minimum, you need: - -```html - - - - - - - - -
- -
- - -``` - -Backends -======== - -`django-ajax-uploader` can put the uploaded files into a number of places, and perform actions on the files uploaded. Currently, -there are backends available for local storage (default), Amazon S3, MongoDB (GridFS), CouchDB, and a locally stored image -thumbnail backend. Creating a custom backend is fairly straightforward, and pull requests are welcome. - -Built-in Backends ------------------- - -`django-ajax-uploader` has the following backends: - -### local.LocalUploadBackend ### - -Stores the file locally, by default to `{MEDIA_ROOT}/uploads`. - -Requirements: - -* None - -Settings: - -* `UPLOAD_DIR` : The directory to store the uploaded file in, within `MEDIA_ROOT`. Defaults to "uploads". -* `BUFFER_SIZE`: The size of each chunk to write. Defaults to 10 MB. See the caveat at the bottom before changing it. - -Context returned: - -* `path`: The full media path to the uploaded file. - - -### mongodb.MongoDBUploadBackend ### - -Stores the file in MongoDB via GridFS - -Requirements - -* [pymongo](https://github.com/AloneRoad/pymongo) - -Settings: - -* `AJAXUPLOAD_MONGODB_HOST`: Specify the host of your MongoDB server. Defaults to localhost if not specified. -* `AJAXUPLOAD_MONGODB_PORT`: Specify the port of your MongoDB server. Defaults to 27017 if not specified. - -Arguments - -* db (required): Specify the database within MongoDB you wish to use -* collection (optional): Specify the collection within the db you wish to use. This is optional and will default to `fs` if not specified - - -Context returned: - -* None - - -### couch.CouchDBUploadBackend ### - -Stores the file in a CouchDB backend - -Requirements - -* [couchdb](http://code.google.com/p/couchdb-python/) - -Settings: - -* `AJAXUPLOAD_COUCHDB_HOST`: Specify the host of your CouchDB server. Defaults to `http://localhost:5984` if not specified. - -Arguments - -* db (required): Specify the database within CouchDB you wish to use - - -Context returned: - -* None - - -### s3.S3UploadBackend ### - -Stores the file in Amazon's S3. - -Requirements: - -* [boto](https://github.com/boto/boto) - -Settings: - -* `NUM_PARALLEL_PROCESSES` : Uploads to Amazon are parallelized to increase speed. If you have more cores and a big pipe, increase this setting for better performance. Defaults to 4. -* `BUFFER_SIZE`: The size of each chunk to write. Defaults to 10 MB. - -Context returned: - -* None - - -### thumbnail.ThumbnailUploadBackend ### - -Stores a thumbnail of the locally, optionally discarding the upload. Subclasses `LocalUploadBackend`. - -Requirements: - -* [sorl-thumbnail](https://github.com/sorl/sorl-thumbnail) - -Settings: - -* `DIMENSIONS` : A string of the dimensions (WxH) to resize the uploaded image to. Defaults to "100x100" -* `KEEP_ORIGINAL`: Whether to keep the originally uploaded file. Defaults to False. -* `BUFFER_SIZE`: The size of each chunk to write. Defaults to 10 MB. - -Context returned: - -* `path`: The full media path to the uploaded file. - - -### default_storage.DefaultStorageUploadBackend ### - -This backend uses Django's default storage backend (defined by the DEFAULT_FILE_STORAGE setting) to save the uploaded files. - -Requirements: - -* None - -Settings: - -* `UPLOAD_DIR` : The directory to store the uploaded file in, within `MEDIA_ROOT`. Defaults to "uploads". -* `BUFFER_SIZE`: The size of each chunk to write. Defaults to 10 MB. See the caveat at the bottom before changing it. - -Context returned: - -* `path`: The full media path to the uploaded file. - - -Backend Usage ------------------------- - -The default backend is `local.LocalUploadBackend`. To use another backend, specify it when instantiating `AjaxFileUploader`. - -For instance, to use `MongoDBUploadBackend`: - -views.py - -```python -from ajaxuploader.views import AjaxFileUploader -from ajaxuploader.backends.mongodb import MongoDBUploadBackend - -... -import_uploader = AjaxFileUploader(backend=MongoDBUploadBackend, db='uploads') -``` - -To set custom parameters, simply pass them along with instantiation. For example, for larger thumbnails, preserving the originals: -views.py - - from ajaxuploader.backends.thumbnail import ThumbnailUploadBackend - - ... - import_uploader = AjaxFileUploader(backend=ThumbnailUploadBackend, DIMENSIONS="500x500", KEEP_ORIGINAL=True) - - -Custom Backends -------------- - -To write a custom backend, simply inherit from `backends.base.AbstractUploadBackend` and implement the `upload_chunk` method. All possible methods to override are described below. - -* `upload_chunk` - takes a string, and writes it to the specified location. -* `setup`: takes the original filename, does all pre-processing needed before uploading the file (for example, for the S3 backend, this method is used to establish a connection with the S3 server). -* `update_filename`: takes the `request` object and the original name of the file being updated, can return a new filename which will be used to refer to the file being saved. If undefined, the uploaded filename is used. If not overriden by `upload_complete`, this value will be returned in the response. -* `upload_complete`: receives the `request` object and the filename post `update_filename` and does any cleanup or manipulation after the upload is complete. (Examples: cropping the image, disconnecting from the server). If a dict is returned, it is used to update the response returned to the client. - - -Caveats -======= -`BUFFER_SIZE` - some users have reported problems using smaller buffer sizes. I also saw random failed uploads with very small sizes like 32k. 10MB has been completely reliable for me, and in what I've read here and there, so do some testing if you want to try a different value. Note that this doesn't have a big impact on the overall upload speed. - - -Credits -======= -Original implementation and ongoing maintenance by [skoczen](https://github.com/skoczen), courtesy of [GoodCloud](https://www.agoodcloud.com). -Most of the backend abstraction was written by [chromano](https://github.com/chromano) and [shockflash](https://github.com/shockflash). -MongoDB support and saner defaults by [chrisjones-brack3t](https://github.com/chrisjones-brack3t). -Threadsafe improvements and bugfixes by [dwaiter](https://github.com/dwaiter). -CouchDB support by [paepke](https://github.com/paepke). -Default Storage backend by [fhahn](https://github.com/fhahn). -File number limit in upload by [qnub](https://github.com/qnub). -JSON parsing improvements by [onyxfish](https://github.com/onyxfish). - -This code began as such a trivial layer on top of [valum's uploader](http://valums.com/ajax-upload/), [boto](https://github.com/boto/boto), and [alex's ideas](http://kuhlit.blogspot.com/2011/04/ajax-file-uploads-and-csrf-in-django-13.html) it's silly. However, I didn't find any implementations that *just worked*, so hopefully it's useful to someone else. I also drew from these sources: - -* http://www.topfstedt.de/weblog/?p=558 -* http://www.elastician.com/2010/12/s3-multipart-upload-in-boto.html -* https://github.com/valums/file-uploader -* https://github.com/alexkuhl/file-uploader - -Many thanks to all for writing such helpful and readable code! diff --git a/karmaworld/apps/ajaxuploader/__init__.py b/karmaworld/apps/ajaxuploader/__init__.py deleted file mode 100644 index e69de29..0000000 diff --git a/karmaworld/apps/ajaxuploader/backends/__init__.py b/karmaworld/apps/ajaxuploader/backends/__init__.py deleted file mode 100644 index e69de29..0000000 diff --git a/karmaworld/apps/ajaxuploader/backends/base.py b/karmaworld/apps/ajaxuploader/backends/base.py deleted file mode 100644 index 295912c..0000000 --- a/karmaworld/apps/ajaxuploader/backends/base.py +++ /dev/null @@ -1,38 +0,0 @@ -class AbstractUploadBackend(object): - BUFFER_SIZE = 10485760 # 10MB - - def __init__(self, **kwargs): - self.__dict__.update(kwargs) - - def setup(self, filename): - """Responsible for doing any pre-processing needed before the upload - starts.""" - - def update_filename(self, request, filename): - """Returns a new name for the file being uploaded.""" - - def upload_chunk(self, chunk): - """Called when a string was read from the client, responsible for - writing that string to the destination file.""" - raise NotImplementedError - - def upload_complete(self, request, filename): - """Overriden to performs any actions needed post-upload, and returns - a dict to be added to the render / json context""" - - def upload(self, uploaded, filename, raw_data): - try: - if raw_data: - # File was uploaded via ajax, and is streaming in. - chunk = uploaded.read(self.BUFFER_SIZE) - while len(chunk) > 0: - self.upload_chunk(chunk) - chunk = uploaded.read(self.BUFFER_SIZE) - else: - # File was uploaded via a POST, and is here. - for chunk in uploaded.chunks(): - self.upload_chunk(chunk) - return True - except: - # things went badly. - return False diff --git a/karmaworld/apps/ajaxuploader/backends/default_storage.py b/karmaworld/apps/ajaxuploader/backends/default_storage.py deleted file mode 100644 index 28bc1ca..0000000 --- a/karmaworld/apps/ajaxuploader/backends/default_storage.py +++ /dev/null @@ -1,33 +0,0 @@ -import os - -from django.core.files.storage import default_storage -from django.core.files.base import ContentFile -from django.template.loader import render_to_string - -from ajaxuploader.backends.base import AbstractUploadBackend - - -class DefaultStorageUploadBackend(AbstractUploadBackend): - """ - Uses Django's default storage backend to store the uploaded files - see https://docs.djangoproject.com/en/dev/topics/files/#file-storage - """ - - UPLOAD_DIR = 'uploads' - - def setup(self, filename): - # join UPLOAD_DIR with filename - new_path = os.path.join(self.UPLOAD_DIR, filename) - - # save empty file in default storage with path = new_path - self.path = default_storage.save(new_path, ContentFile('')) - - # create BufferedWriter for new file - self._dest = default_storage.open(self.path, mode='wb') - - def upload_chunk(self, chunk): - self._dest.write(chunk) - - def upload_complete(self, request, filename): - self._dest.close() - return {"path": self.path} diff --git a/karmaworld/apps/ajaxuploader/backends/local.py b/karmaworld/apps/ajaxuploader/backends/local.py deleted file mode 100644 index 34b0fb5..0000000 --- a/karmaworld/apps/ajaxuploader/backends/local.py +++ /dev/null @@ -1,116 +0,0 @@ -from io import FileIO, BufferedWriter -import os - -from django.conf import settings - -from ajaxuploader.backends.base import AbstractUploadBackend -from karmaworld.apps.notes import tasks -from karmaworld.apps.notes.models import Note -from karmaworld.apps.courses.models import Course - -class LocalUploadBackend(AbstractUploadBackend): - #UPLOAD_DIR = "uploads" - # The below key must be synchronized with the implementing project - # Used to store an array of unclaimed file_pks in the django session - # So they can be claimed later when the anon user authenticates - #SESSION_UNCLAIMED_FILES_KEY = KarmaSettings.SESSION_UNCLAIMED_FILES_KEY - - # When a file is uploaded anonymously, - # What username should we assign ownership to? - # This is important because File.save - # behavior will not set awarded_karma to True - # until an owner is assigned who has username != this - #DEFAULT_UPLOADER_USERNAME = KarmaSettings.DEFAULT_UPLOADER_USERNAME - - def setup(self, filename): - self._path = os.path.join( - settings.MEDIA_ROOT, filename) - try: - os.makedirs(os.path.realpath(os.path.dirname(self._path))) - except: - pass - self._dest = BufferedWriter(FileIO(self._path, "w")) - - def upload_chunk(self, chunk): - self._dest.write(chunk) - - def upload(self, uploaded, filename, raw_data): - """ :raw_data: is 0/1 """ - try: - if raw_data: - # File was uploaded via ajax, and is streaming in. - chunk = uploaded.read(self.BUFFER_SIZE) - while len(chunk) > 0: - self.upload_chunk(chunk) - chunk = uploaded.read(self.BUFFER_SIZE) - else: - # File was uploaded via a POST, and is here. - for chunk in uploaded.chunks(): - self.upload_chunk(chunk) - return True - except: - # things went badly. - return False - - def upload_complete(self, request, filename, upload): - path = settings.MEDIA_URL + "/" + filename - self._dest.close() - - self._dir = settings.MEDIA_ROOT - - # Avoid File.objects.create, as this will try to make - # Another file copy at FileField's 'upload_to' dir - print "creating note" - note = Note() - note.name = filename - note.note_file = os.path.join(self._dir, filename) - note.course_id = request.GET['course_id'] - note.is_hidden = True # Pending approval from user - print "saving note" - note.save() - - # FIXME: Make get or create - print "setting up session vars" - #import ipdb; ipdb.set_trace() - if 'uploaded_files' in request.session: - request.session['uploaded_files'].append(note.pk) - else: - request.session['uploaded_files'] = [note.pk] - - # Asynchronously process document with Google Documents API - print "upload_complete, firing task" - tasks.process_document.delay(note) - - return {'note_url': note.get_absolute_url()} - - def update_filename(self, request, filename): - """ - Returns a new name for the file being uploaded. - Ensure file with name doesn't exist, and if it does, - create a unique filename to avoid overwriting - """ - self._dir = settings.MEDIA_ROOT - unique_filename = False - filename_suffix = 0 - - # Check if file at filename exists - if os.path.isfile(os.path.join(self._dir, filename)): - while not unique_filename: - try: - if filename_suffix == 0: - open(os.path.join(self._dir, filename)) - else: - filename_no_extension, extension = os.path.splitext(filename) - #print "filename all ready exists. Trying " + filename_no_extension + str(filename_suffix) + extension - open(os.path.join(self._dir, filename_no_extension + str(filename_suffix) + extension)) - filename_suffix += 1 - except IOError: - unique_filename = True - - if filename_suffix == 0: - #print "using filename: " + os.path.join(self._dir, filename) - return filename - else: - #print "using filename: " + filename_no_extension + str(filename_suffix) + extension - return filename_no_extension + str(filename_suffix) + extension - diff --git a/karmaworld/apps/ajaxuploader/backends/s3.py b/karmaworld/apps/ajaxuploader/backends/s3.py deleted file mode 100644 index be11d13..0000000 --- a/karmaworld/apps/ajaxuploader/backends/s3.py +++ /dev/null @@ -1,33 +0,0 @@ -from multiprocessing import Pool -from StringIO import StringIO - -import boto -from django.conf import settings - -from ajaxuploader.backends.base import AbstractUploadBackend - -class S3UploadBackend(AbstractUploadBackend): - NUM_PARALLEL_PROCESSES = 4 - - def upload_chunk(self, chunk): - self._counter += 1 - buffer = StringIO() - buffer.write(chunk) - self._pool.apply_async( - self._mp.upload_part_from_file(buffer, self._counter)) - buffer.close() - - - def setup(self, filename): - self._bucket = boto.connect_s3(settings.AWS_ACCESS_KEY_ID, - settings.AWS_SECRET_ACCESS_KEY)\ - .lookup(settings.AWS_BUCKET_NAME) - self._mp = self._bucket.initiate_multipart_upload(filename) - self._pool = Pool(processes=self.NUM_PARALLEL_PROCESSES) - self._counter = 0 - - def upload_complete(self, request, filename): - # Tie up loose ends, and finish the upload - self._pool.close() - self._pool.join() - self._mp.complete_upload() diff --git a/karmaworld/apps/ajaxuploader/models.py b/karmaworld/apps/ajaxuploader/models.py deleted file mode 100644 index e69de29..0000000 diff --git a/karmaworld/apps/ajaxuploader/static/ajaxuploader/css/fileuploader.css b/karmaworld/apps/ajaxuploader/static/ajaxuploader/css/fileuploader.css deleted file mode 100644 index d381c88..0000000 --- a/karmaworld/apps/ajaxuploader/static/ajaxuploader/css/fileuploader.css +++ /dev/null @@ -1,31 +0,0 @@ -//.qq-uploader { position:relative; width: 100%;} -// -//.qq-upload-button { -// display:block; /* or inline-block */ -// width: 100%; padding: 7px 0; text-align:center; -// background:#B5D25B; border-bottom:1px solid #ddd;color:#fff; -//} -//.qq-upload-button-hover {background:#A1C436;} -//.qq-upload-button-focus {outline:1px dotted black;} -// -//.qq-upload-drop-area { -// position:absolute; top:0; left:0; width:100%; height:100%; min-height: 70px; z-index:2; -// background:#B5D25B; text-align:center; -//} -//.qq-upload-drop-area span { -// display:block; position:absolute; top: 50%; width:100%; margin-top:-8px; font-size:16px; -//} -//.qq-upload-drop-area-active {background:#A1C436;} -// -//.qq-upload-list {margin:15px 35px; padding:0; list-style:disc;} -//.qq-upload-list li { margin:0; padding:0; line-height:15px; font-size:12px;} -//.qq-upload-file, .qq-upload-spinner, .qq-upload-size, .qq-upload-cancel, .qq-upload-failed-text { -// margin-right: 7px; -//} -// -//.qq-upload-file {} -//.qq-upload-spinner {display:inline-block; background: url("loading.gif"); width:15px; height:15px; vertical-align:text-bottom;} -//.qq-upload-size,.qq-upload-cancel {font-size:11px;} -// -//.qq-upload-failed-text {display:none;} -//.qq-upload-fail .qq-upload-failed-text {display:inline;} diff --git a/karmaworld/apps/ajaxuploader/static/ajaxuploader/js/fileuploader.js b/karmaworld/apps/ajaxuploader/static/ajaxuploader/js/fileuploader.js deleted file mode 100644 index d555b4e..0000000 --- a/karmaworld/apps/ajaxuploader/static/ajaxuploader/js/fileuploader.js +++ /dev/null @@ -1,1316 +0,0 @@ -/** - * http://github.com/valums/file-uploader - * - * Multiple file upload component with progress-bar, drag-and-drop. - * © 2010 Andrew Valums ( andrew(at)valums.com ) - * © 2011 Alex Kuhl (alexkuhl.org) - * - * Licensed under GNU GPL 2 or later, see license.txt. - * - * Source: - * https://github.com/GoodCloud/django-ajax-uploader/blob/master/ajaxuploader/static/ajaxuploader/js/fileuploader.js - */ - -// -// Helper functions -// - -var qq = qq || {}; - -/** - * Adds all missing properties from second obj to first obj - */ -qq.extend = function(first, second){ - for (var prop in second){ - first[prop] = second[prop]; - } -}; - -/** - * Searches for a given element in the array, returns -1 if it is not present. - * @param {Number} [from] The index at which to begin the search - */ -qq.indexOf = function(arr, elt, from){ - if (arr.indexOf) return arr.indexOf(elt, from); - - from = from || 0; - var len = arr.length; - - if (from < 0) from += len; - - for (; from < len; from++){ - if (from in arr && arr[from] === elt){ - return from; - } - } - return -1; -}; - -qq.getUniqueId = (function(){ - var id = 0; - return function(){ return id++; }; -})(); - -// -// Events - -qq.attach = function(element, type, fn){ - if (element.addEventListener){ - element.addEventListener(type, fn, false); - } else if (element.attachEvent){ - element.attachEvent('on' + type, fn); - } -}; -qq.detach = function(element, type, fn){ - if (element.removeEventListener){ - element.removeEventListener(type, fn, false); - } else if (element.attachEvent){ - element.detachEvent('on' + type, fn); - } -}; - -qq.preventDefault = function(e){ - if (e.preventDefault){ - e.preventDefault(); - } else{ - e.returnValue = false; - } -}; - -// -// Node manipulations - -/** - * Insert node a before node b. - */ -qq.insertBefore = function(a, b){ - b.parentNode.insertBefore(a, b); -}; -qq.remove = function(element){ - element.parentNode.removeChild(element); -}; - -qq.contains = function(parent, descendant){ - // compareposition returns false in this case - if (parent == descendant) return true; - - if (parent.contains){ - return parent.contains(descendant); - } else { - return !!(descendant.compareDocumentPosition(parent) & 8); - } -}; - -/** - * Creates and returns element from html string - * Uses innerHTML to create an element - */ -qq.toElement = (function(){ - var div = document.createElement('div'); - return function(html){ - div.innerHTML = html; - var element = div.firstChild; - div.removeChild(element); - return element; - }; -})(); - -// -// Node properties and attributes - -/** - * Sets styles for an element. - * Fixes opacity in IE6-8. - */ -qq.css = function(element, styles){ - if (styles.opacity != null){ - if (typeof element.style.opacity != 'string' && typeof(element.filters) != 'undefined'){ - styles.filter = 'alpha(opacity=' + Math.round(100 * styles.opacity) + ')'; - } - } - qq.extend(element.style, styles); -}; -qq.hasClass = function(element, name){ - var re = new RegExp('(^| )' + name + '( |$)'); - return re.test(element.className); -}; -qq.addClass = function(element, name){ - if (!qq.hasClass(element, name)){ - element.className += ' ' + name; - } -}; -qq.removeClass = function(element, name){ - var re = new RegExp('(^| )' + name + '( |$)'); - element.className = element.className.replace(re, ' ').replace(/^\s+|\s+$/g, ""); -}; -qq.setText = function(element, text){ - element.innerText = text; - element.textContent = text; -}; - -// -// Selecting elements - -qq.children = function(element){ - var children = [], - child = element.firstChild; - - while (child){ - if (child.nodeType == 1){ - children.push(child); - } - child = child.nextSibling; - } - - return children; -}; - -qq.getByClass = function(element, className){ - if (element.querySelectorAll){ - return element.querySelectorAll('.' + className); - } - - var result = []; - var candidates = element.getElementsByTagName("*"); - var len = candidates.length; - - for (var i = 0; i < len; i++){ - if (qq.hasClass(candidates[i], className)){ - result.push(candidates[i]); - } - } - return result; -}; - -/** - * obj2url() takes a json-object as argument and generates - * a querystring. pretty much like jQuery.param() - * - * how to use: - * - * `qq.obj2url({a:'b',c:'d'},'http://any.url/upload?otherParam=value');` - * - * will result in: - * - * `http://any.url/upload?otherParam=value&a=b&c=d` - * - * @param Object JSON-Object - * @param String current querystring-part - * @return String encoded querystring - */ -qq.obj2url = function(obj, temp, prefixDone){ - var uristrings = [], - prefix = '&', - add = function(nextObj, i){ - var nextTemp = temp - ? (/\[\]$/.test(temp)) // prevent double-encoding - ? temp - : temp+'['+i+']' - : i; - if ((nextTemp != 'undefined') && (i != 'undefined')) { - uristrings.push( - (typeof nextObj === 'object') - ? qq.obj2url(nextObj, nextTemp, true) - : (Object.prototype.toString.call(nextObj) === '[object Function]') - ? encodeURIComponent(nextTemp) + '=' + encodeURIComponent(nextObj()) - : encodeURIComponent(nextTemp) + '=' + encodeURIComponent(nextObj) - ); - } - }; - - if (!prefixDone && temp) { - prefix = (/\?/.test(temp)) ? (/\?$/.test(temp)) ? '' : '&' : '?'; - uristrings.push(temp); - uristrings.push(qq.obj2url(obj)); - } else if ((Object.prototype.toString.call(obj) === '[object Array]') && (typeof obj != 'undefined') ) { - // we wont use a for-in-loop on an array (performance) - for (var i = 0, len = obj.length; i < len; ++i){ - add(obj[i], i); - } - } else if ((typeof obj != 'undefined') && (obj !== null) && (typeof obj === "object")){ - // for anything else but a scalar, we will use for-in-loop - for (var i in obj){ - add(obj[i], i); - } - } else { - uristrings.push(encodeURIComponent(temp) + '=' + encodeURIComponent(obj)); - } - - return uristrings.join(prefix) - .replace(/^&/, '') - .replace(/%20/g, '+'); -}; - -// -// -// Uploader Classes -// -// - -var qq = qq || {}; - -/** - * Creates upload button, validates upload, but doesn't create file list or dd. - */ -qq.FileUploaderBasic = function(o){ - this._options = { - // set to true to see the server response - debug: false, - action: '/server/upload', - params: {}, - button: null, - multiple: true, - maxConnections: 3, - // validation - allowedExtensions: [], - sizeLimit: 0, - minSizeLimit: 0, - filesLimit: 0, - // events - // return false to cancel submit - onSubmit: function(id, fileName){}, - onProgress: function(id, fileName, loaded, total){}, - onComplete: function(id, fileName, responseJSON){}, - onAllComplete: function(completed_files){}, - onCancel: function(id, fileName){}, - // messages - messages: { - typeError: "{file} has invalid extension. Only {extensions} are allowed.", - sizeError: "{file} is too large, maximum file size is {sizeLimit}.", - minSizeError: "{file} is too small, minimum file size is {minSizeLimit}.", - emptyError: "{file} is empty, please select files again without it.", - filesLimitError: "No more than {filesLimit} files are allowed to be uploaded.", - onLeave: "The files are being uploaded, if you leave now the upload will be cancelled." - }, - showMessage: function(message){ - alert(message); - } - }; - qq.extend(this._options, o); - - // number of files being uploaded - this._filesInProgress = 0; - this._handler = this._createUploadHandler(); - - if (this._options.button){ - this._button = this._createUploadButton(this._options.button); - } - - this._preventLeaveInProgress(); -}; - -qq.FileUploaderBasic.prototype = { - setParams: function(params){ - this._options.params = params; - }, - getInProgress: function(){ - return this._filesInProgress; - }, - _createUploadButton: function(element){ - var self = this; - - return new qq.UploadButton({ - element: element, - multiple: this._options.multiple && qq.UploadHandlerXhr.isSupported(), - onChange: function(input){ - self._onInputChange(input); - } - }); - }, - _createUploadHandler: function(){ - var self = this, - handlerClass; - - if(qq.UploadHandlerXhr.isSupported()){ - handlerClass = 'UploadHandlerXhr'; - } else { - handlerClass = 'UploadHandlerForm'; - } - - var handler = new qq[handlerClass]({ - debug: this._options.debug, - action: this._options.action, - maxConnections: this._options.maxConnections, - onProgress: function(id, fileName, loaded, total){ - self._onProgress(id, fileName, loaded, total); - self._options.onProgress(id, fileName, loaded, total); - }, - onComplete: function(id, fileName, result){ - self._onComplete(id, fileName, result); - self._options.onComplete(id, fileName, result); - }, - onAllComplete: function(completed_files){ - self._options.onAllComplete(completed_files); - }, - onCancel: function(id, fileName){ - self._onCancel(id, fileName); - self._options.onCancel(id, fileName); - } - }); - - return handler; - }, - _preventLeaveInProgress: function(){ - var self = this; - - qq.attach(window, 'beforeunload', function(e){ - if (!self._filesInProgress){return;} - - var e = e || window.event; - // for ie, ff - e.returnValue = self._options.messages.onLeave; - // for webkit - return self._options.messages.onLeave; - }); - }, - _onSubmit: function(id, fileName){ - this._filesInProgress++; - }, - _onProgress: function(id, fileName, loaded, total){ - }, - _onComplete: function(id, fileName, result){ - this._filesInProgress--; - if (result.error){ - this._options.showMessage(result.error); - } - }, - _onCancel: function(id, fileName){ - this._filesInProgress--; - }, - _onInputChange: function(input){ - if (this._handler instanceof qq.UploadHandlerXhr){ - this._uploadFileList(input.files); - } else { - if (this._validateFile(input)){ - this._uploadFile(input); - } - } - this._button.reset(); - }, - _uploadFileList: function(files){ - var list_length = 0; - for (var i=0; i this._options.sizeLimit){ - this._error('sizeError', name); - return false; - - } else if (size && size < this._options.minSizeLimit){ - this._error('minSizeError', name); - return false; - } else if (this._options.filesLimit){ - - if (list_length == undefined || list_length == NaN){ - var list_length = 0; - } - - if (this._handler._completed_files == undefined || this._handler._completed_files == NaN){ - var completed_length = 0; - }else{ - var completed_length = this._handler._completed_files.length; - } - - if (this._handler._queue == undefined || this._handler._queue == NaN){ - var queue_length = 0; - }else{ - var queue_length = this._handler._queue.length; - } - - if (this._options.filesLimit <= (completed_length + queue_length + list_length)){ - this._error('filesLimitError', name); - return false; - } - } - - return true; - }, - _error: function(code, fileName){ - var message = this._options.messages[code]; - function r(name, replacement){ message = message.replace(name, replacement); } - - r('{file}', this._formatFileName(fileName)); - r('{extensions}', this._options.allowedExtensions.join(', ')); - r('{sizeLimit}', this._formatSize(this._options.sizeLimit)); - r('{minSizeLimit}', this._formatSize(this._options.minSizeLimit)); - r('{filesLimit}', this._options.filesLimit); - - this._options.showMessage(message); - }, - _formatFileName: function(name){ - if (name.length > 33){ - name = name.slice(0, 19) + '...' + name.slice(-13); - } - return name; - }, - _isAllowedExtension: function(fileName){ - var ext = (-1 !== fileName.indexOf('.')) ? fileName.replace(/.*[.]/, '').toLowerCase() : ''; - var allowed = this._options.allowedExtensions; - - if (!allowed.length){return true;} - - for (var i=0; i 99); - - return Math.max(bytes, 0.1).toFixed(1) + ['kB', 'MB', 'GB', 'TB', 'PB', 'EB'][i]; - } -}; - - -/** - * Class that creates upload widget with drag-and-drop and file list - * @inherits qq.FileUploaderBasic - */ -qq.FileUploader = function(o){ - // call parent constructor - qq.FileUploaderBasic.apply(this, arguments); - - // additional options - qq.extend(this._options, { - element: null, - // if set, will be used instead of qq-upload-list in template - listElement: null, - - template: '
' + - '
' + - '
Click here to browse for a file' + - '
    ' + - '
    ', - - // template for one item in file list - fileTemplate: '', - - classes: { - // used to get elements from templates - button: 'qq-upload-button', - drop: 'qq-upload-drop-area', - dropActive: 'qq-upload-drop-area-active', - list: 'qq-upload-list', - - file: 'qq-upload-file', - spinner: 'qq-upload-spinner', - size: 'qq-upload-size', - cancel: 'qq-upload-cancel', - - // added to list item when upload completes - // used in css to hide progress spinner - success: 'qq-upload-success', - fail: 'qq-upload-fail' - } - }); - // overwrite options with user supplied - qq.extend(this._options, o); - - this._element = this._options.element; - this._element.innerHTML = this._options.template; - this._listElement = this._options.listElement || this._find(this._element, 'list'); - - this._classes = this._options.classes; - - this._button = this._createUploadButton(this._find(this._element, 'button')); - - this._bindCancelEvent(); - this._setupDragDrop(); -}; - -// inherit from Basic Uploader -qq.extend(qq.FileUploader.prototype, qq.FileUploaderBasic.prototype); - -qq.extend(qq.FileUploader.prototype, { - /** - * Gets one of the elements listed in this._options.classes - **/ - _find: function(parent, type){ - var element = qq.getByClass(parent, this._options.classes[type])[0]; - if (!element){ - throw new Error('element not found ' + type); - } - - return element; - }, - _setupDragDrop: function(){ - var self = this, - dropArea = this._find(this._element, 'drop'); - - var dz = new qq.UploadDropZone({ - element: dropArea, - onEnter: function(e){ - qq.addClass(dropArea, self._classes.dropActive); - e.stopPropagation(); - }, - onLeave: function(e){ - e.stopPropagation(); - }, - onLeaveNotDescendants: function(e){ - qq.removeClass(dropArea, self._classes.dropActive); - }, - onDrop: function(e){ - dropArea.style.display = 'none'; - qq.removeClass(dropArea, self._classes.dropActive); - if( !self.multiple && e.dataTransfer.files.length > 1 ) - alert( "Multiple file uploads are disabled." ) ; - else - self._uploadFileList(e.dataTransfer.files); - } - }); - - dropArea.style.display = 'none'; - - qq.attach(document, 'dragenter', function(e){ - if (!dz._isValidFileDrag(e)) return; - - dropArea.style.display = 'block'; - }); - qq.attach(document, 'dragleave', function(e){ - if (!dz._isValidFileDrag(e)) return; - - var relatedTarget = document.elementFromPoint(e.clientX, e.clientY); - // only fire when leaving document out - if ( ! relatedTarget || relatedTarget.nodeName == "HTML"){ - dropArea.style.display = 'none'; - } - }); - }, - _onSubmit: function(id, fileName){ - qq.FileUploaderBasic.prototype._onSubmit.apply(this, arguments); - this._addToList(id, fileName); - }, - _onProgress: function(id, fileName, loaded, total){ - qq.FileUploaderBasic.prototype._onProgress.apply(this, arguments); - - var item = this._getItemByFileId(id); - var size = this._find(item, 'size'); - size.style.display = 'inline'; - - var text; - if (loaded != total){ - text = Math.round(loaded / total * 100) + '% from ' + this._formatSize(total); - } else { - text = this._formatSize(total); - } - - qq.setText(size, text); - }, - _onComplete: function(id, fileName, result){ - qq.FileUploaderBasic.prototype._onComplete.apply(this, arguments); - - // mark completed - var item = this._getItemByFileId(id); - qq.remove(this._find(item, 'cancel')); - qq.remove(this._find(item, 'spinner')); - - if (result.success){ - qq.addClass(item, this._classes.success); - } else { - qq.addClass(item, this._classes.fail); - } - }, - _addToList: function(id, fileName){ - var item = qq.toElement(this._options.fileTemplate); - item.qqFileId = id; - - var fileElement = this._find(item, 'file'); - qq.setText(fileElement, this._formatFileName(fileName)); - this._find(item, 'size').style.display = 'none'; - - this._listElement.appendChild(item); - }, - _getItemByFileId: function(id){ - var item = this._listElement.firstChild; - - // there can't be txt nodes in dynamically created list - // and we can use nextSibling - while (item){ - if (item.qqFileId == id) return item; - item = item.nextSibling; - } - }, - /** - * delegate click event for cancel link - **/ - _bindCancelEvent: function(){ - var self = this, - list = this._listElement; - - qq.attach(list, 'click', function(e){ - e = e || window.event; - var target = e.target || e.srcElement; - - if (qq.hasClass(target, self._classes.cancel)){ - qq.preventDefault(e); - - var item = target.parentNode; - self._handler.cancel(item.qqFileId); - qq.remove(item); - } - }); - } -}); - -qq.UploadDropZone = function(o){ - this._options = { - element: null, - onEnter: function(e){}, - onLeave: function(e){}, - // is not fired when leaving element by hovering descendants - onLeaveNotDescendants: function(e){}, - onDrop: function(e){} - }; - qq.extend(this._options, o); - - this._element = this._options.element; - - this._disableDropOutside(); - this._attachEvents(); -}; - -qq.UploadDropZone.prototype = { - _disableDropOutside: function(e){ - // run only once for all instances - if (!qq.UploadDropZone.dropOutsideDisabled ){ - - qq.attach(document, 'dragover', function(e){ - if (e.dataTransfer){ - e.dataTransfer.dropEffect = 'none'; - e.preventDefault(); - } - }); - - qq.UploadDropZone.dropOutsideDisabled = true; - } - }, - _attachEvents: function(){ - var self = this; - - qq.attach(self._element, 'dragover', function(e){ - if (!self._isValidFileDrag(e)) return; - - var effect = e.dataTransfer.effectAllowed; - if (effect == 'move' || effect == 'linkMove'){ - e.dataTransfer.dropEffect = 'move'; // for FF (only move allowed) - } else { - e.dataTransfer.dropEffect = 'copy'; // for Chrome - } - - e.stopPropagation(); - e.preventDefault(); - }); - - qq.attach(self._element, 'dragenter', function(e){ - if (!self._isValidFileDrag(e)) return; - - self._options.onEnter(e); - }); - - qq.attach(self._element, 'dragleave', function(e){ - if (!self._isValidFileDrag(e)) return; - - self._options.onLeave(e); - - var relatedTarget = document.elementFromPoint(e.clientX, e.clientY); - // do not fire when moving a mouse over a descendant - if (qq.contains(this, relatedTarget)) return; - - self._options.onLeaveNotDescendants(e); - }); - - qq.attach(self._element, 'drop', function(e){ - if (!self._isValidFileDrag(e)) return; - - e.preventDefault(); - self._options.onDrop(e); - }); - }, - _isValidFileDrag: function(e){ - var dt = e.dataTransfer, - // do not check dt.types.contains in webkit, because it crashes safari 4 - isWebkit = navigator.userAgent.indexOf("AppleWebKit") > -1; - - // dt.effectAllowed is none in Safari 5 - // dt.types.contains check is for firefox - return dt && dt.effectAllowed != 'none' && - (dt.files || (!isWebkit && dt.types.contains && dt.types.contains('Files'))); - - } -}; - -qq.UploadButton = function(o){ - this._options = { - element: null, - // if set to true adds multiple attribute to file input - multiple: false, - // name attribute of file input - name: 'file', - onChange: function(input){}, - hoverClass: 'qq-upload-button-hover', - focusClass: 'qq-upload-button-focus' - }; - - qq.extend(this._options, o); - - this._element = this._options.element; - - // make button suitable container for input - qq.css(this._element, { - position: 'relative', - overflow: 'hidden', - // Make sure browse button is in the right side - // in Internet Explorer - direction: 'ltr' - }); - - this._input = this._createInput(); -}; - -qq.UploadButton.prototype = { - /* returns file input element */ - getInput: function(){ - return this._input; - }, - /* cleans/recreates the file input */ - reset: function(){ - if (this._input.parentNode){ - qq.remove(this._input); - } - - qq.removeClass(this._element, this._options.focusClass); - this._input = this._createInput(); - }, - _createInput: function(){ - var input = document.createElement("input"); - - if (this._options.multiple){ - input.setAttribute("multiple", "multiple"); - } - - input.setAttribute("type", "file"); - input.setAttribute("name", this._options.name); - input.setAttribute("id", "file_upload_input"); - - qq.css(input, { - position: 'absolute', - // in Opera only 'browse' button - // is clickable and it is located at - // the right side of the input - right: 0, - top: 0, - fontFamily: 'Arial', - // 4 persons reported this, the max values that worked for them were 243, 236, 236, 118 - fontSize: '118px', - margin: 0, - padding: 0, - cursor: 'pointer', - opacity: 0 - }); - - this._element.appendChild(input); - - var self = this; - qq.attach(input, 'change', function(){ - self._options.onChange(input); - }); - - qq.attach(input, 'mouseover', function(){ - qq.addClass(self._element, self._options.hoverClass); - }); - qq.attach(input, 'mouseout', function(){ - qq.removeClass(self._element, self._options.hoverClass); - }); - qq.attach(input, 'focus', function(){ - qq.addClass(self._element, self._options.focusClass); - }); - qq.attach(input, 'blur', function(){ - qq.removeClass(self._element, self._options.focusClass); - }); - - // IE and Opera, unfortunately have 2 tab stops on file input - // which is unacceptable in our case, disable keyboard access - if (window.attachEvent){ - // it is IE or Opera - input.setAttribute('tabIndex', "-1"); - } - - return input; - } -}; - -/** - * Class for uploading files, uploading itself is handled by child classes - */ -qq.UploadHandlerAbstract = function(o){ - this._options = { - debug: false, - action: '/upload.php', - // maximum number of concurrent uploads - maxConnections: 999, - onProgress: function(id, fileName, loaded, total){}, - onComplete: function(id, fileName, response){}, - onAllComplete: function(completed_files){}, - onCancel: function(id, fileName){} - }; - qq.extend(this._options, o); - - this._queue = []; - // params for files in queue - this._params = []; - this._completed_files = []; -}; -qq.UploadHandlerAbstract.prototype = { - log: function(str){ - if (this._options.debug && window.console) console.log('[uploader] ' + str); - }, - /** - * Adds file or file input to the queue - * @returns id - **/ - add: function(file){}, - /** - * Sends the file identified by id and additional query params to the server - */ - upload: function(id, params){ - var len = this._queue.push(id); - - var copy = {}; - qq.extend(copy, params); - this._params[id] = copy; - - // if too many active uploads, wait... - if (len <= this._options.maxConnections){ - this._upload(id, this._params[id]); - } - }, - /** - * Cancels file upload by id - */ - cancel: function(id){ - this._cancel(id); - this._dequeue(id); - }, - /** - * Cancells all uploads - */ - cancelAll: function(){ - for (var i=0; i= max){ - var nextId = this._queue[max-1]; - this._upload(nextId, this._params[nextId]); - } - - if (this._queue.length == 0){ - this._onAllComplete(); - } - }, - _onAllComplete: function(){ - this._options.onAllComplete(this._completed_files); - } -}; - -/** - * Class for uploading files using form and iframe - * @inherits qq.UploadHandlerAbstract - */ -qq.UploadHandlerForm = function(o){ - qq.UploadHandlerAbstract.apply(this, arguments); - - this._inputs = {}; -}; -// @inherits qq.UploadHandlerAbstract -qq.extend(qq.UploadHandlerForm.prototype, qq.UploadHandlerAbstract.prototype); - -qq.extend(qq.UploadHandlerForm.prototype, { - add: function(fileInput){ - fileInput.setAttribute('name', 'qqfile'); - var id = 'qq-upload-handler-iframe' + qq.getUniqueId(); - - this._inputs[id] = fileInput; - - // remove file input from DOM - if (fileInput.parentNode){ - qq.remove(fileInput); - } - - return id; - }, - getName: function(id){ - // get input value and remove path to normalize - return this._inputs[id].value.replace(/.*(\/|\\)/, ""); - }, - _cancel: function(id){ - this._options.onCancel(id, this.getName(id)); - - delete this._inputs[id]; - - var iframe = document.getElementById(id); - if (iframe){ - // to cancel request set src to something else - // we use src="javascript:false;" because it doesn't - // trigger ie6 prompt on https - iframe.setAttribute('src', 'javascript:false;'); - - qq.remove(iframe); - } - }, - _upload: function(id, params){ - var input = this._inputs[id]; - - if (!input){ - throw new Error('file with passed id was not added, or already uploaded or cancelled'); - } - - var fileName = this.getName(id); - - var iframe = this._createIframe(id); - var form = this._createForm(iframe, params); - form.appendChild(input); - - var self = this; - this._attachLoadEvent(iframe, function(){ - self.log('iframe loaded'); - - var response = self._getIframeContentJSON(iframe); - - self._options.onComplete(id, fileName, response); - self._dequeue(id); - - delete self._inputs[id]; - // timeout added to fix busy state in FF3.6 - setTimeout(function(){ - qq.remove(iframe); - }, 1); - }); - - form.submit(); - qq.remove(form); - - return id; - }, - _attachLoadEvent: function(iframe, callback){ - qq.attach(iframe, 'load', function(){ - // when we remove iframe from dom - // the request stops, but in IE load - // event fires - if (!iframe.parentNode){ - return; - } - - // fixing Opera 10.53 - if (iframe.contentDocument && - iframe.contentDocument.body && - iframe.contentDocument.body.innerHTML == "false"){ - // In Opera event is fired second time - // when body.innerHTML changed from false - // to server response approx. after 1 sec - // when we upload file with iframe - return; - } - - callback(); - }); - }, - /** - * Returns json object received by iframe from server. - */ - _getIframeContentJSON: function(iframe){ - // iframe.contentWindow.document - for IE<7 - var doc = iframe.contentDocument ? iframe.contentDocument: iframe.contentWindow.document, - response; - - this.log("converting iframe's innerHTML to JSON"); - this.log("innerHTML = " + doc.body.innerHTML); - - try { - response = eval("(" + doc.body.innerHTML + ")"); - } catch(err){ - response = {}; - } - - return response; - }, - /** - * Creates iframe with unique name - */ - _createIframe: function(id){ - // We can't use following code as the name attribute - // won't be properly registered in IE6, and new window - // on form submit will open - // var iframe = document.createElement('iframe'); - // iframe.setAttribute('name', id); - - var iframe = qq.toElement('