filemanager and some update for file uploader . added file uploader to kernel

app/assets/javascripts/ckeditor/config.js.erb

@@ -26,10 +26,11 @@ CKEDITOR.editorConfig = function( config ) {
 	// config.filebrowserImageBrowseUrl = '/browser/browse.php?type=Images';
 	// config.filebrowserUploadUrl = '/uploader/upload.php';
 
-	config.filebrowserBrowseUrl = "<%= Rails.application.routes.url_helpers.file_upload_admin_assets_path %>"
-  	config.filebrowserUploadUrl = "<%= Rails.application.routes.url_helpers.file_upload_admin_assets_path %>"
+	config.filebrowserBrowseUrl = "<%= Rails.application.routes.url_helpers.admin_assets_path %>";
+	config.filebrowserImageBrowseUrl = "<%= Rails.application.routes.url_helpers.admin_assets_path %>?type=images&module_app_id=<%= ModuleApp.first(conditions: {title: 'Asset'}).id.to_s %>";
+  	// config.filebrowserUploadUrl = "<%= Rails.application.routes.url_helpers.file_upload_admin_assets_path %>";
 
-	config.contentsCss  = '/orbit_4.0.1/assets/javascripts/lib/ckeditor/plugins/stylesheetparser/samples/assets/sample.css';
+	// config.contentsCss  = '/orbit_4.0.1/assets/javascripts/lib/ckeditor/plugins/stylesheetparser/samples/assets/sample.css';
 	
 	// Load from a list of definitions.
 	// config.stylesSet = [

app/assets/javascripts/file-upload/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(new Blob([new Uint8Array(100)])).size===100}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;a.split(",")[0].indexOf("base64")>=0?b=atob(a.split(",")[1]):b=decodeURIComponent(a.split(",")[1]),f=new ArrayBuffer(b.length),g=new Uint8Array(f);for(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)))})),typeof define=="function"&&define.amd?define(function(){return f}):a.dataURLtoBlob=f})(this);

app/assets/javascripts/file-upload/drop-zone.js

@@ -0,0 +1,19 @@
+$(document).bind('dragover', function (e) {
+	var dropZone = $('#dropzone'),
+		timeout = window.dropZoneTimeout;
+	if (!timeout) {
+		dropZone.removeAttr('style').addClass('in');
+	} else {
+		clearTimeout(timeout);
+	};
+	if (e.target === dropZone[0]) {
+		dropZone.addClass('hover');
+	} else {
+		dropZone.removeClass('hover');
+	};
+	window.dropZoneTimeout = setTimeout(function () {
+		window.dropZoneTimeout = null;
+		dropZone.removeClass('in hover');
+		$('.files').checkListLength();
+	}, 100);
+});

app/assets/javascripts/file-upload/jquery.fileupload-fp.js

@@ -0,0 +1,223 @@
+/*
+ * jQuery File Upload File Processing Plugin 1.2.1
+ * https://github.com/blueimp/jQuery-File-Upload
+ *
+ * Copyright 2012, Sebastian Tschan
+ * https://blueimp.net
+ *
+ * Licensed under the MIT license:
+ * http://www.opensource.org/licenses/MIT
+ */
+
+/*jslint nomen: true, unparam: true, regexp: true */
+/*global define, window, document */
+
+(function (factory) {
+    'use strict';
+    if (typeof define === 'function' && define.amd) {
+        // Register as an anonymous AMD module:
+        define([
+            'jquery',
+            'load-image',
+            'canvas-to-blob',
+            './jquery.fileupload'
+        ], factory);
+    } else {
+        // Browser globals:
+        factory(
+            window.jQuery,
+            window.loadImage
+        );
+    }
+}(function ($, loadImage) {
+    'use strict';
+
+    // The File Upload FP version extends the fileupload widget
+    // with file processing functionality:
+    $.widget('blueimp.fileupload', $.blueimp.fileupload, {
+
+        options: {
+            // The list of file processing actions:
+            process: [
+            /*
+                {
+                    action: 'load',
+                    fileTypes: /^image\/(gif|jpeg|png)$/,
+                    maxFileSize: 20000000 // 20MB
+                },
+                {
+                    action: 'resize',
+                    maxWidth: 1920,
+                    maxHeight: 1200,
+                    minWidth: 800,
+                    minHeight: 600
+                },
+                {
+                    action: 'save'
+                }
+            */
+            ],
+
+            // The add callback is invoked as soon as files are added to the
+            // fileupload widget (via file input selection, drag & drop or add
+            // API call). See the basic file upload widget for more information:
+            add: function (e, data) {
+                $(this).fileupload('process', data).done(function () {
+                    data.submit();
+                });
+            }
+        },
+
+        processActions: {
+            // Loads the image given via data.files and data.index
+            // as img element if the browser supports canvas.
+            // Accepts the options fileTypes (regular expression)
+            // and maxFileSize (integer) to limit the files to load:
+            load: function (data, options) {
+                var that = this,
+                    file = data.files[data.index],
+                    dfd = $.Deferred();
+                if (window.HTMLCanvasElement &&
+                        window.HTMLCanvasElement.prototype.toBlob &&
+                        ($.type(options.maxFileSize) !== 'number' ||
+                            file.size < options.maxFileSize) &&
+                        (!options.fileTypes ||
+                            options.fileTypes.test(file.type))) {
+                    loadImage(
+                        file,
+                        function (img) {
+                            if (!img.src) {
+                                return dfd.rejectWith(that, [data]);
+                            }
+                            data.img = img;
+                            dfd.resolveWith(that, [data]);
+                        }
+                    );
+                } else {
+                    dfd.rejectWith(that, [data]);
+                }
+                return dfd.promise();
+            },
+            // Resizes the image given as data.img and updates
+            // data.canvas with the resized image as canvas element.
+            // Accepts the options maxWidth, maxHeight, minWidth and
+            // minHeight to scale the given image:
+            resize: function (data, options) {
+                var img = data.img,
+                    canvas;
+                options = $.extend({canvas: true}, options);
+                if (img) {
+                    canvas = loadImage.scale(img, options);
+                    if (canvas.width !== img.width ||
+                            canvas.height !== img.height) {
+                        data.canvas = canvas;
+                    }
+                }
+                return data;
+            },
+            // Saves the processed image given as data.canvas
+            // inplace at data.index of data.files:
+            save: function (data, options) {
+                // Do nothing if no processing has happened:
+                if (!data.canvas) {
+                    return data;
+                }
+                var that = this,
+                    file = data.files[data.index],
+                    name = file.name,
+                    dfd = $.Deferred(),
+                    callback = function (blob) {
+                        if (!blob.name) {
+                            if (file.type === blob.type) {
+                                blob.name = file.name;
+                            } else if (file.name) {
+                                blob.name = file.name.replace(
+                                    /\..+$/,
+                                    '.' + blob.type.substr(6)
+                                );
+                            }
+                        }
+                        // Store the created blob at the position
+                        // of the original file in the files list:
+                        data.files[data.index] = blob;
+                        dfd.resolveWith(that, [data]);
+                    };
+                // Use canvas.mozGetAsFile directly, to retain the filename, as
+                // Gecko doesn't support the filename option for FormData.append:
+                if (data.canvas.mozGetAsFile) {
+                    callback(data.canvas.mozGetAsFile(
+                        (/^image\/(jpeg|png)$/.test(file.type) && name) ||
+                            ((name && name.replace(/\..+$/, '')) ||
+                                'blob') + '.png',
+                        file.type
+                    ));
+                } else {
+                    data.canvas.toBlob(callback, file.type);
+                }
+                return dfd.promise();
+            }
+        },
+
+        // Resizes the file at the given index and stores the created blob at
+        // the original position of the files list, returns a Promise object:
+        _processFile: function (files, index, options) {
+            var that = this,
+                dfd = $.Deferred().resolveWith(that, [{
+                    files: files,
+                    index: index
+                }]),
+                chain = dfd.promise();
+            that._processing += 1;
+            $.each(options.process, function (i, settings) {
+                chain = chain.pipe(function (data) {
+                    return that.processActions[settings.action]
+                        .call(this, data, settings);
+                });
+            });
+            chain.always(function () {
+                that._processing -= 1;
+                if (that._processing === 0) {
+                    that.element
+                        .removeClass('fileupload-processing');
+                }
+            });
+            if (that._processing === 1) {
+                that.element.addClass('fileupload-processing');
+            }
+            return chain;
+        },
+
+        // Processes the files given as files property of the data parameter,
+        // returns a Promise object that allows to bind a done handler, which
+        // will be invoked after processing all files (inplace) is done:
+        process: function (data) {
+            var that = this,
+                options = $.extend({}, this.options, data);
+            if (options.process && options.process.length &&
+                    this._isXHRUpload(options)) {
+                $.each(data.files, function (index, file) {
+                    that._processingQueue = that._processingQueue.pipe(
+                        function () {
+                            var dfd = $.Deferred();
+                            that._processFile(data.files, index, options)
+                                .always(function () {
+                                    dfd.resolveWith(that);
+                                });
+                            return dfd.promise();
+                        }
+                    );
+                });
+            }
+            return this._processingQueue;
+        },
+
+        _create: function () {
+            this._super();
+            this._processing = 0;
+            this._processingQueue = $.Deferred().resolveWith(this)
+                .promise();
+        }
+
+    });
+
+}));

app/assets/javascripts/file-upload/jquery.fileupload-ui.js

@@ -0,0 +1,812 @@
+/*
+ * jQuery File Upload User Interface Plugin 7.4
+ * https://github.com/blueimp/jQuery-File-Upload
+ *
+ * Copyright 2010, Sebastian Tschan
+ * https://blueimp.net
+ *
+ * Licensed under the MIT license:
+ * http://www.opensource.org/licenses/MIT
+ */
+
+/*jslint nomen: true, unparam: true, regexp: true */
+/*global define, window, URL, webkitURL, FileReader */
+
+(function (factory) {
+    'use strict';
+    if (typeof define === 'function' && define.amd) {
+        // Register as an anonymous AMD module:
+        define([
+            'jquery',
+            'tmpl',
+            'load-image',
+            './jquery.fileupload-fp'
+        ], factory);
+    } else {
+        // Browser globals:
+        factory(
+            window.jQuery,
+            window.tmpl,
+            window.loadImage
+        );
+    }
+}(function ($, tmpl, loadImage) {
+    'use strict';
+
+    // The UI version extends the file upload widget
+    // and adds complete user interface interaction:
+    $.widget('blueimp.fileupload', $.blueimp.fileupload, {
+
+        options: {
+            // By default, files added to the widget are uploaded as soon
+            // as the user clicks on the start buttons. To enable automatic
+            // uploads, set the following option to true:
+            autoUpload: false,
+            // The following option limits the number of files that are
+            // allowed to be uploaded using this widget:
+            maxNumberOfFiles: undefined,
+            // The maximum allowed file size:
+            maxFileSize: undefined,
+            // The minimum allowed file size:
+            minFileSize: undefined,
+            // The regular expression for allowed file types, matches
+            // against either file type or file name:
+            acceptFileTypes:  /.+$/i,
+            // The regular expression to define for which files a preview
+            // image is shown, matched against the file type:
+            previewSourceFileTypes: /^image\/(gif|jpeg|png)$/,
+            // The maximum file size of images that are to be displayed as preview:
+            previewSourceMaxFileSize: 5000000, // 5MB
+            // The maximum width of the preview images:
+            previewMaxWidth: 80,
+            // The maximum height of the preview images:
+            previewMaxHeight: 80,
+            // By default, preview images are displayed as canvas elements
+            // if supported by the browser. Set the following option to false
+            // to always display preview images as img elements:
+            previewAsCanvas: true,
+            // The ID of the upload template:
+            uploadTemplateId: 'template-upload',
+            // The ID of the download template:
+            downloadTemplateId: 'template-download',
+            // The container for the list of files. If undefined, it is set to
+            // an element with class "files" inside of the widget element:
+            filesContainer: undefined,
+            // By default, files are appended to the files container.
+            // Set the following option to true, to prepend files instead:
+            prependFiles: false,
+            // The expected data type of the upload response, sets the dataType
+            // option of the $.ajax upload requests:
+            dataType: 'json',
+
+            // The add callback is invoked as soon as files are added to the fileupload
+            // widget (via file input selection, drag & drop or add API call).
+            // See the basic file upload widget for more information:
+            add: function (e, data) {
+                var that = $(this).data('blueimp-fileupload') ||
+                        $(this).data('fileupload'),
+                    options = that.options,
+                    files = data.files;
+                $(this).fileupload('process', data).done(function () {
+                    that._adjustMaxNumberOfFiles(-files.length);
+                    data.maxNumberOfFilesAdjusted = true;
+                    data.files.valid = data.isValidated = that._validate(files);
+                    data.context = that._renderUpload(files).data('data', data);
+                    options.filesContainer[
+                        options.prependFiles ? 'prepend' : 'append'
+                    ](data.context);
+                    that._renderPreviews(data);
+                    that._forceReflow(data.context);
+                    that._transition(data.context).done(
+                        function () {
+                            if ((that._trigger('added', e, data) !== false) &&
+                                    (options.autoUpload || data.autoUpload) &&
+                                    data.autoUpload !== false && data.isValidated) {
+                                data.submit();
+                            }
+                        }
+                    );
+                    $('.files').checkListLength();
+                });
+            },
+            // Callback for the start of each file upload request:
+            send: function (e, data) {
+                var that = $(this).data('blueimp-fileupload') ||
+                        $(this).data('fileupload');
+                if (!data.isValidated) {
+                    if (!data.maxNumberOfFilesAdjusted) {
+                        that._adjustMaxNumberOfFiles(-data.files.length);
+                        data.maxNumberOfFilesAdjusted = true;
+                    }
+                    if (!that._validate(data.files)) {
+                        return false;
+                    }
+                }
+                if (data.context && data.dataType &&
+                        data.dataType.substr(0, 6) === 'iframe') {
+                    // Iframe Transport does not support progress events.
+                    // In lack of an indeterminate progress bar, we set
+                    // the progress to 100%, showing the full animated bar:
+                    data.context
+                        .find('.progress').addClass(
+                            !$.support.transition && 'progress-animated'
+                        )
+                        .attr('aria-valuenow', 100)
+                        .find('.bar').css(
+                            'width',
+                            '100%'
+                        );
+                }
+                return that._trigger('sent', e, data);
+            },
+            // Callback for successful uploads:
+            done: function (e, data) {
+                var that = $(this).data('blueimp-fileupload') ||
+                        $(this).data('fileupload'),
+                    files = that._getFilesFromResponse(data),
+                    template,
+                    deferred;
+                if (data.context) {
+                    data.context.each(function (index) {
+                        var file = files[index] ||
+                                {error: 'Empty file upload result'},
+                            deferred = that._addFinishedDeferreds();
+                        if (file.error) {
+                            that._adjustMaxNumberOfFiles(1);
+                        }
+                        that._transition($(this)).done(
+                            function () {
+                                var node = $(this);
+                                template = that._renderDownload([file])
+                                    .replaceAll(node);
+                                that._forceReflow(template);
+                                that._transition(template).done(
+                                    function () {
+                                        data.context = $(this);
+                                        that._trigger('completed', e, data);
+                                        that._trigger('finished', e, data);
+                                        deferred.resolve();
+                                    }
+                                );
+                            }
+                        );
+                    });
+                } else {
+                    if (files.length) {
+                        $.each(files, function (index, file) {
+                            if (data.maxNumberOfFilesAdjusted && file.error) {
+                                that._adjustMaxNumberOfFiles(1);
+                            } else if (!data.maxNumberOfFilesAdjusted &&
+                                    !file.error) {
+                                that._adjustMaxNumberOfFiles(-1);
+                            }
+                        });
+                        data.maxNumberOfFilesAdjusted = true;
+                    }
+                    template = that._renderDownload(files)
+                        .appendTo(that.options.filesContainer);
+                    that._forceReflow(template);
+                    deferred = that._addFinishedDeferreds();
+                    that._transition(template).done(
+                        function () {
+                            data.context = $(this);
+                            that._trigger('completed', e, data);
+                            that._trigger('finished', e, data);
+                            deferred.resolve();
+                        }
+                    );
+                }
+            },
+            // Callback for failed (abort or error) uploads:
+            fail: function (e, data) {
+                var that = $(this).data('blueimp-fileupload') ||
+                        $(this).data('fileupload'),
+                    template,
+                    deferred;
+                if (data.maxNumberOfFilesAdjusted) {
+                    that._adjustMaxNumberOfFiles(data.files.length);
+                }
+                if (data.context) {
+                    data.context.each(function (index) {
+                        if (data.errorThrown !== 'abort') {
+                            var file = data.files[index];
+                            file.error = file.error || data.errorThrown ||
+                                true;
+                            deferred = that._addFinishedDeferreds();
+                            that._transition($(this)).done(
+                                function () {
+                                    var node = $(this);
+                                    template = that._renderDownload([file])
+                                        .replaceAll(node);
+                                    that._forceReflow(template);
+                                    that._transition(template).done(
+                                        function () {
+                                            data.context = $(this);
+                                            that._trigger('failed', e, data);
+                                            that._trigger('finished', e, data);
+                                            deferred.resolve();
+                                        }
+                                    );
+                                }
+                            );
+                        } else {
+                            deferred = that._addFinishedDeferreds();
+                            that._transition($(this)).done(
+                                function () {
+                                    $(this).remove();
+                                    that._trigger('failed', e, data);
+                                    that._trigger('finished', e, data);
+                                    deferred.resolve();
+                                    $('.files').checkListLength();
+                                }
+                            );
+                        }
+                    });
+                } else if (data.errorThrown !== 'abort') {
+                    data.context = that._renderUpload(data.files)
+                        .appendTo(that.options.filesContainer)
+                        .data('data', data);
+                    that._forceReflow(data.context);
+                    deferred = that._addFinishedDeferreds();
+                    that._transition(data.context).done(
+                        function () {
+                            data.context = $(this);
+                            that._trigger('failed', e, data);
+                            that._trigger('finished', e, data);
+                            deferred.resolve();
+                        }
+                    );
+                } else {
+                    that._trigger('failed', e, data);
+                    that._trigger('finished', e, data);
+                    that._addFinishedDeferreds().resolve();
+                }
+            },
+            // Callback for upload progress events:
+            progress: function (e, data) {
+                if (data.context) {
+                    var progress = parseInt(data.loaded / data.total * 100, 10);
+                    data.context.find('.progress')
+                        .attr('aria-valuenow', progress)
+                        .find('.bar').css(
+                            'width',
+                            progress + '%'
+                        );
+                }
+            },
+            // Callback for global upload progress events:
+            progressall: function (e, data) {
+                var $this = $(this),
+                    progress = parseInt(data.loaded / data.total * 100, 10),
+                    globalProgressNode = $this.find('.fileupload-progress'),
+                    extendedProgressNode = globalProgressNode
+                        .find('.progress-extended');
+                if (extendedProgressNode.length) {
+                    extendedProgressNode.html(
+                        ($this.data('blueimp-fileupload') || $this.data('fileupload'))
+                            ._renderExtendedProgress(data)
+                    );
+                }
+                globalProgressNode
+                    .find('.progress')
+                    .attr('aria-valuenow', progress)
+                    .find('.bar').css(
+                        'width',
+                        progress + '%'
+                    );
+            },
+            // Callback for uploads start, equivalent to the global ajaxStart event:
+            start: function (e) {
+                var that = $(this).data('blueimp-fileupload') ||
+                        $(this).data('fileupload');
+                that._resetFinishedDeferreds();
+                that._transition($(this).find('.fileupload-progress')).done(
+                    function () {
+                        that._trigger('started', e);
+                    }
+                );
+            },
+            // Callback for uploads stop, equivalent to the global ajaxStop event:
+            stop: function (e) {
+                var that = $(this).data('blueimp-fileupload') ||
+                        $(this).data('fileupload'),
+                    deferred = that._addFinishedDeferreds();
+                $.when.apply($, that._getFinishedDeferreds())
+                    .done(function () {
+                        that._trigger('stopped', e);
+                    });
+                that._transition($(this).find('.fileupload-progress')).done(
+                    function () {
+                        $(this).find('.progress')
+                            .attr('aria-valuenow', '0')
+                            .find('.bar').css('width', '0%');
+                        $(this).find('.progress-extended').html(' ');
+                        deferred.resolve();
+                    }
+                );
+            },
+            // Callback for file deletion:
+            destroy: function (e, data) {
+                var that = $(this).data('blueimp-fileupload') ||
+                        $(this).data('fileupload');
+                if (data.url) {
+                    $.ajax(data);
+                    that._adjustMaxNumberOfFiles(1);
+                }
+                that._transition(data.context).done(
+                    function () {
+                        $(this).remove();
+                        that._trigger('destroyed', e, data);
+                    }
+                );
+            }
+        },
+
+        _resetFinishedDeferreds: function () {
+            this._finishedUploads = [];
+        },
+
+        _addFinishedDeferreds: function (deferred) {
+            if (!deferred) {
+                deferred = $.Deferred();
+            }
+            this._finishedUploads.push(deferred);
+            return deferred;
+        },
+
+        _getFinishedDeferreds: function () {
+            return this._finishedUploads;
+        },
+
+        _getFilesFromResponse: function (data) {
+            if (data.result && $.isArray(data.result.files)) {
+                return data.result.files;
+            }
+            return [];
+        },
+
+        // Link handler, that allows to download files
+        // by drag & drop of the links to the desktop:
+        _enableDragToDesktop: function () {
+            var link = $(this),
+                url = link.prop('href'),
+                name = link.prop('download'),
+                type = 'application/octet-stream';
+            link.bind('dragstart', function (e) {
+                try {
+                    e.originalEvent.dataTransfer.setData(
+                        'DownloadURL',
+                        [type, name, url].join(':')
+                    );
+                } catch (err) {}
+            });
+        },
+
+        _adjustMaxNumberOfFiles: function (operand) {
+            if (typeof this.options.maxNumberOfFiles === 'number') {
+                this.options.maxNumberOfFiles += operand;
+                if (this.options.maxNumberOfFiles < 1) {
+                    this._disableFileInputButton();
+                } else {
+                    this._enableFileInputButton();
+                }
+            }
+        },
+
+        _formatFileSize: function (bytes) {
+            if (typeof bytes !== 'number') {
+                return '';
+            }
+            if (bytes >= 1000000000) {
+                return (bytes / 1000000000).toFixed(2) + ' GB';
+            }
+            if (bytes >= 1000000) {
+                return (bytes / 1000000).toFixed(2) + ' MB';
+            }
+            return (bytes / 1000).toFixed(2) + ' KB';
+        },
+
+        _formatBitrate: function (bits) {
+            if (typeof bits !== 'number') {
+                return '';
+            }
+            if (bits >= 1000000000) {
+                return (bits / 1000000000).toFixed(2) + ' Gbit/s';
+            }
+            if (bits >= 1000000) {
+                return (bits / 1000000).toFixed(2) + ' Mbit/s';
+            }
+            if (bits >= 1000) {
+                return (bits / 1000).toFixed(2) + ' kbit/s';
+            }
+            return bits.toFixed(2) + ' bit/s';
+        },
+
+        _formatTime: function (seconds) {
+            var date = new Date(seconds * 1000),
+                days = parseInt(seconds / 86400, 10);
+            days = days ? days + 'd ' : '';
+            return days +
+                ('0' + date.getUTCHours()).slice(-2) + ':' +
+                ('0' + date.getUTCMinutes()).slice(-2) + ':' +
+                ('0' + date.getUTCSeconds()).slice(-2);
+        },
+
+        _formatPercentage: function (floatValue) {
+            return (floatValue * 100).toFixed(2) + ' %';
+        },
+
+        _renderExtendedProgress: function (data) {
+            return this._formatBitrate(data.bitrate) + ' ｜ ' +
+                this._formatTime(
+                    (data.total - data.loaded) * 8 / data.bitrate
+                ) + ' ｜ ' +
+                this._formatPercentage(
+                    data.loaded / data.total
+                ) + ' ｜ ' +
+                this._formatFileSize(data.loaded) + ' ／ ' +
+                this._formatFileSize(data.total);
+        },
+
+        _hasError: function (file) {
+            if (file.error) {
+                return file.error;
+            }
+            // The number of added files is subtracted from
+            // maxNumberOfFiles before validation, so we check if
+            // maxNumberOfFiles is below 0 (instead of below 1):
+            if (this.options.maxNumberOfFiles < 0) {
+                return 'Maximum number of files exceeded';
+            }
+            // Files are accepted if either the file type or the file name
+            // matches against the acceptFileTypes regular expression, as
+            // only browsers with support for the File API report the type:
+            if (!(this.options.acceptFileTypes.test(file.type) ||
+                    this.options.acceptFileTypes.test(file.name))) {
+                return 'Filetype not allowed';
+            }
+            if (this.options.maxFileSize &&
+                    file.size > this.options.maxFileSize) {
+                return 'File is too big';
+            }
+            if (typeof file.size === 'number' &&
+                    file.size < this.options.minFileSize) {
+                return 'File is too small';
+            }
+            return null;
+        },
+
+        _validate: function (files) {
+            var that = this,
+                valid = !!files.length;
+            $.each(files, function (index, file) {
+                file.error = that._hasError(file);
+                if (file.error) {
+                    valid = false;
+                }
+            });
+            return valid;
+        },
+
+        _renderTemplate: function (func, files) {
+            if (!func) {
+                return $();
+            }
+            var result = func({
+                files: files,
+                formatFileSize: this._formatFileSize,
+                options: this.options
+            });
+            if (result instanceof $) {
+                return result;
+            }
+            return $(this.options.templatesContainer).html(result).children();
+        },
+
+        _renderPreview: function (file, node) {
+            var that = this,
+                options = this.options,
+                dfd = $.Deferred();
+            return ((loadImage && loadImage(
+                file,
+                function (img) {
+                    node.append(img);
+                    that._forceReflow(node);
+                    that._transition(node).done(function () {
+                        dfd.resolveWith(node);
+                    });
+                    if (!$.contains(that.document[0].body, node[0])) {
+                        // If the element is not part of the DOM,
+                        // transition events are not triggered,
+                        // so we have to resolve manually:
+                        dfd.resolveWith(node);
+                    }
+                    node.on('remove', function () {
+                        // If the element is removed before the
+                        // transition finishes, transition events are
+                        // not triggered, resolve manually:
+                        dfd.resolveWith(node);
+                    });
+                },
+                {
+                    maxWidth: options.previewMaxWidth,
+                    maxHeight: options.previewMaxHeight,
+                    canvas: options.previewAsCanvas
+                }
+            )) || dfd.resolveWith(node)) && dfd;
+        },
+
+        _renderPreviews: function (data) {
+            var that = this,
+                options = this.options;
+            data.context.find('.preview span').each(function (index, element) {
+                var file = data.files[index];
+                if (options.previewSourceFileTypes.test(file.type) &&
+                        ($.type(options.previewSourceMaxFileSize) !== 'number' ||
+                        file.size < options.previewSourceMaxFileSize)) {
+                    that._processingQueue = that._processingQueue.pipe(function () {
+                        var dfd = $.Deferred(),
+                            ev = $.Event('previewdone', {
+                                target: element
+                            });
+                        that._renderPreview(file, $(element)).done(
+                            function () {
+                                that._trigger(ev.type, ev, data);
+                                dfd.resolveWith(that);
+                            }
+                        );
+                        return dfd.promise();
+                    });
+                }
+            });
+            return this._processingQueue;
+        },
+
+        _renderUpload: function (files) {
+            return this._renderTemplate(
+                this.options.uploadTemplate,
+                files
+            );
+        },
+
+        _renderDownload: function (files) {
+            return this._renderTemplate(
+                this.options.downloadTemplate,
+                files
+            ).find('a[download]').each(this._enableDragToDesktop).end();
+        },
+
+        _startHandler: function (e) {
+            e.preventDefault();
+            var button = $(e.currentTarget),
+                template = button.closest('.template-upload'),
+                data = template.data('data');
+            if (data && data.submit && !data.jqXHR && data.submit()) {
+                button.prop('disabled', true);
+            }
+        },
+
+        _cancelHandler: function (e) {
+            e.preventDefault();
+            var template = $(e.currentTarget).closest('.template-upload'),
+                data = template.data('data') || {};
+            if (!data.jqXHR) {
+                data.errorThrown = 'abort';
+                this._trigger('fail', e, data);
+            } else {
+                data.jqXHR.abort();
+            }
+        },
+
+        _deleteHandler: function (e) {
+            e.preventDefault();
+            var button = $(e.currentTarget);
+            this._trigger('destroy', e, $.extend({
+                context: button.closest('.template-download'),
+                type: 'DELETE',
+                dataType: this.options.dataType
+            }, button.data()));
+            $('.files').checkListLength({
+                onlyOne: 1,
+            });
+        },
+
+        _forceReflow: function (node) {
+            return $.support.transition && node.length &&
+                node[0].offsetWidth;
+        },
+
+        _transition: function (node) {
+            var dfd = $.Deferred();
+            if ($.support.transition && node.hasClass('fade') && node.is(':visible')) {
+                node.bind(
+                    $.support.transition.end,
+                    function (e) {
+                        // Make sure we don't respond to other transitions events
+                        // in the container element, e.g. from button elements:
+                        if (e.target === node[0]) {
+                            node.unbind($.support.transition.end);
+                            dfd.resolveWith(node);
+                        }
+                    }
+                ).toggleClass('in');
+            } else {
+                node.toggleClass('in');
+                dfd.resolveWith(node);
+            }
+            return dfd;
+        },
+
+        _initButtonBarEventHandlers: function () {
+            var fileUploadButtonBar = this.element.find('.fileupload-buttonbar'),
+                filesList = this.options.filesContainer;
+            this._on(fileUploadButtonBar.find('.start'), {
+                click: function (e) {
+                    e.preventDefault();
+                    filesList.find('.start').click();
+                }
+            });
+            this._on(fileUploadButtonBar.find('.cancel'), {
+                click: function (e) {
+                    e.preventDefault();
+                    filesList.find('.cancel').click();
+                }
+            });
+            this._on(fileUploadButtonBar.find('.delete'), {
+                click: function (e) {
+                    e.preventDefault();
+                    filesList.find('.toggle:checked')
+                        .closest('.template-download')
+                        .find('.delete').click();
+                    fileUploadButtonBar.find('.toggle')
+                        .prop('checked', false);
+                }
+            });
+            this._on(fileUploadButtonBar.find('.toggle'), {
+                change: function (e) {
+                    filesList.find('.toggle').prop(
+                        'checked',
+                        $(e.currentTarget).is(':checked')
+                    );
+                }
+            });
+        },
+
+        _destroyButtonBarEventHandlers: function () {
+            this._off(
+                this.element.find('.fileupload-buttonbar')
+                    .find('.start, .cancel, .delete'),
+                'click'
+            );
+            this._off(
+                this.element.find('.fileupload-buttonbar .toggle'),
+                'change.'
+            );
+        },
+
+        _initEventHandlers: function () {
+            this._super();
+            this._on(this.options.filesContainer, {
+                'click .start': this._startHandler,
+                'click .cancel': this._cancelHandler,
+                'click .delete': this._deleteHandler
+            });
+            this._initButtonBarEventHandlers();
+        },
+
+        _destroyEventHandlers: function () {
+            this._destroyButtonBarEventHandlers();
+            this._off(this.options.filesContainer, 'click');
+            this._super();
+        },
+
+        _enableFileInputButton: function () {
+            this.element.find('.fileinput-button input')
+                .prop('disabled', false)
+                .parent().removeClass('disabled');
+        },
+
+        _disableFileInputButton: function () {
+            this.element.find('.fileinput-button input')
+                .prop('disabled', true)
+                .parent().addClass('disabled');
+        },
+
+        _initTemplates: function () {
+            var options = this.options;
+            options.templatesContainer = this.document[0].createElement(
+                options.filesContainer.prop('nodeName')
+            );
+            if (tmpl) {
+                if (options.uploadTemplateId) {
+                    options.uploadTemplate = tmpl(options.uploadTemplateId);
+                }
+                if (options.downloadTemplateId) {
+                    options.downloadTemplate = tmpl(options.downloadTemplateId);
+                }
+            }
+        },
+
+        _initFilesContainer: function () {
+            var options = this.options;
+            if (options.filesContainer === undefined) {
+                options.filesContainer = this.element.find('.files');
+            } else if (!(options.filesContainer instanceof $)) {
+                options.filesContainer = $(options.filesContainer);
+            }
+        },
+
+        _stringToRegExp: function (str) {
+            var parts = str.split('/'),
+                modifiers = parts.pop();
+            parts.shift();
+            return new RegExp(parts.join('/'), modifiers);
+        },
+
+        _initRegExpOptions: function () {
+            var options = this.options;
+            if ($.type(options.acceptFileTypes) === 'string') {
+                options.acceptFileTypes = this._stringToRegExp(
+                    options.acceptFileTypes
+                );
+            }
+            if ($.type(options.previewSourceFileTypes) === 'string') {
+                options.previewSourceFileTypes = this._stringToRegExp(
+                    options.previewSourceFileTypes
+                );
+            }
+        },
+
+        _initSpecialOptions: function () {
+            this._super();
+            this._initFilesContainer();
+            this._initTemplates();
+            this._initRegExpOptions();
+        },
+
+        _setOption: function (key, value) {
+            this._super(key, value);
+            if (key === 'maxNumberOfFiles') {
+                this._adjustMaxNumberOfFiles(0);
+            }
+        },
+
+        _create: function () {
+            this._super();
+            this._refreshOptionsList.push(
+                'filesContainer',
+                'uploadTemplateId',
+                'downloadTemplateId'
+            );
+            if (!this._processingQueue) {
+                this._processingQueue = $.Deferred().resolveWith(this).promise();
+                this.process = function () {
+                    return this._processingQueue;
+                };
+            }
+            this._resetFinishedDeferreds();
+        },
+
+        enable: function () {
+            var wasDisabled = false;
+            if (this.options.disabled) {
+                wasDisabled = true;
+            }
+            this._super();
+            if (wasDisabled) {
+                this.element.find('input, button').prop('disabled', false);
+                this._enableFileInputButton();
+            }
+        },
+
+        disable: function () {
+            if (!this.options.disabled) {
+                this.element.find('input, button').prop('disabled', true);
+                this._disableFileInputButton();
+            }
+            this._super();
+        }
+
+    });
+
+}));

app/assets/javascripts/file-upload/jquery.iframe-transport.js

@@ -0,0 +1,185 @@
+/*
+ * jQuery Iframe Transport Plugin 1.6.1
+ * https://github.com/blueimp/jQuery-File-Upload
+ *
+ * Copyright 2011, Sebastian Tschan
+ * https://blueimp.net
+ *
+ * Licensed under the MIT license:
+ * http://www.opensource.org/licenses/MIT
+ */
+
+/*jslint unparam: true, nomen: true */
+/*global define, window, document */
+
+(function (factory) {
+    'use strict';
+    if (typeof define === 'function' && define.amd) {
+        // Register as an anonymous AMD module:
+        define(['jquery'], factory);
+    } else {
+        // Browser globals:
+        factory(window.jQuery);
+    }
+}(function ($) {
+    'use strict';
+
+    // Helper variable to create unique names for the transport iframes:
+    var counter = 0;
+
+    // The iframe transport accepts three 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),
+    //  can be a string or an array of strings.
+    // 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}]
+    $.ajaxTransport('iframe', function (options) {
+        if (options.async) {
+            var form,
+                iframe,
+                addParamChar;
+            return {
+                send: function (_, completeCallback) {
+                    form = $('<form style="display:none;"></form>');
+                    form.attr('accept-charset', options.formAcceptCharset);
+                    addParamChar = /\?/.test(options.url) ? '&' : '?';
+                    // XDomainRequest only supports GET and POST:
+                    if (options.type === 'DELETE') {
+                        options.url = options.url + addParamChar + '_method=DELETE';
+                        options.type = 'POST';
+                    } else if (options.type === 'PUT') {
+                        options.url = options.url + addParamChar + '_method=PUT';
+                        options.type = 'POST';
+                    } else if (options.type === 'PATCH') {
+                        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:
+                    iframe = $(
+                        '<iframe src="javascript:false;" name="iframe-transport-' +
+                            (counter += 1) + '"></iframe>'
+                    ).bind('load', function () {
+                        var fileInputClones,
+                            paramNames = $.isArray(options.paramName) ?
+                                    options.paramName : [options.paramName];
+                        iframe
+                            .unbind('load')
+                            .bind('load', function () {
+                                var response;
+                                // Wrap in a try/catch block to catch exceptions thrown
+                                // when trying to access cross-domain iframe contents:
+                                try {
+                                    response = iframe.contents();
+                                    // Google Chrome and Firefox do not throw an
+                                    // exception when calling iframe.contents() on
+                                    // cross-domain requests, so we unify the response:
+                                    if (!response.length || !response[0].firstChild) {
+                                        throw new Error();
+                                    }
+                                } catch (e) {
+                                    response = undefined;
+                                }
+                                // The complete callback returns the
+                                // iframe content document as response object:
+                                completeCallback(
+                                    200,
+                                    'success',
+                                    {'iframe': response}
+                                );
+                                // Fix for IE endless progress bar activity bug
+                                // (happens on form submits to iframe targets):
+                                $('<iframe src="javascript:false;"></iframe>')
+                                    .appendTo(form);
+                                form.remove();
+                            });
+                        form
+                            .prop('target', iframe.prop('name'))
+                            .prop('action', options.url)
+                            .prop('method', options.type);
+                        if (options.formData) {
+                            $.each(options.formData, function (index, field) {
+                                $('<input type="hidden"/>')
+                                    .prop('name', field.name)
+                                    .val(field.value)
+                                    .appendTo(form);
+                            });
+                        }
+                        if (options.fileInput && options.fileInput.length &&
+                                options.type === 'POST') {
+                            fileInputClones = options.fileInput.clone();
+                            // Insert a clone for each file input field:
+                            options.fileInput.after(function (index) {
+                                return fileInputClones[index];
+                            });
+                            if (options.paramName) {
+                                options.fileInput.each(function (index) {
+                                    $(this).prop(
+                                        'name',
+                                        paramNames[index] || options.paramName
+                                    );
+                                });
+                            }
+                            // Appending the file input fields to the hidden form
+                            // removes them from their original location:
+                            form
+                                .append(options.fileInput)
+                                .prop('enctype', 'multipart/form-data')
+                                // enctype must be set as encoding for IE:
+                                .prop('encoding', 'multipart/form-data');
+                        }
+                        form.submit();
+                        // Insert the file input fields at their original location
+                        // by replacing the clones with the originals:
+                        if (fileInputClones && fileInputClones.length) {
+                            options.fileInput.each(function (index, input) {
+                                var clone = $(fileInputClones[index]);
+                                $(input).prop('name', clone.prop('name'));
+                                clone.replaceWith(input);
+                            });
+                        }
+                    });
+                    form.append(iframe).appendTo(document.body);
+                },
+                abort: function () {
+                    if (iframe) {
+                        // javascript:false as iframe src aborts the request
+                        // and prevents warning popups on HTTPS in IE6.
+                        // concat is used to avoid the "Script URL" JSLint error:
+                        iframe
+                            .unbind('load')
+                            .prop('src', 'javascript'.concat(':false;'));
+                    }
+                    if (form) {
+                        form.remove();
+                    }
+                }
+            };
+        }
+    });
+
+    // The iframe transport returns the iframe content document as response.
+    // The following adds converters from iframe to text, json, html, and script:
+    $.ajaxSetup({
+        converters: {
+            'iframe text': function (iframe) {
+                return iframe && $(iframe[0].body).text();
+            },
+            'iframe json': function (iframe) {
+                return iframe && $.parseJSON($(iframe[0].body).text());
+            },
+            'iframe html': function (iframe) {
+                return iframe && $(iframe[0].body).html();
+            },
+            'iframe script': function (iframe) {
+                return iframe && $.globalEval($(iframe[0].body).text());
+            }
+        }
+    });
+
+}));

app/assets/javascripts/file-upload/load-image.min.js

@@ -0,0 +1 @@
+(function(e){"use strict";var t=function(e,a,n){var r,i,c=document.createElement("img");if(c.onerror=a,c.onload=function(){!i||n&&n.noRevoke||t.revokeObjectURL(i),a&&a(t.scale(c,n))},t.isInstanceOf("Blob",e)||t.isInstanceOf("File",e))r=i=t.createObjectURL(e),c._type=e.type;else{if("string"!=typeof e)return!1;r=e,n&&n.crossOrigin&&(c.crossOrigin=n.crossOrigin)}return r?(c.src=r,c):t.readFile(e,function(e){var t=e.target;t&&t.result?c.src=t.result:a&&a(e)})},a=window.createObjectURL&&window||window.URL&&URL.revokeObjectURL&&URL||window.webkitURL&&webkitURL;t.isInstanceOf=function(e,t){return Object.prototype.toString.call(t)==="[object "+e+"]"},t.detectSubsampling=function(e){var t,a,n=e.width,r=e.height;return n*r>1048576?(t=document.createElement("canvas"),t.width=t.height=1,a=t.getContext("2d"),a.drawImage(e,-n+1,0),0===a.getImageData(0,0,1,1).data[3]):!1},t.detectVerticalSquash=function(e,t){var a,n,r,i,c,o=document.createElement("canvas"),d=o.getContext("2d");for(o.width=1,o.height=t,d.drawImage(e,0,0),a=d.getImageData(0,0,1,t).data,n=0,r=t,i=t;i>n;)c=a[4*(i-1)+3],0===c?r=i:n=i,i=r+n>>1;return i/t||1},t.renderImageToCanvas=function(e,a,n,r){var i,c,o,d,g,h,s,u,l=e.width,m=e.height,f=a.getContext("2d"),w=1024,v=document.createElement("canvas");for(f.save(),t.detectSubsampling(e)&&(l/=2,m/=2),i=t.detectVerticalSquash(e,m),v.width=v.height=w,c=v.getContext("2d"),o=Math.ceil(w*n/l),d=Math.ceil(w*r/m/i),h=0,u=0;m>u;){for(g=0,s=0;l>s;)c.clearRect(0,0,w,w),c.drawImage(e,-s,-u),f.drawImage(v,0,0,w,w,g,h,o,d),s+=w,g+=o;u+=w,h+=d}f.restore(),v=c=null},t.scale=function(e,a){a=a||{};var n=document.createElement("canvas"),r=e.width,i=e.height,c=Math.max((a.minWidth||r)/r,(a.minHeight||i)/i);return c>1&&(r=Math.ceil(r*c),i=Math.ceil(i*c)),c=Math.min((a.maxWidth||r)/r,(a.maxHeight||i)/i),1>c&&(r=Math.ceil(r*c),i=Math.ceil(i*c)),e.getContext||a.canvas&&n.getContext?(n.width=r,n.height=i,"image/jpeg"===e._type?t.renderImageToCanvas(e,n,r,i):n.getContext("2d").drawImage(e,0,0,r,i),n):(e.width=r,e.height=i,e)},t.createObjectURL=function(e){return a?a.createObjectURL(e):!1},t.revokeObjectURL=function(e){return a?a.revokeObjectURL(e):!1},t.readFile=function(e,t){if(window.FileReader&&FileReader.prototype.readAsDataURL){var a=new FileReader;return a.onload=a.onerror=t,a.readAsDataURL(e),a}return!1},"function"==typeof define&&define.amd?define(function(){return t}):e.loadImage=t})(this);

app/assets/javascripts/file-upload/tmpl.min.js

@@ -0,0 +1 @@
+(function(a){"use strict";var b=function(a,c){var d=/[^\w\-\.:]/.test(a)?new Function(b.arg+",tmpl","var _e=tmpl.encode"+b.helper+",_s='"+a.replace(b.regexp,b.func)+"';return _s;"):b.cache[a]=b.cache[a]||b(b.load(a));return c?d(c,b):function(a){return d(a,b)}};b.cache={},b.load=function(a){return document.getElementById(a).innerHTML},b.regexp=/([\s'\\])(?![^%]*%\})|(?:\{%(=|#)([\s\S]+?)%\})|(\{%)|(%\})/g,b.func=function(a,b,c,d,e,f){if(b)return{"\n":"\\n","\r":"\\r","\t":"\\t"," ":" "}[a]||"\\"+a;if(c)return c==="="?"'+_e("+d+")+'":"'+("+d+"||'')+'";if(e)return"';";if(f)return"_s+='"},b.encReg=/[<>&"'\x00]/g,b.encMap={"<":"&lt;",">":"&gt;","&":"&amp;",'"':"&quot;","'":"&#39;"},b.encode=function(a){return String(a||"").replace(b.encReg,function(a){return b.encMap[a]||""})},b.arg="o",b.helper=",print=function(s,e){_s+=e&&(s||'')||_e(s);},include=function(s,d){_s+=tmpl(s,d);}",typeof define=="function"&&define.amd?define(function(){return b}):a.tmpl=b})(this);

app/assets/javascripts/file-upload/vendor/jquery.ui.widget.js

@@ -0,0 +1,530 @@
+/*
+ * jQuery UI Widget 1.10.1+amd
+ * https://github.com/blueimp/jQuery-File-Upload
+ *
+ * Copyright 2013 jQuery Foundation and other contributors
+ * Released under the MIT license.
+ * http://jquery.org/license
+ *
+ * http://api.jqueryui.com/jQuery.widget/
+ */
+
+(function (factory) {
+    if (typeof define === "function" && define.amd) {
+        // Register as an anonymous AMD module:
+        define(["jquery"], factory);
+    } else {
+        // Browser globals:
+        factory(jQuery);
+    }
+}(function( $, undefined ) {
+
+var uuid = 0,
+	slice = Array.prototype.slice,
+	_cleanData = $.cleanData;
+$.cleanData = function( elems ) {
+	for ( var i = 0, elem; (elem = elems[i]) != null; i++ ) {
+		try {
+			$( elem ).triggerHandler( "remove" );
+		// http://bugs.jquery.com/ticket/8235
+		} catch( e ) {}
+	}
+	_cleanData( elems );
+};
+
+$.widget = function( name, base, prototype ) {
+	var fullName, existingConstructor, constructor, basePrototype,
+		// proxiedPrototype allows the provided prototype to remain unmodified
+		// so that it can be used as a mixin for multiple widgets (#8876)
+		proxiedPrototype = {},
+		namespace = name.split( "." )[ 0 ];
+
+	name = name.split( "." )[ 1 ];
+	fullName = namespace + "-" + name;
+
+	if ( !prototype ) {
+		prototype = base;
+		base = $.Widget;
+	}
+
+	// create selector for plugin
+	$.expr[ ":" ][ fullName.toLowerCase() ] = function( elem ) {
+		return !!$.data( elem, fullName );
+	};
+
+	$[ namespace ] = $[ namespace ] || {};
+	existingConstructor = $[ namespace ][ name ];
+	constructor = $[ namespace ][ name ] = function( options, element ) {
+		// allow instantiation without "new" keyword
+		if ( !this._createWidget ) {
+			return new constructor( options, element );
+		}
+
+		// allow instantiation without initializing for simple inheritance
+		// must use "new" keyword (the code above always passes args)
+		if ( arguments.length ) {
+			this._createWidget( options, element );
+		}
+	};
+	// extend with the existing constructor to carry over any static properties
+	$.extend( constructor, existingConstructor, {
+		version: prototype.version,
+		// copy the object used to create the prototype in case we need to
+		// redefine the widget later
+		_proto: $.extend( {}, prototype ),
+		// track widgets that inherit from this widget in case this widget is
+		// redefined after a widget inherits from it
+		_childConstructors: []
+	});
+
+	basePrototype = new base();
+	// we need to make the options hash a property directly on the new instance
+	// otherwise we'll modify the options hash on the prototype that we're
+	// inheriting from
+	basePrototype.options = $.widget.extend( {}, basePrototype.options );
+	$.each( prototype, function( prop, value ) {
+		if ( !$.isFunction( value ) ) {
+			proxiedPrototype[ prop ] = value;
+			return;
+		}
+		proxiedPrototype[ prop ] = (function() {
+			var _super = function() {
+					return base.prototype[ prop ].apply( this, arguments );
+				},
+				_superApply = function( args ) {
+					return base.prototype[ prop ].apply( this, args );
+				};
+			return function() {
+				var __super = this._super,
+					__superApply = this._superApply,
+					returnValue;
+
+				this._super = _super;
+				this._superApply = _superApply;
+
+				returnValue = value.apply( this, arguments );
+
+				this._super = __super;
+				this._superApply = __superApply;
+
+				return returnValue;
+			};
+		})();
+	});
+	constructor.prototype = $.widget.extend( basePrototype, {
+		// TODO: remove support for widgetEventPrefix
+		// always use the name + a colon as the prefix, e.g., draggable:start
+		// don't prefix for widgets that aren't DOM-based
+		widgetEventPrefix: existingConstructor ? basePrototype.widgetEventPrefix : name
+	}, proxiedPrototype, {
+		constructor: constructor,
+		namespace: namespace,
+		widgetName: name,
+		widgetFullName: fullName
+	});
+
+	// If this widget is being redefined then we need to find all widgets that
+	// are inheriting from it and redefine all of them so that they inherit from
+	// the new version of this widget. We're essentially trying to replace one
+	// level in the prototype chain.
+	if ( existingConstructor ) {
+		$.each( existingConstructor._childConstructors, function( i, child ) {
+			var childPrototype = child.prototype;
+
+			// redefine the child widget using the same prototype that was
+			// originally used, but inherit from the new version of the base
+			$.widget( childPrototype.namespace + "." + childPrototype.widgetName, constructor, child._proto );
+		});
+		// remove the list of existing child constructors from the old constructor
+		// so the old child constructors can be garbage collected
+		delete existingConstructor._childConstructors;
+	} else {
+		base._childConstructors.push( constructor );
+	}
+
+	$.widget.bridge( name, constructor );
+};
+
+$.widget.extend = function( target ) {
+	var input = slice.call( arguments, 1 ),
+		inputIndex = 0,
+		inputLength = input.length,
+		key,
+		value;
+	for ( ; inputIndex < inputLength; inputIndex++ ) {
+		for ( key in input[ inputIndex ] ) {
+			value = input[ inputIndex ][ key ];
+			if ( input[ inputIndex ].hasOwnProperty( key ) && value !== undefined ) {
+				// Clone objects
+				if ( $.isPlainObject( value ) ) {
+					target[ key ] = $.isPlainObject( target[ key ] ) ?
+						$.widget.extend( {}, target[ key ], value ) :
+						// Don't extend strings, arrays, etc. with objects
+						$.widget.extend( {}, value );
+				// Copy everything else by reference
+				} else {
+					target[ key ] = value;
+				}
+			}
+		}
+	}
+	return target;
+};
+
+$.widget.bridge = function( name, object ) {
+	var fullName = object.prototype.widgetFullName || name;
+	$.fn[ name ] = function( options ) {
+		var isMethodCall = typeof options === "string",
+			args = slice.call( arguments, 1 ),
+			returnValue = this;
+
+		// allow multiple hashes to be passed on init
+		options = !isMethodCall && args.length ?
+			$.widget.extend.apply( null, [ options ].concat(args) ) :
+			options;
+
+		if ( isMethodCall ) {
+			this.each(function() {
+				var methodValue,
+					instance = $.data( this, fullName );
+				if ( !instance ) {
+					return $.error( "cannot call methods on " + name + " prior to initialization; " +
+						"attempted to call method '" + options + "'" );
+				}
+				if ( !$.isFunction( instance[options] ) || options.charAt( 0 ) === "_" ) {
+					return $.error( "no such method '" + options + "' for " + name + " widget instance" );
+				}
+				methodValue = instance[ options ].apply( instance, args );
+				if ( methodValue !== instance && methodValue !== undefined ) {
+					returnValue = methodValue && methodValue.jquery ?
+						returnValue.pushStack( methodValue.get() ) :
+						methodValue;
+					return false;
+				}
+			});
+		} else {
+			this.each(function() {
+				var instance = $.data( this, fullName );
+				if ( instance ) {
+					instance.option( options || {} )._init();
+				} else {
+					$.data( this, fullName, new object( options, this ) );
+				}
+			});
+		}
+
+		return returnValue;
+	};
+};
+
+$.Widget = function( /* options, element */ ) {};
+$.Widget._childConstructors = [];
+
+$.Widget.prototype = {
+	widgetName: "widget",
+	widgetEventPrefix: "",
+	defaultElement: "<div>",
+	options: {
+		disabled: false,
+
+		// callbacks
+		create: null
+	},
+	_createWidget: function( options, element ) {
+		element = $( element || this.defaultElement || this )[ 0 ];
+		this.element = $( element );
+		this.uuid = uuid++;
+		this.eventNamespace = "." + this.widgetName + this.uuid;
+		this.options = $.widget.extend( {},
+			this.options,
+			this._getCreateOptions(),
+			options );
+
+		this.bindings = $();
+		this.hoverable = $();
+		this.focusable = $();
+
+		if ( element !== this ) {
+			$.data( element, this.widgetFullName, this );
+			this._on( true, this.element, {
+				remove: function( event ) {
+					if ( event.target === element ) {
+						this.destroy();
+					}
+				}
+			});
+			this.document = $( element.style ?
+				// element within the document
+				element.ownerDocument :
+				// element is window or document
+				element.document || element );
+			this.window = $( this.document[0].defaultView || this.document[0].parentWindow );
+		}
+
+		this._create();
+		this._trigger( "create", null, this._getCreateEventData() );
+		this._init();
+	},
+	_getCreateOptions: $.noop,
+	_getCreateEventData: $.noop,
+	_create: $.noop,
+	_init: $.noop,
+
+	destroy: function() {
+		this._destroy();
+		// we can probably remove the unbind calls in 2.0
+		// all event bindings should go through this._on()
+		this.element
+			.unbind( this.eventNamespace )
+			// 1.9 BC for #7810
+			// TODO remove dual storage
+			.removeData( this.widgetName )
+			.removeData( this.widgetFullName )
+			// support: jquery <1.6.3
+			// http://bugs.jquery.com/ticket/9413
+			.removeData( $.camelCase( this.widgetFullName ) );
+		this.widget()
+			.unbind( this.eventNamespace )
+			.removeAttr( "aria-disabled" )
+			.removeClass(
+				this.widgetFullName + "-disabled " +
+				"ui-state-disabled" );
+
+		// clean up events and states
+		this.bindings.unbind( this.eventNamespace );
+		this.hoverable.removeClass( "ui-state-hover" );
+		this.focusable.removeClass( "ui-state-focus" );
+	},
+	_destroy: $.noop,
+
+	widget: function() {
+		return this.element;
+	},
+
+	option: function( key, value ) {
+		var options = key,
+			parts,
+			curOption,
+			i;
+
+		if ( arguments.length === 0 ) {
+			// don't return a reference to the internal hash
+			return $.widget.extend( {}, this.options );
+		}
+
+		if ( typeof key === "string" ) {
+			// handle nested keys, e.g., "foo.bar" => { foo: { bar: ___ } }
+			options = {};
+			parts = key.split( "." );
+			key = parts.shift();
+			if ( parts.length ) {
+				curOption = options[ key ] = $.widget.extend( {}, this.options[ key ] );
+				for ( i = 0; i < parts.length - 1; i++ ) {
+					curOption[ parts[ i ] ] = curOption[ parts[ i ] ] || {};
+					curOption = curOption[ parts[ i ] ];
+				}
+				key = parts.pop();
+				if ( value === undefined ) {
+					return curOption[ key ] === undefined ? null : curOption[ key ];
+				}
+				curOption[ key ] = value;
+			} else {
+				if ( value === undefined ) {
+					return this.options[ key ] === undefined ? null : this.options[ key ];
+				}
+				options[ key ] = value;
+			}
+		}
+
+		this._setOptions( options );
+
+		return this;
+	},
+	_setOptions: function( options ) {
+		var key;
+
+		for ( key in options ) {
+			this._setOption( key, options[ key ] );
+		}
+
+		return this;
+	},
+	_setOption: function( key, value ) {
+		this.options[ key ] = value;
+
+		if ( key === "disabled" ) {
+			this.widget()
+				.toggleClass( this.widgetFullName + "-disabled ui-state-disabled", !!value )
+				.attr( "aria-disabled", value );
+			this.hoverable.removeClass( "ui-state-hover" );
+			this.focusable.removeClass( "ui-state-focus" );
+		}
+
+		return this;
+	},
+
+	enable: function() {
+		return this._setOption( "disabled", false );
+	},
+	disable: function() {
+		return this._setOption( "disabled", true );
+	},
+
+	_on: function( suppressDisabledCheck, element, handlers ) {
+		var delegateElement,
+			instance = this;
+
+		// no suppressDisabledCheck flag, shuffle arguments
+		if ( typeof suppressDisabledCheck !== "boolean" ) {
+			handlers = element;
+			element = suppressDisabledCheck;
+			suppressDisabledCheck = false;
+		}
+
+		// no element argument, shuffle and use this.element
+		if ( !handlers ) {
+			handlers = element;
+			element = this.element;
+			delegateElement = this.widget();
+		} else {
+			// accept selectors, DOM elements
+			element = delegateElement = $( element );
+			this.bindings = this.bindings.add( element );
+		}
+
+		$.each( handlers, function( event, handler ) {
+			function handlerProxy() {
+				// allow widgets to customize the disabled handling
+				// - disabled as an array instead of boolean
+				// - disabled class as method for disabling individual parts
+				if ( !suppressDisabledCheck &&
+						( instance.options.disabled === true ||
+							$( this ).hasClass( "ui-state-disabled" ) ) ) {
+					return;
+				}
+				return ( typeof handler === "string" ? instance[ handler ] : handler )
+					.apply( instance, arguments );
+			}
+
+			// copy the guid so direct unbinding works
+			if ( typeof handler !== "string" ) {
+				handlerProxy.guid = handler.guid =
+					handler.guid || handlerProxy.guid || $.guid++;
+			}
+
+			var match = event.match( /^(\w+)\s*(.*)$/ ),
+				eventName = match[1] + instance.eventNamespace,
+				selector = match[2];
+			if ( selector ) {
+				delegateElement.delegate( selector, eventName, handlerProxy );
+			} else {
+				element.bind( eventName, handlerProxy );
+			}
+		});
+	},
+
+	_off: function( element, eventName ) {
+		eventName = (eventName || "").split( " " ).join( this.eventNamespace + " " ) + this.eventNamespace;
+		element.unbind( eventName ).undelegate( eventName );
+	},
+
+	_delay: function( handler, delay ) {
+		function handlerProxy() {
+			return ( typeof handler === "string" ? instance[ handler ] : handler )
+				.apply( instance, arguments );
+		}
+		var instance = this;
+		return setTimeout( handlerProxy, delay || 0 );
+	},
+
+	_hoverable: function( element ) {
+		this.hoverable = this.hoverable.add( element );
+		this._on( element, {
+			mouseenter: function( event ) {
+				$( event.currentTarget ).addClass( "ui-state-hover" );
+			},
+			mouseleave: function( event ) {
+				$( event.currentTarget ).removeClass( "ui-state-hover" );
+			}
+		});
+	},
+
+	_focusable: function( element ) {
+		this.focusable = this.focusable.add( element );
+		this._on( element, {
+			focusin: function( event ) {
+				$( event.currentTarget ).addClass( "ui-state-focus" );
+			},
+			focusout: function( event ) {
+				$( event.currentTarget ).removeClass( "ui-state-focus" );
+			}
+		});
+	},
+
+	_trigger: function( type, event, data ) {
+		var prop, orig,
+			callback = this.options[ type ];
+
+		data = data || {};
+		event = $.Event( event );
+		event.type = ( type === this.widgetEventPrefix ?
+			type :
+			this.widgetEventPrefix + type ).toLowerCase();
+		// the original event may come from any element
+		// so we need to reset the target on the new event
+		event.target = this.element[ 0 ];
+
+		// copy original event properties over to the new event
+		orig = event.originalEvent;
+		if ( orig ) {
+			for ( prop in orig ) {
+				if ( !( prop in event ) ) {
+					event[ prop ] = orig[ prop ];
+				}
+			}
+		}
+
+		this.element.trigger( event, data );
+		return !( $.isFunction( callback ) &&
+			callback.apply( this.element[0], [ event ].concat( data ) ) === false ||
+			event.isDefaultPrevented() );
+	}
+};
+
+$.each( { show: "fadeIn", hide: "fadeOut" }, function( method, defaultEffect ) {
+	$.Widget.prototype[ "_" + method ] = function( element, options, callback ) {
+		if ( typeof options === "string" ) {
+			options = { effect: options };
+		}
+		var hasOptions,
+			effectName = !options ?
+				method :
+				options === true || typeof options === "number" ?
+					defaultEffect :
+					options.effect || defaultEffect;
+		options = options || {};
+		if ( typeof options === "number" ) {
+			options = { duration: options };
+		}
+		hasOptions = !$.isEmptyObject( options );
+		options.complete = callback;
+		if ( options.delay ) {
+			element.delay( options.delay );
+		}
+		if ( hasOptions && $.effects && $.effects.effect[ effectName ] ) {
+			element[ method ]( options );
+		} else if ( effectName !== method && element[ effectName ] ) {
+			element[ effectName ]( options.duration, options.easing, callback );
+		} else {
+			element.queue(function( next ) {
+				$( this )[ method ]();
+				if ( callback ) {
+					callback.call( element[ 0 ] );
+				}
+				next();
+			});
+		}
+	};
+});
+
+}));

app/controllers/admin/assets_controller.rb

@@ -3,7 +3,17 @@ class Admin::AssetsController < OrbitBackendController
   before_filter :setup_vars
   
   def index
-    @assets = (params[:sort] || @filter) ? get_sorted_and_filtered("asset") : Asset.all.page(params[:page]).per(10)
+    @assets = (params[:sort] || @filter) ? get_sorted_and_filtered("asset") : Asset.all.desc(:created_at).page(params[:page]).per(10)
+    if params[:type] == "images"
+      @assets = @assets.where(:content_type => /^image/)
+    end
+    @tag = ModuleTag.new
+
+    @module_app = ModuleApp.find(params[:module_app_id]) rescue nil
+    raise ModuleAppError, 'Can not find ModuleApp' if @module_app.nil?
+    @module_app_id = @module_app.id rescue nil 
+    
+   render :layout => "assets" 
   end
   
   def show
@@ -95,11 +105,31 @@ class Admin::AssetsController < OrbitBackendController
     redirect_to assets_url(:filter => params[:filter], :direction => params[:direction], :sort => params[:sort], :sort_options => params[:sort_options])
   end
 
+  def delete_files
+    @files = params[:files]
+    @files.each do |file|
+      asset = Asset.find(file)
+      asset.destroy
+    end
+    @assets = (params[:sort] || @filter) ? get_sorted_and_filtered("asset") : Asset.all.desc(:created_at).page(params[:page]).per(10)
+    if params[:type] == "images"
+      @assets = @assets.where(:content_type => /^image/)
+    end
+    # render :json =>{"success"=>true}.to_json
+  end
+
   def file_upload
-    @asset = Asset.new
-    @asset_categories = AssetCategory.all
-    @tags = get_tags
-    render :layout => false
+    @files = params['files']
+    a = Array.new
+    @files.each do |file|
+      @asset = current_user.assets.new
+      @asset.data = file
+      @asset.title_translations = {:en => file.original_filename, :zh_tw => file.original_filename}
+      # @asset.title_translations[:zh_tw] = file.original_filename
+      @asset.save!
+      a << {"url"=>@asset.data.url}
+    end
+    render :json=>{"files"=>a}.to_json
   end
 
   def file_select

app/helpers/admin/assets_helper.rb

@@ -7,5 +7,5 @@ module Admin::AssetsHelper
     end 
     a.join(' - ')
   end
-
+  
 end

app/models/asset.rb

@@ -5,13 +5,16 @@ class Asset
   include OrbitTag::Taggable
 
   mount_uploader :data, FileAssetUploader
+  before_save :update_asset_attributes
 
   field :filename
   field :description, localize: true
   field :title, localize: true
+  field :content_type
+  field :file_size
   
   validates :title, :at_least_one => true
-  validates :description, :at_least_one => true
+
   validates_presence_of :data
 
 
@@ -21,6 +24,14 @@ class Asset
   before_save :clean_tags
 
   protected
+ 
+  
+  def update_asset_attributes
+    if data.present? && data_changed?
+      self.content_type = data.file.content_type
+      self.file_size = data.file.size
+    end
+  end
 
   def clean_tags
     self.tagged_ids.delete('')

app/models/ckeditor/asset.rb

@@ -1,7 +0,0 @@
-class Ckeditor::Asset
-  include Ckeditor::Orm::Mongoid::AssetBase
-
-  delegate :url, :current_path, :size, :content_type, :filename, :to => :data
-  
-  validates_presence_of :data
-end

app/models/ckeditor/attachment_file.rb

@@ -1,7 +0,0 @@
-class Ckeditor::AttachmentFile < Ckeditor::Asset
-  mount_uploader :data, CkeditorAttachmentFileUploader, :mount_on => :data_file_name
-
-  def url_thumb
-    @url_thumb ||= Ckeditor::Utils.filethumb(filename)
-  end
-end

app/models/ckeditor/picture.rb

@@ -1,7 +0,0 @@
-class Ckeditor::Picture < Ckeditor::Asset
-  mount_uploader :data, CkeditorPictureUploader, :mount_on => :data_file_name
-
-  def url_content
-    url(:content)
-  end
-end

app/models/user/user.rb

@@ -32,6 +32,7 @@ class User
   has_one :desktop, :autosave => true, :dependent => :destroy
   has_one :facebook, :autosave => true, :dependent => :destroy
   has_many :other_accounts, :autosave => true, :dependent => :destroy
+  has_many :assets, as: :assetable
   # has_many :journals, :autosave => true, :dependent => :destroy
   # has_many :papers, :autosave => true, :dependent => :destroy
   has_and_belongs_to_many :sub_role_tags

app/views/admin/assets/_asset.html.erb

@@ -1,16 +1,23 @@
 <tr id="asset_<%= asset.id %>" class="with_action">
-	<td><%= check_box_tag 'to_delete[]', asset.id, false, :class => "checkbox_in_list" %></td>
-	<td><%= asset.title rescue nil %></td>
 	<td>
+		<%= check_box_tag 'files[]', asset.id, false, :class => "checkbox_in_list" %>
+		<input type="hidden" value="<%= asset.data.url %>" id="url_<%= asset.id %>" />
+		<% @site_valid_locales.each_with_index do |locale, i| %>
+			<input type="hidden" value="<%= asset.description_translations[locale] rescue nil %>" id="<%= locale %>_desc_<%= asset.id %>" />
+			<input type="hidden" value="<%= asset.title_translations[locale] rescue nil %>" id="<%= locale %>_title_<%= asset.id %>" />
+		<% end %>
+	</td>
+	<td><%= asset.title_translations[I18n.locale.to_s] rescue nil %></td>
+	<!-- <td>
 		<i class="icons-pictures img-peview" rel="popover" data-content="<img src='<%= asset.data.url %>' />" data-original-title="<%= asset.data.filename %>"></i>
 		<div class="quick-edit">
 			<ul class="nav nav-pills hide">
-				<li><%= link_to t(:edit), edit_admin_asset_path(asset), :remote => true, :class => 'edit'  %></li>
-				<li class="dropdown"><%= link_to t(:delete_), admin_asset_path(asset), :confirm => t('sure?'), :method => :delete, :class => 'delete' %></li>
+				<li><%#= link_to t(:edit), edit_admin_asset_path(asset), :remote => true, :class => 'edit'  %></li>
+				<li class="dropdown"><%#= link_to t(:delete_), admin_asset_path(asset), :confirm => t('sure?'), :method => :delete, :class => 'delete' %></li>
 			</ul>
 		</div>
-	</td>
-	<td><%= asset.data.file.content_type rescue nil %></td>
+	</td> -->
+	<!-- <td><%#= asset.data.file.content_type rescue nil %></td> -->
 	<td><%= number_to_human_size(asset.data.file.file_length) rescue nil %></td>
 	<td><%= asset.description rescue nil %></td>
 	<td>
@@ -22,10 +29,7 @@
 			</div>
 		</div>
 	</td>
-</tr>
-
-<script type="text/javascript">
-    $('.img-peview').popover({
-            delay: { show: 100, hide: 300 }
-    });
-</script>
+	<td>
+		<a href="#" class="editform">Edit</a>
+	</td>
+</tr>

app/views/admin/assets/delete_files.js.erb

@@ -0,0 +1,3 @@
+
+$("#tbody_assets").html("<%= j render :partial => 'asset', :collection => @assets %>");
+$("#asset_pagination").html("<%= j paginate @assets, :params => {:direction => params[:direction], :sort => params[:sort], :filter => @filter, :new_filter => nil} %>");

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

@@ -1,30 +1,482 @@
-<%= render 'filter' %>
-<table id="asset_sort_list" class="table main-list">
-	<thead>
-		<tr>
-      <th class="span1"></th>
-      <th class="span4"></th>
-      <th class="span1-2"></th>
-      <th class="span1-2"></th>
-      <th class="span1-2"></th>
-      <th class="span1-2"></th>
-      <th class="span1-2"></th>
-		</tr>
-	</thead>
-	<tbody id="tbody_assets" class="sort-holder">
-		<%= render :partial => 'asset', :collection => @assets %>
-	</tbody>
-</table>
+<style>
+/* File Upload */
+#upload-panel {
+	clear: both;
+}
+#upload-panel iframe {
+	width: 100%;
+	border: none;
+}
+#fileupload {
+	position: relative;
+	clear: both;
+	overflow: hidden;
+	margin: 40px 0 15px;
+	height: 254px;
+	border: 1px solid #d4d4d4;
+	border-radius: 4px;
+	background-color: #FDFDFD;
+	/*-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, .15) inset;
+			box-shadow: 0px 0px 10px rgba(0, 0, 0, .15) inset;*/
+}
+#fileupload table {
+	margin: 0;
+}
+#fileupload .fileupload-buttonbar .navbar {
+	margin-bottom: 0;
+}
+#fileupload .fileupload-buttonbar .navbar .add-photo {
+	border: none;
+	border-right: 1px solid #d4d4d4;
+	background-color: transparent;
+	padding: 10px 15px 10px;
+	color: #777777;
+	text-decoration: none;
+	text-shadow: 0 1px 0 #ffffff;
+}
+#fileupload .fileupload-buttonbar .navbar .add-photo:hover {
+	color: #333333;
+	text-decoration: none;
+	background-color: #EDEDED;
+}
+#fileupload .fileupload-buttonbar .navbar .fileinput-button {
+	position: relative;
+	overflow: hidden;
+}
+#fileupload .fileupload-buttonbar .navbar .fileinput-button input {
+	position: absolute;
+	top: 0;
+	right: 0;
+	margin: 0;
+	font-size: 23px;
+	opacity: 0;
+	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+	filter: alpha(opacity=0);
+	cursor: pointer;
+	-webkit-transform: translate(-300px, 0) scale(4);
+	   -moz-transform: translate(-300px, 0) scale(4);
+		-ms-transform: translate(-300px, 0) scale(4);
+		 -o-transform: translate(-300px, 0) scale(4);
+			transform: translate(-300px, 0) scale(4);
+	direction: ltr;
+}
+#fileupload .fileupload-buttonbar .navbar-inner {
+	border-width: 0 0 1px;
+	border-radius: 4px 4px 0 0;
+	padding: 0;
+}
 
-<div class="form-actions form-fixed pagination-right">
-	<%= link_to content_tag(:i, nil, :class => 'icon-plus icon-white') + t(:add), new_admin_asset_path, :remote => true, :class => 'btn btn-primary pull-right' %>
-	<div id="asset_pagination" class="paginationFixed">
-		<%= paginate @assets, :params => {:direction => params[:direction], :sort => params[:sort], :filter => @filter, :new_filter => nil, :sort_options => params[:sort_options]}, :remote => true %>
+#fileupload .fileupload-progress .progress {
+	position: absolute;
+	right: 0;
+	left: 0;
+	margin-bottom: 0;
+	height: 5px;
+	border-radius: 0;
+	background-color: transparent;
+	background-image: none;
+}
+#fileupload .fileupload-progress .progress-success.progress-striped .bar {
+	background-color: #0088CC;
+}
+#fileupload .fileupload-progress .progress-extended {
+	position: absolute;
+	top: 1px;
+	right: 0;
+	padding-right: 15px;
+	color: #0088CC;
+	text-align: right;
+	text-shadow: 0 1px 0 #ffffff;
+	letter-spacing: -0.1em;
+	font-size: 12px;
+	font-family: 'Varela Round', sans-serif;
+	line-height: 40px;
+}
+#fileupload .fileupload-buttonbar {
+	position: relative;
+	z-index: 3;
+}
+#fileupload #dropzone {
+	margin: 15px 10px 10px;
+	padding: 30px;
+	text-align: center;
+	font-size: 2em;
+	font-family: 'Raleway';
+	line-height: 1.2em;
+	color: #e4e4e4;
+}
+#fileupload #dropzone div[data-icons] {
+	font-size: 4em;
+	height: 70px;
+	padding-top: 30px;
+	text-shadow: 0px -1px 0px #ececec;
+	color: #f5f5f5;
+}
+#fileupload #dropzone.drop {
+	position: absolute;
+	top: 37px;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	border: 2px dashed #0088CC;
+	border-radius: 10px;
+	color: #0088CC;
+	background-color: #FFFFFF;
+	z-index: 0;
+}
+#fileupload #dropzone.fade {
+	opacity: .3;
+}
+#fileupload #dropzone.in {
+	opacity: .7;
+	z-index: 2;
+	border-color: #faa732;
+	color: #faa732;
+}
+#fileupload #dropzone.drop div[data-icons] {
+	text-shadow: 0px -1px 0px #0c5f80;
+	color: #0088CC;
+}
+#fileupload #dropzone.in div[data-icons] {
+	text-shadow: 0px -1px 0px #a28a10;
+	color: #faa732;
+}
+#fileupload #file-list {
+	position: relative;
+	z-index: 1;
+	height: 209px;
+	margin: 2px 0;
+}
+#fileupload #file-list .pane {
+	margin-right: 2px;
+}
+#fileupload #file-list .files {
+	margin: 0;
+	padding: 10px 14px 10px 10px;
+	list-style: none;
+}
+#fileupload #file-list .files > li {
+	padding: 10px;
+}
+#fileupload #file-list .files > li:nth-child(even) {
+	background-color: #e9e9e9;
+	border-radius: 3px;
+}
+#fileupload #file-list .files ul {
+	position: relative;
+	margin: 0;
+	padding: 0;
+	list-style: none;
+}
+#fileupload #file-list .files ul li {
+	float: left;
+}
+#fileupload #file-list .files ul li.action-bnt {
+	float: right;
+}
+#fileupload #file-list .preview {
+	width: 80px;
+	min-height: 1px;
+	margin-right: 10px;
+	text-align: center;
+}
+#fileupload #file-list .name {
+	width: 150px;
+	max-width: 250px;
+	margin-left: 15px;
+}
+#fileupload #file-list .progress {
+	position: absolute;
+	left: -5px;
+	right: -5px;
+	bottom: -5px;
+	margin-bottom: 0;
+	height: 5px;
+	box-shadow: none;
+	background-color: transparent;
+	background-image: none;
+}
+#fileupload #file-list .size {
+	width: 80px;
+}
+#fileupload #file-list .action-bnt {
+	text-align: right;
+}
+</style>
+<ul class="nav nav-tabs  module-nav">
+  <li class="active">
+    <a href="#filemanager" data-toggle="tab">File Manager</a>
+  </li>
+  <li><a href="#upload" data-toggle="tab">Upload</a></li>
+</ul>
+<div class="tab-pane fade in active" id="filemanager">
+	<a href="<%= admin_module_tags_path(:module_app_id => @module_app_id.to_s) %>"> Tag Management </a>
+	<div id="panel_l" style="width:200px;float:left;margin:5px 5px 5px 5px;">
+		preview is here
 	</div>
+	<div id="panel_r" class="tab-pane fade in active" style="width: 1200px;" >
+		<table id="asset_sort_list" class="table main-list">
+			<thead>
+				<tr>
+			      <th class="span1"></th>
+			      <th class="span4">Name</th>
+			      <th class="span1-2">Size</th>
+			      <th class="span1-2">Description</th>
+			      <th class="span2">Tags</th>
+			      <th class="span1">Action</th>
+				</tr>
+			</thead>
+			<tbody id="tbody_assets" class="sort-holder">
+				<%= render :partial => 'asset', :collection => @assets %>
+			</tbody>
+		</table>
+	</div>
+	<div class="form-actions form-fixed pagination-right">
+		<button class="btn btn-primary" id="insert_btn" style="display:none;">Insert</button>
+		<button class="btn btn-primary" id="delete_btn" style="display:none;">Delete</button>
+		<div id="asset_pagination" class="paginationFixed">
+			<%= paginate @assets, :params => {:direction => params[:direction], :sort => params[:sort], :filter => @filter, :new_filter => nil, :sort_options => params[:sort_options]}, :remote => true %>
+		</div>
+	</div>
+</div>
+<div class="tab-pane fade" id="upload">
+	 <form action="<%= file_upload_admin_assets_path %>", id='fileupload'>
+    <!-- Redirect browsers with JavaScript disabled to the origin page -->
+    <!-- The fileupload-buttonbar contains buttons to add/delete files and start/cancel the upload -->
+    <div class="fileupload-buttonbar">
+      <div class="navbar">
+        <div class="navbar-inner">
+          <ul class="nav">
+            <li>
+              <div class="fileinput-button add-photo">
+                <i class="icon-plus icon-white"></i>
+                <span>Add files...</span>
+                <input type="file" name="files[]" multiple>
+              </div>
+            </li>
+            <li>
+              <button type="submit" class="start add-photo">
+                <i class="icon-upload icon-white"></i>
+                <span>Start upload</span>
+              </button>
+            </li>
+            <li>
+              <button type="reset" class="cancel add-photo">
+                <i class="icon-ban-circle icon-white"></i>
+                <span>Cancel upload</span>
+              </button>
+            </li>
+            <!-- <li>
+              <button type="button" class="delete">
+                <i class="icons-trash icon-white"></i>
+                <span>Delete</span>
+              </button>
+            </li> -->
+          </ul>
+        </div>
+      </div>
+      <!-- The global progress information -->
+      <div class="fileupload-progress">
+          <!-- The global progress bar -->
+          <div class="progress progress-success progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100">
+              <div class="bar" style="width:0%;"></div>
+          </div>
+          <!-- The extended global progress information -->
+          <div class="progress-extended"></div>
+      </div>
+    </div>
+    <!-- Drop Zone -->
+    <div id="dropzone" class="drop">
+      <div data-icons="&#xe0a3;"></div>
+      Drop files here
+    </div>
+    <!-- The loading indicator is shown during file processing -->
+    <div class="fileupload-loading"></div>
+    <!-- The table listing the files available for upload/download -->
+    <div id="file-list" class="nano">
+      <div class="content">
+        <ul role="presentation" class="files clearfix">
+        </ul>
+      </div>
+    </div>
+  </form>
+</div>
+<div id="editform" class="modal hide fade">
+  <div class="modal-header">
+    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+    <h3>Modal header</h3>
+  </div>
+  <div class="modal-body">
+    <p>One fine body…</p>
+  </div>
+  <div class="modal-footer">
+    <a href="#" class="btn" data-dismiss="modal">Close</a>
+    <a href="#" class="btn btn-primary">Save changes</a>
+  </div>
 </div>
 
 <% content_for :page_specific_javascript do %>
-	<%= javascript_include_tag "/static/jquery.cycle.all.latest.js" %>
-	<%= javascript_include_tag "inc/modal-preview" %>
+  <%= javascript_include_tag "file-upload/vendor/jquery.ui.widget.js" %>
+  <%= javascript_include_tag "file-upload/tmpl.min.js" %>
+  <%= javascript_include_tag "file-upload/load-image.min.js" %>
+  <%= javascript_include_tag "file-upload/canvas-to-blob.min.js" %>
+  <%= javascript_include_tag "file-upload/jquery.iframe-transport.js" %>
+  <%= javascript_include_tag "file-upload/jquery.fileupload.js" %>
+  <%= javascript_include_tag "file-upload/jquery.fileupload-fp.js" %>
+  <%= javascript_include_tag "file-upload/jquery.fileupload-ui.js" %>
+  <%= javascript_include_tag "file-upload/drop-zone.js" %>
 <% end %>
+<script type="text/javascript">
+!function ($) {
+    $.fn.checkListLength = function (param){
+        _defaultSettings = {
+            onlyOne: null,
+        };
+        _set = $.extend(_defaultSettings, param);
+        $this = this;
+        $li = this.children('li');
+        $dropzone = $('#dropzone');
+        if(($li.length - _set.onlyOne) == 0) {
+		    $('#dropzone').fadeIn(300);
+		} else {
+		    $('#dropzone').fadeOut(300);
+		};
+		$('#file-list').nanoScroller({ scrollTop: 0, iOSNativeScrolling: true });
+    }
+}(window.jQuery);
+$(function () {
+    'use strict';
+    // Initialize the jQuery File Upload widget:
+    $('#fileupload').fileupload({
+        maxFileSize: 5000000,
+        acceptFileTypes: /(\.|\/)(gif|jpe?g|png|pdf|doc|docx|ppt|pptx|xls|xlsx)$/i,
+        dropZone: $('#dropzone'),
+        headers:{
+            'X-CSRF-Token': $('meta[name="csrf-token"]').attr("content")
+        }
+    }).bind('fileuploadstop', function (e, data) {
+    	window.location.reload();
+    });
+});
+$(document).ready(function(){
+	var insertBtn = $("#insert_btn"),
+		deleteBtn = $("#delete_btn"),
+		url = null;
 
+	$("#asset_sort_list").on(clickEvent,"input[type=checkbox]",function(){
+		if($("input[type=checkbox]:checked").length == 1){
+			url = window.location.protocol + "//" + window.location.host + $("#url_" + $("input[type=checkbox]:checked").val()).val();
+			insertBtn.show();
+		}else{
+			insertBtn.hide();
+			url = null;
+		}
+		if($("input[type=checkbox]:checked").length)
+			deleteBtn.show();
+		else
+			deleteBtn.hide();
+	})
+	insertBtn.bind(clickEvent,function(){
+		var alt_text = $("#"+language+"_desc_"+$("input[type=checkbox]:checked").val()).val();
+		alt_text = (alt_text ? alt_text : "This is alt text");
+		if(url){
+			window.opener.CKEDITOR.tools.callFunction( funcNum, url, function() {
+			    var element,
+			        dialog = this.getDialog();
+			    if ( dialog.getName() == 'image' ) {
+			        element = dialog.getContentElement( 'info', 'txtAlt' );
+			        if ( element )
+			            element.setValue( alt_text );
+			    }
+			});
+			window.close();
+		}
+	})
+	deleteBtn.bind( clickEvent,function(){
+		var items_to_delete = [],
+			type = getUrlParam("type");
+		$("input[type=checkbox]:checked").each(function(){
+			items_to_delete.push($(this).val());
+		})
+		$.post("<%= delete_files_admin_assets_path %>",{"files":items_to_delete,"type":type},function(){
+			deleteBtn.hide();
+		})
+	})
+	$("#asset_sort_list").on(clickEvent,".editform",function(){
+		$("#editform").modal("show");
+	})
+
+	function getUrlParam( paramName ) {
+	    var reParam = new RegExp( '(?:[\?&]|&)' + paramName + '=([^&]+)', 'i' ) ;
+	    var match = window.location.search.match(reParam) ;
+
+	    return ( match && match.length > 1 ) ? match[ 1 ] : null ;
+	}
+	var funcNum = getUrlParam( 'CKEditorFuncNum' ),
+		t = getUrlParam('CKEditor').split("_"),
+		language = t[t.length-1];
+
+	language = (language == "tw" ? "zh_tw" : language); 
+
+})
+</script>
+<script id="template-upload" type="text/x-tmpl">
+    {% for (var i=0, file; file=o.files[i]; i++) { %}
+      <li class="template-upload fade">
+        <ul class="clearfix">
+            <li class="action-bnt">
+              {% if (o.files.valid && !i) { %}
+                <div class="progress progress-success progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0">
+                  <div class="bar" style="width:0%;"></div>
+                </div>
+                {% if (!o.options.autoUpload) { %}
+                  <button class="btn btn-primary start">
+                    <i class="icon-upload icon-white"></i>
+                  </button>
+                {% } %}
+              {% } %}
+              {% if (!i) { %}
+                <button class="btn btn-warning cancel">
+                  <i class="icon-ban-circle icon-white"></i>
+                </button>
+              {% } %}
+            </li>
+            <li class="preview pull-left"><span class="fade"></span></li>
+            <li class="name-size">
+              <p>{%=file.name%}</p>
+              {% if (file.error) { %}
+                <p class="error"><span class="label label-important">Error</span> {%=file.error%}</p>
+              {% } else if (o.files.valid && !i) { %}
+                <p class="label label-info">{%=o.formatFileSize(file.size)%}</p>
+              {% } %}
+            </li>
+          </ul>
+      </li>
+    {% } %}
+  </script>
+  <!-- The template to display files available for download -->
+<script id="template-download" type="text/x-tmpl">
+  {% for (var i=0, file; file=o.files[i]; i++) { %}
+    <li class="template-download fade">
+      <ul class="clearfix">
+        {% if (file.error) { %}
+          <li class="name-size">
+            <p>{%=file.name%}</p>
+            <p class="error"><span class="label label-important">Error</span> {%=file.error%}</p>
+          </li>
+        {% } else { %}
+          <li class="preview">
+            {% if (file.thumbnail_url) { %}
+              <a href="{%=file.url%}" title="{%=file.name%}" data-gallery="gallery" download="{%=file.name%}"><img src="{%=file.thumbnail_url%}"></a>
+            {% } %}
+          </li>
+          <li class="name-size">
+            <p><a href="{%=file.url%}" title="{%=file.name%}" data-gallery="{%=file.thumbnail_url&&'gallery'%}" download="{%=file.name%}">{%=file.name%}</a></p>
+            <p ><span class="label label-success">Success</span> File uploaded successfully!</p>
+            <p class="label label-info">{%=o.formatFileSize(file.size)%}</p>
+          </li>
+        {% } %}
+      </ul>
+    </li>
+  {% } %}
+</script>

app/views/admin/assets/index.js.erb

@@ -1,4 +0,0 @@
-$("#delete_all").attr("action", "<%= delete_admin_assets_path(:direction => params[:direction], :sort => params[:sort], :filter => @filter, :new_filter => nil, :sort_options => params[:sort_options]) %>");
-$("#sort_headers").html("<%= j render 'sort_headers' %>");
-$("#tbody_assets").html("<%= j render :partial => 'asset', :collection => @assets %>");
-$("#asset_pagination").html("<%= j paginate @assets, :params => {:direction => params[:direction], :sort => params[:sort], :filter => @filter, :new_filter => nil} %>");

app/views/admin/module_tags/index.html.erb

@@ -3,7 +3,6 @@
     <input id="filter-input" class="search-query input-medium" type="text" placeholder="<%= t('search.tags') %>" value="">
   </div>
 <% end %>
-
 <div id="tags_index">
   <%= render 'index' %>
 </div>

app/views/layouts/assets.html.erb

@@ -0,0 +1,22 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+	<title><%= @title || APP_CONFIG['orbit'] %></title>
+	<%#= render 'layouts/meta' %>
+	<%#= render 'layouts/google_font' %>
+	<%= stylesheet_link_tag "back_end" %>
+  <%= yield :page_specific_css %>
+	<%= render 'layouts/ie_html5_fix' %>
+	<%= javascript_include_tag "back_end" %>
+	<%= yield :page_specific_javascript %>
+	<%= csrf_meta_tag %>
+</head>
+<body id="dashboards">
+	<section>
+    <div >
+     <!--  <div id="filter" class="topnav clearfix">
+      </div> -->
+    	<%= yield %>
+  </section>
+</body>
+</html>