Variation de l'opacité pour indiquer l'état d'avancement.

[ckeditor.git] / skins / ckeditor / plugins / plinn_image / plugin.js

diff --git a/skins/ckeditor/plugins/plinn_image/plugin.js b/skins/ckeditor/plugins/plinn_image/plugin.js
index 149de7f..631f9fa 100644 (file)
--- a/skins/ckeditor/plugins/plinn_image/plugin.js
+++ b/skins/ckeditor/plugins/plinn_image/plugin.js
@@ -18,13 +18,13 @@ var PlinnCKDDUploader = function(editor) {
 
 // Drag and drop
 PlinnCKDDUploader.prototype.dragenter = function(e) {
-       evt = e.data.$;
+       var evt = e.data.$;
        disableDefault(evt);
        disablePropagation(evt);
 };
 
 PlinnCKDDUploader.prototype.dragover = function(e) {
-       evt = e.data.$;
+       var evt = e.data.$;
        disableDefault(evt);
        disablePropagation(evt);
        evt = getEventObject(evt);
@@ -33,7 +33,7 @@ PlinnCKDDUploader.prototype.dragover = function(e) {
 };
 
 PlinnCKDDUploader.prototype.drop = function(e) {
-       evt = e.data.$;
+       var evt = e.data.$;
        disableDefault(evt);
        disablePropagation(evt);
        getEventObject(evt);
@@ -46,14 +46,16 @@ PlinnCKDDUploader.prototype.createFileProxy = function(file) {
        var container = new CKEDITOR.dom.element('span');
        var rel = CKEDITOR.dom.element.createFromHtml('<span style="position:relative"/>');
        container.append(rel);
-       var progressBar = CKEDITOR.dom.element.createFromHtml('<span style="display:block; position:absolute; background:#ef8e32; height:4px; border-radius:2px; width:0"/>')
+       var progressBar = CKEDITOR.dom.element.createFromHtml(
+               '<span style="display:block; position:absolute; background:#ef8e32; height:4px; border-radius:2px; width:0; left:0; top:1em"/>');
        rel.append(progressBar);
        var link = new CKEDITOR.dom.element('a');
        link.setAttribute('href', '#');
+       link.setStyle('opacity', 0.2);
        link.appendText(file.name);
        container.append(link);
 
-       var proxy = new Object();
+       var proxy = {};
        proxy.file = file;
        proxy.container = container;
        proxy.progressBar = progressBar;
@@ -72,6 +74,7 @@ PlinnCKDDUploader.prototype.handleFiles = function(files) {
                else {
                        proxy = this.createFileProxy(file);
                        this.editor.insertElement(proxy.container);
+                       this.editor.insertText(' ');
                        this.uploadQueuePush(proxy);
                }
        }
@@ -136,6 +139,8 @@ PlinnCKDDUploader.prototype.progressHandlerCB = function(progress) {
        var size = this.progressBarMaxSize * progress;
        size = Math.round(size);
        this.progressBar.setStyle('width', String(size) + 'px');
+       var currentOpacity = this.uploadedItem.link.getStyle('opacity');
+       this.uploadedItem.link.setStyle('opacity', Math.max(currentOpacity, progress));
 };
 
 PlinnCKDDUploader.prototype.progressHandler = function(evt) {
@@ -173,13 +178,13 @@ var reSize = /getResizedImage\?size=(\d+)_(\d+)$/;
 function updateImageSizeUrlParameters(img) {
        if (reSize.test(img.src)){
                var matches = reSize.exec(img.src);
-               var srcWidth = parseInt(matches[1]);
-               var srcHeight = parseInt(matches[2]);
+               var srcWidth = parseInt(matches[1], 10);
+               var srcHeight = parseInt(matches[2], 10);
        
-               var imgWidth = parseInt((img.style.width) ? img.style.width : img.width);
-               var imgHeight = parseInt((img.style.height) ? img.style.height : img.height);
+               var imgWidth = parseInt((img.style.width) ? img.style.width : img.width, 10);
+               var imgHeight = parseInt((img.style.height) ? img.style.height : img.height, 10);
        
-               if ((imgWidth && imgHeight) && srcWidth != imgWidth && srcHeight != imgHeight) {
+               if ((imgWidth && imgHeight) && srcWidth !== imgWidth && srcHeight !== imgHeight) {
                        var newUrl = img.getAttribute('src', 2).replace(reSize, 'getResizedImage?size=' + imgWidth + '_' + imgHeight);
                        img.width = imgWidth;
                        img.height = imgHeight;
@@ -197,7 +202,7 @@ function openPlinnImageDialog(path, editor) {
                //",left=" + iLeft ;
        
        var win = open(path + 'dialog/plinn_image.html', 'PlinnImageDialog', winOptions);
-       win.dialogArguments = new Object();
+       win.dialogArguments = {};
        win.dialogArguments.editor = editor;
        win.dialogArguments.pluginPath = path;
        win.dialogArguments.CKEDITOR = CKEDITOR;
@@ -217,8 +222,9 @@ CKEDITOR.plugins.add( 'plinn_image',
                                        var tmpDiv = document.createElement('div');
                                        tmpDiv.innerHTML = evt.data.dataValue;
                                        var images = tmpDiv.getElementsByTagName('IMG');
-                                       for (var i = 0 ; i < images.length ; i++)
-                                               updateImageSizeUrlParameters(images[i]);
+                                       var i;
+                                       for (i = 0 ; i < images.length ; i++) {
+                                               updateImageSizeUrlParameters(images[i]);}
                                        evt.data.dataValue = tmpDiv.innerHTML;
                                }
                        );
@@ -248,4 +254,4 @@ CKEDITOR.plugins.add( 'plinn_image',
        
 });
 
-})();
+}());