radiant-assets-extension 0.0.4 → 0.0.5

data/app/controllers/admin/assets_controller.rb

@@ -1,4 +1,28 @@
 class Admin::AssetsController < Admin::ResourceController
   paginate_models
   helper :assets
+  
+  def create
+    # HACK: depends on javascript being present and packaging each file
+    # in its own request
+    # TODO: handle non-js situations with several files in one request
+    @asset = Asset.create! :upload => Array(params[:asset][:upload]).first
+    @asset.save!
+    render_hacky_json(:markup => @template.asset_listing(@asset))
+  rescue => e
+    logger.warn(e.to_s)
+    render_hacky_json(:markup => "Error: #{e.to_s}")
+  end
+  
+private
+  # HACK: sending JSON as text/html
+  # (https://github.com/blueimp/jQuery-File-Upload/wiki/Setup)
+  # jquery.fileupload makes use of iframes for browsers like Microsoft
+  # Internet Explorer and Opera, which do not yet support XMLHTTPRequest
+  # uploads. They will only register a load event if the Content-type of the
+  # response is set to text/plain or text/html, not if it is set to
+  # application/json.
+  def render_hacky_json(data)
+    render :json => data, :content_type => 'text/html'
+  end
 end

data/app/helpers/assets_helper.rb

@@ -1,4 +1,4 @@
-module AssetsHelper
+module AssetsHelper  
   def asset_listing(asset)
     icon(asset) +
     content_tag(:span, asset.to_s, :class=>'title')
@@ -40,9 +40,7 @@ module AssetsHelper
   end
   
   def video_player(asset)
-    content_tag :video, :controls => 'controls' do
-      content_tag :source, '', :src => @asset.upload.url, :type => @asset.upload.mime_type
-    end
+    %Q{<video src="#{asset.upload.url}" type="#{asset.upload.mime_type}" controls="controls">}
   end
   
   def audio_player(asset)
@@ -58,10 +56,7 @@ module AssetsHelper
   end
   
   def view_toggle
-    if list_view?
-      link_to 'Grid view', admin_assets_path(:view => 'grid')
-     else
-      link_to 'List view', admin_assets_path(:view => 'list')
-    end
+    other = list_view? ? 'grid' : 'list'
+    link_to "Switch to #{other} view", admin_assets_path(:view => other)
   end
 end

data/app/models/asset.rb

@@ -10,8 +10,8 @@ class Asset < ActiveRecord::Base
      # HACK: relying on extension instead of using analyser and upload.format
      # analyser can throw us into very long loop when trying to identify
      # non-image files like word docs
-     upload.ext.to_sym
-  rescue UnableToHandle
+     upload.ext && upload.ext.to_sym
+  rescue Dragonfly::FunctionManager::UnableToHandle
     :generic
   end
   

data/app/views/admin/assets/edit.html.erb

@@ -2,7 +2,7 @@
 
 <h1>Edit Asset</h1>
 
-<% form_for [:admin, @asset], :html => {'data-onsubmit_status' => onsubmit_status(@asset)} do |f| %>
+<% form_for [:admin, @asset], :html => {:multipart => true, 'data-onsubmit_status' => onsubmit_status(@asset)} do |f| %>
   <div class="form_area">
     <p class="title">
       Caption: <%= f.text_field :caption %>
@@ -16,8 +16,7 @@
         <% end %>
       </tbody>
     </table>
-    <!-- FIXME: doesn't work at the moment -->
-    <!-- <%= f.file_field :upload %> -->
+    <%= f.file_field :upload %>
     <%= display(@asset) %>
   </div>
   <p class="buttons">

data/app/views/admin/assets/index.html.erb

@@ -7,7 +7,7 @@
 <div id="actions">
   <%= pagination_for(@assets) %>
   <ul>
-    <li class="new"><%= link_to 'Upload New Asset', new_admin_asset_path %></li>
+    <li class="new"><%= link_to 'Upload New Assets', new_admin_asset_path %></li>
     <li><%= view_toggle %></li>
   </ul>
 </div>

data/app/views/admin/assets/new.html.erb

@@ -1,8 +1,45 @@
-<h1>Upload New Asset</h1>
+<% include_stylesheet 'admin/extensions/assets/assets' %>
+
+<h1>Upload New Assets</h1>
+<table id="files">
+  <tbody></tbody>
+</table>
+
+<p>You can select multiple files</p>
 <% form_for [:admin, @asset], :html => {:multipart => true, 'data-onsubmit_status'=>'Uploading Asset&#8230;'} do |f| %>
-  <%= f.file_field :upload %>
-  <p class="buttons">
+  <%= f.file_field :upload, :multiple => true %>
+  
+  <!-- <p class="buttons">
     <%= f.submit 'Upload Asset', :class=>'button' %>
     or <%= link_to 'Cancel', admin_assets_path %>
-  </p>
+  </p> -->
 <% end %>
+
+<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
+<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js"></script>
+<% include_stylesheet 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/base/jquery-ui.css' %>
+<script type="text/javascript">jQuery.noConflict();</script>
+<script src="/jquery.fileupload/jquery.fileupload.js" type="text/javascript"></script>
+<script src="/jquery.fileupload/jquery.fileupload-ui.js" type="text/javascript"></script>
+<% include_stylesheet '/jquery.fileupload/jquery.fileupload-ui.css' %>
+<script type="text/javascript">
+  (function($) {
+    $(function () {
+      $('form.new_asset').fileUploadUI({
+        uploadTable: $('#files'),
+        downloadTable: $('#files'),
+        buildUploadRow: function (files, index) {
+          return $('<tr><td>' + files[index].name + '<\/td>' +
+                   '<td class="file_upload_progress"><div><\/div><\/td>' +
+                   '<td class="file_upload_cancel">' +
+                   '<button class="ui-state-default ui-corner-all" title="Cancel">' +
+                   '<span class="ui-icon ui-icon-cancel">Cancel<\/span>' +
+                   '<\/button><\/td><\/tr>');
+        },
+        buildDownloadRow: function (file) {
+          return $('<tr><td>' + file.markup + '<\/td><\/tr>');
+        }
+      });
+    });
+  }(jQuery));
+</script>

data/lib/radiant-assets-extension/version.rb

@@ -1,3 +1,3 @@
 module RadiantAssetsExtension
-  VERSION = '0.0.4'
+  VERSION = '0.0.5'
 end

data/lib/tasks/assets_extension_tasks.rake

@@ -2,7 +2,7 @@ namespace :radiant do
   namespace :extensions do
     namespace :assets do
       
-      desc "Runs the migration of the Images extension"
+      desc "Runs the migration of the Assets extension"
       task :migrate => :environment do
         require 'radiant/extension_migrator'
         if ENV["VERSION"]
@@ -14,10 +14,10 @@ namespace :radiant do
         end
       end
       
-      desc "Copies public assets of the Images to the instance public/ directory."
+      desc "Copies public assets of the Assets extension to the instance public/ directory."
       task :update => :environment do
         is_svn_or_dir = proc {|path| path =~ /\.svn/ || File.directory?(path) }
-        puts "Copying assets from ImagesExtension"
+        puts "Copying assets from AssetsExtension"
         Dir[AssetsExtension.root + "/public/**/*"].reject(&is_svn_or_dir).each do |file|
           path = file.sub(AssetsExtension.root, '')
           directory = File.dirname(path)
@@ -25,7 +25,7 @@ namespace :radiant do
           cp file, RAILS_ROOT + path, :verbose => false
         end
         unless AssetsExtension.root.starts_with? RAILS_ROOT # don't need to copy vendored tasks  
-          puts "Copying rake tasks from ImagesExtension"
+          puts "Copying rake tasks from AssetsExtension"
           local_tasks_path = File.join(RAILS_ROOT, %w(lib tasks))
           mkdir_p local_tasks_path, :verbose => false
           Dir[File.join AssetsExtension.root, %w(lib tasks *.rake)].each do |file|

data/public/jquery.fileupload/.gitignore

@@ -0,0 +1 @@
+.DS_Store

data/public/jquery.fileupload/jquery.fileupload-ui.css

@@ -0,0 +1,74 @@
+.file_upload {
+  position: relative;
+  overflow: hidden;
+  direction: ltr;
+  cursor: pointer;
+  text-align: center;
+  color: #333;
+  font-weight: bold;
+  -moz-border-radius: 10px;
+  -webkit-border-radius: 10px;
+  border-radius: 10px;
+  width: 200px;
+  height: 30px;
+  line-height: 30px;
+  background: palegreen;
+  border: 1px solid limegreen;
+}
+
+.file_upload_small {
+  width: 200px;
+  height: 30px;
+  line-height: 30px;
+  font-size: auto;
+  background: palegreen;
+  border: 1px solid limegreen;
+}
+
+.file_upload_large {
+  width: 100%;
+  height: 150px;
+  line-height: 150px;
+  font-size: 20px;
+  background: palegreen;
+  border: 1px solid limegreen;
+}
+
+.file_upload_highlight {
+  background: lawngreen;
+}
+
+.file_upload input {
+  position: absolute;
+  top: 0;
+  right: 0;
+  margin: 0;
+  border: 300px solid transparent;
+  opacity: 0;
+  -ms-filter: 'alpha(opacity=0)';
+  filter: alpha(opacity=0);
+  -o-transform: translate(-300px, -300px) scale(10);
+  -moz-transform: translate(-800px, 0) scale(10);
+  cursor: pointer;
+}
+
+.file_upload iframe, .file_upload button {
+  display: none;
+}
+
+.file_upload_preview img {
+  width: 80px;
+}
+
+.file_upload_progress .ui-progressbar-value {
+  background: url(pbar-ani.gif);
+}
+
+.file_upload_progress div {
+  width: 150px;
+  height: 15px;
+}
+
+.file_upload_cancel button {
+  cursor: pointer;
+}

data/public/jquery.fileupload/jquery.fileupload-ui.js

@@ -0,0 +1,308 @@
+/*
+ * jQuery File Upload User Interface Plugin 3.6
+ *
+ * Copyright 2010, Sebastian Tschan, AQUANTUM
+ * Licensed under the MIT license:
+ * http://creativecommons.org/licenses/MIT/
+ *
+ * https://blueimp.net
+ * http://www.aquantum.de
+ */
+
+/*jslint browser: true */
+/*global jQuery, FileReader, URL */
+
+(function ($) {
+
+    var undef = 'undefined',
+        func = 'function',
+        UploadHandler,
+        methods,
+
+        LocalImage = function (file, imageTypes) {
+            var img,
+                fileReader;
+            if (!imageTypes.test(file.type)) {
+                return null;
+            }
+            img = document.createElement('img');
+            if (typeof URL !== undef && typeof URL.createObjectURL === func) {
+                img.src = URL.createObjectURL(file);
+                img.onload = function () {
+                    URL.revokeObjectURL(this.src);
+                };
+                return img;
+            }
+            if (typeof FileReader !== undef) {
+                fileReader = new FileReader();
+                if (typeof fileReader.readAsDataURL === func) {
+                    fileReader.onload = function (e) {
+                        img.src = e.target.result;
+                    };
+                    fileReader.readAsDataURL(file);
+                    return img;
+                }
+            }
+            return null;
+        };
+        
+    UploadHandler = function (container, options) {
+        var uploadHandler = this,
+            dragOverTimeout,
+            isDropZoneEnlarged;
+        
+        this.dropZone = container;
+        this.imageTypes = /^image\/(gif|jpeg|png)$/;
+        this.previewSelector = '.file_upload_preview';
+        this.progressSelector = '.file_upload_progress div';
+        this.cancelSelector = '.file_upload_cancel button';
+        this.cssClassSmall = 'file_upload_small';
+        this.cssClassLarge = 'file_upload_large';
+        this.cssClassHighlight = 'file_upload_highlight';
+        this.dropEffect = 'highlight';
+        this.uploadTable = this.downloadTable = null;
+        
+        this.buildUploadRow = this.buildDownloadRow = function () {
+            return null;
+        };
+
+        this.addNode = function (parentNode, node, callBack) {
+            if (node) {
+                node.css('display', 'none').appendTo(parentNode).fadeIn(function () {
+                    if (typeof callBack === func) {
+                        try {
+                            callBack();
+                        } catch (e) {
+                            // Fix endless exception loop:
+                            $(this).stop();
+                            throw e;
+                        }
+                    }
+                });
+            } else if (typeof callBack === func) {
+                callBack();
+            }
+        };
+
+        this.removeNode = function (node, callBack) {
+            if (node) {
+                node.fadeOut(function () {
+                    $(this).remove();
+                    if (typeof callBack === func) {
+                        try {
+                            callBack();
+                        } catch (e) {
+                            // Fix endless exception loop:
+                            $(this).stop();
+                            throw e;
+                        }
+                    }
+                });
+            } else if (typeof callBack === func) {
+                callBack();
+            }
+        };
+
+        this.onAbort = function (event, files, index, xhr, handler) {
+            handler.removeNode(handler.uploadRow);
+        };
+        
+        this.cancelUpload = function (event, files, index, xhr, handler) {
+            var readyState = xhr.readyState;
+            xhr.abort();
+            // If readyState is below 2, abort() has no effect:
+            if (isNaN(readyState) || readyState < 2) {
+                handler.onAbort(event, files, index, xhr, handler);
+            }
+        };
+        
+        this.initProgressBar = function (node, value) {
+            if (typeof node.progressbar === func) {
+                return node.progressbar({
+                    value: value
+                });
+            } else {
+                var progressbar = $('<progress value="' + value + '" max="100"/>').appendTo(node);
+                progressbar.progressbar = function (key, value) {
+                    progressbar.attr('value', value);
+                };
+                return progressbar;
+            }
+        };
+        
+        this.initUploadRow = function (event, files, index, xhr, handler, callBack) {
+            var uploadRow = handler.uploadRow = handler.buildUploadRow(files, index, handler);
+            if (uploadRow) {
+                handler.progressbar = handler.initProgressBar(
+                    uploadRow.find(handler.progressSelector),
+                    (xhr.upload ? 0 : 100)
+                );
+                uploadRow.find(handler.cancelSelector).click(function (e) {
+                    handler.cancelUpload(e, files, index, xhr, handler);
+                });
+                uploadRow.find(handler.previewSelector).each(function () {
+                    $(this).append(new LocalImage(files[index], handler.imageTypes));
+                });
+            }
+            handler.addNode(
+                (typeof handler.uploadTable === func ? handler.uploadTable(handler) : handler.uploadTable),
+                uploadRow,
+                callBack
+            );
+        };
+        
+        this.initUpload = function (event, files, index, xhr, handler, callBack) {
+            handler.initUploadRow(event, files, index, xhr, handler, function () {
+                if (typeof handler.beforeSend === func) {
+                    handler.beforeSend(event, files, index, xhr, handler, callBack);
+                } else {
+                    callBack();
+                }
+            });
+        };
+        
+        this.onProgress = function (event, files, index, xhr, handler) {
+            if (handler.progressbar) {
+                handler.progressbar.progressbar(
+                    'value',
+                    parseInt(event.loaded / event.total * 100, 10)
+                );
+            }
+        };
+        
+        this.parseResponse = function (xhr) {
+            if (typeof xhr.responseText !== undef) {
+                return $.parseJSON(xhr.responseText);
+            } else {
+                // Instead of an XHR object, an iframe is used for legacy browsers:
+                return $.parseJSON(xhr.contents().text());
+            }
+        };
+        
+        this.initDownloadRow = function (event, files, index, xhr, handler, callBack) {
+            var json, downloadRow;
+            try {
+                json = handler.response = handler.parseResponse(xhr);
+                downloadRow = handler.downloadRow = handler.buildDownloadRow(json, handler);
+                handler.addNode(
+                    (typeof handler.downloadTable === func ? handler.downloadTable(handler) : handler.downloadTable),
+                    downloadRow,
+                    callBack
+                );
+            } catch (e) {
+                if (typeof handler.onError === func) {
+                    handler.originalEvent = event;
+                    handler.onError(e, files, index, xhr, handler);
+                } else {
+                    throw e;
+                }
+            }
+        };
+        
+        this.onLoad = function (event, files, index, xhr, handler) {
+            handler.removeNode(handler.uploadRow, function () {
+                handler.initDownloadRow(event, files, index, xhr, handler, function () {
+                    if (typeof handler.onComplete === func) {
+                        handler.onComplete(event, files, index, xhr, handler);
+                    }
+                });
+            });
+        };
+
+        this.dropZoneEnlarge = function () {
+            if (!isDropZoneEnlarged) {
+                if (typeof uploadHandler.dropZone.switchClass === func) {
+                    uploadHandler.dropZone.switchClass(
+                        uploadHandler.cssClassSmall,
+                        uploadHandler.cssClassLarge
+                    );
+                } else {
+                    uploadHandler.dropZone.addClass(uploadHandler.cssClassLarge);
+                    uploadHandler.dropZone.removeClass(uploadHandler.cssClassSmall);
+                }
+                isDropZoneEnlarged = true;
+            }
+        };
+        
+        this.dropZoneReduce = function () {
+            if (typeof uploadHandler.dropZone.switchClass === func) {
+                uploadHandler.dropZone.switchClass(
+                    uploadHandler.cssClassLarge,
+                    uploadHandler.cssClassSmall
+                );
+            } else {
+                uploadHandler.dropZone.addClass(uploadHandler.cssClassSmall);
+                uploadHandler.dropZone.removeClass(uploadHandler.cssClassLarge);
+            }
+            isDropZoneEnlarged = false;
+        };
+
+        this.onDocumentDragEnter = function (event) {
+            uploadHandler.dropZoneEnlarge();
+        };
+        
+        this.onDocumentDragOver = function (event) {
+            if (dragOverTimeout) {
+                clearTimeout(dragOverTimeout);
+            }
+            dragOverTimeout = setTimeout(function () {
+                uploadHandler.dropZoneReduce();
+            }, 200);
+        };
+        
+        this.onDragEnter = this.onDragLeave = function (event) {
+            uploadHandler.dropZone.toggleClass(uploadHandler.cssClassHighlight);
+        };
+        
+        this.onDrop = function (event) {
+            if (dragOverTimeout) {
+                clearTimeout(dragOverTimeout);
+            }
+            if (uploadHandler.dropEffect && typeof uploadHandler.dropZone.effect === func) {
+                uploadHandler.dropZone.effect(uploadHandler.dropEffect, function () {
+                    uploadHandler.dropZone.removeClass(uploadHandler.cssClassHighlight);
+                    uploadHandler.dropZoneReduce();
+                });
+            } else {
+                uploadHandler.dropZone.removeClass(uploadHandler.cssClassHighlight);
+                uploadHandler.dropZoneReduce();
+            }
+        };
+
+        $.extend(this, options);
+    };
+
+    methods = {
+        init : function (options) {
+            return this.each(function () {
+                $(this).fileUpload(new UploadHandler($(this), options));
+            });
+        },
+        
+        option: function (option, value, namespace) {
+            if (typeof option === undef || (typeof option === 'string' && typeof value === undef)) {
+                return $(this).fileUpload('option', option, value, namespace);
+            }
+            return this.each(function () {
+                $(this).fileUpload('option', option, value, namespace);
+            });
+        },
+            
+        destroy : function (namespace) {
+            return this.each(function () {
+                $(this).fileUpload('destroy', namespace);
+            });
+        }
+    };
+    
+    $.fn.fileUploadUI = function (method) {
+        if (methods[method]) {
+            return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
+        } else if (typeof method === 'object' || !method) {
+            return methods.init.apply(this, arguments);
+        } else {
+            $.error('Method ' + method + ' does not exist on jQuery.fileUploadUI');
+        }
+    };
+    
+}(jQuery));

data/public/jquery.fileupload/jquery.fileupload.js

@@ -0,0 +1,629 @@
+/*
+ * jQuery File Upload Plugin 3.7.1
+ *
+ * Copyright 2010, Sebastian Tschan, AQUANTUM
+ * Licensed under the MIT license:
+ * http://creativecommons.org/licenses/MIT/
+ *
+ * https://blueimp.net
+ * http://www.aquantum.de
+ */
+
+/*jslint browser: true */
+/*global File, FileReader, FormData, unescape, jQuery */
+
+(function ($) {
+
+    var defaultNamespace = 'file_upload',
+        undef = 'undefined',
+        func = 'function',
+        num = 'number',
+        FileUpload,
+        methods,
+
+        MultiLoader = function (callBack, numberComplete) {
+            var loaded = 0;
+            this.complete = function () {
+                loaded += 1;
+                if (loaded === numberComplete) {
+                    callBack();
+                }
+            };
+        };
+        
+    FileUpload = function (container) {
+        var fileUpload = this,
+            uploadForm,
+            fileInput,
+            settings = {
+                namespace: defaultNamespace,
+                uploadFormFilter: function (index) {
+                    return true;
+                },
+                fileInputFilter: function (index) {
+                    return true;
+                },
+                cssClass: defaultNamespace,
+                dragDropSupport: true,
+                dropZone: container,
+                url: function (form) {
+                    return form.attr('action');
+                },
+                method: function (form) {
+                    return form.attr('method');
+                },
+                fieldName: function (input) {
+                    return input.attr('name');
+                },
+                formData: function (form) {
+                    return form.serializeArray();
+                },
+                multipart: true,
+                multiFileRequest: false,
+                withCredentials: false,
+                forceIframeUpload: false
+            },
+            documentListeners = {},
+            dropZoneListeners = {},
+            protocolRegExp = /^http(s)?:\/\//,
+            optionsReference,
+
+            isXHRUploadCapable = function () {
+                return typeof XMLHttpRequest !== undef && typeof File !== undef && (
+                    !settings.multipart || typeof FormData !== undef || typeof FileReader !== undef
+                );
+            },
+
+            initEventHandlers = function () {
+                if (settings.dragDropSupport) {
+                    if (typeof settings.onDocumentDragEnter === func) {
+                        documentListeners['dragenter.' + settings.namespace] = function (e) {
+                            settings.onDocumentDragEnter(e);
+                        };
+                    }
+                    if (typeof settings.onDocumentDragLeave === func) {
+                        documentListeners['dragleave.' + settings.namespace] = function (e) {
+                            settings.onDocumentDragLeave(e);
+                        };
+                    }
+                    documentListeners['dragover.'   + settings.namespace] = fileUpload.onDocumentDragOver;
+                    documentListeners['drop.'       + settings.namespace] = fileUpload.onDocumentDrop;
+                    $(document).bind(documentListeners);
+                    if (typeof settings.onDragEnter === func) {
+                        dropZoneListeners['dragenter.' + settings.namespace] = function (e) {
+                            settings.onDragEnter(e);
+                        };
+                    }
+                    if (typeof settings.onDragLeave === func) {
+                        dropZoneListeners['dragleave.' + settings.namespace] = function (e) {
+                            settings.onDragLeave(e);
+                        };
+                    }
+                    dropZoneListeners['dragover.'   + settings.namespace] = fileUpload.onDragOver;
+                    dropZoneListeners['drop.'       + settings.namespace] = fileUpload.onDrop;
+                    settings.dropZone.bind(dropZoneListeners);
+                }
+                fileInput.bind('change.' + settings.namespace, fileUpload.onChange);
+            },
+
+            removeEventHandlers = function () {
+                $.each(documentListeners, function (key, value) {
+                    $(document).unbind(key, value);
+                });
+                $.each(dropZoneListeners, function (key, value) {
+                    settings.dropZone.unbind(key, value);
+                });
+                fileInput.unbind('change.' + settings.namespace);
+            },
+
+            initUploadEventHandlers = function (files, index, xhr, settings) {
+                if (typeof settings.onProgress === func) {
+                    xhr.upload.onprogress = function (e) {
+                        settings.onProgress(e, files, index, xhr, settings);
+                    };
+                }
+                if (typeof settings.onLoad === func) {
+                    xhr.onload = function (e) {
+                        settings.onLoad(e, files, index, xhr, settings);
+                    };
+                }
+                if (typeof settings.onAbort === func) {
+                    xhr.onabort = function (e) {
+                        settings.onAbort(e, files, index, xhr, settings);
+                    };
+                }
+                if (typeof settings.onError === func) {
+                    xhr.onerror = function (e) {
+                        settings.onError(e, files, index, xhr, settings);
+                    };
+                }
+            },
+
+            getUrl = function (settings) {
+                if (typeof settings.url === func) {
+                    return settings.url(settings.uploadForm || uploadForm);
+                }
+                return settings.url;
+            },
+            
+            getMethod = function (settings) {
+                if (typeof settings.method === func) {
+                    return settings.method(settings.uploadForm || uploadForm);
+                }
+                return settings.method;
+            },
+            
+            getFieldName = function (settings) {
+                if (typeof settings.fieldName === func) {
+                    return settings.fieldName(settings.fileInput || fileInput);
+                }
+                return settings.fieldName;
+            },
+
+            getFormData = function (settings) {
+                var formData;
+                if (typeof settings.formData === func) {
+                    return settings.formData(settings.uploadForm || uploadForm);
+                } else if ($.isArray(settings.formData)) {
+                    return settings.formData;
+                } else if (settings.formData) {
+                    formData = [];
+                    $.each(settings.formData, function (name, value) {
+                        formData.push({name: name, value: value});
+                    });
+                    return formData;
+                }
+                return [];
+            },
+
+            isSameDomain = function (url) {
+                if (protocolRegExp.test(url)) {
+                    var host = location.host,
+                        indexStart = location.protocol.length + 2,
+                        index = url.indexOf(host, indexStart),
+                        pathIndex = index + host.length;
+                    if ((index === indexStart || index === url.indexOf('@', indexStart) + 1) &&
+                            (url.length === pathIndex || $.inArray(url.charAt(pathIndex), ['/', '?', '#']) !== -1)) {
+                        return true;
+                    }
+                    return false;
+                }
+                return true;
+            },
+
+            nonMultipartUpload = function (file, xhr, sameDomain) {
+                if (sameDomain) {
+                    xhr.setRequestHeader('X-File-Name', unescape(encodeURIComponent(file.name)));
+                }
+                xhr.setRequestHeader('Content-Type', file.type);
+                xhr.send(file);
+            },
+
+            formDataUpload = function (files, xhr, settings) {
+                var formData = new FormData(),
+                    i;
+                $.each(getFormData(settings), function (index, field) {
+                    formData.append(field.name, field.value);
+                });
+                for (i = 0; i < files.length; i += 1) {
+                    formData.append(getFieldName(settings), files[i]);
+                }
+                xhr.send(formData);
+            },
+
+            loadFileContent = function (file, callBack) {
+                var fileReader = new FileReader();
+                fileReader.onload = function (e) {
+                    file.content = e.target.result;
+                    callBack();
+                };
+                fileReader.readAsBinaryString(file);
+            },
+
+            buildMultiPartFormData = function (boundary, files, filesFieldName, fields) {
+                var doubleDash = '--',
+                    crlf     = '\r\n',
+                    formData = '';
+                $.each(fields, function (index, field) {
+                    formData += doubleDash + boundary + crlf +
+                        'Content-Disposition: form-data; name="' +
+                        unescape(encodeURIComponent(field.name)) +
+                        '"' + crlf + crlf +
+                        unescape(encodeURIComponent(field.value)) + crlf;
+                });
+                $.each(files, function (index, file) {
+                    formData += doubleDash + boundary + crlf +
+                        'Content-Disposition: form-data; name="' +
+                        unescape(encodeURIComponent(filesFieldName)) +
+                        '"; filename="' + unescape(encodeURIComponent(file.name)) + '"' + crlf +
+                        'Content-Type: ' + file.type + crlf + crlf +
+                        file.content + crlf;
+                });
+                formData += doubleDash + boundary + doubleDash + crlf;
+                return formData;
+            },
+            
+            fileReaderUpload = function (files, xhr, settings) {
+                var boundary = '----MultiPartFormBoundary' + (new Date()).getTime(),
+                    loader,
+                    i;
+                xhr.setRequestHeader('Content-Type', 'multipart/form-data; boundary=' + boundary);
+                loader = new MultiLoader(function () {
+                    xhr.sendAsBinary(buildMultiPartFormData(
+                        boundary,
+                        files,
+                        getFieldName(settings),
+                        getFormData(settings)
+                    ));
+                }, files.length);
+                for (i = 0; i < files.length; i += 1) {
+                    loadFileContent(files[i], loader.complete);
+                }
+            },
+
+            upload = function (files, index, xhr, settings) {
+                var url = getUrl(settings),
+                    sameDomain = isSameDomain(url),
+                    filesToUpload;
+                initUploadEventHandlers(files, index, xhr, settings);
+                xhr.open(getMethod(settings), url, true);
+                if (sameDomain) {
+                    xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
+                } else if (settings.withCredentials) {
+                    xhr.withCredentials = true;
+                }
+                if (!settings.multipart) {
+                    nonMultipartUpload(files[index], xhr, sameDomain);
+                } else {
+                    if (typeof index === num) {
+                        filesToUpload = [files[index]];
+                    } else {
+                        filesToUpload = files;
+                    }
+                    if (typeof FormData !== undef) {
+                        formDataUpload(filesToUpload, xhr, settings);
+                    } else if (typeof FileReader !== undef) {
+                        fileReaderUpload(filesToUpload, xhr, settings);
+                    } else {
+                        $.error('Browser does neither support FormData nor FileReader interface');
+                    }
+                }
+            },
+
+            handleUpload = function (event, files, input, form, index) {
+                var xhr = new XMLHttpRequest(),
+                    uploadSettings = $.extend({}, settings);
+                uploadSettings.fileInput = input;
+                uploadSettings.uploadForm = form;
+                if (typeof uploadSettings.initUpload === func) {
+                    uploadSettings.initUpload(
+                        event,
+                        files,
+                        index,
+                        xhr,
+                        uploadSettings,
+                        function () {
+                            upload(files, index, xhr, uploadSettings);
+                        }
+                    );
+                } else {
+                    upload(files, index, xhr, uploadSettings);
+                }
+            },
+
+            handleFiles = function (event, files, input, form) {
+                var i;
+                if (settings.multiFileRequest) {
+                    handleUpload(event, files, input, form);
+                } else {
+                    for (i = 0; i < files.length; i += 1) {
+                        handleUpload(event, files, input, form, i);
+                    }
+                }
+            },
+
+            legacyUploadFormDataInit = function (input, form, settings) {
+                var formData = getFormData(settings);
+                form.find(':input').not(':disabled')
+                    .attr('disabled', true)
+                    .addClass(settings.namespace + '_disabled');
+                $.each(formData, function (index, field) {
+                    $('<input type="hidden"/>')
+                        .attr('name', field.name)
+                        .val(field.value)
+                        .addClass(settings.namespace + '_form_data')
+                        .appendTo(form);
+                });
+                input
+                    .attr('name', getFieldName(settings))
+                    .appendTo(form);
+            },
+
+            legacyUploadFormDataReset = function (input, form, settings) {
+                input.detach();
+                form.find('.' + settings.namespace + '_disabled')
+                    .removeAttr('disabled')
+                    .removeClass(settings.namespace + '_disabled');
+                form.find('.' + settings.namespace + '_form_data').remove();
+            },
+
+            legacyUpload = function (input, form, iframe, settings) {
+                var originalAction = form.attr('action'),
+                    originalMethod = form.attr('method'),
+                    originalTarget = form.attr('target');
+                iframe
+                    .unbind('abort')
+                    .bind('abort', function (e) {
+                        iframe.readyState = 0;
+                        // javascript:false as iframe src prevents warning popups on HTTPS in IE6
+                        // concat is used here to prevent the "Script URL" JSLint error:
+                        iframe.unbind('load').attr('src', 'javascript'.concat(':false;'));
+                        if (typeof settings.onAbort === func) {
+                            settings.onAbort(e, [{name: input.val(), type: null, size: null}], 0, iframe, settings);
+                        }
+                    })
+                    .unbind('load')
+                    .bind('load', function (e) {
+                        iframe.readyState = 4;
+                        if (typeof settings.onLoad === func) {
+                            settings.onLoad(e, [{name: input.val(), type: null, size: null}], 0, iframe, settings);
+                        }
+                        // Fix for IE endless progress bar activity bug (happens on form submits to iframe targets):
+                        $('<iframe src="javascript:false;" style="display:none"></iframe>').appendTo(form).remove();
+                    });
+                form
+                    .attr('action', getUrl(settings))
+                    .attr('method', getMethod(settings))
+                    .attr('target', iframe.attr('name'));
+                legacyUploadFormDataInit(input, form, settings);
+                iframe.readyState = 2;
+                form.get(0).submit();
+                legacyUploadFormDataReset(input, form, settings);
+                form
+                    .attr('action', originalAction)
+                    .attr('method', originalMethod)
+                    .attr('target', originalTarget);
+            },
+
+            handleLegacyUpload = function (event, input, form) {
+                // javascript:false as iframe src prevents warning popups on HTTPS in IE6:
+                var iframe = $('<iframe src="javascript:false;" style="display:none" name="iframe_' +
+                    settings.namespace + '_' + (new Date()).getTime() + '"></iframe>'),
+                    uploadSettings = $.extend({}, settings);
+                uploadSettings.fileInput = input;
+                uploadSettings.uploadForm = form;
+                iframe.readyState = 0;
+                iframe.abort = function () {
+                    iframe.trigger('abort');
+                };
+                iframe.bind('load', function () {
+                    iframe.unbind('load');
+                    if (typeof uploadSettings.initUpload === func) {
+                        uploadSettings.initUpload(
+                            event,
+                            [{name: input.val(), type: null, size: null}],
+                            0,
+                            iframe,
+                            uploadSettings,
+                            function () {
+                                legacyUpload(input, form, iframe, uploadSettings);
+                            }
+                        );
+                    } else {
+                        legacyUpload(input, form, iframe, uploadSettings);
+                    }
+                }).appendTo(form);
+            },
+            
+            initUploadForm = function () {
+                uploadForm = (container.is('form') ? container : container.find('form'))
+                    .filter(settings.uploadFormFilter);
+            },
+            
+            initFileInput = function () {
+                fileInput = uploadForm.find('input:file')
+                    .filter(settings.fileInputFilter);
+            },
+            
+            replaceFileInput = function (input) {
+                var inputClone = input.clone(true);
+                $('<form/>').append(inputClone).get(0).reset();
+                input.after(inputClone).detach();
+                initFileInput();
+            };
+
+        this.onDocumentDragOver = function (e) {
+            if (typeof settings.onDocumentDragOver === func &&
+                    settings.onDocumentDragOver(e) === false) {
+                return false;
+            }
+            e.preventDefault();
+        };
+        
+        this.onDocumentDrop = function (e) {
+            if (typeof settings.onDocumentDrop === func &&
+                    settings.onDocumentDrop(e) === false) {
+                return false;
+            }
+            e.preventDefault();
+        };
+
+        this.onDragOver = function (e) {
+            if (typeof settings.onDragOver === func &&
+                    settings.onDragOver(e) === false) {
+                return false;
+            }
+            var dataTransfer = e.originalEvent.dataTransfer;
+            if (dataTransfer) {
+                dataTransfer.dropEffect = dataTransfer.effectAllowed = 'copy';
+            }
+            e.preventDefault();
+        };
+
+        this.onDrop = function (e) {
+            if (typeof settings.onDrop === func &&
+                    settings.onDrop(e) === false) {
+                return false;
+            }
+            var dataTransfer = e.originalEvent.dataTransfer;
+            if (dataTransfer && dataTransfer.files && isXHRUploadCapable()) {
+                handleFiles(e, dataTransfer.files);
+            }
+            e.preventDefault();
+        };
+        
+        this.onChange = function (e) {
+            if (typeof settings.onChange === func &&
+                    settings.onChange(e) === false) {
+                return false;
+            }
+            var input = $(e.target),
+                form = $(e.target.form);
+            if (form.length === 1) {
+                input.data(defaultNamespace + '_form', form);
+                replaceFileInput(input);
+            } else {
+                form = input.data(defaultNamespace + '_form');
+            }
+            if (!settings.forceIframeUpload && e.target.files && isXHRUploadCapable()) {
+                handleFiles(e, e.target.files, input, form);
+            } else {
+                handleLegacyUpload(e, input, form);
+            }
+        };
+
+        this.init = function (options) {
+            if (options) {
+                $.extend(settings, options);
+                optionsReference = options;
+            }
+            initUploadForm();
+            initFileInput();
+            if (container.data(settings.namespace)) {
+                $.error('FileUpload with namespace "' + settings.namespace + '" already assigned to this element');
+                return;
+            }
+            container
+                .data(settings.namespace, fileUpload)
+                .addClass(settings.cssClass);
+            settings.dropZone.not(container).addClass(settings.cssClass);
+            initEventHandlers();
+        };
+
+        this.options = function (options) {
+            var oldCssClass,
+                oldDropZone,
+                uploadFormFilterUpdate,
+                fileInputFilterUpdate;
+            if (typeof options === undef) {
+                return $.extend({}, settings);
+            }
+            if (optionsReference) {
+                $.extend(optionsReference, options);
+            }
+            removeEventHandlers();
+            $.each(options, function (name, value) {
+                switch (name) {
+                case 'namespace':
+                    $.error('The FileUpload namespace cannot be updated.');
+                    return;
+                case 'uploadFormFilter':
+                    uploadFormFilterUpdate = true;
+                    fileInputFilterUpdate = true;
+                    break;
+                case 'fileInputFilter':
+                    fileInputFilterUpdate = true;
+                    break;
+                case 'cssClass':
+                    oldCssClass = settings.cssClass;
+                    break;
+                case 'dropZone':
+                    oldDropZone = settings.dropZone;
+                    break;
+                }
+                settings[name] = value;
+            });
+            if (uploadFormFilterUpdate) {
+                initUploadForm();
+            }
+            if (fileInputFilterUpdate) {
+                initFileInput();
+            }
+            if (typeof oldCssClass !== undef) {
+                container
+                    .removeClass(oldCssClass)
+                    .addClass(settings.cssClass);
+                (oldDropZone ? oldDropZone : settings.dropZone).not(container)
+                    .removeClass(oldCssClass);
+                settings.dropZone.not(container).addClass(settings.cssClass);
+            } else if (oldDropZone) {
+                oldDropZone.not(container).removeClass(settings.cssClass);
+                settings.dropZone.not(container).addClass(settings.cssClass);
+            }
+            initEventHandlers();
+        };
+        
+        this.option = function (name, value) {
+            var options;
+            if (typeof value === undef) {
+                return settings[name];
+            }
+            options = {};
+            options[name] = value;
+            fileUpload.options(options);
+        };
+        
+        this.destroy = function () {
+            removeEventHandlers();
+            container
+                .removeData(settings.namespace)
+                .removeClass(settings.cssClass);
+            settings.dropZone.not(container).removeClass(settings.cssClass);
+        };
+    };
+
+    methods = {
+        init : function (options) {
+            return this.each(function () {
+                (new FileUpload($(this))).init(options);
+            });
+        },
+        
+        option: function (option, value, namespace) {
+            namespace = namespace ? namespace : defaultNamespace;
+            var fileUpload = $(this).data(namespace);
+            if (fileUpload) {
+                if (typeof option === 'string') {
+                    return fileUpload.option(option, value);
+                }
+                return fileUpload.options(option);
+            } else {
+                $.error('No FileUpload with namespace "' + namespace + '" assigned to this element');
+            }
+        },
+                
+        destroy : function (namespace) {
+            namespace = namespace ? namespace : defaultNamespace;
+            return this.each(function () {
+                var fileUpload = $(this).data(namespace);
+                if (fileUpload) {
+                    fileUpload.destroy();
+                } else {
+                    $.error('No FileUpload with namespace "' + namespace + '" assigned to this element');
+                }
+            });
+
+        }
+    };
+    
+    $.fn.fileUpload = function (method) {
+        if (methods[method]) {
+            return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
+        } else if (typeof method === 'object' || !method) {
+            return methods.init.apply(this, arguments);
+        } else {
+            $.error('Method ' + method + ' does not exist on jQuery.fileUpload');
+        }
+    };
+    
+}(jQuery));

data/public/stylesheets/admin/extensions/assets/assets.css

@@ -19,7 +19,6 @@ table.index .size {
 
 #assets .icon {
   display: block;
-  float: left;
   text-align: center;
   background: #ccc;
   text-transform: uppercase;
@@ -36,6 +35,7 @@ table#assets .icon, table#assets .thumbnail {
 
 table#assets .icon {
   font-size: 75%;
+  float: left;
 }
 
 #assets, #assets li {
@@ -46,6 +46,7 @@ table#assets .icon {
 }
 
 #assets li {
+  background: #ccc;
   float: left;
   margin-right: 1px;
   margin-bottom: 1px;

metadata

@@ -1,13 +1,13 @@
 --- !ruby/object:Gem::Specification 
 name: radiant-assets-extension
 version: !ruby/object:Gem::Version 
-  hash: 23
+  hash: 21
   prerelease: false
   segments: 
   - 0
   - 0
-  - 4
-  version: 0.0.4
+  - 5
+  version: 0.0.5
 platform: ruby
 authors: 
 - Gerrit Kaiser
@@ -88,6 +88,11 @@ files:
 - lib/radiant-assets-extension/s3_store.rb
 - lib/radiant-assets-extension/version.rb
 - lib/tasks/assets_extension_tasks.rake
+- public/jquery.fileupload/.gitignore
+- public/jquery.fileupload/jquery.fileupload-ui.css
+- public/jquery.fileupload/jquery.fileupload-ui.js
+- public/jquery.fileupload/jquery.fileupload.js
+- public/jquery.fileupload/pbar-ani.gif
 - public/stylesheets/admin/extensions/assets/assets.css
 - radiant-assets-extension.gemspec
 - spec/spec.opts
@@ -96,7 +101,7 @@ has_rdoc: true
 homepage: http://ext.radiantcms.org/extensions/269-assets
 licenses: []
 
-post_install_message: "\n  Add this to your radiant project with:\n    config.gem 'radiant-assets-extension', :version => '0.0.4'\n  "
+post_install_message: "\n  Add this to your radiant project with:\n    config.gem 'radiant-assets-extension', :version => '0.0.5'\n  "
 rdoc_options: []
 
 require_paths: