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