fix docs
[roojs1] / Roo / bootstrap / DocumentViewer.js
index 5c5bcae..6186c4a 100644 (file)
@@ -7,8 +7,8 @@
  * @class Roo.bootstrap.DocumentViewer
  * @extends Roo.bootstrap.Component
  * Bootstrap DocumentViewer class
- * @cfg {Number} width default 300
- * @cfg {Number} height default 300
+ * @cfg {Boolean} showDownload (true|false) show download button (default true)
+ * @cfg {Boolean} showTrash (true|false) show trash button (default true)
  * 
  * @constructor
  * Create a new DocumentViewer
@@ -24,15 +24,34 @@ Roo.bootstrap.DocumentViewer = function(config){
          * Fire after initEvent
          * @param {Roo.bootstrap.DocumentViewer} this
          */
-        "initial" : true
+        "initial" : true,
+        /**
+         * @event click
+         * Fire after click
+         * @param {Roo.bootstrap.DocumentViewer} this
+         */
+        "click" : true,
+        /**
+         * @event download
+         * Fire after download button
+         * @param {Roo.bootstrap.DocumentViewer} this
+         */
+        "download" : true,
+        /**
+         * @event trash
+         * Fire after trash button
+         * @param {Roo.bootstrap.DocumentViewer} this
+         */
+        "trash" : true
         
     });
 };
 
 Roo.extend(Roo.bootstrap.DocumentViewer, Roo.bootstrap.Component,  {
     
-    width : 300,
-    height : 300,
+    showDownload : true,
+    
+    showTrash : true,
     
     getAutoCreate : function()
     {
@@ -47,8 +66,12 @@ Roo.extend(Roo.bootstrap.DocumentViewer, Roo.bootstrap.Component,  {
                         {
                             tag : 'div',
                             cls : 'roo-document-viewer-thumb',
-                            style : 'width: ' + this.width + 'px; height: ' + this.height + 'px;'
-                            
+                            cn : [
+                                {
+                                    tag : 'img',
+                                    cls : 'roo-document-viewer-image'
+                                }
+                            ]
                         }
                     ]
                 },
@@ -61,11 +84,22 @@ Roo.extend(Roo.bootstrap.DocumentViewer, Roo.bootstrap.Component,  {
                         cn : [
                             {
                                 tag : 'div',
-                                cls : 'btn-group',
+                                cls : 'btn-group roo-document-viewer-download',
+                                cn : [
+                                    {
+                                        tag : 'button',
+                                        cls : 'btn btn-default',
+                                        html : '<i class="fa fa-download"></i>'
+                                    }
+                                ]
+                            },
+                            {
+                                tag : 'div',
+                                cls : 'btn-group roo-document-viewer-trash',
                                 cn : [
                                     {
                                         tag : 'button',
-                                        cls : 'btn btn-default roo-document-viewer-trash',
+                                        cls : 'btn btn-default',
                                         html : '<i class="fa fa-trash"></i>'
                                     }
                                 ]
@@ -81,37 +115,70 @@ Roo.extend(Roo.bootstrap.DocumentViewer, Roo.bootstrap.Component,  {
     
     initEvents : function()
     {
-        
         this.bodyEl = this.el.select('.roo-document-viewer-body', true).first();
-        this.bodyEl.setVisibilityMode(Roo.Element.DISPLAY).originalDisplay = 'block';
-        
-        this.previewEl = this.el.select('.roo-document-viewer-preview', true).first();
-        this.previewEl.setVisibilityMode(Roo.Element.DISPLAY).originalDisplay = 'block';
+        this.bodyEl.setVisibilityMode(Roo.Element.DISPLAY);
         
         this.thumbEl = this.el.select('.roo-document-viewer-thumb', true).first();
-        this.thumbEl.setVisibilityMode(Roo.Element.DISPLAY).originalDisplay = 'block';
+        this.thumbEl.setVisibilityMode(Roo.Element.DISPLAY);
+        
+        this.imageEl = this.el.select('.roo-document-viewer-image', true).first();
+        this.imageEl.setVisibilityMode(Roo.Element.DISPLAY);
         
         this.footerEl = this.el.select('.roo-document-viewer-footer', true).first();
-        this.footerEl.setVisibilityMode(Roo.Element.DISPLAY).originalDisplay = 'block';
+        this.footerEl.setVisibilityMode(Roo.Element.DISPLAY);
+        
+        this.downloadBtn = this.el.select('.roo-document-viewer-download', true).first();
+        this.downloadBtn.setVisibilityMode(Roo.Element.DISPLAY);
         
         this.trashBtn = this.el.select('.roo-document-viewer-trash', true).first();
-        this.trashBtn.setVisibilityMode(Roo.Element.DISPLAY).originalDisplay = 'block';
+        this.trashBtn.setVisibilityMode(Roo.Element.DISPLAY);
         
         this.bodyEl.on('click', this.onClick, this);
-        
+        this.downloadBtn.on('click', this.onDownload, this);
         this.trashBtn.on('click', this.onTrash, this);
         
+        this.downloadBtn.hide();
+        this.trashBtn.hide();
+        
+        if(this.showDownload){
+            this.downloadBtn.show();
+        }
+        
+        if(this.showTrash){
+            this.trashBtn.show();
+        }
+        
+        if(!this.showDownload && !this.showTrash) {
+            this.footerEl.hide();
+        }
+        
+    },
+    
+    initial : function()
+    {
         this.fireEvent('initial', this);
+        
+    },
+    
+    onClick : function(e)
+    {
+        e.preventDefault();
+        
+        this.fireEvent('click', this);
     },
     
-    onClick : function()
+    onDownload : function(e)
     {
+        e.preventDefault();
         
+        this.fireEvent('download', this);
     },
     
-    onTrash : function()
+    onTrash : function(e)
     {
+        e.preventDefault();
         
+        this.fireEvent('trash', this);
     }
     
 });