uploadbox 0.1.4 → 0.2.0.beta

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 62eaeadebe7535bad0f7073a427adae552ca5f71
-  data.tar.gz: 2f60ac42239cde465eb8af3b4b93aa10d9e38df6
+  metadata.gz: ceb2ca3efe6cd4d8445e02f68131325e8afd0f62
+  data.tar.gz: a3c2e0d3bad7ccd9b3b5f48c7f6b906d04e13545
 SHA512:
-  metadata.gz: 1cee6a89123479d9ce8c2f3f964ac41a3deea5f303baccfa8db42daf576636fa2cc2721530bbcef671776ca7a7668335c3cb8ab6d9d9d9d417f510974d61d06f
-  data.tar.gz: 4efde4d34b35e777d9fe107fd603df55271ff4b2e986b51b4a078f0afa3b18296b69eb667a82509afca2ba2441665bcc145c5bdbc520b5a05b26419bbb239a4c
+  metadata.gz: 5d82e4d94916edb0360dbde08f0abeca13abd56dcc71d91c9bd5238271ee06a4a0e7451896f8131bb1127f65684874e46ccb43d2ed26583a6cccc1bc66e41f2b
+  data.tar.gz: 99e05a4feed7f68e4937257679394877a57258fb6e5a755799339f080092bad9ee13d2fb0dfa6cbe6d428f8835ce5840c8d1356366a6acb218ee5229ae08c96c

data/README.md

@@ -14,7 +14,7 @@ Make sure you have [ImageMagick](http://www.imagemagick.org/) installed.
 
 Add to Gemfile
 ```
-gem 'uploadbox', '0.1.3'
+gem 'uploadbox', '0.1.4'
 ```
 
 Run generators
@@ -123,4 +123,12 @@ S3_BUCKET=uploads-production \
 Add Redis
 ```
 heroku addons:add rediscloud:20
-```
+```
+
+## Upgrade from 0.1.x
+If are upgrading from 0.1.x you will need to create a migration to add a column named `original_file` to the `images` table
+```
+rails g migration add_original_file_to_images original_file:string
+rake db:migrate
+```
+

data/app/assets/javascripts/_gallery_uploader.coffee

@@ -1,11 +1,11 @@
 class @GalleryUploader
-  constructor: (@container) ->    
+  constructor: (@container) ->
     @previews = {}
 
     @container.find('input[type="file"]:first').show().fileupload
       type: 'POST'
       dataType: 'xml'
-      replaceFileInput: false   
+      replaceFileInput: false
       autoUpload: true
       formData: @getFormData
       dropZone: @container
@@ -18,7 +18,7 @@ class @GalleryUploader
   add: (e, data) =>
     if @loader
       @loader.detach()
-    
+
     if @verifyProcessingInterval
       clearInterval(@verifyProcessingInterval)
 
@@ -59,6 +59,6 @@ class @GalleryUploader
 
   nextPreview: =>
     @currentIndex ||= 0
-    key = Object.keys(@previews)[@currentIndex] 
+    key = Object.keys(@previews)[@currentIndex]
     @currentIndex++
     @previews[key]

data/app/assets/javascripts/_image_uploader.coffee

@@ -30,12 +30,32 @@ class @ImageUploader
       clearInterval(@verifyProcessingInterval)
 
     if @file.type.match /gif|jpe?g|png/
-      @loader = $('<div class="progress progress-striped active"><div class="bar" style="width: 0%;"></div></div>').hide()
-      @preview.prepend(@loader.fadeIn())
+      loadImage @file, @appendThumb, {
+        maxWidth: @thumbContainer.data('width'),
+        maxHeight: @thumbContainer.data('height'),
+        minWidth: @thumbContainer.data('width'),
+        minHeight: @thumbContainer.data('height'),
+        canvas: true,
+        crop: true,
+        orientation: true
+      }
+
+      @loader = $('<div><div class="progress progress-striped active"><div class="bar" style="width: 0%;"></div></div><div class="uploader-overlay"></div></div>').hide()
+      @loader.find('.uploader-overlay').height(@thumbContainer.data('height'))
+      @preview.prepend(@loader)
+      @loader.show()
+
       data.submit()
       @container.find('.fileupload').removeClass('processing').addClass('uploading')
       @container.closest('form').find('[type=submit]').attr("disabled", true)
 
+  appendThumb: (img) =>
+    @thumbContainer.html('')
+    $(img).hide()
+    @container.find('.fileupload-preview.preview').append($(img).show())
+    @container.find('.fileupload').removeClass('fileupload-new').addClass('fileupload-uploading')
+    @loader.show()
+
   getFormData: (arg) =>
     file = @file
     @filePath = @container.find('input[name="key"]').val() + file.name
@@ -55,6 +75,7 @@ class @ImageUploader
 
   done: (e, data) =>
     @container.find('.fileupload').removeClass('uploading').addClass('processing')
+
     $.ajax
       type: 'POST'
       url: @fileInput.data('callback-url')
@@ -65,7 +86,7 @@ class @ImageUploader
         'image[secure_random]': @fileInput.data('secure-random')
 
       complete: =>
-        @verifyProcessingInterval = setInterval(@verifyProcessing, 5000)
+        @verifyProcessingInterval = setInterval(@verifyProcessing, 500)
 
       error: =>
         @loader.detach()
@@ -80,10 +101,10 @@ class @ImageUploader
       dataType: 'json'
       url: @fileInput.data('find-url')
       data:
-        'name': filename
-        'imageable_type': @typeInput.val()
-        'upload_name': @uploadNameInput.val()
-        'secure_random': @fileInput.data('secure-random')
+        image:
+          'imageable_type': @typeInput.val()
+          'upload_name': @uploadNameInput.val()
+          'secure_random': @fileInput.data('secure-random')
 
       complete: (data) =>
         if data.responseJSON.hasOwnProperty('id')
@@ -107,16 +128,11 @@ class @ImageUploader
     @container.closest('form').find('[type=submit]').attr("disabled", false)
 
   showThumb: (image) =>
-    console.log 'showThumb'
-    @loader.detach()
+    @loader.fadeOut =>
+      @loader.detach()
     @idInput.val(image.id)
     @container.find('a.btn.fileupload-exists').attr('href', image.url)
     @thumbContainer.find('img').detach()
-    img = $('<img/>')
-    img.attr('src', image.versions[@thumbContainer.data('version')])
-    img.attr('width', @thumbContainer.data('width'))
-    img.attr('height', @thumbContainer.data('height')).hide()
-    @container.find('.fileupload-preview.preview').append(img.fadeIn())
     @container.find('.fileupload').removeClass('fileupload-new').addClass('fileupload-exists')
     @container.find('.fileupload').removeClass('uploading').removeClass('processing')
     @container.closest('form').find('[type=submit]').attr("disabled", false)

data/app/assets/javascripts/_show_image.coffee

@@ -0,0 +1,15 @@
+class @ShowImage
+  constructor: (@container) ->
+    if @container.data('processing') == true
+      loadImage @container.data('original'), @append, {
+        maxWidth: @container.find('img').attr('width'),
+        maxHeight: @container.find('img').attr('height'),
+        minWidth: @container.find('img').attr('width'),
+        minHeight: @container.find('img').attr('height'),
+        canvas: true,
+        crop: true,
+        orientation: true
+      }
+  append: (img) =>
+    @container.append(img)
+

data/app/assets/javascripts/_uploader_preview.coffee

@@ -1,15 +1,16 @@
 class @UploaderPreview
   constructor: (@container, @file) ->
-    @loader = $('<div class="progress progress-striped active"><div class="bar" style="width: 0%;"></div></div>').hide()
+    @thumbContainer = @container.find('.fileupload-preview.thumbnail')
+    @loader = $('<div><div class="progress progress-striped active"><div class="bar" style="width: 0%;"></div></div><div class="uploader-overlay"></div></div>').hide()
 
     @startLoader() if @isUploadStarting()
-      
+
     @container.find('a.btn.fileupload-exists').bind('ajax:success', @delete)
 
     @container.find('input[type="file"]:first').show().fileupload
       type: 'POST'
       dataType: 'xml'
-      replaceFileInput: false   
+      replaceFileInput: false
       autoUpload: true
       formData: @getFormData
       dropZone: @container
@@ -26,28 +27,44 @@ class @UploaderPreview
     @thumbContainer = @container.find('.fileupload-preview.thumbnail')
 
   startLoader: =>
-    @container.prepend(@loader.fadeIn())
+    loadImage @file, @appendThumb, {
+      maxWidth: @thumbContainer.data('width'),
+      maxHeight: @thumbContainer.data('height'),
+      minWidth: @thumbContainer.data('width'),
+      minHeight: @thumbContainer.data('height'),
+      canvas: true,
+      crop: true,
+      orientation: true
+    }
+    @loader.find('.uploader-overlay').height(@thumbContainer.data('height'))
+    @container.prepend(@loader.show())
     @container.find('.fileupload').removeClass('processing').addClass('uploading')
 
-
   add: (e, data) =>
     @file = data.files[0]
 
     if @loader
       @loader.detach()
-    
+
     if @verifyProcessingInterval
       clearInterval(@verifyProcessingInterval)
 
     if @file.type.match /gif|jpe?g|png/
+
       data.context = @id()
       @startLoader()
       @container.closest('form').find('[type=submit]').attr("disabled", true)
       data.submit()
 
+  appendThumb: (img) =>
+    @thumbContainer.html('')
+    @thumbContainer.append(img)
+    @container.find('.fileupload').removeClass('fileupload-new').addClass('fileupload-uploading')
+    @loader.show()
+
   getFormData: =>
     @filePath = "uploads/#{@id()}/" + @file.name
-    
+
     [
       { name: 'key', value: @filePath },
       { name: 'acl', value: @container.find('input[name="acl"]').val()  },
@@ -58,7 +75,7 @@ class @UploaderPreview
       { name: 'file', value: @file }
     ]
 
-  
+
   isUploadStarting: =>
     @container.find('.fileupload').hasClass('fileupload-new')
 
@@ -71,18 +88,20 @@ class @UploaderPreview
 
   done: (data) =>
     @container.find('.fileupload').removeClass('uploading').addClass('processing')
+    @container.closest('form').find('[type=submit]').attr("disabled", false)
+
     $.ajax
       type: 'POST'
       url: @fileInput.data('callback-url')
-      data: 
+      data:
         'image[remote_file_url]': @fileInput.data('url') + @filePath
         'image[imageable_type]': @typeInput.val()
         'image[upload_name]': @uploadNameInput.val()
         'image[secure_random]': @id()
-      
+
       complete: =>
-        @verifyProcessingInterval = setInterval(@verifyProcessing, 5000)
-      
+        @verifyProcessingInterval = setInterval(@verifyProcessing, 500)
+
       error: =>
         @loader.detach()
         @container.find('.fileupload').removeClass('uploading').removeClass('processing')
@@ -96,33 +115,28 @@ class @UploaderPreview
       dataType: 'json'
       url: @fileInput.data('find-url')
       data:
-        'name': filename
-        'imageable_type': @typeInput.val()
-        'upload_name': @uploadNameInput.val()
-        'secure_random': @id()
+        image:
+          imageable_type: @typeInput.val()
+          upload_name: @uploadNameInput.val()
+          secure_random: @id()
 
       complete: (data) =>
         if data.responseJSON.hasOwnProperty('id')
           clearInterval(@verifyProcessingInterval)
           @showThumb(data.responseJSON)
-      
+
       error: =>
         @loader.detach()
         @container.detach()
 
   showThumb: (image) =>
-    @loader.detach()
+    console.log 'showThumb'
+    @loader.fadeOut =>
+      @loader.detach()
     @idInput.val(image.id)
     @container.find('a.btn.fileupload-exists').attr('href', image.url)
-    @thumbContainer.find('img').detach()
-    img = $('<img/>')
-    img.attr('src', image.versions[@thumbContainer.data('version')])
-    img.attr('width', @thumbContainer.data('width'))
-    img.attr('height', @thumbContainer.data('height')).hide()
-    @container.find('.fileupload-preview.thumbnail').append(img.fadeIn())
-    @container.find('.fileupload').removeClass('fileupload-new').addClass('fileupload-exists')
+    @container.find('.fileupload').removeClass('fileupload-new').removeClass('fileupload-uploading').addClass('fileupload-exists')
     @container.find('.fileupload').removeClass('uploading').removeClass('processing')
-    @container.closest('form').find('[type=submit]').attr("disabled", false)
 
   fail: =>
     @loader.detach()

data/app/assets/javascripts/canvas-to-blob.min.js

@@ -0,0 +1 @@
+!function(a){"use strict";var b=a.HTMLCanvasElement&&a.HTMLCanvasElement.prototype,c=a.Blob&&function(){try{return Boolean(new Blob)}catch(a){return!1}}(),d=c&&a.Uint8Array&&function(){try{return 100===new Blob([new Uint8Array(100)]).size}catch(a){return!1}}(),e=a.BlobBuilder||a.WebKitBlobBuilder||a.MozBlobBuilder||a.MSBlobBuilder,f=(c||e)&&a.atob&&a.ArrayBuffer&&a.Uint8Array&&function(a){var b,f,g,h,i,j;for(b=a.split(",")[0].indexOf("base64")>=0?atob(a.split(",")[1]):decodeURIComponent(a.split(",")[1]),f=new ArrayBuffer(b.length),g=new Uint8Array(f),h=0;h<b.length;h+=1)g[h]=b.charCodeAt(h);return i=a.split(",")[0].split(":")[1].split(";")[0],c?new Blob([d?g:f],{type:i}):(j=new e,j.append(f),j.getBlob(i))};a.HTMLCanvasElement&&!b.toBlob&&(b.mozGetAsFile?b.toBlob=function(a,c,d){d&&b.toDataURL&&f?a(f(this.toDataURL(c,d))):a(this.mozGetAsFile("blob",c))}:b.toDataURL&&f&&(b.toBlob=function(a,b,c){a(f(this.toDataURL(b,c)))})),"function"==typeof define&&define.amd?define(function(){return f}):a.dataURLtoBlob=f}(this);

data/app/assets/javascripts/jquery.fileupload.js

@@ -1,5 +1,5 @@
 /*
- * jQuery File Upload Plugin 5.32.3
+ * jQuery File Upload Plugin 5.40.1
  * https://github.com/blueimp/jQuery-File-Upload
  *
  * Copyright 2010, Sebastian Tschan
@@ -9,8 +9,8 @@
  * http://www.opensource.org/licenses/MIT
  */
 
-/*jslint nomen: true, unparam: true, regexp: true */
-/*global define, window, document, location, File, Blob, FormData */
+/* jshint nomen:false */
+/* global define, window, document, location, Blob, FormData */
 
 (function (factory) {
     'use strict';
@@ -40,9 +40,11 @@
         $('<input type="file">').prop('disabled'));
 
     // The FileReader API is not actually used, but works as feature detection,
-    // as e.g. Safari supports XHR file uploads via the FormData API,
-    // but not non-multipart XHR file uploads:
-    $.support.xhrFileUpload = !!(window.XMLHttpRequestUpload && window.FileReader);
+    // as some Safari versions (5?) support XHR file uploads via the FormData API,
+    // but not non-multipart XHR file uploads.
+    // window.XMLHttpRequestUpload is not available on IE10, so we check for
+    // window.ProgressEvent instead to detect XHR2 file upload capability:
+    $.support.xhrFileUpload = !!(window.ProgressEvent && window.FileReader);
     $.support.xhrFormDataFileUpload = !!window.FormData;
 
     // Detect support for Blob slicing (required for chunked uploads):
@@ -88,6 +90,14 @@
             // To limit the number of files uploaded with one XHR request,
             // set the following option to an integer greater than 0:
             limitMultiFileUploads: undefined,
+            // The following option limits the number of files uploaded with one
+            // XHR request to keep the request size under or equal to the defined
+            // limit in bytes:
+            limitMultiFileUploadSize: undefined,
+            // Multipart file uploads add a number of bytes to each uploaded file,
+            // therefore the following option adds an overhead for each file used
+            // in the limitMultiFileUploadSize configuration:
+            limitMultiFileUploadSizeOverhead: 512,
             // Set the following option to true to issue all file upload requests
             // in a sequential order:
             sequentialUploads: false,
@@ -174,6 +184,9 @@
             // handlers using jQuery's Deferred callbacks:
             // data.submit().done(func).fail(func).always(func);
             add: function (e, data) {
+                if (e.isDefaultPrevented()) {
+                    return false;
+                }
                 if (data.autoUpload || (data.autoUpload !== false &&
                         $(this).fileupload('option', 'autoUpload'))) {
                     data.process().done(function () {
@@ -280,7 +293,7 @@
 
         _getFormData: function (options) {
             var formData;
-            if (typeof options.formData === 'function') {
+            if ($.type(options.formData) === 'function') {
                 return options.formData(options.form);
             }
             if ($.isArray(options.formData)) {
@@ -360,10 +373,18 @@
                 // Trigger a custom progress event with a total data property set
                 // to the file size(s) of the current upload and a loaded data
                 // property calculated accordingly:
-                this._trigger('progress', e, data);
+                this._trigger(
+                    'progress',
+                    $.Event('progress', {delegatedEvent: e}),
+                    data
+                );
                 // Trigger a global progress event for all current file uploads,
                 // including ajax calls queued for sequential file uploads:
-                this._trigger('progressall', e, this._progress);
+                this._trigger(
+                    'progressall',
+                    $.Event('progressall', {delegatedEvent: e}),
+                    this._progress
+                );
             }
         },
 
@@ -398,7 +419,8 @@
                 file = options.files[0],
                 // Ignore non-multipart setting if not supported:
                 multipart = options.multipart || !$.support.xhrFileUpload,
-                paramName = options.paramName[0];
+                paramName = $.type(options.paramName) === 'array' ?
+                    options.paramName[0] : options.paramName;
             options.headers = $.extend({}, options.headers);
             if (options.contentRange) {
                 options.headers['Content-Range'] = options.contentRange;
@@ -408,7 +430,7 @@
                     encodeURI(file.name) + '"';
             }
             if (!multipart) {
-                options.contentType = file.type;
+                options.contentType = file.type || 'application/octet-stream';
                 options.data = options.blob || file;
             } else if ($.support.xhrFormDataFileUpload) {
                 if (options.postMessage) {
@@ -425,7 +447,8 @@
                     } else {
                         $.each(options.files, function (index, file) {
                             formData.push({
-                                name: options.paramName[index] || paramName,
+                                name: ($.type(options.paramName) === 'array' &&
+                                    options.paramName[index]) || paramName,
                                 value: file
                             });
                         });
@@ -448,9 +471,10 @@
                             if (that._isInstanceOf('File', file) ||
                                     that._isInstanceOf('Blob', file)) {
                                 formData.append(
-                                    options.paramName[index] || paramName,
+                                    ($.type(options.paramName) === 'array' &&
+                                        options.paramName[index]) || paramName,
                                     file,
-                                    file.name
+                                    file.uploadName || file.name
                                 );
                             }
                         });
@@ -534,8 +558,10 @@
                 options.url = options.form.prop('action') || location.href;
             }
             // The HTTP request method must be "POST" or "PUT":
-            options.type = (options.type || options.form.prop('method') || '')
-                .toUpperCase();
+            options.type = (options.type ||
+                ($.type(options.form.prop('method')) === 'string' &&
+                    options.form.prop('method')) || ''
+                ).toUpperCase();
             if (options.type !== 'POST' && options.type !== 'PUT' &&
                     options.type !== 'PATCH') {
                 options.type = 'POST';
@@ -594,22 +620,32 @@
         // Adds convenience methods to the data callback argument:
         _addConvenienceMethods: function (e, data) {
             var that = this,
-                getPromise = function (data) {
-                    return $.Deferred().resolveWith(that, [data]).promise();
+                getPromise = function (args) {
+                    return $.Deferred().resolveWith(that, args).promise();
                 };
             data.process = function (resolveFunc, rejectFunc) {
                 if (resolveFunc || rejectFunc) {
                     data._processQueue = this._processQueue =
-                        (this._processQueue || getPromise(this))
-                            .pipe(resolveFunc, rejectFunc);
+                        (this._processQueue || getPromise([this])).pipe(
+                            function () {
+                                if (data.errorThrown) {
+                                    return $.Deferred()
+                                        .rejectWith(that, [data]).promise();
+                                }
+                                return getPromise(arguments);
+                            }
+                        ).pipe(resolveFunc, rejectFunc);
                 }
-                return this._processQueue || getPromise(this);
+                return this._processQueue || getPromise([this]);
             };
             data.submit = function () {
                 if (this.state() !== 'pending') {
                     data.jqXHR = this.jqXHR =
-                        (that._trigger('submit', e, this) !== false) &&
-                        that._onSend(e, this);
+                        (that._trigger(
+                            'submit',
+                            $.Event('submit', {delegatedEvent: e}),
+                            this
+                        ) !== false) && that._onSend(e, this);
                 }
                 return this.jqXHR || that._getXHRPromise();
             };
@@ -617,7 +653,9 @@
                 if (this.jqXHR) {
                     return this.jqXHR.abort();
                 }
-                return that._getXHRPromise();
+                this.errorThrown = 'abort';
+                that._trigger('fail', null, this);
+                return that._getXHRPromise(false);
             };
             data.state = function () {
                 if (this.jqXHR) {
@@ -627,6 +665,10 @@
                     return that._getDeferredState(this._processQueue);
                 }
             };
+            data.processing = function () {
+                return !this.jqXHR && this._processQueue && that
+                    ._getDeferredState(this._processQueue) === 'pending';
+            };
             data.progress = function () {
                 return this._progress;
             };
@@ -829,7 +871,11 @@
                     // Set timer for bitrate progress calculation:
                     options._bitrateTimer = new that._BitrateTimer();
                     jqXHR = jqXHR || (
-                        ((aborted || that._trigger('send', e, options) === false) &&
+                        ((aborted || that._trigger(
+                            'send',
+                            $.Event('send', {delegatedEvent: e}),
+                            options
+                        ) === false) &&
                         that._getXHRPromise(false, options.context, aborted)) ||
                         that._chunkedUpload(options) || $.ajax(options)
                     ).done(function (result, textStatus, jqXHR) {
@@ -900,39 +946,70 @@
             var that = this,
                 result = true,
                 options = $.extend({}, this.options, data),
+                files = data.files,
+                filesLength = files.length,
                 limit = options.limitMultiFileUploads,
+                limitSize = options.limitMultiFileUploadSize,
+                overhead = options.limitMultiFileUploadSizeOverhead,
+                batchSize = 0,
                 paramName = this._getParamName(options),
                 paramNameSet,
                 paramNameSlice,
                 fileSet,
-                i;
-            if (!(options.singleFileUploads || limit) ||
+                i,
+                j = 0;
+            if (limitSize && (!filesLength || files[0].size === undefined)) {
+                limitSize = undefined;
+            }
+            if (!(options.singleFileUploads || limit || limitSize) ||
                     !this._isXHRUpload(options)) {
-                fileSet = [data.files];
+                fileSet = [files];
                 paramNameSet = [paramName];
-            } else if (!options.singleFileUploads && limit) {
+            } else if (!(options.singleFileUploads || limitSize) && limit) {
                 fileSet = [];
                 paramNameSet = [];
-                for (i = 0; i < data.files.length; i += limit) {
-                    fileSet.push(data.files.slice(i, i + limit));
+                for (i = 0; i < filesLength; i += limit) {
+                    fileSet.push(files.slice(i, i + limit));
                     paramNameSlice = paramName.slice(i, i + limit);
                     if (!paramNameSlice.length) {
                         paramNameSlice = paramName;
                     }
                     paramNameSet.push(paramNameSlice);
                 }
+            } else if (!options.singleFileUploads && limitSize) {
+                fileSet = [];
+                paramNameSet = [];
+                for (i = 0; i < filesLength; i = i + 1) {
+                    batchSize += files[i].size + overhead;
+                    if (i + 1 === filesLength ||
+                            ((batchSize + files[i + 1].size + overhead) > limitSize) ||
+                            (limit && i + 1 - j >= limit)) {
+                        fileSet.push(files.slice(j, i + 1));
+                        paramNameSlice = paramName.slice(j, i + 1);
+                        if (!paramNameSlice.length) {
+                            paramNameSlice = paramName;
+                        }
+                        paramNameSet.push(paramNameSlice);
+                        j = i + 1;
+                        batchSize = 0;
+                    }
+                }
             } else {
                 paramNameSet = paramName;
             }
-            data.originalFiles = data.files;
-            $.each(fileSet || data.files, function (index, element) {
+            data.originalFiles = files;
+            $.each(fileSet || files, function (index, element) {
                 var newData = $.extend({}, data);
                 newData.files = fileSet ? element : [element];
                 newData.paramName = paramNameSet[index];
                 that._initResponseObject(newData);
                 that._initProgressObject(newData);
                 that._addConvenienceMethods(e, newData);
-                result = that._trigger('add', e, newData);
+                result = that._trigger(
+                    'add',
+                    $.Event('add', {delegatedEvent: e}),
+                    newData
+                );
                 return result;
             });
             return result;
@@ -1101,7 +1178,11 @@
                 if (that.options.replaceFileInput) {
                     that._replaceFileInput(data.fileInput);
                 }
-                if (that._trigger('change', e, data) !== false) {
+                if (that._trigger(
+                        'change',
+                        $.Event('change', {delegatedEvent: e}),
+                        data
+                    ) !== false) {
                     that._onAdd(e, data);
                 }
             });
@@ -1118,9 +1199,12 @@
                         data.files.push(file);
                     }
                 });
-                if (this._trigger('paste', e, data) === false ||
-                        this._onAdd(e, data) === false) {
-                    return false;
+                if (this._trigger(
+                        'paste',
+                        $.Event('paste', {delegatedEvent: e}),
+                        data
+                    ) !== false) {
+                    this._onAdd(e, data);
                 }
             }
         },
@@ -1134,7 +1218,11 @@
                 e.preventDefault();
                 this._getDroppedFiles(dataTransfer).always(function (files) {
                     data.files = files;
-                    if (that._trigger('drop', e, data) !== false) {
+                    if (that._trigger(
+                            'drop',
+                            $.Event('drop', {delegatedEvent: e}),
+                            data
+                        ) !== false) {
                         that._onAdd(e, data);
                     }
                 });
@@ -1144,14 +1232,13 @@
         _onDragOver: function (e) {
             e.dataTransfer = e.originalEvent && e.originalEvent.dataTransfer;
             var dataTransfer = e.dataTransfer;
-            if (dataTransfer) {
-                if (this._trigger('dragover', e) === false) {
-                    return false;
-                }
-                if ($.inArray('Files', dataTransfer.types) !== -1) {
-                    dataTransfer.dropEffect = 'copy';
-                    e.preventDefault();
-                }
+            if (dataTransfer && $.inArray('Files', dataTransfer.types) !== -1 &&
+                    this._trigger(
+                        'dragover',
+                        $.Event('dragover', {delegatedEvent: e})
+                    ) !== false) {
+                e.preventDefault();
+                dataTransfer.dropEffect = 'copy';
             }
         },
 
@@ -1220,15 +1307,21 @@
 
         _initDataAttributes: function () {
             var that = this,
-                options = this.options;
+                options = this.options,
+                clone = $(this.element[0].cloneNode(false));
             // Initialize options set via HTML5 data-attributes:
             $.each(
-                $(this.element[0].cloneNode(false)).data(),
+                clone.data(),
                 function (key, value) {
-                    if (that._isRegExpOption(key, value)) {
-                        value = that._getRegExp(value);
+                    var dataAttributeName = 'data-' +
+                        // Convert camelCase to hyphen-ated key:
+                        key.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
+                    if (clone.attr(dataAttributeName)) {
+                        if (that._isRegExpOption(key, value)) {
+                            value = that._getRegExp(value);
+                        }
+                        options[key] = value;
                     }
-                    options[key] = value;
                 }
             );
         },

data/app/assets/javascripts/jquery.iframe-transport.js

@@ -1,5 +1,5 @@
 /*
- * jQuery Iframe Transport Plugin 1.7
+ * jQuery Iframe Transport Plugin 1.8.2
  * https://github.com/blueimp/jQuery-File-Upload
  *
  * Copyright 2011, Sebastian Tschan
@@ -9,8 +9,7 @@
  * http://www.opensource.org/licenses/MIT
  */
 
-/*jslint unparam: true, nomen: true */
-/*global define, window, document */
+/* global define, window, document */
 
 (function (factory) {
     'use strict';
@@ -27,7 +26,7 @@
     // Helper variable to create unique names for the transport iframes:
     var counter = 0;
 
-    // The iframe transport accepts three additional options:
+    // The iframe transport accepts four additional options:
     // options.fileInput: a jQuery collection of file input fields
     // options.paramName: the parameter name for the file form data,
     //  overrides the name property of the file input field(s),
@@ -35,9 +34,16 @@
     // options.formData: an array of objects with name and value properties,
     //  equivalent to the return data of .serializeArray(), e.g.:
     //  [{name: 'a', value: 1}, {name: 'b', value: 2}]
+    // options.initialIframeSrc: the URL of the initial iframe src,
+    //  by default set to "javascript:false;"
     $.ajaxTransport('iframe', function (options) {
         if (options.async) {
-            var form,
+            // javascript:false as initial iframe src
+            // prevents warning popups on HTTPS in IE6:
+            /*jshint scripturl: true */
+            var initialIframeSrc = options.initialIframeSrc || 'javascript:false;',
+            /*jshint scripturl: false */
+                form,
                 iframe,
                 addParamChar;
             return {
@@ -56,15 +62,13 @@
                         options.url = options.url + addParamChar + '_method=PATCH';
                         options.type = 'POST';
                     }
-                    // javascript:false as initial iframe src
-                    // prevents warning popups on HTTPS in IE6.
                     // IE versions below IE8 cannot set the name property of
                     // elements that have already been added to the DOM,
                     // so we set the name along with the iframe HTML markup:
                     counter += 1;
                     iframe = $(
-                        '<iframe src="javascript:false;" name="iframe-transport-' +
-                            counter + '"></iframe>'
+                        '<iframe src="' + initialIframeSrc +
+                            '" name="iframe-transport-' + counter + '"></iframe>'
                     ).bind('load', function () {
                         var fileInputClones,
                             paramNames = $.isArray(options.paramName) ?
@@ -95,7 +99,7 @@
                                 );
                                 // Fix for IE endless progress bar activity bug
                                 // (happens on form submits to iframe targets):
-                                $('<iframe src="javascript:false;"></iframe>')
+                                $('<iframe src="' + initialIframeSrc + '"></iframe>')
                                     .appendTo(form);
                                 window.setTimeout(function () {
                                     // Removing the form in a setTimeout call
@@ -138,6 +142,8 @@
                                 .prop('enctype', 'multipart/form-data')
                                 // enctype must be set as encoding for IE:
                                 .prop('encoding', 'multipart/form-data');
+                            // Remove the HTML5 form attribute from the input(s):
+                            options.fileInput.removeAttr('form');
                         }
                         form.submit();
                         // Insert the file input fields at their original location
@@ -145,7 +151,10 @@
                         if (fileInputClones && fileInputClones.length) {
                             options.fileInput.each(function (index, input) {
                                 var clone = $(fileInputClones[index]);
-                                $(input).prop('name', clone.prop('name'));
+                                // Restore the original name and form properties:
+                                $(input)
+                                    .prop('name', clone.prop('name'))
+                                    .attr('form', clone.attr('form'));
                                 clone.replaceWith(input);
                             });
                         }
@@ -159,7 +168,7 @@
                         // concat is used to avoid the "Script URL" JSLint error:
                         iframe
                             .unbind('load')
-                            .prop('src', 'javascript'.concat(':false;'));
+                            .prop('src', initialIframeSrc);
                     }
                     if (form) {
                         form.remove();

data/app/assets/javascripts/load-image.min.js

@@ -0,0 +1 @@
+!function(a){"use strict";var b=function(a,c,d){var e,f,g=document.createElement("img");if(g.onerror=c,g.onload=function(){!f||d&&d.noRevoke||b.revokeObjectURL(f),c&&c(b.scale(g,d))},b.isInstanceOf("Blob",a)||b.isInstanceOf("File",a))e=f=b.createObjectURL(a),g._type=a.type;else{if("string"!=typeof a)return!1;e=a,d&&d.crossOrigin&&(g.crossOrigin=d.crossOrigin)}return e?(g.src=e,g):b.readFile(a,function(a){var b=a.target;b&&b.result?g.src=b.result:c&&c(a)})},c=window.createObjectURL&&window||window.URL&&URL.revokeObjectURL&&URL||window.webkitURL&&webkitURL;b.isInstanceOf=function(a,b){return Object.prototype.toString.call(b)==="[object "+a+"]"},b.transformCoordinates=function(){},b.getTransformedOptions=function(a){return a},b.renderImageToCanvas=function(a,b,c,d,e,f,g,h,i,j){return a.getContext("2d").drawImage(b,c,d,e,f,g,h,i,j),a},b.hasCanvasOption=function(a){return a.canvas||a.crop},b.scale=function(a,c){c=c||{};var d,e,f,g,h,i,j,k,l,m=document.createElement("canvas"),n=a.getContext||b.hasCanvasOption(c)&&m.getContext,o=a.naturalWidth||a.width,p=a.naturalHeight||a.height,q=o,r=p,s=function(){var a=Math.max((f||q)/q,(g||r)/r);a>1&&(q=Math.ceil(q*a),r=Math.ceil(r*a))},t=function(){var a=Math.min((d||q)/q,(e||r)/r);1>a&&(q=Math.ceil(q*a),r=Math.ceil(r*a))};return n&&(c=b.getTransformedOptions(c),j=c.left||0,k=c.top||0,c.sourceWidth?(h=c.sourceWidth,void 0!==c.right&&void 0===c.left&&(j=o-h-c.right)):h=o-j-(c.right||0),c.sourceHeight?(i=c.sourceHeight,void 0!==c.bottom&&void 0===c.top&&(k=p-i-c.bottom)):i=p-k-(c.bottom||0),q=h,r=i),d=c.maxWidth,e=c.maxHeight,f=c.minWidth,g=c.minHeight,n&&d&&e&&c.crop?(q=d,r=e,l=h/i-d/e,0>l?(i=e*h/d,void 0===c.top&&void 0===c.bottom&&(k=(p-i)/2)):l>0&&(h=d*i/e,void 0===c.left&&void 0===c.right&&(j=(o-h)/2))):((c.contain||c.cover)&&(f=d=d||f,g=e=e||g),c.cover?(t(),s()):(s(),t())),n?(m.width=q,m.height=r,b.transformCoordinates(m,c),b.renderImageToCanvas(m,a,j,k,h,i,0,0,q,r)):(a.width=q,a.height=r,a)},b.createObjectURL=function(a){return c?c.createObjectURL(a):!1},b.revokeObjectURL=function(a){return c?c.revokeObjectURL(a):!1},b.readFile=function(a,b,c){if(window.FileReader){var d=new FileReader;if(d.onload=d.onerror=b,c=c||"readAsDataURL",d[c])return d[c](a),d}return!1},"function"==typeof define&&define.amd?define(function(){return b}):a.loadImage=b}(this),function(a){"use strict";"function"==typeof define&&define.amd?define(["load-image"],a):a(window.loadImage)}(function(a){"use strict";if(window.navigator&&window.navigator.platform&&/iP(hone|od|ad)/.test(window.navigator.platform)){var b=a.renderImageToCanvas;a.detectSubsampling=function(a){var b,c;return a.width*a.height>1048576?(b=document.createElement("canvas"),b.width=b.height=1,c=b.getContext("2d"),c.drawImage(a,-a.width+1,0),0===c.getImageData(0,0,1,1).data[3]):!1},a.detectVerticalSquash=function(a,b){var c,d,e,f,g,h=a.naturalHeight||a.height,i=document.createElement("canvas"),j=i.getContext("2d");for(b&&(h/=2),i.width=1,i.height=h,j.drawImage(a,0,0),c=j.getImageData(0,0,1,h).data,d=0,e=h,f=h;f>d;)g=c[4*(f-1)+3],0===g?e=f:d=f,f=e+d>>1;return f/h||1},a.renderImageToCanvas=function(c,d,e,f,g,h,i,j,k,l){if("image/jpeg"===d._type){var m,n,o,p,q=c.getContext("2d"),r=document.createElement("canvas"),s=1024,t=r.getContext("2d");if(r.width=s,r.height=s,q.save(),m=a.detectSubsampling(d),m&&(e/=2,f/=2,g/=2,h/=2),n=a.detectVerticalSquash(d,m),m||1!==n){for(f*=n,k=Math.ceil(s*k/g),l=Math.ceil(s*l/h/n),j=0,p=0;h>p;){for(i=0,o=0;g>o;)t.clearRect(0,0,s,s),t.drawImage(d,e,f,g,h,-o,-p,g,h),q.drawImage(r,0,0,s,s,i,j,k,l),o+=s,i+=k;p+=s,j+=l}return q.restore(),c}}return b(c,d,e,f,g,h,i,j,k,l)}}}),function(a){"use strict";"function"==typeof define&&define.amd?define(["load-image"],a):a(window.loadImage)}(function(a){"use strict";var b=a.hasCanvasOption;a.hasCanvasOption=function(a){return b(a)||a.orientation},a.transformCoordinates=function(a,b){var c=a.getContext("2d"),d=a.width,e=a.height,f=b.orientation;if(f)switch(f>4&&(a.width=e,a.height=d),f){case 2:c.translate(d,0),c.scale(-1,1);break;case 3:c.translate(d,e),c.rotate(Math.PI);break;case 4:c.translate(0,e),c.scale(1,-1);break;case 5:c.rotate(.5*Math.PI),c.scale(1,-1);break;case 6:c.rotate(.5*Math.PI),c.translate(0,-e);break;case 7:c.rotate(.5*Math.PI),c.translate(d,-e),c.scale(-1,1);break;case 8:c.rotate(-.5*Math.PI),c.translate(-d,0)}},a.getTransformedOptions=function(a){if(!a.orientation||1===a.orientation)return a;var b,c={};for(b in a)a.hasOwnProperty(b)&&(c[b]=a[b]);switch(a.orientation){case 2:c.left=a.right,c.right=a.left;break;case 3:c.left=a.right,c.top=a.bottom,c.right=a.left,c.bottom=a.top;break;case 4:c.top=a.bottom,c.bottom=a.top;break;case 5:c.left=a.top,c.top=a.left,c.right=a.bottom,c.bottom=a.right;break;case 6:c.left=a.top,c.top=a.right,c.right=a.bottom,c.bottom=a.left;break;case 7:c.left=a.bottom,c.top=a.right,c.right=a.top,c.bottom=a.left;break;case 8:c.left=a.bottom,c.top=a.left,c.right=a.top,c.bottom=a.right}return a.orientation>4&&(c.maxWidth=a.maxHeight,c.maxHeight=a.maxWidth,c.minWidth=a.minHeight,c.minHeight=a.minWidth,c.sourceWidth=a.sourceHeight,c.sourceHeight=a.sourceWidth),c}}),function(a){"use strict";"function"==typeof define&&define.amd?define(["load-image"],a):a(window.loadImage)}(function(a){"use strict";var b=window.Blob&&(Blob.prototype.slice||Blob.prototype.webkitSlice||Blob.prototype.mozSlice);a.blobSlice=b&&function(){var a=this.slice||this.webkitSlice||this.mozSlice;return a.apply(this,arguments)},a.metaDataParsers={jpeg:{65505:[]}},a.parseMetaData=function(b,c,d){d=d||{};var e=this,f=d.maxMetaDataSize||262144,g={},h=!(window.DataView&&b&&b.size>=12&&"image/jpeg"===b.type&&a.blobSlice);(h||!a.readFile(a.blobSlice.call(b,0,f),function(b){if(b.target.error)return console.log(b.target.error),c(g),void 0;var f,h,i,j,k=b.target.result,l=new DataView(k),m=2,n=l.byteLength-4,o=m;if(65496===l.getUint16(0)){for(;n>m&&(f=l.getUint16(m),f>=65504&&65519>=f||65534===f);){if(h=l.getUint16(m+2)+2,m+h>l.byteLength){console.log("Invalid meta data: Invalid segment size.");break}if(i=a.metaDataParsers.jpeg[f])for(j=0;j<i.length;j+=1)i[j].call(e,l,m,h,g,d);m+=h,o=m}!d.disableImageHead&&o>6&&(g.imageHead=k.slice?k.slice(0,o):new Uint8Array(k).subarray(0,o))}else console.log("Invalid JPEG file: Missing JPEG marker.");c(g)},"readAsArrayBuffer"))&&c(g)}}),function(a){"use strict";"function"==typeof define&&define.amd?define(["load-image","load-image-meta"],a):a(window.loadImage)}(function(a){"use strict";a.ExifMap=function(){return this},a.ExifMap.prototype.map={Orientation:274},a.ExifMap.prototype.get=function(a){return this[a]||this[this.map[a]]},a.getExifThumbnail=function(a,b,c){var d,e,f;if(!c||b+c>a.byteLength)return console.log("Invalid Exif data: Invalid thumbnail data."),void 0;for(d=[],e=0;c>e;e+=1)f=a.getUint8(b+e),d.push((16>f?"0":"")+f.toString(16));return"data:image/jpeg,%"+d.join("%")},a.exifTagTypes={1:{getValue:function(a,b){return a.getUint8(b)},size:1},2:{getValue:function(a,b){return String.fromCharCode(a.getUint8(b))},size:1,ascii:!0},3:{getValue:function(a,b,c){return a.getUint16(b,c)},size:2},4:{getValue:function(a,b,c){return a.getUint32(b,c)},size:4},5:{getValue:function(a,b,c){return a.getUint32(b,c)/a.getUint32(b+4,c)},size:8},9:{getValue:function(a,b,c){return a.getInt32(b,c)},size:4},10:{getValue:function(a,b,c){return a.getInt32(b,c)/a.getInt32(b+4,c)},size:8}},a.exifTagTypes[7]=a.exifTagTypes[1],a.getExifValue=function(b,c,d,e,f,g){var h,i,j,k,l,m,n=a.exifTagTypes[e];if(!n)return console.log("Invalid Exif data: Invalid tag type."),void 0;if(h=n.size*f,i=h>4?c+b.getUint32(d+8,g):d+8,i+h>b.byteLength)return console.log("Invalid Exif data: Invalid data offset."),void 0;if(1===f)return n.getValue(b,i,g);for(j=[],k=0;f>k;k+=1)j[k]=n.getValue(b,i+k*n.size,g);if(n.ascii){for(l="",k=0;k<j.length&&(m=j[k],"\x00"!==m);k+=1)l+=m;return l}return j},a.parseExifTag=function(b,c,d,e,f){var g=b.getUint16(d,e);f.exif[g]=a.getExifValue(b,c,d,b.getUint16(d+2,e),b.getUint32(d+4,e),e)},a.parseExifTags=function(a,b,c,d,e){var f,g,h;if(c+6>a.byteLength)return console.log("Invalid Exif data: Invalid directory offset."),void 0;if(f=a.getUint16(c,d),g=c+2+12*f,g+4>a.byteLength)return console.log("Invalid Exif data: Invalid directory size."),void 0;for(h=0;f>h;h+=1)this.parseExifTag(a,b,c+2+12*h,d,e);return a.getUint32(g,d)},a.parseExifData=function(b,c,d,e,f){if(!f.disableExif){var g,h,i,j=c+10;if(1165519206===b.getUint32(c+4)){if(j+8>b.byteLength)return console.log("Invalid Exif data: Invalid segment size."),void 0;if(0!==b.getUint16(c+8))return console.log("Invalid Exif data: Missing byte alignment offset."),void 0;switch(b.getUint16(j)){case 18761:g=!0;break;case 19789:g=!1;break;default:return console.log("Invalid Exif data: Invalid byte alignment marker."),void 0}if(42!==b.getUint16(j+2,g))return console.log("Invalid Exif data: Missing TIFF marker."),void 0;h=b.getUint32(j+4,g),e.exif=new a.ExifMap,h=a.parseExifTags(b,j,j+h,g,e),h&&!f.disableExifThumbnail&&(i={exif:{}},h=a.parseExifTags(b,j,j+h,g,i),i.exif[513]&&(e.exif.Thumbnail=a.getExifThumbnail(b,j+i.exif[513],i.exif[514]))),e.exif[34665]&&!f.disableExifSub&&a.parseExifTags(b,j,j+e.exif[34665],g,e),e.exif[34853]&&!f.disableExifGps&&a.parseExifTags(b,j,j+e.exif[34853],g,e)}}},a.metaDataParsers.jpeg[65505].push(a.parseExifData)}),function(a){"use strict";"function"==typeof define&&define.amd?define(["load-image","load-image-exif"],a):a(window.loadImage)}(function(a){"use strict";a.ExifMap.prototype.tags={256:"ImageWidth",257:"ImageHeight",34665:"ExifIFDPointer",34853:"GPSInfoIFDPointer",40965:"InteroperabilityIFDPointer",258:"BitsPerSample",259:"Compression",262:"PhotometricInterpretation",274:"Orientation",277:"SamplesPerPixel",284:"PlanarConfiguration",530:"YCbCrSubSampling",531:"YCbCrPositioning",282:"XResolution",283:"YResolution",296:"ResolutionUnit",273:"StripOffsets",278:"RowsPerStrip",279:"StripByteCounts",513:"JPEGInterchangeFormat",514:"JPEGInterchangeFormatLength",301:"TransferFunction",318:"WhitePoint",319:"PrimaryChromaticities",529:"YCbCrCoefficients",532:"ReferenceBlackWhite",306:"DateTime",270:"ImageDescription",271:"Make",272:"Model",305:"Software",315:"Artist",33432:"Copyright",36864:"ExifVersion",40960:"FlashpixVersion",40961:"ColorSpace",40962:"PixelXDimension",40963:"PixelYDimension",42240:"Gamma",37121:"ComponentsConfiguration",37122:"CompressedBitsPerPixel",37500:"MakerNote",37510:"UserComment",40964:"RelatedSoundFile",36867:"DateTimeOriginal",36868:"DateTimeDigitized",37520:"SubSecTime",37521:"SubSecTimeOriginal",37522:"SubSecTimeDigitized",33434:"ExposureTime",33437:"FNumber",34850:"ExposureProgram",34852:"SpectralSensitivity",34855:"PhotographicSensitivity",34856:"OECF",34864:"SensitivityType",34865:"StandardOutputSensitivity",34866:"RecommendedExposureIndex",34867:"ISOSpeed",34868:"ISOSpeedLatitudeyyy",34869:"ISOSpeedLatitudezzz",37377:"ShutterSpeedValue",37378:"ApertureValue",37379:"BrightnessValue",37380:"ExposureBias",37381:"MaxApertureValue",37382:"SubjectDistance",37383:"MeteringMode",37384:"LightSource",37385:"Flash",37396:"SubjectArea",37386:"FocalLength",41483:"FlashEnergy",41484:"SpatialFrequencyResponse",41486:"FocalPlaneXResolution",41487:"FocalPlaneYResolution",41488:"FocalPlaneResolutionUnit",41492:"SubjectLocation",41493:"ExposureIndex",41495:"SensingMethod",41728:"FileSource",41729:"SceneType",41730:"CFAPattern",41985:"CustomRendered",41986:"ExposureMode",41987:"WhiteBalance",41988:"DigitalZoomRatio",41989:"FocalLengthIn35mmFilm",41990:"SceneCaptureType",41991:"GainControl",41992:"Contrast",41993:"Saturation",41994:"Sharpness",41995:"DeviceSettingDescription",41996:"SubjectDistanceRange",42016:"ImageUniqueID",42032:"CameraOwnerName",42033:"BodySerialNumber",42034:"LensSpecification",42035:"LensMake",42036:"LensModel",42037:"LensSerialNumber",0:"GPSVersionID",1:"GPSLatitudeRef",2:"GPSLatitude",3:"GPSLongitudeRef",4:"GPSLongitude",5:"GPSAltitudeRef",6:"GPSAltitude",7:"GPSTimeStamp",8:"GPSSatellites",9:"GPSStatus",10:"GPSMeasureMode",11:"GPSDOP",12:"GPSSpeedRef",13:"GPSSpeed",14:"GPSTrackRef",15:"GPSTrack",16:"GPSImgDirectionRef",17:"GPSImgDirection",18:"GPSMapDatum",19:"GPSDestLatitudeRef",20:"GPSDestLatitude",21:"GPSDestLongitudeRef",22:"GPSDestLongitude",23:"GPSDestBearingRef",24:"GPSDestBearing",25:"GPSDestDistanceRef",26:"GPSDestDistance",27:"GPSProcessingMethod",28:"GPSAreaInformation",29:"GPSDateStamp",30:"GPSDifferential",31:"GPSHPositioningError"},a.ExifMap.prototype.stringValues={ExposureProgram:{0:"Undefined",1:"Manual",2:"Normal program",3:"Aperture priority",4:"Shutter priority",5:"Creative program",6:"Action program",7:"Portrait mode",8:"Landscape mode"},MeteringMode:{0:"Unknown",1:"Average",2:"CenterWeightedAverage",3:"Spot",4:"MultiSpot",5:"Pattern",6:"Partial",255:"Other"},LightSource:{0:"Unknown",1:"Daylight",2:"Fluorescent",3:"Tungsten (incandescent light)",4:"Flash",9:"Fine weather",10:"Cloudy weather",11:"Shade",12:"Daylight fluorescent (D 5700 - 7100K)",13:"Day white fluorescent (N 4600 - 5400K)",14:"Cool white fluorescent (W 3900 - 4500K)",15:"White fluorescent (WW 3200 - 3700K)",17:"Standard light A",18:"Standard light B",19:"Standard light C",20:"D55",21:"D65",22:"D75",23:"D50",24:"ISO studio tungsten",255:"Other"},Flash:{0:"Flash did not fire",1:"Flash fired",5:"Strobe return light not detected",7:"Strobe return light detected",9:"Flash fired, compulsory flash mode",13:"Flash fired, compulsory flash mode, return light not detected",15:"Flash fired, compulsory flash mode, return light detected",16:"Flash did not fire, compulsory flash mode",24:"Flash did not fire, auto mode",25:"Flash fired, auto mode",29:"Flash fired, auto mode, return light not detected",31:"Flash fired, auto mode, return light detected",32:"No flash function",65:"Flash fired, red-eye reduction mode",69:"Flash fired, red-eye reduction mode, return light not detected",71:"Flash fired, red-eye reduction mode, return light detected",73:"Flash fired, compulsory flash mode, red-eye reduction mode",77:"Flash fired, compulsory flash mode, red-eye reduction mode, return light not detected",79:"Flash fired, compulsory flash mode, red-eye reduction mode, return light detected",89:"Flash fired, auto mode, red-eye reduction mode",93:"Flash fired, auto mode, return light not detected, red-eye reduction mode",95:"Flash fired, auto mode, return light detected, red-eye reduction mode"},SensingMethod:{1:"Undefined",2:"One-chip color area sensor",3:"Two-chip color area sensor",4:"Three-chip color area sensor",5:"Color sequential area sensor",7:"Trilinear sensor",8:"Color sequential linear sensor"},SceneCaptureType:{0:"Standard",1:"Landscape",2:"Portrait",3:"Night scene"},SceneType:{1:"Directly photographed"},CustomRendered:{0:"Normal process",1:"Custom process"},WhiteBalance:{0:"Auto white balance",1:"Manual white balance"},GainControl:{0:"None",1:"Low gain up",2:"High gain up",3:"Low gain down",4:"High gain down"},Contrast:{0:"Normal",1:"Soft",2:"Hard"},Saturation:{0:"Normal",1:"Low saturation",2:"High saturation"},Sharpness:{0:"Normal",1:"Soft",2:"Hard"},SubjectDistanceRange:{0:"Unknown",1:"Macro",2:"Close view",3:"Distant view"},FileSource:{3:"DSC"},ComponentsConfiguration:{0:"",1:"Y",2:"Cb",3:"Cr",4:"R",5:"G",6:"B"},Orientation:{1:"top-left",2:"top-right",3:"bottom-right",4:"bottom-left",5:"left-top",6:"right-top",7:"right-bottom",8:"left-bottom"}},a.ExifMap.prototype.getText=function(a){var b=this.get(a);switch(a){case"LightSource":case"Flash":case"MeteringMode":case"ExposureProgram":case"SensingMethod":case"SceneCaptureType":case"SceneType":case"CustomRendered":case"WhiteBalance":case"GainControl":case"Contrast":case"Saturation":case"Sharpness":case"SubjectDistanceRange":case"FileSource":case"Orientation":return this.stringValues[a][b];case"ExifVersion":case"FlashpixVersion":return String.fromCharCode(b[0],b[1],b[2],b[3]);case"ComponentsConfiguration":return this.stringValues[a][b[0]]+this.stringValues[a][b[1]]+this.stringValues[a][b[2]]+this.stringValues[a][b[3]];case"GPSVersionID":return b[0]+"."+b[1]+"."+b[2]+"."+b[3]}return String(b)},function(a){var b,c=a.tags,d=a.map;for(b in c)c.hasOwnProperty(b)&&(d[c[b]]=b)}(a.ExifMap.prototype),a.ExifMap.prototype.getAll=function(){var a,b,c={};for(a in this)this.hasOwnProperty(a)&&(b=this.tags[a],b&&(c[b]=this.getText(b)));return c}});

data/app/assets/javascripts/uploadbox.coffee

@@ -1,10 +1,13 @@
 #= require jquery.ui.widget
+#= require _uuid
+#= require load-image.min
+#= require canvas-to-blob.min
 #= require jquery.iframe-transport
 #= require cors/jquery.postmessage-transport
 #= require cors/jquery.xdr-transport
-#= require _uuid
 #= require jquery.fileupload
 #= require _image_uploader
 #= require _uploader_preview
 #= require _gallery_uploader
-#= require _manager
+#= require _show_image
+#= require _manager

data/app/assets/stylesheets/uploadbox.sass

@@ -1,8 +1,24 @@
 @import bootstrap/progress
 
+.uploadbox-image-container
+  background: #eee
+  display: inline-block
+  img, canvas
+    display: inline-block
+    vertical-align: bottom
+
+.uploadbox-image-container.uploadbox-processing
+  background: #eee
+
 .uploadbox-image-uploader
   position: relative
 
+  .uploader-overlay
+    width: 100%
+    background: rgba(0, 0, 0, .6)
+    position: absolute
+    z-index: 1
+
   .btn
     background-color: #f7f7f7
     text-align: center
@@ -25,11 +41,11 @@
       width: 100%
       top: 10px
 
-    &.uploading:before
-      content: 'Enviando'
+    // &.uploading:before
+    //   content: 'Enviando'
 
-    &.processing:before
-      content: 'Processando'
+    // &.processing:before
+    //   content: 'Processando'
 
 
   .fileupload-new .btn.fileupload-exists
@@ -110,7 +126,7 @@
     .btn
       vertical-align: middle
 
-  .fileupload-exists .fileupload-new, .fileupload-new .fileupload-exists
+  .fileupload-exists .fileupload-new, .fileupload-new .fileupload-exists, .fileupload-uploading .fileupload-new
     display: none
 
   .fileupload-inline .fileupload-controls
@@ -157,7 +173,7 @@
     width: 100%
 
   .progress
-    height: 10px
+    height: 7px
     width: 100%
     margin-bottom: 0
     border-radius: 0
@@ -183,4 +199,8 @@
     border: 0
     &:hover
       background: black
-      color: white
+      color: white
+
+  .fileupload-uploading
+    .btn.fileupload-exists
+      display: none

data/app/controllers/uploadbox/images_controller.rb

@@ -3,19 +3,29 @@ module Uploadbox
     layout false
 
     def create
+      attributes = image_params
+      attributes["imageable_type"].constantize # load class
+      attributes["original_file"] = attributes["remote_file_url"]
+
+      attributes.delete("upload_name")
+      attributes.delete("remote_file_url")
+
+      upload = Uploadbox.const_get(upload_class_name).create!(attributes)
+
       if Uploadbox.background_processing
-        Resque.enqueue(ProcessImage, image_params)
+        Resque.enqueue(ProcessImage, {id: upload.id, upload_class_name: upload_class_name})
       else
-        Image.create_upload(image_params)
+        upload.process
       end
+
       render nothing: true
     end
 
     def find
-      params[:imageable_type].constantize # load class
+      # binding.pry
+      image_params["imageable_type"].constantize # load class
 
-      upload_class_name = params[:imageable_type] + params[:upload_name].camelize
-      @image = Uploadbox.const_get(upload_class_name).find_by(secure_random: params[:secure_random])
+      @image = Uploadbox.const_get(upload_class_name).find_by(secure_random: image_params[:secure_random])
     end
 
     def destroy
@@ -26,5 +36,9 @@ module Uploadbox
       def image_params
         params.require(:image).permit(:remote_file_url, :imageable_type, :upload_name, :secure_random)
       end
+
+      def upload_class_name
+        image_params["imageable_type"] + image_params["upload_name"].camelize
+      end
   end
 end

data/app/helpers/uploadbox/img_helper.rb

@@ -4,7 +4,6 @@ module Uploadbox
       Base64.encode64(policy_data.to_json).gsub("\n", "")
     end
 
-
     def s3_signature
       Base64.encode64(
         OpenSSL::HMAC.digest(
@@ -17,7 +16,21 @@ module Uploadbox
 
     def img(source, options={})
       if source.respond_to?(:url) and source.respond_to?(:width) and source.respond_to?(:height)
-        image_tag(source.url, {width: source.width, height: source.height}.merge(options))
+        if source.processing?
+          data = {
+            processing: source.processing?,
+            original: source.original_file,
+            component: 'ShowImage'
+          }
+          content_tag :div, class: 'uploadbox-image-container uploadbox-processing', style: "width: #{source.width}px; height: #{source.height}px", data: data do
+            image_tag(source.url, {width: source.width, height: source.height, style: 'display: none'}.merge(options))
+          end
+        else
+          data = {}
+          content_tag :div, class: 'uploadbox-image-container', width: source.width, height: source.height, data: data do
+            image_tag(source.url, {width: source.width, height: source.height}.merge(options))
+          end
+        end
       else
         image_tag(source, options)
       end

data/app/jobs/process_image.rb

@@ -1,9 +1,9 @@
 class ProcessImage
   extend HerokuResqueAutoScale
-  
+
   @queue = :process_image
 
-  def self.perform(image_params)
-    Image.create_upload(image_params)
+  def self.perform(attributes)
+    Uploadbox.const_get(attributes['upload_class_name']).find(attributes['id']).process
   end
 end

data/app/models/image.rb

@@ -1,11 +1,11 @@
 class Image < ActiveRecord::Base
   belongs_to :imageable, polymorphic: true
 
-  def self.create_upload(attributes)
-    attributes["imageable_type"].constantize # load class
+  def process
+    update(remote_file_url: original_file)
+  end
 
-    upload_class_name = attributes["imageable_type"] + attributes["upload_name"].camelize
-    attributes.delete("upload_name")
-    Uploadbox.const_get(upload_class_name).create!(attributes)
+  def processing?
+    file.blank?
   end
 end

data/config/routes.rb

@@ -3,5 +3,7 @@ Uploadbox::Engine.routes.draw do
   resources :images, only: [:create, :update, :destroy] do
     get 'find', on: :collection
   end
-  # mount Resque::Server.new, :at => "/resque"
+  if Uploadbox.resque_server
+    mount Resque::Server.new, :at => "/resque"
+  end
 end

data/lib/generators/uploadbox/image/templates/initializers/uploadbox.rb

@@ -3,11 +3,17 @@ Uploadbox.retina_quality = 30
 Uploadbox.image_quality  = 70
 
 if Rails.env.production?
+  Uploadbox.background_processing  = true
+
   REDIS = Redis.connect(url: ENV["REDISCLOUD_URL"])
   Resque.redis = REDIS
   Resque.after_fork = Proc.new { ActiveRecord::Base.establish_connection }
 end
 
+if Rails.env.development?
+  Uploadbox.resque_server = true
+end
+
 CarrierWave.configure do |config|
   config.storage = :fog
 

data/lib/generators/uploadbox/image/templates/migrate/create_images.rb

@@ -8,6 +8,7 @@ class CreateImages < ActiveRecord::Migration
       t.boolean :retina, default: false
       t.string :upload_name
       t.string :secure_random, index: true
+      t.string :original_file
 
       t.timestamps
     end

data/lib/uploadbox/image_uploader.rb

@@ -22,7 +22,7 @@ module Uploadbox
       # @post.picture?
       define_method("#{upload_name}?") do
         upload = send("#{upload_name}_upload")
-        !!(upload and upload.file?)
+        !!(upload and (upload.processing? or upload.file?))
       end
 
       # @post.picture
@@ -36,6 +36,10 @@ module Uploadbox
             def to_s
               url
             end
+
+            def processing?
+              false
+            end
           end
 
           placeholder = Class.new do
@@ -66,7 +70,7 @@ module Uploadbox
 
       # Post.update_picture_versions!
       self.define_singleton_method "update_#{upload_name}_versions!" do
-        Uploadbox.const_get(upload_class_name).find_each{|upload| upload.file.recreate_versions!}
+        Uploadbox.const_get(upload_class_name).find_each{ |upload| upload.file.recreate_versions! if upload.file? }
       end
 
       # Uploadbox::PostPicture < Image
@@ -111,6 +115,14 @@ module Uploadbox
             def height
               dimensions[1]
             end
+
+            def processing?
+              model.processing?
+            end
+
+            def original_file
+              model.original_file
+            end
           end
         end
         mount_uploader :file, dynamic_uploader
@@ -209,6 +221,14 @@ module Uploadbox
             def height
               dimensions[1]
             end
+
+            def processing?
+              model.processing?
+            end
+
+            def original_file
+              model.original_file
+            end
           end
         end
         mount_uploader :file, dynamic_uploader

data/lib/uploadbox/version.rb

@@ -1,3 +1,3 @@
 module Uploadbox
-  VERSION = "0.1.4"
+  VERSION = "0.2.0.beta"
 end

data/lib/uploadbox.rb

@@ -5,4 +5,5 @@ module Uploadbox
   mattr_accessor :image_quality
   mattr_accessor :retina_quality
   mattr_accessor :background_processing
+  mattr_accessor :resque_server
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: uploadbox
 version: !ruby/object:Gem::Version
-  version: 0.1.4
+  version: 0.2.0.beta
 platform: ruby
 authors:
 - Julio Protzek
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2014-03-25 00:00:00.000000000 Z
+date: 2014-03-26 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -332,25 +332,25 @@ dependencies:
       - !ruby/object:Gem::Version
         version: 0.7.2
 - !ruby/object:Gem::Dependency
-  name: sqlite3
+  name: pg
   requirement: !ruby/object:Gem::Requirement
     requirements:
     - - ~>
       - !ruby/object:Gem::Version
-        version: '1.3'
+        version: '0.17'
     - - '>='
       - !ruby/object:Gem::Version
-        version: 1.3.7
+        version: 0.17.1
   type: :development
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - ~>
       - !ruby/object:Gem::Version
-        version: '1.3'
+        version: '0.17'
     - - '>='
       - !ruby/object:Gem::Version
-        version: 1.3.7
+        version: 0.17.1
 - !ruby/object:Gem::Dependency
   name: rspec-rails
   requirement: !ruby/object:Gem::Requirement
@@ -536,13 +536,16 @@ files:
 - app/assets/javascripts/_gallery_uploader.coffee
 - app/assets/javascripts/_image_uploader.coffee
 - app/assets/javascripts/_manager.coffee
+- app/assets/javascripts/_show_image.coffee
 - app/assets/javascripts/_uploader_preview.coffee
 - app/assets/javascripts/_uuid.js
+- app/assets/javascripts/canvas-to-blob.min.js
 - app/assets/javascripts/cors/jquery.postmessage-transport.js
 - app/assets/javascripts/cors/jquery.xdr-transport.js
 - app/assets/javascripts/jquery.fileupload.js
 - app/assets/javascripts/jquery.iframe-transport.js
 - app/assets/javascripts/jquery.ui.widget.js
+- app/assets/javascripts/load-image.min.js
 - app/assets/javascripts/uploadbox.coffee
 - app/assets/stylesheets/bootstrap/_progress.css
 - app/assets/stylesheets/uploadbox.sass
@@ -589,9 +592,9 @@ required_ruby_version: !ruby/object:Gem::Requirement
       version: 1.9.3
 required_rubygems_version: !ruby/object:Gem::Requirement
   requirements:
-  - - '>='
+  - - '>'
     - !ruby/object:Gem::Version
-      version: '0'
+      version: 1.3.1
 requirements: []
 rubyforge_project: 
 rubygems_version: 2.1.11