image editing dialog
[roojs1] / roojs-ui.js
index 9323b6b..2409d8a 100644 (file)
@@ -1584,7 +1584,7 @@ var r=A.getRegion(E);if(r&&F){if(F.size){r.resizeTo(F.size);}if(F.collapsed==tru
 A.on("regionexpanded",this.onRegionExpanded,this);},storeState:function(){this.provider.set(this.layout.id+"-layout-state",this.state);},onRegionResized:function(A,B){this.state[A.getPosition()].size=B;this.storeState();},onRegionCollapsed:function(A){this.state[A.getPosition()].collapsed=true;
 this.storeState();},onRegionExpanded:function(A){this.state[A.getPosition()].collapsed=false;this.storeState();}};
 // Roo/ContentPanel.js
-Roo.ContentPanel=function(el,A,B){console.log("ContentPanel Constructor");if(el.autoCreate){A=el;el=Roo.id();}this.el=Roo.get(el);if(!this.el&&A&&A.autoCreate){if(typeof A.autoCreate=="object"){if(!A.autoCreate.id){A.autoCreate.id=A.id||el;}this.el=Roo.DomHelper.append(document.body,A.autoCreate,true);
+Roo.ContentPanel=function(el,A,B){if(el.autoCreate){A=el;el=Roo.id();}this.el=Roo.get(el);if(!this.el&&A&&A.autoCreate){if(typeof A.autoCreate=="object"){if(!A.autoCreate.id){A.autoCreate.id=A.id||el;}this.el=Roo.DomHelper.append(document.body,A.autoCreate,true);
 }else{this.el=Roo.DomHelper.append(document.body,{tag:"div",cls:"x-layout-inactive-content",id:A.id||el},true);}}this.closable=false;this.loaded=false;this.active=false;if(typeof A=="string"){this.title=A;}else{Roo.apply(this,A);}if(this.toolbar&&!this.toolbar.el&&this.toolbar.xtype){this.wrapEl=this.el.wrap();
 this.toolbar.container=this.el.insertSibling(false,'before');this.toolbar=new Roo.Toolbar(this.toolbar);}if(this.footer&&!this.footer.el&&this.footer.xtype){if(!this.wrapEl){this.wrapEl=this.el.wrap();}this.footer.container=this.wrapEl.createChild();this.footer=Roo.factory(this.footer,Roo);
 }if(this.resizeEl){this.resizeEl=Roo.get(this.resizeEl,true);}else{this.resizeEl=this.el;}this.addEvents({"activate":true,"deactivate":true,"resize":true,"render":true});if(this.autoScroll){this.resizeEl.setStyle("overflow","auto");}else{this.el.on('scroll',function(){Roo.log('fix random scolling');
@@ -1932,7 +1932,7 @@ B.push(tpl.body.replace(/(\r\n|\n)/g,'\\n').replace(/'/g,"\\'").replace(this.re,
 // Roo/dialog/namespace.js
 Roo.dialog={};
 // Roo/dialog/UploadCropbox.js
-Roo.dialog.UploadCropbox=function(A){console.log("Dialog UploadCropbox Constructor");Roo.dialog.UploadCropbox.superclass.constructor.call(this,A);this.addEvents({"beforeselectfile":true,"initial":true,"crop":true,"prepare":true,"exception":true,"beforeloadcanvas":true,"trash":true,"download":true,"footerbuttonclick":true,"resize":true,"rotate":true,"inspect":true,"upload":true,"arrange":true,"loadcanvas":true}
+Roo.dialog.UploadCropbox=function(A){Roo.dialog.UploadCropbox.superclass.constructor.call(this,A);this.addEvents({"beforeselectfile":true,"initial":true,"crop":true,"prepare":true,"exception":true,"beforeloadcanvas":true,"trash":true,"download":true,"footerbuttonclick":true,"resize":true,"rotate":true,"inspect":true,"upload":true,"arrange":true,"loadcanvas":true}
 );this.buttons=this.buttons||Roo.dialog.UploadCropbox.footer.STANDARD;};Roo.extend(Roo.dialog.UploadCropbox,Roo.Component,{emptyText:'Click to upload image',rotateNotify:'Image is too small to rotate',errorTimeout:3000,scale:0,baseScale:1,rotate:0,dragable:false,pinching:false,mouseX:0,mouseY:0,cropData:false,minWidth:300,minHeight:300,file:false,exif:{}
 ,baseRotate:1,cropType:'image/jpeg',buttons:false,canvasLoaded:false,isDocument:false,method:'POST',paramName:'imageUpload',loadMask:true,loadingText:'Loading...',maskEl:false,getAutoCreate:function(){var A={tag:'div',cls:'roo-upload-cropbox',cn:[{tag:'input',cls:'roo-upload-cropbox-selector',type:'file'}
 ,{tag:'div',cls:'roo-upload-cropbox-body',style:'cursor:pointer',cn:[{tag:'div',cls:'roo-upload-cropbox-preview'},{tag:'div',cls:'roo-upload-cropbox-thumb'},{tag:'div',cls:'roo-upload-cropbox-empty-notify',html:this.emptyText},{tag:'div',cls:'roo-upload-cropbox-error-notify alert alert-danger',html:this.rotateNotify}
@@ -1946,7 +1946,7 @@ this.notifyEl.setVisibilityMode(Roo.Element.DISPLAY).originalDisplay='block';thi
 this.footerEl.setVisibilityMode(Roo.Element.DISPLAY).originalDisplay='block';this.footerEl.hide();this.setThumbBoxSize();this.bind();this.resize();this.fireEvent('initial',this);},bind:function(){var A=this;window.addEventListener("resize",function(){A.resize();
 });this.bodyEl.on('click',this.beforeSelectFile,this);if(Roo.isTouch){this.bodyEl.on('touchstart',this.onTouchStart,this);this.bodyEl.on('touchmove',this.onTouchMove,this);this.bodyEl.on('touchend',this.onTouchEnd,this);}if(!Roo.isTouch){this.bodyEl.on('mousedown',this.onMouseDown,this);
 this.bodyEl.on('mousemove',this.onMouseMove,this);var B=(/Firefox/i.test(navigator.userAgent))?'DOMMouseScroll':'mousewheel';this.bodyEl.on(B,this.onMouseWheel,this);Roo.get(document).on('mouseup',this.onMouseUp,this);}this.selectorEl.on('change',this.onFileSelected,this);
-},reset:function(){this.scale=0;this.baseScale=1;this.rotate=0;this.baseRotate=1;this.dragable=false;this.pinching=false;this.mouseX=0;this.mouseY=0;this.cropData=false;this.notifyEl.dom.innerHTML=this.emptyText;this.selectorEl.dom.value='';},resize:function(){if(this.fireEvent('resize',this)!=false){this.setThumbBoxPosition();
+},reset:function(){this.scale=0;this.baseScale=1;this.rotate=0;this.baseRotate=1;this.dragable=false;this.pinching=false;this.mouseX=0;this.mouseY=0;this.cropData=false;this.notifyEl.dom.innerHTML=this.emptyText;},resize:function(){if(this.fireEvent('resize',this)!=false){this.setThumbBoxPosition();
 this.setCanvasPosition();}},onFooterButtonClick:function(e,el,o,A){switch(A){case 'rotate-left':this.onRotateLeft(e);break;case 'rotate-right':this.onRotateRight(e);break;case 'picture':this.beforeSelectFile(e);break;case 'trash':this.trash(e);break;case 'crop':this.crop(e);
 break;case 'download':this.download(e);break;default:break;}this.fireEvent('footerbuttonclick',this,A);},beforeSelectFile:function(e){e.preventDefault();if(this.fireEvent('beforeselectfile',this)!=false){this.selectorEl.dom.click();}},onFileSelected:function(e){e.preventDefault();
 if(typeof(this.selectorEl.dom.files)=='undefined'||!this.selectorEl.dom.files.length){return;}var A=this.selectorEl.dom.files[0];if(this.fireEvent('inspect',this,A)!=false){this.prepare(A);}},trash:function(e){this.fireEvent('trash',this);},download:function(e){this.fireEvent('download',this);
@@ -1957,12 +1957,14 @@ var ph=Math.ceil((this.bodyEl.getHeight()-this.canvasEl.height)/2);this.previewE
 return;}this.mouseX=Roo.isTouch?e.browserEvent.touches[0].pageX:e.getPageX();this.mouseY=Roo.isTouch?e.browserEvent.touches[0].pageY:e.getPageY();},onMouseMove:function(e){e.stopEvent();if(!this.canvasLoaded){return;}if(!this.dragable){return;}var A=Math.ceil(this.thumbEl.getLeft(true));
 var B=Math.ceil(this.thumbEl.getTop(true));var C=Math.ceil(A+this.thumbEl.getWidth()-this.canvasEl.width);var D=Math.ceil(B+this.thumbEl.getHeight()-this.canvasEl.height);var x=Roo.isTouch?e.browserEvent.touches[0].pageX:e.getPageX();var y=Roo.isTouch?e.browserEvent.touches[0].pageY:e.getPageY();
 x=x-this.mouseX;y=y-this.mouseY;var E=Math.ceil(x+this.previewEl.getLeft(true));var F=Math.ceil(y+this.previewEl.getTop(true));E=(A<E)?A:((C>E)?C:E);F=(B<F)?B:((D>F)?D:F);this.previewEl.setLeft(E);this.previewEl.setTop(F);this.mouseX=Roo.isTouch?e.browserEvent.touches[0].pageX:e.getPageX();
-this.mouseY=Roo.isTouch?e.browserEvent.touches[0].pageY:e.getPageY();},onMouseUp:function(e){e.stopEvent();this.dragable=false;},onMouseWheel:function(e){e.stopEvent();this.startScale=this.scale;this.scale=(e.getWheelDelta()==1)?(this.scale+1):(this.scale-1);
-if(!this.zoomable()){this.scale=this.startScale;return;}this.draw();return;},zoomable:function(){var A=this.thumbEl.getWidth()/this.minWidth;if(this.minWidth<this.minHeight){A=this.thumbEl.getHeight()/this.minHeight;}var B=Math.ceil(this.imageEl.OriginWidth*this.getScaleLevel()/A);
-var C=Math.ceil(this.imageEl.OriginHeight*this.getScaleLevel()/A);if(this.isDocument&&(this.rotate==0||this.rotate==180)&&(B>this.imageEl.OriginWidth||C>this.imageEl.OriginHeight||(B<this.minWidth&&C<this.minHeight))){return false;}if(this.isDocument&&(this.rotate==90||this.rotate==270)&&(B>this.imageEl.OriginWidth||C>this.imageEl.OriginHeight||(B<this.minHeight&&C<this.minWidth))){return false;
-}if(!this.isDocument&&(this.rotate==0||this.rotate==180)&&(B<this.minWidth||B>this.imageEl.OriginWidth||C<this.minHeight||C>this.imageEl.OriginHeight)){return false;}if(!this.isDocument&&(this.rotate==90||this.rotate==270)&&(B<this.minHeight||B>this.imageEl.OriginWidth||C<this.minWidth||C>this.imageEl.OriginHeight)){return false;
-}return true;},onRotateLeft:function(e){if(!this.isDocument&&(this.canvasEl.height<this.thumbEl.getWidth()||this.canvasEl.width<this.thumbEl.getHeight())){var A=this.thumbEl.getWidth()/this.minWidth;var bw=Math.ceil(this.canvasEl.width/this.getScaleLevel());
-var bh=Math.ceil(this.canvasEl.height/this.getScaleLevel());this.startScale=this.scale;while(this.getScaleLevel()<A){this.scale=this.scale+1;if(!this.zoomable()){break;}if(Math.ceil(bw*this.getScaleLevel())<this.thumbEl.getHeight()||Math.ceil(bh*this.getScaleLevel())<this.thumbEl.getWidth()){continue;
+this.mouseY=Roo.isTouch?e.browserEvent.touches[0].pageY:e.getPageY();},onMouseUp:function(e){e.stopEvent();this.dragable=false;},onMouseWheel:function(e){e.stopEvent();this.startScale=this.scale;console.log("START SCALE: "+this.scale);this.scale=(e.getWheelDelta()==1)?(this.scale+1):(this.scale-1);
+console.log("END SCALE: "+this.scale);if(!this.zoomable()){this.scale=this.startScale;return;}this.draw();return;},zoomable:function(){console.log("THUMBEL");console.log(this.thumbEl);var A=this.thumbEl.getWidth()/this.minWidth;if(this.minWidth<this.minHeight){A=this.thumbEl.getHeight()/this.minHeight;
+}console.log("MINSCALE: "+A);var B=Math.ceil(this.imageEl.OriginWidth*this.getScaleLevel()/A);var C=Math.ceil(this.imageEl.OriginHeight*this.getScaleLevel()/A);var D=this.imageEl.OriginWidth;var E=this.imageEl.OriginHeight;if(this.imageEl.OriginWidth/this.imageEl.OriginHeight>this.minWidth/this.minHeight&&this.imageEl.OriginHeight<this.minHeight){E=this.minHeight;
+D=this.imageEl.OriginWidth/this.imageEl.OriginHeight*this.minHeight;}if(this.imageEl.OriginWidth/this.imageEl.OriginHeight<this.minWidth/this.minHeight&&this.imageEl.OriginWidth<this.minWidth){D=this.minWidth;E=this.imageEl.OriginHeight/this.imageEl.OriginWidth*this.minWidth;
+}console.log("GETSCALELEVEL: "+this.getScaleLevel());console.log("width: "+B);console.log("height: "+C);if(this.isDocument&&(this.rotate==0||this.rotate==180)&&(B>this.imageEl.OriginWidth||C>this.imageEl.OriginHeight||(B<this.minWidth&&C<this.minHeight))){return false;
+}if(this.isDocument&&(this.rotate==90||this.rotate==270)&&(B>this.imageEl.OriginWidth||C>this.imageEl.OriginHeight||(B<this.minHeight&&C<this.minWidth))){return false;}if(!this.isDocument&&(this.rotate==0||this.rotate==180)&&((this.imageEl.OriginWidth/this.imageEl.OriginHeight>this.minWidth/this.minHeight&&B<this.minWidth)||B>D||(this.imageEl.OriginWidth/this.imageEl.OriginHeight<this.minWidth/this.minHeight&&C<this.minHeight)||C>E)){return false;
+}if(!this.isDocument&&(this.rotate==90||this.rotate==270)&&(B<this.minHeight||B>this.imageEl.OriginWidth||C<this.minWidth||C>this.imageEl.OriginHeight)){return false;}return true;},onRotateLeft:function(e){if(!this.isDocument&&(this.canvasEl.height<this.thumbEl.getWidth()||this.canvasEl.width<this.thumbEl.getHeight())){var A=this.thumbEl.getWidth()/this.minWidth;
+var bw=Math.ceil(this.canvasEl.width/this.getScaleLevel());var bh=Math.ceil(this.canvasEl.height/this.getScaleLevel());this.startScale=this.scale;while(this.getScaleLevel()<A){this.scale=this.scale+1;if(!this.zoomable()){break;}if(Math.ceil(bw*this.getScaleLevel())<this.thumbEl.getHeight()||Math.ceil(bh*this.getScaleLevel())<this.thumbEl.getWidth()){continue;
 }this.rotate=(this.rotate<90)?270:this.rotate-90;this.draw();return;}this.scale=this.startScale;this.onRotateFail();return false;}this.rotate=(this.rotate<90)?270:this.rotate-90;if(this.isDocument){this.setThumbBoxSize();this.setThumbBoxPosition();this.setCanvasPosition();
 }this.draw();this.fireEvent('rotate',this,'left');},onRotateRight:function(e){if(!this.isDocument&&(this.canvasEl.height<this.thumbEl.getWidth()||this.canvasEl.width<this.thumbEl.getHeight())){var A=this.thumbEl.getWidth()/this.minWidth;var bw=Math.ceil(this.canvasEl.width/this.getScaleLevel());
 var bh=Math.ceil(this.canvasEl.height/this.getScaleLevel());this.startScale=this.scale;while(this.getScaleLevel()<A){this.scale=this.scale+1;if(!this.zoomable()){break;}if(Math.ceil(bw*this.getScaleLevel())<this.thumbEl.getHeight()||Math.ceil(bh*this.getScaleLevel())<this.thumbEl.getWidth()){continue;
@@ -2003,10 +2005,10 @@ this.baseScale=A/this.imageEl.OriginHeight;}return;}B=this.thumbEl.getHeight();t
 }return;}if(this.baseRotate==6||this.baseRotate==8){A=this.thumbEl.getHeight();this.baseScale=A/this.imageEl.OriginHeight;if(this.imageEl.OriginHeight*this.baseScale<this.thumbEl.getWidth()){B=this.thumbEl.getWidth();this.baseScale=B/this.imageEl.OriginHeight;
 }if(this.imageEl.OriginWidth>this.imageEl.OriginHeight){B=this.thumbEl.getWidth();this.baseScale=B/this.imageEl.OriginHeight;if(this.imageEl.OriginWidth*this.baseScale<this.thumbEl.getHeight()){A=this.thumbEl.getHeight();this.baseScale=A/this.imageEl.OriginWidth;
 }}return;}A=this.thumbEl.getWidth();this.baseScale=A/this.imageEl.OriginWidth;if(this.imageEl.OriginHeight*this.baseScale<this.thumbEl.getHeight()){B=this.thumbEl.getHeight();this.baseScale=B/this.imageEl.OriginHeight;}if(this.imageEl.OriginWidth>this.imageEl.OriginHeight){B=this.thumbEl.getHeight();
-this.baseScale=B/this.imageEl.OriginHeight;if(this.imageEl.OriginWidth*this.baseScale<this.thumbEl.getWidth()){A=this.thumbEl.getWidth();this.baseScale=A/this.imageEl.OriginWidth;}}return;},getScaleLevel:function(){return this.baseScale*Math.pow(1.1,this.scale);
-},onTouchStart:function(e){if(!this.canvasLoaded){this.beforeSelectFile(e);return;}var A=e.browserEvent.touches;if(!A){return;}if(A.length==1){this.onMouseDown(e);return;}if(A.length!=2){return;}var B=[];for(var i=0,C;C=A[i];i++){B.push(C.pageX,C.pageY);}
-var x=Math.pow(B[0]-B[2],2);var y=Math.pow(B[1]-B[3],2);this.startDistance=Math.sqrt(x+y);this.startScale=this.scale;this.pinching=true;this.dragable=false;},onTouchMove:function(e){if(!this.pinching&&!this.dragable){return;}var A=e.browserEvent.touches;if(!A){return;
-}if(this.dragable){this.onMouseMove(e);return;}var B=[];for(var i=0,C;C=A[i];i++){B.push(C.pageX,C.pageY);}var x=Math.pow(B[0]-B[2],2);var y=Math.pow(B[1]-B[3],2);this.endDistance=Math.sqrt(x+y);this.scale=this.startScale+Math.floor(Math.log(this.endDistance/this.startDistance)/Math.log(1.1));
+this.baseScale=B/this.imageEl.OriginHeight;if(this.imageEl.OriginWidth*this.baseScale<this.thumbEl.getWidth()){A=this.thumbEl.getWidth();this.baseScale=A/this.imageEl.OriginWidth;}}return;},getScaleLevel:function(){console.log("BASESCALE: "+this.baseScale);
+return this.baseScale*Math.pow(1.02,this.scale);},onTouchStart:function(e){if(!this.canvasLoaded){this.beforeSelectFile(e);return;}var A=e.browserEvent.touches;if(!A){return;}if(A.length==1){this.onMouseDown(e);return;}if(A.length!=2){return;}var B=[];for(var i=0,C;
+C=A[i];i++){B.push(C.pageX,C.pageY);}var x=Math.pow(B[0]-B[2],2);var y=Math.pow(B[1]-B[3],2);this.startDistance=Math.sqrt(x+y);this.startScale=this.scale;this.pinching=true;this.dragable=false;},onTouchMove:function(e){if(!this.pinching&&!this.dragable){return;
+}var A=e.browserEvent.touches;if(!A){return;}if(this.dragable){this.onMouseMove(e);return;}var B=[];for(var i=0,C;C=A[i];i++){B.push(C.pageX,C.pageY);}var x=Math.pow(B[0]-B[2],2);var y=Math.pow(B[1]-B[3],2);this.endDistance=Math.sqrt(x+y);this.scale=this.startScale+Math.floor(Math.log(this.endDistance/this.startDistance)/Math.log(1.1));
 if(!this.zoomable()){this.scale=this.startScale;return;}this.draw();},onTouchEnd:function(e){this.pinching=false;this.dragable=false;},process:function(A,B){if(this.loadMask){this.maskEl.mask(this.loadingText);}this.xhr=new XMLHttpRequest();A.xhr=this.xhr;
 this.xhr.open(this.method,this.url,true);var C={"Accept":"application/json","Cache-Control":"no-cache","X-Requested-With":"XMLHttpRequest"};for(var D in C){var E=C[D];if(E){this.xhr.setRequestHeader(D,E);}}var F=this;this.xhr.onload=function(){F.xhrOnLoad(F.xhr);
 };this.xhr.onerror=function(){F.xhrOnError(F.xhr);};var G=new FormData();G.append('returnHTML','NO');if(B){G.append('crop',B);}if(typeof(A)!='undefined'&&(typeof(A.id)=='undefined'||A.id*1<1)){G.append(this.paramName,A,A.name);}if(typeof(A.filename)!='undefined'){G.append('filename',A.filename);