issue #50 styling the new uploader

2 files changed, 16 insertions, 7 deletions

diff --git a/lib/scripts/fileuploaderextended.js b/lib/scripts/fileuploaderextended.js
index 822c32958..de0bdaa3d 100644
--- a/lib/scripts/fileuploaderextended.js
+++ b/lib/scripts/fileuploaderextended.js
@@ -52,11 +52,11 @@ qq.extend(qq.FileUploader.prototype, {
         item.qqFileId = id;
 
         var fileElement = this._find(item, 'file');
-        qq.setText(fileElement, this._formatFileName(fileName));
+        qq.setText(fileElement, fileName);
         this._find(item, 'size').style.display = 'none';
 
         var nameElement = this._find(item, 'nameInput');
-        nameElement.value = this._formatFileName(fileName);
+        nameElement.value = fileName;
         nameElement.id = id;
 
         this._listElement.appendChild(item);
@@ -76,20 +76,20 @@ qq.FileUploaderExtended = function(o){
         template: '<div class="qq-uploader">' +
                 '<div class="qq-upload-drop-area"><span>' + LANG.media_drop + '</span></div>' +
                 '<div class="qq-upload-button">' + LANG.media_select + '</div>' +
-                '<ul class="qq-upload-list"></ul>' +
+                '<div class="qq-upload-list"></div>' +
                 '<label class="check" for="dw__ow"><input id="dw__ow" type="checkbox" value="1" name="ow"><span>' + LANG.media_overwrt + '</span></label>' +
                 '<div><input class="button" type="submit" value="' + LANG.media_upload_btn + '" id="mediamanager__upload_button"></div>' +
              '</div>',
 
         // template for one item in file list
-        fileTemplate: '<li>' +
+        fileTemplate: '<div class="li">' +
                 '<span class="qq-upload-file qq-upload-file-hidden"></span>' +
                 '<input class="qq-upload-name-input edit" type="text">' +
                 '<span class="qq-upload-spinner-hidden"></span>' +
                 '<span class="qq-upload-size"></span>' +
                 '<a class="qq-upload-cancel" href="#">' + LANG.media_cancel + '</a>' +
                 '<span class="qq-upload-failed-text">Failed</span>' +
-            '</li>',
+            '</div>',
 
         classes: {
             // used to get elements from templates
@@ -140,6 +140,9 @@ qq.extend(qq.FileUploaderExtended.prototype, {
             qq.preventDefault(e);
             self._handler._options.onUpload();
 
+            jQuery(".qq-upload-name-input").each(function (i) {
+                jQuery(this).attr('disabled', 'disabled');
+            });
         });
     },
 
@@ -157,10 +160,13 @@ qq.extend(qq.FileUploaderExtended.prototype, {
         qq.removeClass(fileElement, 'qq-upload-file-hidden');
         qq.remove(nameInput);
         jQuery('.qq-upload-button, #mediamanager__upload_button').remove();
-        jQuery('#dw__ow').parent().remove();
+        jQuery('#dw__ow').parent().hide();
 
         if (result.success){
             qq.addClass(item, this._classes.success);
+            $link = '<a href="' + result.link + '">' + nameInput.value + '</a>';
+            jQuery(fileElement).html($link);
+
         } else {
             qq.addClass(item, this._classes.fail);
             var fail = this._find(item, 'failedText');
diff --git a/lib/scripts/media.js b/lib/scripts/media.js
index 4fc4155b2..c1ff1f451 100644
--- a/lib/scripts/media.js
+++ b/lib/scripts/media.js
@@ -81,7 +81,9 @@ var dw_mediamanager = {
             // "upload as" field autofill
             .delegate('#upload__file', 'change', dw_mediamanager.suggest)
             // sort type selection
-            .delegate('#mediamanager__form_sort select', 'change', dw_mediamanager.list);
+            .delegate('#mediamanager__form_sort select', 'change', dw_mediamanager.list)
+            // uploaded images
+            .delegate('.qq-upload-file a', 'click', dw_mediamanager.details);
 
         // changing opened tab in the file details panel
         jQuery('#mediamanager__layout_detail').delegate('#mediamanager__tabs_details a', 'click', dw_mediamanager.details)
@@ -651,6 +653,7 @@ var dw_mediamanager = {
 
     init_ajax_uploader: function () {
         if (!jQuery('#mediamanager__uploader').length) return;
+        if (jQuery('.qq-upload-list').length) return;
 
         var params = dw_mediamanager.form_params(jQuery('#dw__upload'))+'&call=mediaupload';
         params = dw_mediamanager.params_toarray(params);