Roo/bootstrap/DocumentManager.js
[roojs1] / Roo / bootstrap / DocumentManager.js
index 404cc7f..2032bd1 100644 (file)
@@ -238,7 +238,7 @@ Roo.extend(Roo.bootstrap.DocumentManager, Roo.bootstrap.Component,  {
         this.progress = new Roo.bootstrap.Progress({
             cls : 'roo-document-manager-progress',
             active : true,
-            striped : true,
+            striped : true
         });
         
         this.progress.render(this.progressDialog.getChildContainer());
@@ -546,26 +546,13 @@ Roo.extend(Roo.bootstrap.DocumentManager, Roo.bootstrap.Component,  {
     
     renderPreview : function(file)
     {
-        var _this = this;
-        
-        var imageEl = document.createElement('img');
-            
-        var _this = this;
-
-        imageEl.addEventListener("load", function(){ return _this.drawPreview(imageEl); });
-
-        this.imageEl.src = baseURL +'/Images/Thumb/' + this.thumbSize + '/' + file.id + '/' + file.filename;
-        
-    },
-    
-    drawPreview : function(imageEl)
-    {
-        var width = this.imageEl.naturalWidth || this.imageEl.width;
-        var height = this.imageEl.naturalHeight || this.imageEl.height;
+        if(typeof(file.target) != 'undefined' && file.target){
+            return file;
+        }
         
-        var preview = {
+        var previewEl = this.managerEl.createChild({
             tag : 'div',
-            cls : 'roo-document-manager-preview tall',
+            cls : 'roo-document-manager-preview',
             cn : [
                 {
                     tag : 'div',
@@ -576,32 +563,10 @@ Roo.extend(Roo.bootstrap.DocumentManager, Roo.bootstrap.Component,  {
                 {
                     tag : 'button',
                     cls : 'close',
-                    html : 'x'
+                    html : '<i class="fa fa-times-circle"></i>'
                 }
             ]
-        }
-        
-        if(width > height){
-            preview = {
-                tag : 'div',
-                cls : 'roo-document-manager-preview wide',
-                cn : [
-                    {
-                        tag : 'div',
-                        tooltip : file.filename,
-                        cls : 'roo-document-manager-thumb',
-                        html : '<img src="' + baseURL +'/Images/Thumb/' + this.thumbSize + '/' + file.id + '/' + file.filename + '">'
-                    },
-                    {
-                        tag : 'button',
-                        cls : 'close',
-                        html : 'x'
-                    }
-                ]
-            }
-        }
-        
-        var previewEl = this.managerEl.createChild(preview);
+        });
 
         var close = previewEl.select('button.close', true).first();
 
@@ -611,11 +576,32 @@ Roo.extend(Roo.bootstrap.DocumentManager, Roo.bootstrap.Component,  {
 
         var image = previewEl.select('img', true).first();
         
-//        image.dom.addEventListener("load", function(){ _this.onPreviewLoad(image); });
+        var _this = this;
+        
+        image.dom.addEventListener("load", function(){ _this.onPreviewLoad(file, image); });
         
         image.on('click', this.onClick, this, file);
         
         return file;
         
+    },
+    
+    onPreviewLoad : function(file, image)
+    {
+        if(typeof(file.target) == 'undefined' || !file.target){
+            return;
+        }
+        
+        var width = image.dom.naturalWidth || image.dom.width;
+        var height = image.dom.naturalHeight || image.dom.height;
+        
+        if(width > height){
+            file.target.addClass('wide');
+            return;
+        }
+        
+        file.target.addClass('tall');
+        return;
+        
     }
 });