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

   1 <html><head><title>../roojs1/Roo/bootstrap/UploadCropbox.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.UploadCropbox
   8  * @extends Roo.bootstrap.Component
   9  * Bootstrap UploadCropbox class
  10  * @cfg {String} emptyText show when image has been loaded
  11  * @cfg {String} rotateNotify show when image too small to rotate
  12  * @cfg {Number} errorTimeout default 3000
  13  * @cfg {Number} minWidth default 300
  14  * @cfg {Number} minHeight default 300
  15  * @cfg {Array} buttons default ['rotateLeft', 'pictureBtn', 'rotateRight']
  16  * @cfg {Boolean} isDocument (true|false) default false
  17  *
  18  * @constructor
  19  * Create a new UploadCropbox
  20  * @param {Object} config The config object
  21  */
  22
  23 </span><span class="jsdoc-var">Roo.bootstrap.UploadCropbox </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">){
  24     </span><span class="jsdoc-var">Roo.bootstrap.UploadCropbox.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">);
  25
  26     </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
  27         </span><span class="jsdoc-comment">/**
  28          * @event beforeselectfile
  29          * Fire before select file
  30          * @param {Roo.bootstrap.UploadCropbox} this
  31          */
  32         </span><span class="jsdoc-string">&quot;beforeselectfile&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  33         </span><span class="jsdoc-comment">/**
  34          * @event initial
  35          * Fire after initEvent
  36          * @param {Roo.bootstrap.UploadCropbox} this
  37          */
  38         </span><span class="jsdoc-string">&quot;initial&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  39         </span><span class="jsdoc-comment">/**
  40          * @event crop
  41          * Fire after initEvent
  42          * @param {Roo.bootstrap.UploadCropbox} this
  43          * @param {String} data
  44          */
  45         </span><span class="jsdoc-string">&quot;crop&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  46         </span><span class="jsdoc-comment">/**
  47          * @event prepare
  48          * Fire when preparing the file data
  49          * @param {Roo.bootstrap.UploadCropbox} this
  50          * @param {Object} file
  51          */
  52         </span><span class="jsdoc-string">&quot;prepare&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  53         </span><span class="jsdoc-comment">/**
  54          * @event exception
  55          * Fire when get exception
  56          * @param {Roo.bootstrap.UploadCropbox} this
  57          * @param {Object} options
  58          */
  59         </span><span class="jsdoc-string">&quot;exception&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  60         </span><span class="jsdoc-comment">/**
  61          * @event beforeloadcanvas
  62          * Fire before load the canvas
  63          * @param {Roo.bootstrap.UploadCropbox} this
  64          * @param {String} src
  65          */
  66         </span><span class="jsdoc-string">&quot;beforeloadcanvas&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  67         </span><span class="jsdoc-comment">/**
  68          * @event trash
  69          * Fire when trash image
  70          * @param {Roo.bootstrap.UploadCropbox} this
  71          */
  72         </span><span class="jsdoc-string">&quot;trash&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  73         </span><span class="jsdoc-comment">/**
  74          * @event download
  75          * Fire when download the image
  76          * @param {Roo.bootstrap.UploadCropbox} this
  77          */
  78         </span><span class="jsdoc-string">&quot;download&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 footerbuttonclick
  81          * Fire when footerbuttonclick
  82          * @param {Roo.bootstrap.UploadCropbox} this
  83          * @param {String} type
  84          */
  85         </span><span class="jsdoc-string">&quot;footerbuttonclick&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  86         </span><span class="jsdoc-comment">/**
  87          * @event resize
  88          * Fire when resize
  89          * @param {Roo.bootstrap.UploadCropbox} this
  90          */
  91         </span><span class="jsdoc-string">&quot;resize&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 rotate
  94          * Fire when rotate the image
  95          * @param {Roo.bootstrap.UploadCropbox} this
  96          * @param {String} pos
  97          */
  98         </span><span class="jsdoc-string">&quot;rotate&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
  99     </span><span class="jsdoc-syntax">});
 100
 101     </span><span class="jsdoc-var">this.buttons </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.buttons </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">Roo.bootstrap.UploadCropbox.footer.STANDARD</span><span class="jsdoc-syntax">;
 102 };
 103
 104 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.UploadCropbox</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Component</span><span class="jsdoc-syntax">,  {
 105
 106     </span><span class="jsdoc-var">emptyText </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Click to upload image'</span><span class="jsdoc-syntax">,
 107     </span><span class="jsdoc-var">rotateNotify </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Image is too small to rotate'</span><span class="jsdoc-syntax">,
 108     </span><span class="jsdoc-var">errorTimeout </span><span class="jsdoc-syntax">: 3000,
 109     </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">: 0,
 110     </span><span class="jsdoc-var">baseScale </span><span class="jsdoc-syntax">: 1,
 111     </span><span class="jsdoc-var">rotate </span><span class="jsdoc-syntax">: 0,
 112     </span><span class="jsdoc-var">dragable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 113     </span><span class="jsdoc-var">pinching </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 114     </span><span class="jsdoc-var">mouseX </span><span class="jsdoc-syntax">: 0,
 115     </span><span class="jsdoc-var">mouseY </span><span class="jsdoc-syntax">: 0,
 116     </span><span class="jsdoc-var">cropData </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 117     </span><span class="jsdoc-var">minWidth </span><span class="jsdoc-syntax">: 300,
 118     </span><span class="jsdoc-var">minHeight </span><span class="jsdoc-syntax">: 300,
 119     </span><span class="jsdoc-var">file </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 120     </span><span class="jsdoc-var">exif </span><span class="jsdoc-syntax">: {},
 121     </span><span class="jsdoc-var">baseRotate </span><span class="jsdoc-syntax">: 1,
 122     </span><span class="jsdoc-var">cropType </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'image/jpeg'</span><span class="jsdoc-syntax">,
 123     </span><span class="jsdoc-var">buttons </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 124     </span><span class="jsdoc-var">canvasLoaded </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 125     </span><span class="jsdoc-var">isDocument </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 126
 127     </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 128     {
 129         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= {
 130             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 131             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-upload-cropbox'</span><span class="jsdoc-syntax">,
 132             </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
 133                 {
 134                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 135                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-upload-cropbox-body'</span><span class="jsdoc-syntax">,
 136                     </span><span class="jsdoc-var">style </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'cursor:pointer'</span><span class="jsdoc-syntax">,
 137                     </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
 138                         {
 139                             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 140                             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-upload-cropbox-preview'
 141                         </span><span class="jsdoc-syntax">},
 142                         {
 143                             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 144                             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-upload-cropbox-thumb'
 145                         </span><span class="jsdoc-syntax">},
 146                         {
 147                             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 148                             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-upload-cropbox-empty-notify'</span><span class="jsdoc-syntax">,
 149                             </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.emptyText
 150                         </span><span class="jsdoc-syntax">},
 151                         {
 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-upload-cropbox-error-notify alert alert-danger'</span><span class="jsdoc-syntax">,
 154                             </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.rotateNotify
 155                         </span><span class="jsdoc-syntax">}
 156                     ]
 157                 },
 158                 {
 159                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 160                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-upload-cropbox-footer'</span><span class="jsdoc-syntax">,
 161                     </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: {
 162                         </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 163                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn-group btn-group-justified roo-upload-cropbox-btn-group'</span><span class="jsdoc-syntax">,
 164                         </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: []
 165                     }
 166                 }
 167             ]
 168         };
 169
 170         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
 171     },
 172
 173     </span><span class="jsdoc-var">onRender </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">)
 174     {
 175         </span><span class="jsdoc-var">Roo.bootstrap.UploadCropbox.superclass.onRender.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">);
 176
 177         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.buttons.length</span><span class="jsdoc-syntax">) {
 178
 179             </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.buttons</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">bb</span><span class="jsdoc-syntax">) {
 180
 181                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">btn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-upload-cropbox-footer div.roo-upload-cropbox-btn-group'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.createChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">bb</span><span class="jsdoc-syntax">);
 182
 183                 </span><span class="jsdoc-var">btn.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onFooterButtonClick.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, [</span><span class="jsdoc-var">bb.action</span><span class="jsdoc-syntax">], </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">));
 184
 185             }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 186         }
 187     },
 188
 189     </span><span class="jsdoc-var">initEvents </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 190     {
 191         </span><span class="jsdoc-var">this.urlAPI </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">window.createObjectURL </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">window</span><span class="jsdoc-syntax">) ||
 192                                 (</span><span class="jsdoc-var">window.URL </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">URL.revokeObjectURL </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">URL</span><span class="jsdoc-syntax">) ||
 193                                 (</span><span class="jsdoc-var">window.webkitURL </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">webkitURL</span><span class="jsdoc-syntax">);
 194
 195         </span><span class="jsdoc-var">this.bodyEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-upload-cropbox-body'</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">();
 196         </span><span class="jsdoc-var">this.bodyEl.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">;
 197
 198         </span><span class="jsdoc-var">this.previewEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-upload-cropbox-preview'</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">();
 199         </span><span class="jsdoc-var">this.previewEl.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">;
 200
 201         </span><span class="jsdoc-var">this.thumbEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-upload-cropbox-thumb'</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">();
 202         </span><span class="jsdoc-var">this.thumbEl.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">;
 203         </span><span class="jsdoc-var">this.thumbEl.hide</span><span class="jsdoc-syntax">();
 204
 205         </span><span class="jsdoc-var">this.notifyEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-upload-cropbox-empty-notify'</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">();
 206         </span><span class="jsdoc-var">this.notifyEl.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">;
 207
 208         </span><span class="jsdoc-var">this.errorEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-upload-cropbox-error-notify'</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">();
 209         </span><span class="jsdoc-var">this.errorEl.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">;
 210         </span><span class="jsdoc-var">this.errorEl.hide</span><span class="jsdoc-syntax">();
 211
 212         </span><span class="jsdoc-var">this.footerEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-upload-cropbox-footer'</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">();
 213         </span><span class="jsdoc-var">this.footerEl.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">;
 214         </span><span class="jsdoc-var">this.footerEl.hide</span><span class="jsdoc-syntax">();
 215
 216         </span><span class="jsdoc-var">this.setThumbBoxSize</span><span class="jsdoc-syntax">();
 217
 218         </span><span class="jsdoc-var">this.bind</span><span class="jsdoc-syntax">();
 219
 220         </span><span class="jsdoc-var">this.resize</span><span class="jsdoc-syntax">();
 221
 222         </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">);
 223     },
 224
 225     </span><span class="jsdoc-var">bind </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 226     {
 227         </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">;
 228
 229         </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.resize</span><span class="jsdoc-syntax">(); } );
 230
 231         </span><span class="jsdoc-var">this.bodyEl.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.beforeSelectFile</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 232
 233         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isTouch</span><span class="jsdoc-syntax">){
 234             </span><span class="jsdoc-var">this.bodyEl.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'touchstart'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onTouchStart</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 235             </span><span class="jsdoc-var">this.bodyEl.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'touchmove'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onTouchMove</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 236             </span><span class="jsdoc-var">this.bodyEl.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'touchend'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onTouchEnd</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 237         }
 238
 239         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">Roo.isTouch</span><span class="jsdoc-syntax">){
 240             </span><span class="jsdoc-var">this.bodyEl.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'mousedown'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onMouseDown</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 241             </span><span class="jsdoc-var">this.bodyEl.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'mousemove'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onMouseMove</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 242             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">mousewheel </span><span class="jsdoc-syntax">= (/Firefox/i</span><span class="jsdoc-var">.test</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">navigator.userAgent</span><span class="jsdoc-syntax">))? </span><span class="jsdoc-string">'DOMMouseScroll' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'mousewheel'</span><span class="jsdoc-syntax">;
 243             </span><span class="jsdoc-var">this.bodyEl.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">mousewheel</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onMouseWheel</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 244             </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'mouseup'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onMouseUp</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 245         }
 246     },
 247
 248     </span><span class="jsdoc-var">reset </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 249     {
 250         </span><span class="jsdoc-var">this.scale </span><span class="jsdoc-syntax">= 0;
 251         </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">= 1;
 252         </span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">= 0;
 253         </span><span class="jsdoc-var">this.baseRotate </span><span class="jsdoc-syntax">= 1;
 254         </span><span class="jsdoc-var">this.dragable </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 255         </span><span class="jsdoc-var">this.pinching </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 256         </span><span class="jsdoc-var">this.mouseX </span><span class="jsdoc-syntax">= 0;
 257         </span><span class="jsdoc-var">this.mouseY </span><span class="jsdoc-syntax">= 0;
 258         </span><span class="jsdoc-var">this.cropData </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 259         </span><span class="jsdoc-var">this.notifyEl.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.emptyText</span><span class="jsdoc-syntax">;
 260
 261     },
 262
 263     </span><span class="jsdoc-var">resize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 264     {
 265         </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">'resize'</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">){
 266             </span><span class="jsdoc-var">this.setThumbBoxPosition</span><span class="jsdoc-syntax">();
 267             </span><span class="jsdoc-var">this.setCanvasPosition</span><span class="jsdoc-syntax">();
 268         }
 269     },
 270
 271     </span><span class="jsdoc-var">onFooterButtonClick </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">, </span><span class="jsdoc-var">type</span><span class="jsdoc-syntax">)
 272     {
 273         </span><span class="jsdoc-keyword">switch </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">type</span><span class="jsdoc-syntax">) {
 274             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'rotate-left' </span><span class="jsdoc-syntax">:
 275                 </span><span class="jsdoc-var">this.onRotateLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
 276                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 277             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'rotate-right' </span><span class="jsdoc-syntax">:
 278                 </span><span class="jsdoc-var">this.onRotateRight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
 279                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 280             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'picture' </span><span class="jsdoc-syntax">:
 281                 </span><span class="jsdoc-var">this.beforeSelectFile</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
 282                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 283             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'trash' </span><span class="jsdoc-syntax">:
 284                 </span><span class="jsdoc-var">this.trash</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
 285                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 286             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'crop' </span><span class="jsdoc-syntax">:
 287                 </span><span class="jsdoc-var">this.crop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
 288                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 289             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'download' </span><span class="jsdoc-syntax">:
 290                 </span><span class="jsdoc-var">this.download</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
 291                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 292             </span><span class="jsdoc-keyword">default </span><span class="jsdoc-syntax">:
 293                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 294         }
 295
 296         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'footerbuttonclick'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">type</span><span class="jsdoc-syntax">);
 297     },
 298
 299     </span><span class="jsdoc-var">beforeSelectFile </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">)
 300     {
 301         </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">);
 302     },
 303
 304     </span><span class="jsdoc-var">trash </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">)
 305     {
 306         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'trash'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 307     },
 308
 309     </span><span class="jsdoc-var">download </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">)
 310     {
 311         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'download'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 312     },
 313
 314     </span><span class="jsdoc-var">loadCanvas </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">src</span><span class="jsdoc-syntax">)
 315     {
 316         </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">'beforeloadcanvas'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">src</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
 317
 318             </span><span class="jsdoc-var">this.reset</span><span class="jsdoc-syntax">();
 319
 320             </span><span class="jsdoc-var">this.imageEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.createElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'img'</span><span class="jsdoc-syntax">);
 321
 322             </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">;
 323
 324             </span><span class="jsdoc-var">this.imageEl.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.onLoadCanvas</span><span class="jsdoc-syntax">(); });
 325
 326             </span><span class="jsdoc-var">this.imageEl.src </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">src</span><span class="jsdoc-syntax">;
 327         }
 328     },
 329
 330     </span><span class="jsdoc-var">onLoadCanvas </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 331     {
 332         </span><span class="jsdoc-var">this.bodyEl.un</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.beforeSelectFile</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 333
 334         </span><span class="jsdoc-var">this.notifyEl.hide</span><span class="jsdoc-syntax">();
 335         </span><span class="jsdoc-var">this.thumbEl.show</span><span class="jsdoc-syntax">();
 336         </span><span class="jsdoc-var">this.footerEl.show</span><span class="jsdoc-syntax">();
 337
 338         </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.imageEl.naturalWidth </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.imageEl.width</span><span class="jsdoc-syntax">;
 339         </span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.imageEl.naturalHeight </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.imageEl.height</span><span class="jsdoc-syntax">;
 340
 341         </span><span class="jsdoc-var">this.baseRotateLevel</span><span class="jsdoc-syntax">();
 342
 343         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isDocument</span><span class="jsdoc-syntax">){
 344             </span><span class="jsdoc-var">this.setThumbBoxSize</span><span class="jsdoc-syntax">();
 345         }
 346
 347         </span><span class="jsdoc-var">this.setThumbBoxPosition</span><span class="jsdoc-syntax">();
 348
 349         </span><span class="jsdoc-var">this.baseScaleLevel</span><span class="jsdoc-syntax">();
 350
 351         </span><span class="jsdoc-var">this.draw</span><span class="jsdoc-syntax">();
 352
 353         </span><span class="jsdoc-var">this.resize</span><span class="jsdoc-syntax">();
 354
 355         </span><span class="jsdoc-var">this.canvasLoaded </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 356
 357     },
 358
 359     </span><span class="jsdoc-var">setCanvasPosition </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 360     {
 361         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.canvasEl</span><span class="jsdoc-syntax">){
 362             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 363         }
 364
 365         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pw </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">this.bodyEl.getWidth</span><span class="jsdoc-syntax">() - </span><span class="jsdoc-var">this.canvasEl.width</span><span class="jsdoc-syntax">) / 2);
 366         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ph </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">this.bodyEl.getHeight</span><span class="jsdoc-syntax">() - </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">) / 2);
 367
 368         </span><span class="jsdoc-var">this.previewEl.setLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pw</span><span class="jsdoc-syntax">);
 369         </span><span class="jsdoc-var">this.previewEl.setTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ph</span><span class="jsdoc-syntax">);
 370
 371     },
 372
 373     </span><span class="jsdoc-var">onMouseDown </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">)
 374     {
 375         </span><span class="jsdoc-var">e.stopEvent</span><span class="jsdoc-syntax">();
 376
 377         </span><span class="jsdoc-var">this.dragable </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 378         </span><span class="jsdoc-var">this.pinching </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 379
 380         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isDocument </span><span class="jsdoc-syntax">&amp;&amp; (</span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">() || </span><span class="jsdoc-var">this.canvasEl.height </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">())){
 381             </span><span class="jsdoc-var">this.dragable </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 382             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 383         }
 384
 385         </span><span class="jsdoc-var">this.mouseX </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.isTouch </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">e.browserEvent.touches</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.pageX </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">e.getPageX</span><span class="jsdoc-syntax">();
 386         </span><span class="jsdoc-var">this.mouseY </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.isTouch </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">e.browserEvent.touches</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.pageY </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">e.getPageY</span><span class="jsdoc-syntax">();
 387
 388     },
 389
 390     </span><span class="jsdoc-var">onMouseMove </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">)
 391     {
 392         </span><span class="jsdoc-var">e.stopEvent</span><span class="jsdoc-syntax">();
 393
 394         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.canvasLoaded</span><span class="jsdoc-syntax">){
 395             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 396         }
 397
 398         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.dragable</span><span class="jsdoc-syntax">){
 399             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 400         }
 401
 402         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">minX </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.thumbEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">));
 403         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">minY </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.thumbEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">));
 404
 405         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">minX </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">() - </span><span class="jsdoc-var">this.canvasEl.width</span><span class="jsdoc-syntax">);
 406         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">maxY </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">minY </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">() - </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">);
 407
 408         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.isTouch </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">e.browserEvent.touches</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.pageX </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">e.getPageX</span><span class="jsdoc-syntax">();
 409         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.isTouch </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">e.browserEvent.touches</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.pageY </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">e.getPageY</span><span class="jsdoc-syntax">();
 410
 411         </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.mouseX</span><span class="jsdoc-syntax">;
 412         </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.mouseY</span><span class="jsdoc-syntax">;
 413
 414         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">bgX </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.previewEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">));
 415         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">bgY </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.previewEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">));
 416
 417         </span><span class="jsdoc-var">bgX </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">minX </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">bgX</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">minX </span><span class="jsdoc-syntax">: ((</span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">bgX</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">maxX </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">bgX</span><span class="jsdoc-syntax">);
 418         </span><span class="jsdoc-var">bgY </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">minY </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">bgY</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">minY </span><span class="jsdoc-syntax">: ((</span><span class="jsdoc-var">maxY </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">bgY</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">maxY </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">bgY</span><span class="jsdoc-syntax">);
 419
 420         </span><span class="jsdoc-var">this.previewEl.setLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">bgX</span><span class="jsdoc-syntax">);
 421         </span><span class="jsdoc-var">this.previewEl.setTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">bgY</span><span class="jsdoc-syntax">);
 422
 423         </span><span class="jsdoc-var">this.mouseX </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.isTouch </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">e.browserEvent.touches</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.pageX </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">e.getPageX</span><span class="jsdoc-syntax">();
 424         </span><span class="jsdoc-var">this.mouseY </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.isTouch </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">e.browserEvent.touches</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.pageY </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">e.getPageY</span><span class="jsdoc-syntax">();
 425     },
 426
 427     </span><span class="jsdoc-var">onMouseUp </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">)
 428     {
 429         </span><span class="jsdoc-var">e.stopEvent</span><span class="jsdoc-syntax">();
 430
 431         </span><span class="jsdoc-var">this.dragable </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 432     },
 433
 434     </span><span class="jsdoc-var">onMouseWheel </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">)
 435     {
 436         </span><span class="jsdoc-var">e.stopEvent</span><span class="jsdoc-syntax">();
 437
 438         </span><span class="jsdoc-var">this.startScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.scale</span><span class="jsdoc-syntax">;
 439
 440         </span><span class="jsdoc-var">this.scale </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">e.getWheelDelta</span><span class="jsdoc-syntax">() == 1) ? (</span><span class="jsdoc-var">this.scale </span><span class="jsdoc-syntax">+ 1) : (</span><span class="jsdoc-var">this.scale </span><span class="jsdoc-syntax">- 1);
 441
 442         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.zoomable</span><span class="jsdoc-syntax">()){
 443             </span><span class="jsdoc-var">this.scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.startScale</span><span class="jsdoc-syntax">;
 444             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 445         }
 446
 447         </span><span class="jsdoc-var">this.draw</span><span class="jsdoc-syntax">();
 448
 449         </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 450     },
 451
 452     </span><span class="jsdoc-var">zoomable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 453     {
 454         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">minScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.minWidth</span><span class="jsdoc-syntax">;
 455
 456         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.minWidth </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.minHeight</span><span class="jsdoc-syntax">){
 457             </span><span class="jsdoc-var">minScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.minHeight</span><span class="jsdoc-syntax">;
 458         }
 459
 460         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">minScale</span><span class="jsdoc-syntax">);
 461         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">minScale</span><span class="jsdoc-syntax">);
 462
 463         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(
 464                 </span><span class="jsdoc-var">this.isDocument </span><span class="jsdoc-syntax">&amp;&amp;
 465                 (</span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">== 0 || </span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">== 180) &amp;&amp;
 466                 (
 467                     </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">||
 468                     </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">||
 469                     (</span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.minWidth </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.minHeight</span><span class="jsdoc-syntax">)
 470                 )
 471         ){
 472             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 473         }
 474
 475         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(
 476                 </span><span class="jsdoc-var">this.isDocument </span><span class="jsdoc-syntax">&amp;&amp;
 477                 (</span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">== 90 || </span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">== 270) &amp;&amp;
 478                 (
 479                     </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">||
 480                     </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">||
 481                     (</span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.minHeight </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.minWidth</span><span class="jsdoc-syntax">)
 482                 )
 483         ){
 484             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 485         }
 486
 487         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(
 488                 !</span><span class="jsdoc-var">this.isDocument </span><span class="jsdoc-syntax">&amp;&amp;
 489                 (</span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">== 0 || </span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">== 180) &amp;&amp;
 490                 (
 491                     </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.minWidth </span><span class="jsdoc-syntax">||
 492                     </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">||
 493                     </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.minHeight </span><span class="jsdoc-syntax">||
 494                     </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight
 495                 </span><span class="jsdoc-syntax">)
 496         ){
 497             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 498         }
 499
 500         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(
 501                 !</span><span class="jsdoc-var">this.isDocument </span><span class="jsdoc-syntax">&amp;&amp;
 502                 (</span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">== 90 || </span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">== 270) &amp;&amp;
 503                 (
 504                     </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.minHeight </span><span class="jsdoc-syntax">||
 505                     </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">||
 506                     </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.minWidth </span><span class="jsdoc-syntax">||
 507                     </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight
 508                 </span><span class="jsdoc-syntax">)
 509         ){
 510             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 511         }
 512
 513         </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 514
 515     },
 516
 517     </span><span class="jsdoc-var">onRotateLeft </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">)
 518     {
 519         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.isDocument </span><span class="jsdoc-syntax">&amp;&amp; (</span><span class="jsdoc-var">this.canvasEl.height </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">() || </span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">())){
 520
 521             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">minScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.minWidth</span><span class="jsdoc-syntax">;
 522
 523             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">bw </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 524             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">bh </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl.height </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 525
 526             </span><span class="jsdoc-var">this.startScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.scale</span><span class="jsdoc-syntax">;
 527
 528             </span><span class="jsdoc-keyword">while </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">() &lt; </span><span class="jsdoc-var">minScale</span><span class="jsdoc-syntax">){
 529
 530                 </span><span class="jsdoc-var">this.scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.scale </span><span class="jsdoc-syntax">+ 1;
 531
 532                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.zoomable</span><span class="jsdoc-syntax">()){
 533                     </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 534                 }
 535
 536                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(
 537                         </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">bw </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">()) &lt; </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">() ||
 538                         </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">bh </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">()) &lt; </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">()
 539                 ){
 540                     </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
 541                 }
 542
 543                 </span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">&lt; 90) ? 270 : </span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">- 90;
 544
 545                 </span><span class="jsdoc-var">this.draw</span><span class="jsdoc-syntax">();
 546
 547                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 548             }
 549
 550             </span><span class="jsdoc-var">this.scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.startScale</span><span class="jsdoc-syntax">;
 551
 552             </span><span class="jsdoc-var">this.onRotateFail</span><span class="jsdoc-syntax">();
 553
 554             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 555         }
 556
 557         </span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">&lt; 90) ? 270 : </span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">- 90;
 558
 559         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isDocument</span><span class="jsdoc-syntax">){
 560             </span><span class="jsdoc-var">this.setThumbBoxSize</span><span class="jsdoc-syntax">();
 561             </span><span class="jsdoc-var">this.setThumbBoxPosition</span><span class="jsdoc-syntax">();
 562             </span><span class="jsdoc-var">this.setCanvasPosition</span><span class="jsdoc-syntax">();
 563         }
 564
 565         </span><span class="jsdoc-var">this.draw</span><span class="jsdoc-syntax">();
 566
 567         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'rotate'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">);
 568
 569     },
 570
 571     </span><span class="jsdoc-var">onRotateRight </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">)
 572     {
 573         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.isDocument </span><span class="jsdoc-syntax">&amp;&amp; (</span><span class="jsdoc-var">this.canvasEl.height </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">() || </span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">())){
 574
 575             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">minScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.minWidth</span><span class="jsdoc-syntax">;
 576
 577             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">bw </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 578             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">bh </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl.height </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 579
 580             </span><span class="jsdoc-var">this.startScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.scale</span><span class="jsdoc-syntax">;
 581
 582             </span><span class="jsdoc-keyword">while </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">() &lt; </span><span class="jsdoc-var">minScale</span><span class="jsdoc-syntax">){
 583
 584                 </span><span class="jsdoc-var">this.scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.scale </span><span class="jsdoc-syntax">+ 1;
 585
 586                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.zoomable</span><span class="jsdoc-syntax">()){
 587                     </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 588                 }
 589
 590                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(
 591                         </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">bw </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">()) &lt; </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">() ||
 592                         </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">bh </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">()) &lt; </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">()
 593                 ){
 594                     </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
 595                 }
 596
 597                 </span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">&gt; 180) ? 0 : </span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">+ 90;
 598
 599                 </span><span class="jsdoc-var">this.draw</span><span class="jsdoc-syntax">();
 600
 601                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 602             }
 603
 604             </span><span class="jsdoc-var">this.scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.startScale</span><span class="jsdoc-syntax">;
 605
 606             </span><span class="jsdoc-var">this.onRotateFail</span><span class="jsdoc-syntax">();
 607
 608             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 609         }
 610
 611         </span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">&gt; 180) ? 0 : </span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">+ 90;
 612
 613         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isDocument</span><span class="jsdoc-syntax">){
 614             </span><span class="jsdoc-var">this.setThumbBoxSize</span><span class="jsdoc-syntax">();
 615             </span><span class="jsdoc-var">this.setThumbBoxPosition</span><span class="jsdoc-syntax">();
 616             </span><span class="jsdoc-var">this.setCanvasPosition</span><span class="jsdoc-syntax">();
 617         }
 618
 619         </span><span class="jsdoc-var">this.draw</span><span class="jsdoc-syntax">();
 620
 621         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'rotate'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'right'</span><span class="jsdoc-syntax">);
 622     },
 623
 624     </span><span class="jsdoc-var">onRotateFail </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 625     {
 626         </span><span class="jsdoc-var">this.errorEl.show</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 627
 628         </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">;
 629
 630         (</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() { </span><span class="jsdoc-var">_this.errorEl.hide</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">); })</span><span class="jsdoc-var">.defer</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.errorTimeout</span><span class="jsdoc-syntax">);
 631     },
 632
 633     </span><span class="jsdoc-var">draw </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 634     {
 635         </span><span class="jsdoc-var">this.previewEl.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 636
 637         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">canvasEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.createElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;canvas&quot;</span><span class="jsdoc-syntax">);
 638
 639         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">contextEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">canvasEl.getContext</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;2d&quot;</span><span class="jsdoc-syntax">);
 640
 641         </span><span class="jsdoc-var">canvasEl.width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">();
 642         </span><span class="jsdoc-var">canvasEl.height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">();
 643         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">center </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">/ 2;
 644
 645         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">){
 646             </span><span class="jsdoc-var">canvasEl.width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">();
 647             </span><span class="jsdoc-var">canvasEl.height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">();
 648             </span><span class="jsdoc-var">center </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">/ 2;
 649         }
 650
 651         </span><span class="jsdoc-var">contextEl.scale</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 652
 653         </span><span class="jsdoc-var">contextEl.translate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">center</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">center</span><span class="jsdoc-syntax">);
 654         </span><span class="jsdoc-var">contextEl.rotate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">Math.PI </span><span class="jsdoc-syntax">/ 180);
 655
 656         </span><span class="jsdoc-var">contextEl.drawImage</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl</span><span class="jsdoc-syntax">, 0, 0, </span><span class="jsdoc-var">this.imageEl.OriginWidth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">center </span><span class="jsdoc-syntax">* -1, </span><span class="jsdoc-var">center </span><span class="jsdoc-syntax">* -1, </span><span class="jsdoc-var">this.imageEl.OriginWidth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">);
 657
 658         </span><span class="jsdoc-var">this.canvasEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.createElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;canvas&quot;</span><span class="jsdoc-syntax">);
 659
 660         </span><span class="jsdoc-var">this.contextEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.canvasEl.getContext</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;2d&quot;</span><span class="jsdoc-syntax">);
 661
 662         </span><span class="jsdoc-keyword">switch </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rotate</span><span class="jsdoc-syntax">) {
 663             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">0 :
 664
 665                 </span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">();
 666                 </span><span class="jsdoc-var">this.canvasEl.height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">();
 667
 668                 </span><span class="jsdoc-var">this.contextEl.drawImage</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">canvasEl</span><span class="jsdoc-syntax">, 0, 0, </span><span class="jsdoc-var">this.canvasEl.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">, 0, 0, </span><span class="jsdoc-var">this.canvasEl.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">);
 669
 670                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 671             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">90 :
 672
 673                 </span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">();
 674                 </span><span class="jsdoc-var">this.canvasEl.height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">();
 675
 676                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">){
 677                     </span><span class="jsdoc-var">this.contextEl.drawImage</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">canvasEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Math.abs</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">), 0, </span><span class="jsdoc-var">this.canvasEl.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">, 0, 0, </span><span class="jsdoc-var">this.canvasEl.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">);
 678                     </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 679                 }
 680
 681                 </span><span class="jsdoc-var">this.contextEl.drawImage</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">canvasEl</span><span class="jsdoc-syntax">, 0, 0, </span><span class="jsdoc-var">this.canvasEl.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">, 0, 0, </span><span class="jsdoc-var">this.canvasEl.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">);
 682
 683                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 684             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">180 :
 685
 686                 </span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">();
 687                 </span><span class="jsdoc-var">this.canvasEl.height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">();
 688
 689                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">){
 690                     </span><span class="jsdoc-var">this.contextEl.drawImage</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">canvasEl</span><span class="jsdoc-syntax">, 0, </span><span class="jsdoc-var">Math.abs</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">), </span><span class="jsdoc-var">this.canvasEl.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">, 0, 0, </span><span class="jsdoc-var">this.canvasEl.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">);
 691                     </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 692                 }
 693
 694                 </span><span class="jsdoc-var">this.contextEl.drawImage</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">canvasEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Math.abs</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">), 0, </span><span class="jsdoc-var">this.canvasEl.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">, 0, 0, </span><span class="jsdoc-var">this.canvasEl.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">);
 695
 696                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 697             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">270 :
 698
 699                 </span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">();
 700                 </span><span class="jsdoc-var">this.canvasEl.height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">();
 701
 702                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">){
 703                     </span><span class="jsdoc-var">this.contextEl.drawImage</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">canvasEl</span><span class="jsdoc-syntax">, 0, 0, </span><span class="jsdoc-var">this.canvasEl.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">, 0, 0, </span><span class="jsdoc-var">this.canvasEl.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">);
 704                     </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 705                 }
 706
 707                 </span><span class="jsdoc-var">this.contextEl.drawImage</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">canvasEl</span><span class="jsdoc-syntax">, 0, </span><span class="jsdoc-var">Math.abs</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">), </span><span class="jsdoc-var">this.canvasEl.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">, 0, 0, </span><span class="jsdoc-var">this.canvasEl.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.canvasEl.height</span><span class="jsdoc-syntax">);
 708
 709                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 710             </span><span class="jsdoc-keyword">default </span><span class="jsdoc-syntax">:
 711                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 712         }
 713
 714         </span><span class="jsdoc-var">this.previewEl.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl</span><span class="jsdoc-syntax">);
 715
 716         </span><span class="jsdoc-var">this.setCanvasPosition</span><span class="jsdoc-syntax">();
 717     },
 718
 719     </span><span class="jsdoc-var">crop </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 720     {
 721         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.canvasLoaded</span><span class="jsdoc-syntax">){
 722             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 723         }
 724
 725         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">imageCanvas </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.createElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;canvas&quot;</span><span class="jsdoc-syntax">);
 726
 727         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">imageContext </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">imageCanvas.getContext</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;2d&quot;</span><span class="jsdoc-syntax">);
 728
 729         </span><span class="jsdoc-var">imageCanvas.width </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">;
 730         </span><span class="jsdoc-var">imageCanvas.height </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">;
 731
 732         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">center </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">imageCanvas.width </span><span class="jsdoc-syntax">/ 2;
 733
 734         </span><span class="jsdoc-var">imageContext.translate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">center</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">center</span><span class="jsdoc-syntax">);
 735
 736         </span><span class="jsdoc-var">imageContext.rotate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">Math.PI </span><span class="jsdoc-syntax">/ 180);
 737
 738         </span><span class="jsdoc-var">imageContext.drawImage</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl</span><span class="jsdoc-syntax">, 0, 0, </span><span class="jsdoc-var">this.imageEl.OriginWidth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">center </span><span class="jsdoc-syntax">* -1, </span><span class="jsdoc-var">center </span><span class="jsdoc-syntax">* -1, </span><span class="jsdoc-var">this.imageEl.OriginWidth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">);
 739
 740         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">canvas </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.createElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;canvas&quot;</span><span class="jsdoc-syntax">);
 741
 742         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">context </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">canvas.getContext</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;2d&quot;</span><span class="jsdoc-syntax">);
 743
 744         </span><span class="jsdoc-var">canvas.width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.minWidth</span><span class="jsdoc-syntax">;
 745         </span><span class="jsdoc-var">canvas.height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.minHeight</span><span class="jsdoc-syntax">;
 746
 747         </span><span class="jsdoc-keyword">switch </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rotate</span><span class="jsdoc-syntax">) {
 748             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">0 :
 749
 750                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">() &gt; </span><span class="jsdoc-var">this.imageEl.OriginWidth</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 751                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">() &gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 752
 753                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.thumbEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) &gt; </span><span class="jsdoc-var">this.previewEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)) ? 0 : ((</span><span class="jsdoc-var">this.previewEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.thumbEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)) / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 754                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.thumbEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) &gt; </span><span class="jsdoc-var">this.previewEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)) ? 0 : ((</span><span class="jsdoc-var">this.previewEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.thumbEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)) / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 755
 756                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">targetWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.minWidth </span><span class="jsdoc-syntax">- 2 * </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">;
 757                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">targetHeight </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.minHeight </span><span class="jsdoc-syntax">- 2 * </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">;
 758
 759                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= 1;
 760
 761                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">== 0 &amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">== 0) || (</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">== 0 &amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">&gt; 0)){
 762                     </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">targetWidth </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">;
 763                 }
 764
 765                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">&gt; 0 &amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">== 0){
 766                     </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">targetHeight </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">;
 767                 }
 768
 769                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">&gt; 0 &amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">&gt; 0){
 770                     </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">targetWidth </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">;
 771
 772                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">){
 773                         </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">targetHeight </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">;
 774                     }
 775                 }
 776
 777                 </span><span class="jsdoc-var">context.scale</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">scale</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">scale</span><span class="jsdoc-syntax">);
 778
 779                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">this.thumbEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.previewEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">));
 780                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl.height </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">this.thumbEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.previewEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">));
 781
 782                 </span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">&lt; 0 ? 0 : (</span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 783                 </span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">&lt; 0 ? 0 : (</span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 784
 785                 </span><span class="jsdoc-var">context.drawImage</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">imageCanvas</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sx</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sy</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">);
 786
 787                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 788             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">90 :
 789
 790                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">() &gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 791                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">() &gt; </span><span class="jsdoc-var">this.imageEl.OriginWidth</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 792
 793                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.thumbEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) &gt; </span><span class="jsdoc-var">this.previewEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)) ? 0 : ((</span><span class="jsdoc-var">this.previewEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.thumbEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)) / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 794                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.thumbEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) &gt; </span><span class="jsdoc-var">this.previewEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)) ? 0 : ((</span><span class="jsdoc-var">this.previewEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.thumbEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)) / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 795
 796                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">targetWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.minWidth </span><span class="jsdoc-syntax">- 2 * </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">;
 797                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">targetHeight </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.minHeight </span><span class="jsdoc-syntax">- 2 * </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">;
 798
 799                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= 1;
 800
 801                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">== 0 &amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">== 0) || (</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">== 0 &amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">&gt; 0)){
 802                     </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">targetWidth </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">;
 803                 }
 804
 805                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">&gt; 0 &amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">== 0){
 806                     </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">targetHeight </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">;
 807                 }
 808
 809                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">&gt; 0 &amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">&gt; 0){
 810                     </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">targetWidth </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">;
 811
 812                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">){
 813                         </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">targetHeight </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">;
 814                     }
 815                 }
 816
 817                 </span><span class="jsdoc-var">context.scale</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">scale</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">scale</span><span class="jsdoc-syntax">);
 818
 819                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">this.thumbEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.previewEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">));
 820                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl.height </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">this.thumbEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.previewEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">));
 821
 822                 </span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">&lt; 0 ? 0 : (</span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 823                 </span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">&lt; 0 ? 0 : (</span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 824
 825                 </span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">+= (</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">Math.abs</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">) : 0;
 826
 827                 </span><span class="jsdoc-var">context.drawImage</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">imageCanvas</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sx</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sy</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">);
 828
 829                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 830             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">180 :
 831
 832                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">() &gt; </span><span class="jsdoc-var">this.imageEl.OriginWidth</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 833                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">() &gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 834
 835                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.thumbEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) &gt; </span><span class="jsdoc-var">this.previewEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)) ? 0 : ((</span><span class="jsdoc-var">this.previewEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.thumbEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)) / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 836                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.thumbEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) &gt; </span><span class="jsdoc-var">this.previewEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)) ? 0 : ((</span><span class="jsdoc-var">this.previewEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.thumbEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)) / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 837
 838                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">targetWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.minWidth </span><span class="jsdoc-syntax">- 2 * </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">;
 839                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">targetHeight </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.minHeight </span><span class="jsdoc-syntax">- 2 * </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">;
 840
 841                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= 1;
 842
 843                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">== 0 &amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">== 0) || (</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">== 0 &amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">&gt; 0)){
 844                     </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">targetWidth </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">;
 845                 }
 846
 847                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">&gt; 0 &amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">== 0){
 848                     </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">targetHeight </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">;
 849                 }
 850
 851                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">&gt; 0 &amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">&gt; 0){
 852                     </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">targetWidth </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">;
 853
 854                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">){
 855                         </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">targetHeight </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">;
 856                     }
 857                 }
 858
 859                 </span><span class="jsdoc-var">context.scale</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">scale</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">scale</span><span class="jsdoc-syntax">);
 860
 861                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">this.thumbEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.previewEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">));
 862                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl.height </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">this.thumbEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.previewEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">));
 863
 864                 </span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">&lt; 0 ? 0 : (</span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 865                 </span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">&lt; 0 ? 0 : (</span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 866
 867                 </span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">+= (</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">) ? 0 : </span><span class="jsdoc-var">Math.abs</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">);
 868                 </span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">+= (</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">Math.abs</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">) : 0;
 869
 870                 </span><span class="jsdoc-var">context.drawImage</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">imageCanvas</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sx</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sy</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">);
 871
 872                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 873             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">270 :
 874
 875                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">() &gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 876                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">() &gt; </span><span class="jsdoc-var">this.imageEl.OriginWidth</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">() / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 877
 878                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.thumbEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) &gt; </span><span class="jsdoc-var">this.previewEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)) ? 0 : ((</span><span class="jsdoc-var">this.previewEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.thumbEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)) / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 879                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.thumbEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) &gt; </span><span class="jsdoc-var">this.previewEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)) ? 0 : ((</span><span class="jsdoc-var">this.previewEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.thumbEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)) / </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 880
 881                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">targetWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.minWidth </span><span class="jsdoc-syntax">- 2 * </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">;
 882                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">targetHeight </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.minHeight </span><span class="jsdoc-syntax">- 2 * </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">;
 883
 884                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= 1;
 885
 886                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">== 0 &amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">== 0) || (</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">== 0 &amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">&gt; 0)){
 887                     </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">targetWidth </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">;
 888                 }
 889
 890                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">&gt; 0 &amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">== 0){
 891                     </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">targetHeight </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">;
 892                 }
 893
 894                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">&gt; 0 &amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">&gt; 0){
 895                     </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">targetWidth </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">;
 896
 897                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">){
 898                         </span><span class="jsdoc-var">scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">targetHeight </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">;
 899                     }
 900                 }
 901
 902                 </span><span class="jsdoc-var">context.scale</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">scale</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">scale</span><span class="jsdoc-syntax">);
 903
 904                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl.width </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">this.thumbEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.previewEl.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">));
 905                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.canvasEl.height </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">this.thumbEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) - </span><span class="jsdoc-var">this.previewEl.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">));
 906
 907                 </span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">&lt; 0 ? 0 : (</span><span class="jsdoc-var">sx </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 908                 </span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">&lt; 0 ? 0 : (</span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.getScaleLevel</span><span class="jsdoc-syntax">());
 909
 910                 </span><span class="jsdoc-var">sy </span><span class="jsdoc-syntax">+= (</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">) ? 0 : </span><span class="jsdoc-var">Math.abs</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">);
 911
 912                 </span><span class="jsdoc-var">context.drawImage</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">imageCanvas</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sx</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sy</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">);
 913
 914                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 915             </span><span class="jsdoc-keyword">default </span><span class="jsdoc-syntax">:
 916                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 917         }
 918
 919         </span><span class="jsdoc-var">this.cropData </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">canvas.toDataURL</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.cropType</span><span class="jsdoc-syntax">);
 920
 921         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'crop'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.cropData</span><span class="jsdoc-syntax">);
 922
 923     },
 924
 925     </span><span class="jsdoc-var">setThumbBoxSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 926     {
 927         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">;
 928
 929         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isDocument </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">){
 930             </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.minWidth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.minHeight</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.minWidth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.minHeight</span><span class="jsdoc-syntax">);
 931             </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.minWidth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.minHeight</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.minWidth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.minHeight</span><span class="jsdoc-syntax">);
 932
 933             </span><span class="jsdoc-var">this.minWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">;
 934             </span><span class="jsdoc-var">this.minHeight </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">;
 935
 936             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">== 90 || </span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">== 270){
 937                 </span><span class="jsdoc-var">this.minWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">;
 938                 </span><span class="jsdoc-var">this.minHeight </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">;
 939             }
 940         }
 941
 942         </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= 300;
 943         </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.minWidth </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.minHeight</span><span class="jsdoc-syntax">);
 944
 945         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.minWidth </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.minHeight</span><span class="jsdoc-syntax">){
 946             </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= 300;
 947             </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.minHeight </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.minWidth</span><span class="jsdoc-syntax">);
 948         }
 949
 950         </span><span class="jsdoc-var">this.thumbEl.setStyle</span><span class="jsdoc-syntax">({
 951             </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'px'</span><span class="jsdoc-syntax">,
 952             </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'px'
 953         </span><span class="jsdoc-syntax">});
 954
 955         </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 956
 957     },
 958
 959     </span><span class="jsdoc-var">setThumbBoxPosition </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 960     {
 961         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">this.bodyEl.getWidth</span><span class="jsdoc-syntax">() - </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">()) / 2 );
 962         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.ceil</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">this.bodyEl.getHeight</span><span class="jsdoc-syntax">() - </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">()) / 2);
 963
 964         </span><span class="jsdoc-var">this.thumbEl.setLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">);
 965         </span><span class="jsdoc-var">this.thumbEl.setTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">);
 966
 967     },
 968
 969     </span><span class="jsdoc-var">baseRotateLevel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 970     {
 971         </span><span class="jsdoc-var">this.baseRotate </span><span class="jsdoc-syntax">= 1;
 972
 973         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(
 974                 </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.exif</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">&amp;&amp;
 975                 </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.exif</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">Roo.bootstrap.UploadCropbox</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'tags'</span><span class="jsdoc-syntax">][</span><span class="jsdoc-string">'Orientation'</span><span class="jsdoc-syntax">]]) != </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">&amp;&amp;
 976                 [1, 3, 6, 8]</span><span class="jsdoc-var">.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.exif</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">Roo.bootstrap.UploadCropbox</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'tags'</span><span class="jsdoc-syntax">][</span><span class="jsdoc-string">'Orientation'</span><span class="jsdoc-syntax">]]) != -1
 977         ){
 978             </span><span class="jsdoc-var">this.baseRotate </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.exif</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">Roo.bootstrap.UploadCropbox</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'tags'</span><span class="jsdoc-syntax">][</span><span class="jsdoc-string">'Orientation'</span><span class="jsdoc-syntax">]];
 979         }
 980
 981         </span><span class="jsdoc-var">this.rotate </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.bootstrap.UploadCropbox</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'Orientation'</span><span class="jsdoc-syntax">][</span><span class="jsdoc-var">this.baseRotate</span><span class="jsdoc-syntax">];
 982
 983     },
 984
 985     </span><span class="jsdoc-var">baseScaleLevel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 986     {
 987         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">;
 988
 989         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isDocument</span><span class="jsdoc-syntax">){
 990
 991             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.baseRotate </span><span class="jsdoc-syntax">== 6 || </span><span class="jsdoc-var">this.baseRotate </span><span class="jsdoc-syntax">== 8){
 992
 993                 </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">();
 994                 </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.imageEl.OriginWidth</span><span class="jsdoc-syntax">;
 995
 996                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">()){
 997                     </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">();
 998                     </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">;
 999                 }
1000
1001                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1002             }
1003
1004             </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">();
1005             </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">;
1006
1007             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">()){
1008                 </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">();
1009                 </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.imageEl.OriginWidth</span><span class="jsdoc-syntax">;
1010             }
1011
1012             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1013         }
1014
1015         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.baseRotate </span><span class="jsdoc-syntax">== 6 || </span><span class="jsdoc-var">this.baseRotate </span><span class="jsdoc-syntax">== 8){
1016
1017             </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">();
1018             </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">;
1019
1020             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">()){
1021                 </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">();
1022                 </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">;
1023             }
1024
1025             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">){
1026                 </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">();
1027                 </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">;
1028
1029                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">()){
1030                     </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">();
1031                     </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.imageEl.OriginWidth</span><span class="jsdoc-syntax">;
1032                 }
1033             }
1034
1035             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1036         }
1037
1038         </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">();
1039         </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.imageEl.OriginWidth</span><span class="jsdoc-syntax">;
1040
1041         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginHeight </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">()){
1042             </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">();
1043             </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">;
1044         }
1045
1046         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">){
1047
1048             </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.thumbEl.getHeight</span><span class="jsdoc-syntax">();
1049             </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.imageEl.OriginHeight</span><span class="jsdoc-syntax">;
1050
1051             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.imageEl.OriginWidth </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">()){
1052                 </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.thumbEl.getWidth</span><span class="jsdoc-syntax">();
1053                 </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.imageEl.OriginWidth</span><span class="jsdoc-syntax">;
1054             }
1055
1056         }
1057
1058         </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1059     },
1060
1061     </span><span class="jsdoc-var">getScaleLevel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
1062     {
1063         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.baseScale </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">Math.pow</span><span class="jsdoc-syntax">(1.1, </span><span class="jsdoc-var">this.scale</span><span class="jsdoc-syntax">);
1064     },
1065
1066     </span><span class="jsdoc-var">onTouchStart </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">)
1067     {
1068         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.canvasLoaded</span><span class="jsdoc-syntax">){
1069             </span><span class="jsdoc-var">this.beforeSelectFile</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
1070             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1071         }
1072
1073         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">touches </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">e.browserEvent.touches</span><span class="jsdoc-syntax">;
1074
1075         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">touches</span><span class="jsdoc-syntax">){
1076             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1077         }
1078
1079         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">touches.length </span><span class="jsdoc-syntax">== 1){
1080             </span><span class="jsdoc-var">this.onMouseDown</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
1081             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1082         }
1083
1084         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">touches.length </span><span class="jsdoc-syntax">!= 2){
1085             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1086         }
1087
1088         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">coords </span><span class="jsdoc-syntax">= [];
1089
1090         </span><span class="jsdoc-keyword">for</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0, </span><span class="jsdoc-var">finger</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">finger </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">touches</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++){
1091             </span><span class="jsdoc-var">coords.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">finger.pageX</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">finger.pageY</span><span class="jsdoc-syntax">);
1092         }
1093
1094         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.pow</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">coords</span><span class="jsdoc-syntax">[0] - </span><span class="jsdoc-var">coords</span><span class="jsdoc-syntax">[2], 2);
1095         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.pow</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">coords</span><span class="jsdoc-syntax">[1] - </span><span class="jsdoc-var">coords</span><span class="jsdoc-syntax">[3], 2);
1096
1097         </span><span class="jsdoc-var">this.startDistance </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.sqrt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">);
1098
1099         </span><span class="jsdoc-var">this.startScale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.scale</span><span class="jsdoc-syntax">;
1100
1101         </span><span class="jsdoc-var">this.pinching </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
1102         </span><span class="jsdoc-var">this.dragable </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
1103
1104     },
1105
1106     </span><span class="jsdoc-var">onTouchMove </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">)
1107     {
1108         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.pinching </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.dragable</span><span class="jsdoc-syntax">){
1109             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1110         }
1111
1112         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">touches </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">e.browserEvent.touches</span><span class="jsdoc-syntax">;
1113
1114         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">touches</span><span class="jsdoc-syntax">){
1115             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1116         }
1117
1118         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dragable</span><span class="jsdoc-syntax">){
1119             </span><span class="jsdoc-var">this.onMouseMove</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
1120             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1121         }
1122
1123         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">coords </span><span class="jsdoc-syntax">= [];
1124
1125         </span><span class="jsdoc-keyword">for</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0, </span><span class="jsdoc-var">finger</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">finger </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">touches</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++){
1126             </span><span class="jsdoc-var">coords.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">finger.pageX</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">finger.pageY</span><span class="jsdoc-syntax">);
1127         }
1128
1129         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.pow</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">coords</span><span class="jsdoc-syntax">[0] - </span><span class="jsdoc-var">coords</span><span class="jsdoc-syntax">[2], 2);
1130         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.pow</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">coords</span><span class="jsdoc-syntax">[1] - </span><span class="jsdoc-var">coords</span><span class="jsdoc-syntax">[3], 2);
1131
1132         </span><span class="jsdoc-var">this.endDistance </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.sqrt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">);
1133
1134         </span><span class="jsdoc-var">this.scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.startScale </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">Math.floor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Math.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.endDistance </span><span class="jsdoc-syntax">/ </span><span class="jsdoc-var">this.startDistance</span><span class="jsdoc-syntax">) / </span><span class="jsdoc-var">Math.log</span><span class="jsdoc-syntax">(1.1));
1135
1136         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.zoomable</span><span class="jsdoc-syntax">()){
1137             </span><span class="jsdoc-var">this.scale </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.startScale</span><span class="jsdoc-syntax">;
1138             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1139         }
1140
1141         </span><span class="jsdoc-var">this.draw</span><span class="jsdoc-syntax">();
1142
1143     },
1144
1145     </span><span class="jsdoc-var">onTouchEnd </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">)
1146     {
1147         </span><span class="jsdoc-var">this.pinching </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
1148         </span><span class="jsdoc-var">this.dragable </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
1149
1150     },
1151
1152     </span><span class="jsdoc-var">prepare </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">)
1153     {
1154         </span><span class="jsdoc-var">this.file </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
1155         </span><span class="jsdoc-var">this.exif </span><span class="jsdoc-syntax">= {};
1156
1157         </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</span><span class="jsdoc-syntax">) === </span><span class="jsdoc-string">'string'</span><span class="jsdoc-syntax">){
1158             </span><span class="jsdoc-var">this.loadCanvas</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">);
1159             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1160         }
1161
1162         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">file </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.urlAPI</span><span class="jsdoc-syntax">){
1163             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1164         }
1165
1166         </span><span class="jsdoc-var">this.file </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">file</span><span class="jsdoc-syntax">;
1167         </span><span class="jsdoc-var">this.cropType </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">file.type</span><span class="jsdoc-syntax">;
1168
1169         </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">;
1170
1171         </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">this.file</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
1172
1173             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">reader </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">FileReader</span><span class="jsdoc-syntax">();
1174
1175             </span><span class="jsdoc-var">reader.onload </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">) {
1176                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.target.error</span><span class="jsdoc-syntax">) {
1177                     </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.target.error</span><span class="jsdoc-syntax">);
1178                     </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1179                 }
1180
1181                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">buffer </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">e.target.result</span><span class="jsdoc-syntax">,
1182                     </span><span class="jsdoc-var">dataView </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">DataView</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">buffer</span><span class="jsdoc-syntax">),
1183                     </span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">= 2,
1184                     </span><span class="jsdoc-var">maxOffset </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dataView.byteLength </span><span class="jsdoc-syntax">- 4,
1185                     </span><span class="jsdoc-var">markerBytes</span><span class="jsdoc-syntax">,
1186                     </span><span class="jsdoc-var">markerLength</span><span class="jsdoc-syntax">;
1187
1188                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView.getUint16</span><span class="jsdoc-syntax">(0) === 0xffd8) {
1189                     </span><span class="jsdoc-keyword">while </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">maxOffset</span><span class="jsdoc-syntax">) {
1190                         </span><span class="jsdoc-var">markerBytes </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dataView.getUint16</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">);
1191
1192                         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">markerBytes </span><span class="jsdoc-syntax">&gt;= 0xffe0 &amp;&amp; </span><span class="jsdoc-var">markerBytes </span><span class="jsdoc-syntax">&lt;= 0xffef) || </span><span class="jsdoc-var">markerBytes </span><span class="jsdoc-syntax">=== 0xfffe) {
1193                             </span><span class="jsdoc-var">markerLength </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dataView.getUint16</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">+ 2) + 2;
1194                             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">markerLength </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">dataView.byteLength</span><span class="jsdoc-syntax">) {
1195                                 </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'Invalid meta data: Invalid segment size.'</span><span class="jsdoc-syntax">);
1196                                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1197                             }
1198
1199                             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">markerBytes </span><span class="jsdoc-syntax">== 0xffe1){
1200                                 </span><span class="jsdoc-var">_this.parseExifData</span><span class="jsdoc-syntax">(
1201                                     </span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">,
1202                                     </span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">,
1203                                     </span><span class="jsdoc-var">markerLength
1204                                 </span><span class="jsdoc-syntax">);
1205                             }
1206
1207                             </span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">markerLength</span><span class="jsdoc-syntax">;
1208
1209                             </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
1210                         }
1211
1212                         </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1213                     }
1214
1215                 }
1216
1217                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">url </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">_this.urlAPI.createObjectURL</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">_this.file</span><span class="jsdoc-syntax">);
1218
1219                 </span><span class="jsdoc-var">_this.loadCanvas</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">url</span><span class="jsdoc-syntax">);
1220
1221                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1222             }
1223
1224             </span><span class="jsdoc-var">reader.readAsArrayBuffer</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.file</span><span class="jsdoc-syntax">);
1225
1226         }
1227
1228     },
1229
1230     </span><span class="jsdoc-var">parseExifData </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">length</span><span class="jsdoc-syntax">)
1231     {
1232         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tiffOffset </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">+ 10,
1233             </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">,
1234             </span><span class="jsdoc-var">dirOffset</span><span class="jsdoc-syntax">;
1235
1236         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView.getUint32</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">+ 4) !== 0x45786966) {
1237             </span><span class="jsdoc-comment">// No Exif data, might be XMP data instead
1238             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1239         }
1240
1241         </span><span class="jsdoc-comment">// Check for the ASCII code for &quot;Exif&quot; (0x45786966):
1242         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView.getUint32</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">+ 4) !== 0x45786966) {
1243             </span><span class="jsdoc-comment">// No Exif data, might be XMP data instead
1244             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1245         }
1246         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tiffOffset </span><span class="jsdoc-syntax">+ 8 &gt; </span><span class="jsdoc-var">dataView.byteLength</span><span class="jsdoc-syntax">) {
1247             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'Invalid Exif data: Invalid segment size.'</span><span class="jsdoc-syntax">);
1248             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1249         }
1250         </span><span class="jsdoc-comment">// Check for the two null bytes:
1251         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView.getUint16</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">+ 8) !== 0x0000) {
1252             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'Invalid Exif data: Missing byte alignment offset.'</span><span class="jsdoc-syntax">);
1253             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1254         }
1255         </span><span class="jsdoc-comment">// Check the byte alignment:
1256         </span><span class="jsdoc-keyword">switch </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView.getUint16</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tiffOffset</span><span class="jsdoc-syntax">)) {
1257         </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">0x4949:
1258             </span><span class="jsdoc-var">littleEndian </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
1259             </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1260         </span><span class="jsdoc-keyword">case </span><span class="jsdoc-syntax">0x4D4D:
1261             </span><span class="jsdoc-var">littleEndian </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
1262             </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1263         </span><span class="jsdoc-keyword">default</span><span class="jsdoc-syntax">:
1264             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'Invalid Exif data: Invalid byte alignment marker.'</span><span class="jsdoc-syntax">);
1265             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1266         }
1267         </span><span class="jsdoc-comment">// Check for the TIFF tag marker (0x002A):
1268         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView.getUint16</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tiffOffset </span><span class="jsdoc-syntax">+ 2, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">) !== 0x002A) {
1269             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'Invalid Exif data: Missing TIFF marker.'</span><span class="jsdoc-syntax">);
1270             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1271         }
1272         </span><span class="jsdoc-comment">// Retrieve the directory offset bytes, usually 0x00000008 or 8 decimal:
1273         </span><span class="jsdoc-var">dirOffset </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dataView.getUint32</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tiffOffset </span><span class="jsdoc-syntax">+ 4, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">);
1274
1275         </span><span class="jsdoc-var">this.parseExifTags</span><span class="jsdoc-syntax">(
1276             </span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">,
1277             </span><span class="jsdoc-var">tiffOffset</span><span class="jsdoc-syntax">,
1278             </span><span class="jsdoc-var">tiffOffset </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">dirOffset</span><span class="jsdoc-syntax">,
1279             </span><span class="jsdoc-var">littleEndian
1280         </span><span class="jsdoc-syntax">);
1281     },
1282
1283     </span><span class="jsdoc-var">parseExifTags </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">tiffOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dirOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">)
1284     {
1285         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tagsNumber</span><span class="jsdoc-syntax">,
1286             </span><span class="jsdoc-var">dirEndOffset</span><span class="jsdoc-syntax">,
1287             </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">;
1288         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dirOffset </span><span class="jsdoc-syntax">+ 6 &gt; </span><span class="jsdoc-var">dataView.byteLength</span><span class="jsdoc-syntax">) {
1289             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'Invalid Exif data: Invalid directory offset.'</span><span class="jsdoc-syntax">);
1290             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1291         }
1292         </span><span class="jsdoc-var">tagsNumber </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dataView.getUint16</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dirOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">);
1293         </span><span class="jsdoc-var">dirEndOffset </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dirOffset </span><span class="jsdoc-syntax">+ 2 + 12 * </span><span class="jsdoc-var">tagsNumber</span><span class="jsdoc-syntax">;
1294         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dirEndOffset </span><span class="jsdoc-syntax">+ 4 &gt; </span><span class="jsdoc-var">dataView.byteLength</span><span class="jsdoc-syntax">) {
1295             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'Invalid Exif data: Invalid directory size.'</span><span class="jsdoc-syntax">);
1296             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1297         }
1298         </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">tagsNumber</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">+= 1) {
1299             </span><span class="jsdoc-var">this.parseExifTag</span><span class="jsdoc-syntax">(
1300                 </span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">,
1301                 </span><span class="jsdoc-var">tiffOffset</span><span class="jsdoc-syntax">,
1302                 </span><span class="jsdoc-var">dirOffset </span><span class="jsdoc-syntax">+ 2 + 12 * </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// tag offset
1303                 </span><span class="jsdoc-var">littleEndian
1304             </span><span class="jsdoc-syntax">);
1305         }
1306         </span><span class="jsdoc-comment">// Return the offset to the next directory:
1307         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">dataView.getUint32</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dirEndOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">);
1308     },
1309
1310     </span><span class="jsdoc-var">parseExifTag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">tiffOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">)
1311     {
1312         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dataView.getUint16</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">);
1313
1314         </span><span class="jsdoc-var">this.exif</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">this.getExifValue</span><span class="jsdoc-syntax">(
1315             </span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">,
1316             </span><span class="jsdoc-var">tiffOffset</span><span class="jsdoc-syntax">,
1317             </span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">,
1318             </span><span class="jsdoc-var">dataView.getUint16</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">+ 2, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">), </span><span class="jsdoc-comment">// tag type
1319             </span><span class="jsdoc-var">dataView.getUint32</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">+ 4, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">), </span><span class="jsdoc-comment">// tag length
1320             </span><span class="jsdoc-var">littleEndian
1321         </span><span class="jsdoc-syntax">);
1322     },
1323
1324     </span><span class="jsdoc-var">getExifValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">tiffOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">type</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">length</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">)
1325     {
1326         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tagType </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.bootstrap.UploadCropbox.exifTagTypes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">type</span><span class="jsdoc-syntax">],
1327             </span><span class="jsdoc-var">tagSize</span><span class="jsdoc-syntax">,
1328             </span><span class="jsdoc-var">dataOffset</span><span class="jsdoc-syntax">,
1329             </span><span class="jsdoc-var">values</span><span class="jsdoc-syntax">,
1330             </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">,
1331             </span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">,
1332             </span><span class="jsdoc-var">c</span><span class="jsdoc-syntax">;
1333
1334         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">tagType</span><span class="jsdoc-syntax">) {
1335             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'Invalid Exif data: Invalid tag type.'</span><span class="jsdoc-syntax">);
1336             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1337         }
1338
1339         </span><span class="jsdoc-var">tagSize </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">tagType.size </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">length</span><span class="jsdoc-syntax">;
1340         </span><span class="jsdoc-comment">// Determine if the value is contained in the dataOffset bytes,
1341         // or if the value at the dataOffset is a pointer to the actual data:
1342         </span><span class="jsdoc-var">dataOffset </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">tagSize </span><span class="jsdoc-syntax">&gt; 4 ?
1343                 </span><span class="jsdoc-var">tiffOffset </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">dataView.getUint32</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">+ 8, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">) : (</span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">+ 8);
1344         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataOffset </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">tagSize </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">dataView.byteLength</span><span class="jsdoc-syntax">) {
1345             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'Invalid Exif data: Invalid data offset.'</span><span class="jsdoc-syntax">);
1346             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1347         }
1348         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">length </span><span class="jsdoc-syntax">=== 1) {
1349             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">tagType.getValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dataOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">);
1350         }
1351         </span><span class="jsdoc-var">values </span><span class="jsdoc-syntax">= [];
1352         </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">length</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">+= 1) {
1353             </span><span class="jsdoc-var">values</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">tagType.getValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dataOffset </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">* </span><span class="jsdoc-var">tagType.size</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">);
1354         }
1355
1356         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tagType.ascii</span><span class="jsdoc-syntax">) {
1357             </span><span class="jsdoc-var">str </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
1358             </span><span class="jsdoc-comment">// Concatenate the chars:
1359             </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">values.length</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">+= 1) {
1360                 </span><span class="jsdoc-var">c </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">values</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">];
1361                 </span><span class="jsdoc-comment">// Ignore the terminating NULL byte(s):
1362                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-string">'\u0000'</span><span class="jsdoc-syntax">) {
1363                     </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1364                 }
1365                 </span><span class="jsdoc-var">str </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">c</span><span class="jsdoc-syntax">;
1366             }
1367             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">;
1368         }
1369         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">values</span><span class="jsdoc-syntax">;
1370     }
1371
1372 });
1373
1374 </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.UploadCropbox</span><span class="jsdoc-syntax">, {
1375     </span><span class="jsdoc-var">tags </span><span class="jsdoc-syntax">: {
1376         </span><span class="jsdoc-string">'Orientation'</span><span class="jsdoc-syntax">: 0x0112
1377     },
1378
1379     </span><span class="jsdoc-var">Orientation</span><span class="jsdoc-syntax">: {
1380             1: 0, </span><span class="jsdoc-comment">//'top-left',
1381 //            2: 'top-right',
1382             </span><span class="jsdoc-syntax">3: 180, </span><span class="jsdoc-comment">//'bottom-right',
1383 //            4: 'bottom-left',
1384 //            5: 'left-top',
1385             </span><span class="jsdoc-syntax">6: 90, </span><span class="jsdoc-comment">//'right-top',
1386 //            7: 'right-bottom',
1387             </span><span class="jsdoc-syntax">8: 270 </span><span class="jsdoc-comment">//'left-bottom'
1388     </span><span class="jsdoc-syntax">},
1389
1390     </span><span class="jsdoc-var">exifTagTypes </span><span class="jsdoc-syntax">: {
1391         </span><span class="jsdoc-comment">// byte, 8-bit unsigned int:
1392         </span><span class="jsdoc-syntax">1: {
1393             </span><span class="jsdoc-var">getValue</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dataOffset</span><span class="jsdoc-syntax">) {
1394                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">dataView.getUint8</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataOffset</span><span class="jsdoc-syntax">);
1395             },
1396             </span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">: 1
1397         },
1398         </span><span class="jsdoc-comment">// ascii, 8-bit byte:
1399         </span><span class="jsdoc-syntax">2: {
1400             </span><span class="jsdoc-var">getValue</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dataOffset</span><span class="jsdoc-syntax">) {
1401                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">String.fromCharCode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView.getUint8</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataOffset</span><span class="jsdoc-syntax">));
1402             },
1403             </span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">: 1,
1404             </span><span class="jsdoc-var">ascii</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
1405         </span><span class="jsdoc-syntax">},
1406         </span><span class="jsdoc-comment">// short, 16 bit int:
1407         </span><span class="jsdoc-syntax">3: {
1408             </span><span class="jsdoc-var">getValue</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dataOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">) {
1409                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">dataView.getUint16</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">);
1410             },
1411             </span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">: 2
1412         },
1413         </span><span class="jsdoc-comment">// long, 32 bit int:
1414         </span><span class="jsdoc-syntax">4: {
1415             </span><span class="jsdoc-var">getValue</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dataOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">) {
1416                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">dataView.getUint32</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">);
1417             },
1418             </span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">: 4
1419         },
1420         </span><span class="jsdoc-comment">// rational = two long values, first is numerator, second is denominator:
1421         </span><span class="jsdoc-syntax">5: {
1422             </span><span class="jsdoc-var">getValue</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dataOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">) {
1423                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">dataView.getUint32</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">) /
1424                     </span><span class="jsdoc-var">dataView.getUint32</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataOffset </span><span class="jsdoc-syntax">+ 4, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">);
1425             },
1426             </span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">: 8
1427         },
1428         </span><span class="jsdoc-comment">// slong, 32 bit signed int:
1429         </span><span class="jsdoc-syntax">9: {
1430             </span><span class="jsdoc-var">getValue</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dataOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">) {
1431                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">dataView.getInt32</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">);
1432             },
1433             </span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">: 4
1434         },
1435         </span><span class="jsdoc-comment">// srational, two slongs, first is numerator, second is denominator:
1436         </span><span class="jsdoc-syntax">10: {
1437             </span><span class="jsdoc-var">getValue</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataView</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dataOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">) {
1438                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">dataView.getInt32</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataOffset</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">) /
1439                     </span><span class="jsdoc-var">dataView.getInt32</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataOffset </span><span class="jsdoc-syntax">+ 4, </span><span class="jsdoc-var">littleEndian</span><span class="jsdoc-syntax">);
1440             },
1441             </span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">: 8
1442         }
1443     },
1444
1445     </span><span class="jsdoc-var">footer </span><span class="jsdoc-syntax">: {
1446         </span><span class="jsdoc-var">STANDARD </span><span class="jsdoc-syntax">: [
1447             {
1448                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
1449                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn-group roo-upload-cropbox-rotate-left'</span><span class="jsdoc-syntax">,
1450                 </span><span class="jsdoc-var">action </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'rotate-left'</span><span class="jsdoc-syntax">,
1451                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
1452                     {
1453                         </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
1454                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn btn-default'</span><span class="jsdoc-syntax">,
1455                         </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;i class=&quot;fa fa-undo&quot;&gt;&lt;/i&gt;'
1456                     </span><span class="jsdoc-syntax">}
1457                 ]
1458             },
1459             {
1460                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
1461                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn-group roo-upload-cropbox-picture'</span><span class="jsdoc-syntax">,
1462                 </span><span class="jsdoc-var">action </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'picture'</span><span class="jsdoc-syntax">,
1463                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
1464                     {
1465                         </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
1466                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn btn-default'</span><span class="jsdoc-syntax">,
1467                         </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;i class=&quot;fa fa-picture-o&quot;&gt;&lt;/i&gt;'
1468                     </span><span class="jsdoc-syntax">}
1469                 ]
1470             },
1471             {
1472                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
1473                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn-group roo-upload-cropbox-rotate-right'</span><span class="jsdoc-syntax">,
1474                 </span><span class="jsdoc-var">action </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'rotate-right'</span><span class="jsdoc-syntax">,
1475                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
1476                     {
1477                         </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
1478                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn btn-default'</span><span class="jsdoc-syntax">,
1479                         </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;i class=&quot;fa fa-repeat&quot;&gt;&lt;/i&gt;'
1480                     </span><span class="jsdoc-syntax">}
1481                 ]
1482             }
1483         ],
1484         </span><span class="jsdoc-var">DOCUMENT </span><span class="jsdoc-syntax">: [
1485             {
1486                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
1487                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn-group roo-upload-cropbox-rotate-left'</span><span class="jsdoc-syntax">,
1488                 </span><span class="jsdoc-var">action </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'rotate-left'</span><span class="jsdoc-syntax">,
1489                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
1490                     {
1491                         </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
1492                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn btn-default'</span><span class="jsdoc-syntax">,
1493                         </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;i class=&quot;fa fa-undo&quot;&gt;&lt;/i&gt;'
1494                     </span><span class="jsdoc-syntax">}
1495                 ]
1496             },
1497             {
1498                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
1499                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn-group roo-upload-cropbox-download'</span><span class="jsdoc-syntax">,
1500                 </span><span class="jsdoc-var">action </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'download'</span><span class="jsdoc-syntax">,
1501                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
1502                     {
1503                         </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
1504                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn btn-default'</span><span class="jsdoc-syntax">,
1505                         </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;i class=&quot;fa fa-download&quot;&gt;&lt;/i&gt;'
1506                     </span><span class="jsdoc-syntax">}
1507                 ]
1508             },
1509             {
1510                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
1511                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn-group roo-upload-cropbox-crop'</span><span class="jsdoc-syntax">,
1512                 </span><span class="jsdoc-var">action </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'crop'</span><span class="jsdoc-syntax">,
1513                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
1514                     {
1515                         </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
1516                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn btn-default'</span><span class="jsdoc-syntax">,
1517                         </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;i class=&quot;fa fa-crop&quot;&gt;&lt;/i&gt;'
1518                     </span><span class="jsdoc-syntax">}
1519                 ]
1520             },
1521             {
1522                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
1523                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn-group roo-upload-cropbox-trash'</span><span class="jsdoc-syntax">,
1524                 </span><span class="jsdoc-var">action </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'trash'</span><span class="jsdoc-syntax">,
1525                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
1526                     {
1527                         </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
1528                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn btn-default'</span><span class="jsdoc-syntax">,
1529                         </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;i class=&quot;fa fa-trash&quot;&gt;&lt;/i&gt;'
1530                     </span><span class="jsdoc-syntax">}
1531                 ]
1532             },
1533             {
1534                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
1535                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn-group roo-upload-cropbox-rotate-right'</span><span class="jsdoc-syntax">,
1536                 </span><span class="jsdoc-var">action </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'rotate-right'</span><span class="jsdoc-syntax">,
1537                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
1538                     {
1539                         </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
1540                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn btn-default'</span><span class="jsdoc-syntax">,
1541                         </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;i class=&quot;fa fa-repeat&quot;&gt;&lt;/i&gt;'
1542                     </span><span class="jsdoc-syntax">}
1543                 ]
1544             }
1545         ],
1546         </span><span class="jsdoc-var">ROTATOR </span><span class="jsdoc-syntax">: [
1547             {
1548                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
1549                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn-group roo-upload-cropbox-rotate-left'</span><span class="jsdoc-syntax">,
1550                 </span><span class="jsdoc-var">action </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'rotate-left'</span><span class="jsdoc-syntax">,
1551                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
1552                     {
1553                         </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
1554                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn btn-default'</span><span class="jsdoc-syntax">,
1555                         </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;i class=&quot;fa fa-undo&quot;&gt;&lt;/i&gt;'
1556                     </span><span class="jsdoc-syntax">}
1557                 ]
1558             },
1559             {
1560                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
1561                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn-group roo-upload-cropbox-rotate-right'</span><span class="jsdoc-syntax">,
1562                 </span><span class="jsdoc-var">action </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'rotate-right'</span><span class="jsdoc-syntax">,
1563                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
1564                     {
1565                         </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
1566                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'btn btn-default'</span><span class="jsdoc-syntax">,
1567                         </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;i class=&quot;fa fa-repeat&quot;&gt;&lt;/i&gt;'
1568                     </span><span class="jsdoc-syntax">}
1569                 ]
1570             }
1571         ]
1572     }
1573 });
1574 </span></code></body></html>