git.roojs.org Git - roojs1/blob - docs/src/Roo_bootstrap_DocumentManager.js.html

   1 <html><head><title>/home/edward/gitlive/roojs1/Roo/bootstrap/DocumentManager.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty">
   2 <span class="jsdoc-comment">/*
   3 * Licence: LGPL
   4 */
   5
   6 /**
   7  * @class Roo.bootstrap.DocumentManager
   8  * @extends Roo.bootstrap.Component
   9  * Bootstrap DocumentManager class
  10  * @cfg {String} paramName default 'imageUpload'
  11  * @cfg {String} toolTipName default 'filename'
  12  * @cfg {String} method default POST
  13  * @cfg {String} url action url
  14  * @cfg {Number} boxes number of boxes, 0 is no limit.. default 0
  15  * @cfg {Boolean} multiple multiple upload default true
  16  * @cfg {Number} thumbSize default 300
  17  * @cfg {String} fieldLabel
  18  * @cfg {Number} labelWidth default 4
  19  * @cfg {String} labelAlign (left|top) default left
  20  * @cfg {Boolean} editable (true|false) allow edit when upload a image default true
  21 * @cfg {Number} labellg set the width of label (1-12)
  22  * @cfg {Number} labelmd set the width of label (1-12)
  23  * @cfg {Number} labelsm set the width of label (1-12)
  24  * @cfg {Number} labelxs set the width of label (1-12)
  25  *
  26  * @constructor
  27  * Create a new DocumentManager
  28  * @param {Object} config The config object
  29  */
  30
  31 </span><span class="jsdoc-var">Roo.bootstrap.DocumentManager </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
  32     </span><span class="jsdoc-var">Roo.bootstrap.DocumentManager.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
  33
  34     </span><span class="jsdoc-var">this.files </span><span class="jsdoc-syntax">= [];
  35     </span><span class="jsdoc-var">this.delegates </span><span class="jsdoc-syntax">= [];
  36
  37     </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
  38         </span><span class="jsdoc-comment">/**
  39          * @event initial
  40          * Fire when initial the DocumentManager
  41          * @param {Roo.bootstrap.DocumentManager} this
  42          */
  43         </span><span class="jsdoc-string">&quot;initial&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  44         </span><span class="jsdoc-comment">/**
  45          * @event inspect
  46          * inspect selected file
  47          * @param {Roo.bootstrap.DocumentManager} this
  48          * @param {File} file
  49          */
  50         </span><span class="jsdoc-string">&quot;inspect&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  51         </span><span class="jsdoc-comment">/**
  52          * @event exception
  53          * Fire when xhr load exception
  54          * @param {Roo.bootstrap.DocumentManager} this
  55          * @param {XMLHttpRequest} xhr
  56          */
  57         </span><span class="jsdoc-string">&quot;exception&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  58         </span><span class="jsdoc-comment">/**
  59          * @event afterupload
  60          * Fire when xhr load exception
  61          * @param {Roo.bootstrap.DocumentManager} this
  62          * @param {XMLHttpRequest} xhr
  63          */
  64         </span><span class="jsdoc-string">&quot;afterupload&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  65         </span><span class="jsdoc-comment">/**
  66          * @event prepare
  67          * prepare the form data
  68          * @param {Roo.bootstrap.DocumentManager} this
  69          * @param {Object} formData
  70          */
  71         </span><span class="jsdoc-string">&quot;prepare&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  72         </span><span class="jsdoc-comment">/**
  73          * @event remove
  74          * Fire when remove the file
  75          * @param {Roo.bootstrap.DocumentManager} this
  76          * @param {Object} file
  77          */
  78         </span><span class="jsdoc-string">&quot;remove&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  79         </span><span class="jsdoc-comment">/**
  80          * @event refresh
  81          * Fire after refresh the file
  82          * @param {Roo.bootstrap.DocumentManager} this
  83          */
  84         </span><span class="jsdoc-string">&quot;refresh&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  85         </span><span class="jsdoc-comment">/**
  86          * @event click
  87          * Fire after click the image
  88          * @param {Roo.bootstrap.DocumentManager} this
  89          * @param {Object} file
  90          */
  91         </span><span class="jsdoc-string">&quot;click&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  92         </span><span class="jsdoc-comment">/**
  93          * @event edit
  94          * Fire when upload a image and editable set to true
  95          * @param {Roo.bootstrap.DocumentManager} this
  96          * @param {Object} file
  97          */
  98         </span><span class="jsdoc-string">&quot;edit&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  99         </span><span class="jsdoc-comment">/**
 100          * @event beforeselectfile
 101          * Fire before select file
 102          * @param {Roo.bootstrap.DocumentManager} this
 103          */
 104         </span><span class="jsdoc-string">&quot;beforeselectfile&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 105         </span><span class="jsdoc-comment">/**
 106          * @event process
 107          * Fire before process file
 108          * @param {Roo.bootstrap.DocumentManager} this
 109          * @param {Object} file
 110          */
 111         </span><span class="jsdoc-string">&quot;process&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 112         </span><span class="jsdoc-comment">/**
 113          * @event previewrendered
 114          * Fire when preview rendered
 115          * @param {Roo.bootstrap.DocumentManager} this
 116          * @param {Object} file
 117          */
 118         </span><span class="jsdoc-string">&quot;previewrendered&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 119         </span><span class="jsdoc-comment">/**
 120          */
 121         </span><span class="jsdoc-string">&quot;previewResize&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
 122
 123     </span><span class="jsdoc-syntax">});
 124 };
 125
 126 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.DocumentManager</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Component</span><span class="jsdoc-syntax">,  {
 127
 128     </span><span class="jsdoc-var">boxes </span><span class="jsdoc-syntax">: 0,
 129     </span><span class="jsdoc-var">inputName </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
 130     </span><span class="jsdoc-var">thumbSize </span><span class="jsdoc-syntax">: 300,
 131     </span><span class="jsdoc-var">multiple </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 132     </span><span class="jsdoc-var">files </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 133     </span><span class="jsdoc-var">method </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'POST'</span><span class="jsdoc-syntax">,
 134     </span><span class="jsdoc-var">url </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
 135     </span><span class="jsdoc-var">paramName </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'imageUpload'</span><span class="jsdoc-syntax">,
 136     </span><span class="jsdoc-var">toolTipName </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'filename'</span><span class="jsdoc-syntax">,
 137     </span><span class="jsdoc-var">fieldLabel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
 138     </span><span class="jsdoc-var">labelWidth </span><span class="jsdoc-syntax">: 4,
 139     </span><span class="jsdoc-var">labelAlign </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">,
 140     </span><span class="jsdoc-var">editable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 141     </span><span class="jsdoc-var">delegates </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 142     </span><span class="jsdoc-var">xhr </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 143
 144     </span><span class="jsdoc-var">labellg </span><span class="jsdoc-syntax">: 0,
 145     </span><span class="jsdoc-var">labelmd </span><span class="jsdoc-syntax">: 0,
 146     </span><span class="jsdoc-var">labelsm </span><span class="jsdoc-syntax">: 0,
 147     </span><span class="jsdoc-var">labelxs </span><span class="jsdoc-syntax">: 0,
 148
 149     </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 150     {
 151         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">managerWidget </span><span class="jsdoc-syntax">= {
 152             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 153             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-document-manager'</span><span class="jsdoc-syntax">,
 154             </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
 155                 {
 156                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'input'</span><span class="jsdoc-syntax">,
 157                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-document-manager-selector'</span><span class="jsdoc-syntax">,
 158                     </span><span class="jsdoc-var">type </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'file'
 159                 </span><span class="jsdoc-syntax">},
 160                 {
 161                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 162                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-document-manager-uploader'</span><span class="jsdoc-syntax">,
 163                     </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
 164                         {
 165                             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 166                             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-document-manager-upload-btn'</span><span class="jsdoc-syntax">,
 167                             </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;i class=&quot;fa fa-plus&quot;&gt;&lt;/i&gt;'
 168                         </span><span class="jsdoc-syntax">}
 169                     ]
 170
 171                 }
 172             ]
 173         };
 174
 175         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">content </span><span class="jsdoc-syntax">= [
 176             {
 177                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 178                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'column col-md-12'</span><span class="jsdoc-syntax">,
 179                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">managerWidget
 180             </span><span class="jsdoc-syntax">}
 181         ];
 182
 183         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fieldLabel.length</span><span class="jsdoc-syntax">){
 184
 185             </span><span class="jsdoc-var">content </span><span class="jsdoc-syntax">= [
 186                 {
 187                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 188                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'column col-md-12'</span><span class="jsdoc-syntax">,
 189                     </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.fieldLabel
 190                 </span><span class="jsdoc-syntax">},
 191                 {
 192                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 193                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'column col-md-12'</span><span class="jsdoc-syntax">,
 194                     </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">managerWidget
 195                 </span><span class="jsdoc-syntax">}
 196             ];
 197
 198             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.labelAlign </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">){
 199                 </span><span class="jsdoc-var">content </span><span class="jsdoc-syntax">= [
 200                     {
 201                         </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 202                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'column'</span><span class="jsdoc-syntax">,
 203                         </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.fieldLabel
 204                     </span><span class="jsdoc-syntax">},
 205                     {
 206                         </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 207                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'column'</span><span class="jsdoc-syntax">,
 208                         </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">managerWidget
 209                     </span><span class="jsdoc-syntax">}
 210                 ];
 211
 212                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.labelWidth </span><span class="jsdoc-syntax">&gt; 12){
 213                     </span><span class="jsdoc-var">content</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.style </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;width: &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.labelWidth </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'px'</span><span class="jsdoc-syntax">;
 214                 }
 215
 216                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.labelWidth </span><span class="jsdoc-syntax">&lt; 13 &amp;&amp; </span><span class="jsdoc-var">this.labelmd </span><span class="jsdoc-syntax">== 0){
 217                     </span><span class="jsdoc-var">this.labelmd </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.labelWidth</span><span class="jsdoc-syntax">;
 218                 }
 219
 220                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.labellg </span><span class="jsdoc-syntax">&gt; 0){
 221                     </span><span class="jsdoc-var">content</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-lg-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.labellg</span><span class="jsdoc-syntax">;
 222                     </span><span class="jsdoc-var">content</span><span class="jsdoc-syntax">[1]</span><span class="jsdoc-var">.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-lg-' </span><span class="jsdoc-syntax">+ (12 - </span><span class="jsdoc-var">this.labellg</span><span class="jsdoc-syntax">);
 223                 }
 224
 225                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.labelmd </span><span class="jsdoc-syntax">&gt; 0){
 226                     </span><span class="jsdoc-var">content</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-md-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.labelmd</span><span class="jsdoc-syntax">;
 227                     </span><span class="jsdoc-var">content</span><span class="jsdoc-syntax">[1]</span><span class="jsdoc-var">.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-md-' </span><span class="jsdoc-syntax">+ (12 - </span><span class="jsdoc-var">this.labelmd</span><span class="jsdoc-syntax">);
 228                 }
 229
 230                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.labelsm </span><span class="jsdoc-syntax">&gt; 0){
 231                     </span><span class="jsdoc-var">content</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-sm-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.labelsm</span><span class="jsdoc-syntax">;
 232                     </span><span class="jsdoc-var">content</span><span class="jsdoc-syntax">[1]</span><span class="jsdoc-var">.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-sm-' </span><span class="jsdoc-syntax">+ (12 - </span><span class="jsdoc-var">this.labelsm</span><span class="jsdoc-syntax">);
 233                 }
 234
 235                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.labelxs </span><span class="jsdoc-syntax">&gt; 0){
 236                     </span><span class="jsdoc-var">content</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-xs-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.labelxs</span><span class="jsdoc-syntax">;
 237                     </span><span class="jsdoc-var">content</span><span class="jsdoc-syntax">[1]</span><span class="jsdoc-var">.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-xs-' </span><span class="jsdoc-syntax">+ (12 - </span><span class="jsdoc-var">this.labelxs</span><span class="jsdoc-syntax">);
 238                 }
 239
 240             }
 241         }
 242
 243         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= {
 244             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 245             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'row clearfix'</span><span class="jsdoc-syntax">,
 246             </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">content
 247         </span><span class="jsdoc-syntax">};
 248
 249         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
 250
 251     },
 252
 253     </span><span class="jsdoc-var">initEvents </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 254     {
 255         </span><span class="jsdoc-var">this.managerEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-document-manager'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
 256         </span><span class="jsdoc-var">this.managerEl.setVisibilityMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.Element.DISPLAY</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.originalDisplay </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'block'</span><span class="jsdoc-syntax">;
 257
 258         </span><span class="jsdoc-var">this.selectorEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-document-manager-selector'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
 259         </span><span class="jsdoc-var">this.selectorEl.hide</span><span class="jsdoc-syntax">();
 260
 261         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.multiple</span><span class="jsdoc-syntax">){
 262             </span><span class="jsdoc-var">this.selectorEl.attr</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'multiple'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'multiple'</span><span class="jsdoc-syntax">);
 263         }
 264
 265         </span><span class="jsdoc-var">this.selectorEl.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'change'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onFileSelected</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 266
 267         </span><span class="jsdoc-var">this.uploader </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-document-manager-uploader'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
 268         </span><span class="jsdoc-var">this.uploader.setVisibilityMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.Element.DISPLAY</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.originalDisplay </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'block'</span><span class="jsdoc-syntax">;
 269
 270         </span><span class="jsdoc-var">this.uploader.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onUploaderClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 271
 272         </span><span class="jsdoc-var">this.renderProgressDialog</span><span class="jsdoc-syntax">();
 273
 274         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 275
 276         </span><span class="jsdoc-var">window.addEventListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;resize&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() { </span><span class="jsdoc-var">_this.refresh</span><span class="jsdoc-syntax">(); } );
 277
 278         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'initial'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 279     },
 280
 281     </span><span class="jsdoc-var">renderProgressDialog </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 282     {
 283         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 284
 285         </span><span class="jsdoc-var">this.progressDialog </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.bootstrap.Modal</span><span class="jsdoc-syntax">({
 286             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-document-manager-progress-dialog'</span><span class="jsdoc-syntax">,
 287             </span><span class="jsdoc-var">allow_close </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 288             </span><span class="jsdoc-var">animate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 289             </span><span class="jsdoc-var">title </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
 290             </span><span class="jsdoc-var">buttons </span><span class="jsdoc-syntax">: [
 291                 {
 292                     </span><span class="jsdoc-var">name  </span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'cancel'</span><span class="jsdoc-syntax">,
 293                     </span><span class="jsdoc-var">weight </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'danger'</span><span class="jsdoc-syntax">,
 294                     </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Cancel'
 295                 </span><span class="jsdoc-syntax">}
 296             ],
 297             </span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {
 298                 </span><span class="jsdoc-var">btnclick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
 299                     </span><span class="jsdoc-var">_this.uploadCancel</span><span class="jsdoc-syntax">();
 300                     </span><span class="jsdoc-var">this.hide</span><span class="jsdoc-syntax">();
 301                 }
 302             }
 303         });
 304
 305         </span><span class="jsdoc-var">this.progressDialog.render</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">));
 306
 307         </span><span class="jsdoc-var">this.progress </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.bootstrap.Progress</span><span class="jsdoc-syntax">({
 308             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-document-manager-progress'</span><span class="jsdoc-syntax">,
 309             </span><span class="jsdoc-var">active </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 310             </span><span class="jsdoc-var">striped </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
 311         </span><span class="jsdoc-syntax">});
 312
 313         </span><span class="jsdoc-var">this.progress.render</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.progressDialog.getChildContainer</span><span class="jsdoc-syntax">());
 314
 315         </span><span class="jsdoc-var">this.progressBar </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.bootstrap.ProgressBar</span><span class="jsdoc-syntax">({
 316             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-document-manager-progress-bar'</span><span class="jsdoc-syntax">,
 317             </span><span class="jsdoc-var">aria_valuenow </span><span class="jsdoc-syntax">: 0,
 318             </span><span class="jsdoc-var">aria_valuemin </span><span class="jsdoc-syntax">: 0,
 319             </span><span class="jsdoc-var">aria_valuemax </span><span class="jsdoc-syntax">: 12,
 320             </span><span class="jsdoc-var">panel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'success'
 321         </span><span class="jsdoc-syntax">});
 322
 323         </span><span class="jsdoc-var">this.progressBar.render</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.progress.getChildContainer</span><span class="jsdoc-syntax">());
 324     },
 325
 326     </span><span class="jsdoc-var">onUploaderClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)
 327     {
 328         </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
 329
 330         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'beforeselectfile'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
 331             </span><span class="jsdoc-var">this.selectorEl.dom.click</span><span class="jsdoc-syntax">();
 332         }
 333
 334     },
 335
 336     </span><span class="jsdoc-var">onFileSelected </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)
 337     {
 338         </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
 339
 340         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.selectorEl.dom.files</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.selectorEl.dom.files.length</span><span class="jsdoc-syntax">){
 341             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 342         }
 343
 344         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.selectorEl.dom.files</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">){
 345             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'inspect'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
 346                 </span><span class="jsdoc-var">this.files.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">);
 347             }
 348         }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 349
 350         </span><span class="jsdoc-var">this.queue</span><span class="jsdoc-syntax">();
 351
 352     },
 353
 354     </span><span class="jsdoc-var">queue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 355     {
 356         </span><span class="jsdoc-var">this.selectorEl.dom.value </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 357
 358         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.files </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.files.length</span><span class="jsdoc-syntax">){
 359             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 360         }
 361
 362         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.boxes </span><span class="jsdoc-syntax">&gt; 0 &amp;&amp; </span><span class="jsdoc-var">this.files.length </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.boxes</span><span class="jsdoc-syntax">){
 363             </span><span class="jsdoc-var">this.files </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.files.slice</span><span class="jsdoc-syntax">(0, </span><span class="jsdoc-var">this.boxes</span><span class="jsdoc-syntax">);
 364         }
 365
 366         </span><span class="jsdoc-var">this.uploader.show</span><span class="jsdoc-syntax">();
 367
 368         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.boxes </span><span class="jsdoc-syntax">&gt; 0 &amp;&amp; </span><span class="jsdoc-var">this.files.length </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.boxes </span><span class="jsdoc-syntax">- 1){
 369             </span><span class="jsdoc-var">this.uploader.hide</span><span class="jsdoc-syntax">();
 370         }
 371
 372         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 373
 374         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">files </span><span class="jsdoc-syntax">= [];
 375
 376         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">docs </span><span class="jsdoc-syntax">= [];
 377
 378         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.files</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">){
 379
 380             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file.id</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">file.id </span><span class="jsdoc-syntax">* 1 &gt; 0){
 381                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">f </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.renderPreview</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">);
 382                 </span><span class="jsdoc-var">files.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">);
 383                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 384             }
 385
 386             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file.type.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'image'</span><span class="jsdoc-syntax">) != -1){
 387                 </span><span class="jsdoc-var">this.delegates.push</span><span class="jsdoc-syntax">(
 388                     (</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 389                         </span><span class="jsdoc-var">_this.process</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">);
 390                     })</span><span class="jsdoc-var">.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">)
 391                 );
 392
 393                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 394             }
 395
 396             </span><span class="jsdoc-var">docs.push</span><span class="jsdoc-syntax">(
 397                 (</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 398                     </span><span class="jsdoc-var">_this.process</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">);
 399                 })</span><span class="jsdoc-var">.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">)
 400             );
 401
 402         }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 403
 404         </span><span class="jsdoc-var">this.files </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">files</span><span class="jsdoc-syntax">;
 405
 406         </span><span class="jsdoc-var">this.delegates </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.delegates.concat</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">docs</span><span class="jsdoc-syntax">);
 407
 408         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.delegates.length</span><span class="jsdoc-syntax">){
 409             </span><span class="jsdoc-var">this.refresh</span><span class="jsdoc-syntax">();
 410             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 411         }
 412
 413         </span><span class="jsdoc-var">this.progressBar.aria_valuemax </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.delegates.length</span><span class="jsdoc-syntax">;
 414
 415         </span><span class="jsdoc-var">this.arrange</span><span class="jsdoc-syntax">();
 416
 417         </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 418     },
 419
 420     </span><span class="jsdoc-var">arrange </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 421     {
 422         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.delegates.length</span><span class="jsdoc-syntax">){
 423             </span><span class="jsdoc-var">this.progressDialog.hide</span><span class="jsdoc-syntax">();
 424             </span><span class="jsdoc-var">this.refresh</span><span class="jsdoc-syntax">();
 425             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 426         }
 427
 428         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">delegate </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.delegates.shift</span><span class="jsdoc-syntax">();
 429
 430         </span><span class="jsdoc-var">this.progressDialog.show</span><span class="jsdoc-syntax">();
 431
 432         </span><span class="jsdoc-var">this.progressDialog.setTitle</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">this.progressBar.aria_valuemax </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.delegates.length</span><span class="jsdoc-syntax">) + </span><span class="jsdoc-string">' / ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.progressBar.aria_valuemax</span><span class="jsdoc-syntax">);
 433
 434         </span><span class="jsdoc-var">this.progressBar.update</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.progressBar.aria_valuemax </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.delegates.length</span><span class="jsdoc-syntax">);
 435
 436         </span><span class="jsdoc-var">delegate</span><span class="jsdoc-syntax">();
 437     },
 438
 439     </span><span class="jsdoc-var">refresh </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 440     {
 441         </span><span class="jsdoc-var">this.uploader.show</span><span class="jsdoc-syntax">();
 442
 443         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.boxes </span><span class="jsdoc-syntax">&gt; 0 &amp;&amp; </span><span class="jsdoc-var">this.files.length </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.boxes </span><span class="jsdoc-syntax">- 1){
 444             </span><span class="jsdoc-var">this.uploader.hide</span><span class="jsdoc-syntax">();
 445         }
 446
 447         </span><span class="jsdoc-var">Roo.isTouch </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.closable</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">this.closable</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 448
 449         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'refresh'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 450     },
 451
 452     </span><span class="jsdoc-var">onRemove </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">)
 453     {
 454         </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
 455
 456         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'remove'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">);
 457
 458     },
 459
 460     </span><span class="jsdoc-var">remove </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">)
 461     {
 462         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">files </span><span class="jsdoc-syntax">= [];
 463
 464         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.files</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">){
 465             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file.id</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">file.id </span><span class="jsdoc-syntax">* 1 &lt; 1 || </span><span class="jsdoc-var">file.id </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">o.id</span><span class="jsdoc-syntax">){
 466                 </span><span class="jsdoc-var">files.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">);
 467                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 468             }
 469
 470             </span><span class="jsdoc-var">o.target.remove</span><span class="jsdoc-syntax">();
 471
 472         }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 473
 474         </span><span class="jsdoc-var">this.files </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">files</span><span class="jsdoc-syntax">;
 475
 476         </span><span class="jsdoc-var">this.refresh</span><span class="jsdoc-syntax">();
 477     },
 478
 479     </span><span class="jsdoc-var">clear </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 480     {
 481         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.files</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">){
 482             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">file.target</span><span class="jsdoc-syntax">){
 483                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 484             }
 485
 486             </span><span class="jsdoc-var">file.target.remove</span><span class="jsdoc-syntax">();
 487
 488         }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 489
 490         </span><span class="jsdoc-var">this.files </span><span class="jsdoc-syntax">= [];
 491
 492         </span><span class="jsdoc-var">this.refresh</span><span class="jsdoc-syntax">();
 493     },
 494
 495     </span><span class="jsdoc-var">onClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">)
 496     {
 497         </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
 498
 499         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">);
 500
 501     },
 502
 503     </span><span class="jsdoc-var">closable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">closable</span><span class="jsdoc-syntax">)
 504     {
 505         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.managerEl.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-document-manager-preview &gt; button.close'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.elements</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
 506
 507             </span><span class="jsdoc-var">el.setVisibilityMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.Element.DISPLAY</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.originalDisplay </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'block'</span><span class="jsdoc-syntax">;
 508
 509             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">closable</span><span class="jsdoc-syntax">){
 510                 </span><span class="jsdoc-var">el.show</span><span class="jsdoc-syntax">();
 511                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 512             }
 513
 514             </span><span class="jsdoc-var">el.hide</span><span class="jsdoc-syntax">();
 515
 516         }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 517     },
 518
 519     </span><span class="jsdoc-var">xhrOnLoad </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xhr</span><span class="jsdoc-syntax">)
 520     {
 521         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.managerEl.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-document-manager-loading'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.elements</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
 522             </span><span class="jsdoc-var">el.remove</span><span class="jsdoc-syntax">();
 523         }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 524
 525         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xhr.readyState </span><span class="jsdoc-syntax">!== 4) {
 526             </span><span class="jsdoc-var">this.arrange</span><span class="jsdoc-syntax">();
 527             </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'exception'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">xhr</span><span class="jsdoc-syntax">);
 528             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 529         }
 530
 531         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">response </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.decode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xhr.responseText</span><span class="jsdoc-syntax">);
 532
 533         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">response.success</span><span class="jsdoc-syntax">){
 534             </span><span class="jsdoc-var">this.arrange</span><span class="jsdoc-syntax">();
 535             </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'exception'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">xhr</span><span class="jsdoc-syntax">);
 536             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 537         }
 538
 539         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">file </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.renderPreview</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">response.data</span><span class="jsdoc-syntax">);
 540
 541         </span><span class="jsdoc-var">this.files.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">);
 542
 543         </span><span class="jsdoc-var">this.arrange</span><span class="jsdoc-syntax">();
 544
 545         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'afterupload'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">xhr</span><span class="jsdoc-syntax">);
 546
 547     },
 548
 549     </span><span class="jsdoc-var">xhrOnError </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xhr</span><span class="jsdoc-syntax">)
 550     {
 551         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'xhr on error'</span><span class="jsdoc-syntax">);
 552
 553         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">response </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.decode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xhr.responseText</span><span class="jsdoc-syntax">);
 554
 555         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">response</span><span class="jsdoc-syntax">);
 556
 557         </span><span class="jsdoc-var">this.arrange</span><span class="jsdoc-syntax">();
 558     },
 559
 560     </span><span class="jsdoc-var">process </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">)
 561     {
 562         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'process'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">) !== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
 563             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.editable </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">file.type.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'image'</span><span class="jsdoc-syntax">) != -1){
 564                 </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'edit'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">);
 565                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 566             }
 567
 568             </span><span class="jsdoc-var">this.uploadStart</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
 569
 570             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 571         }
 572
 573     },
 574
 575     </span><span class="jsdoc-var">uploadStart </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">crop</span><span class="jsdoc-syntax">)
 576     {
 577         </span><span class="jsdoc-var">this.xhr </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">XMLHttpRequest</span><span class="jsdoc-syntax">();
 578
 579         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file.id</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">file.id </span><span class="jsdoc-syntax">* 1 &gt; 0){
 580             </span><span class="jsdoc-var">this.arrange</span><span class="jsdoc-syntax">();
 581             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 582         }
 583
 584         </span><span class="jsdoc-var">file.xhr </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.xhr</span><span class="jsdoc-syntax">;
 585
 586         </span><span class="jsdoc-var">this.managerEl.createChild</span><span class="jsdoc-syntax">({
 587             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 588             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-document-manager-loading'</span><span class="jsdoc-syntax">,
 589             </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
 590                 {
 591                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 592                     </span><span class="jsdoc-var">tooltip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">file.name</span><span class="jsdoc-syntax">,
 593                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-document-manager-thumb'</span><span class="jsdoc-syntax">,
 594                     </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;i class=&quot;fa fa-circle-o-notch fa-spin&quot;&gt;&lt;/i&gt;'
 595                 </span><span class="jsdoc-syntax">}
 596             ]
 597
 598         });
 599
 600         </span><span class="jsdoc-var">this.xhr.open</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.method</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.url</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 601
 602         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">headers </span><span class="jsdoc-syntax">= {
 603             </span><span class="jsdoc-string">&quot;Accept&quot;</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;application/json&quot;</span><span class="jsdoc-syntax">,
 604             </span><span class="jsdoc-string">&quot;Cache-Control&quot;</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;no-cache&quot;</span><span class="jsdoc-syntax">,
 605             </span><span class="jsdoc-string">&quot;X-Requested-With&quot;</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;XMLHttpRequest&quot;
 606         </span><span class="jsdoc-syntax">};
 607
 608         </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">headerName </span><span class="jsdoc-keyword">in </span><span class="jsdoc-var">headers</span><span class="jsdoc-syntax">) {
 609             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">headerValue </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">headers</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">headerName</span><span class="jsdoc-syntax">];
 610             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">headerValue</span><span class="jsdoc-syntax">) {
 611                 </span><span class="jsdoc-var">this.xhr.setRequestHeader</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">headerName</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">headerValue</span><span class="jsdoc-syntax">);
 612             }
 613         }
 614
 615         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 616
 617         </span><span class="jsdoc-var">this.xhr.onload </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 618         {
 619             </span><span class="jsdoc-var">_this.xhrOnLoad</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">_this.xhr</span><span class="jsdoc-syntax">);
 620         }
 621
 622         </span><span class="jsdoc-var">this.xhr.onerror </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 623         {
 624             </span><span class="jsdoc-var">_this.xhrOnError</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">_this.xhr</span><span class="jsdoc-syntax">);
 625         }
 626
 627         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">formData </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">FormData</span><span class="jsdoc-syntax">();
 628
 629         </span><span class="jsdoc-var">formData.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'returnHTML'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'NO'</span><span class="jsdoc-syntax">);
 630
 631         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">crop</span><span class="jsdoc-syntax">){
 632             </span><span class="jsdoc-var">formData.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'crop'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">crop</span><span class="jsdoc-syntax">);
 633         }
 634
 635         </span><span class="jsdoc-var">formData.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.paramName</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">file.name</span><span class="jsdoc-syntax">);
 636
 637         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">options </span><span class="jsdoc-syntax">= {
 638             </span><span class="jsdoc-var">file </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">,
 639             </span><span class="jsdoc-var">manually </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false
 640         </span><span class="jsdoc-syntax">};
 641
 642         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'prepare'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">formData</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">options</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
 643
 644             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">options.manually</span><span class="jsdoc-syntax">){
 645                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 646             }
 647
 648             </span><span class="jsdoc-var">this.xhr.send</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">formData</span><span class="jsdoc-syntax">);
 649             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 650         };
 651
 652         </span><span class="jsdoc-var">this.uploadCancel</span><span class="jsdoc-syntax">();
 653     },
 654
 655     </span><span class="jsdoc-var">uploadCancel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 656     {
 657         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.xhr</span><span class="jsdoc-syntax">) {
 658             </span><span class="jsdoc-var">this.xhr.abort</span><span class="jsdoc-syntax">();
 659         }
 660
 661         </span><span class="jsdoc-var">this.delegates </span><span class="jsdoc-syntax">= [];
 662
 663         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.managerEl.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-document-manager-loading'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.elements</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
 664             </span><span class="jsdoc-var">el.remove</span><span class="jsdoc-syntax">();
 665         }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 666
 667         </span><span class="jsdoc-var">this.arrange</span><span class="jsdoc-syntax">();
 668     },
 669
 670     </span><span class="jsdoc-var">renderPreview </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">)
 671     {
 672         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file.target</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">file.target</span><span class="jsdoc-syntax">){
 673             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">;
 674         }
 675
 676         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">img_src </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">encodeURI</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">baseURL </span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">'/Images/Thumb/' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.thumbSize </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'/' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">file.id </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'/' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">file.filename</span><span class="jsdoc-syntax">);
 677
 678         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">previewEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.managerEl.createChild</span><span class="jsdoc-syntax">({
 679             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 680             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-document-manager-preview'</span><span class="jsdoc-syntax">,
 681             </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
 682                 {
 683                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 684                     </span><span class="jsdoc-var">tooltip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.toolTipName</span><span class="jsdoc-syntax">],
 685                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-document-manager-thumb'</span><span class="jsdoc-syntax">,
 686                     </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;img tooltip=&quot;' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.toolTipName</span><span class="jsdoc-syntax">] + </span><span class="jsdoc-string">'&quot; src=&quot;' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">img_src </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'&quot;&gt;'
 687                 </span><span class="jsdoc-syntax">},
 688                 {
 689                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
 690                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'close'</span><span class="jsdoc-syntax">,
 691                     </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;i class=&quot;fa fa-times-circle&quot;&gt;&lt;/i&gt;'
 692                 </span><span class="jsdoc-syntax">}
 693             ]
 694         });
 695
 696         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">close </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">previewEl.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'button.close'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
 697
 698         </span><span class="jsdoc-var">close.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onRemove</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">);
 699
 700         </span><span class="jsdoc-var">file.target </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">previewEl</span><span class="jsdoc-syntax">;
 701
 702         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">image </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">previewEl.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'img'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
 703
 704         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 705
 706         </span><span class="jsdoc-var">image.dom.addEventListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;load&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){ </span><span class="jsdoc-var">_this.onPreviewLoad</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">image</span><span class="jsdoc-syntax">); });
 707
 708         </span><span class="jsdoc-var">image.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">);
 709
 710         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'previewrendered'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">);
 711
 712         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">;
 713
 714     },
 715
 716     </span><span class="jsdoc-var">onPreviewLoad </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">image</span><span class="jsdoc-syntax">)
 717     {
 718         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file.target</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">file.target</span><span class="jsdoc-syntax">){
 719             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 720         }
 721
 722         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">image.dom.naturalWidth </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">image.dom.width</span><span class="jsdoc-syntax">;
 723         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">image.dom.naturalHeight </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">image.dom.height</span><span class="jsdoc-syntax">;
 724
 725         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.previewResize</span><span class="jsdoc-syntax">) {
 726             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 727         }
 728
 729         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">){
 730             </span><span class="jsdoc-var">file.target.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'wide'</span><span class="jsdoc-syntax">);
 731             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 732         }
 733
 734         </span><span class="jsdoc-var">file.target.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'tall'</span><span class="jsdoc-syntax">);
 735         </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 736
 737     },
 738
 739     </span><span class="jsdoc-var">uploadFromSource </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">crop</span><span class="jsdoc-syntax">)
 740     {
 741         </span><span class="jsdoc-var">this.xhr </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">XMLHttpRequest</span><span class="jsdoc-syntax">();
 742
 743         </span><span class="jsdoc-var">this.managerEl.createChild</span><span class="jsdoc-syntax">({
 744             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 745             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-document-manager-loading'</span><span class="jsdoc-syntax">,
 746             </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
 747                 {
 748                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 749                     </span><span class="jsdoc-var">tooltip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">file.name</span><span class="jsdoc-syntax">,
 750                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-document-manager-thumb'</span><span class="jsdoc-syntax">,
 751                     </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;i class=&quot;fa fa-circle-o-notch fa-spin&quot;&gt;&lt;/i&gt;'
 752                 </span><span class="jsdoc-syntax">}
 753             ]
 754
 755         });
 756
 757         </span><span class="jsdoc-var">this.xhr.open</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.method</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.url</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 758
 759         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">headers </span><span class="jsdoc-syntax">= {
 760             </span><span class="jsdoc-string">&quot;Accept&quot;</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;application/json&quot;</span><span class="jsdoc-syntax">,
 761             </span><span class="jsdoc-string">&quot;Cache-Control&quot;</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;no-cache&quot;</span><span class="jsdoc-syntax">,
 762             </span><span class="jsdoc-string">&quot;X-Requested-With&quot;</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;XMLHttpRequest&quot;
 763         </span><span class="jsdoc-syntax">};
 764
 765         </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">headerName </span><span class="jsdoc-keyword">in </span><span class="jsdoc-var">headers</span><span class="jsdoc-syntax">) {
 766             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">headerValue </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">headers</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">headerName</span><span class="jsdoc-syntax">];
 767             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">headerValue</span><span class="jsdoc-syntax">) {
 768                 </span><span class="jsdoc-var">this.xhr.setRequestHeader</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">headerName</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">headerValue</span><span class="jsdoc-syntax">);
 769             }
 770         }
 771
 772         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 773
 774         </span><span class="jsdoc-var">this.xhr.onload </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 775         {
 776             </span><span class="jsdoc-var">_this.xhrOnLoad</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">_this.xhr</span><span class="jsdoc-syntax">);
 777         }
 778
 779         </span><span class="jsdoc-var">this.xhr.onerror </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 780         {
 781             </span><span class="jsdoc-var">_this.xhrOnError</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">_this.xhr</span><span class="jsdoc-syntax">);
 782         }
 783
 784         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">formData </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">FormData</span><span class="jsdoc-syntax">();
 785
 786         </span><span class="jsdoc-var">formData.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'returnHTML'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'NO'</span><span class="jsdoc-syntax">);
 787
 788         </span><span class="jsdoc-var">formData.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'crop'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">crop</span><span class="jsdoc-syntax">);
 789
 790         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file.filename</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">){
 791             </span><span class="jsdoc-var">formData.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'filename'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">file.filename</span><span class="jsdoc-syntax">);
 792         }
 793
 794         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file.mimetype</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">){
 795             </span><span class="jsdoc-var">formData.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'mimetype'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">file.mimetype</span><span class="jsdoc-syntax">);
 796         }
 797
 798         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">formData</span><span class="jsdoc-syntax">);
 799
 800         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'prepare'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">formData</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
 801             </span><span class="jsdoc-var">this.xhr.send</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">formData</span><span class="jsdoc-syntax">);
 802         };
 803     }
 804 });
 805 </span></code></body></html>