From 2d3da716e893d4325c3f4e263d301ef7f5116bcf Mon Sep 17 00:00:00 2001 From: leon Date: Wed, 6 Jul 2022 10:43:06 +0800 Subject: [PATCH] roojs-core.js roojs-core-debug.js roojs-ui.js roojs-ui-debug.js roojs-all.js roojs-debug.js --- roojs-all.js | 16 +++++++++------- roojs-debug.js | 28 ++++++++++++++-------------- roojs-ui-debug.js | 28 ++++++++++++++-------------- roojs-ui.js | 16 +++++++++------- 4 files changed, 46 insertions(+), 42 deletions(-) diff --git a/roojs-all.js b/roojs-all.js index 7bbffedb74..a01e39a35c 100644 --- a/roojs-all.js +++ b/roojs-all.js @@ -2914,13 +2914,15 @@ var bh=Math.ceil(this.canvasEl.height/this.getScaleLevel());this.startScale=this }this.draw();this.fireEvent('rotate',this,'left');},onRotateRight:function(e){if(!this.isDocument&&(this.canvasEl.height180)?0:this.rotate+90;this.draw();return;}this.scale=this.startScale;this.onRotateFail();return false;}this.rotate=(this.rotate>180)?0:this.rotate+90;if(this.isDocument){this.setThumbBoxSize();this.setThumbBoxPosition();this.setCanvasPosition(); -}this.draw();this.fireEvent('rotate',this,'right');},onRotateFail:function(){this.errorEl.show(true);var A=this;(function(){A.errorEl.hide(true);}).defer(this.errorTimeout);},draw:function(){console.log("DRAW");this.previewEl.dom.innerHTML='';this.canvasEl=document.createElement("canvas"); -this.contextEl=this.canvasEl.getContext("2d");switch(this.rotate){case 0:this.canvasEl.width=this.imageEl.OriginWidth*this.getScaleLevel();this.canvasEl.height=this.imageEl.OriginHeight*this.getScaleLevel();this.contextEl.drawImage(canvasEl,0,0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height); -break;case 90:this.canvasEl.width=this.imageEl.OriginHeight*this.getScaleLevel();this.canvasEl.height=this.imageEl.OriginWidth*this.getScaleLevel();if(this.imageEl.OriginWidth>this.imageEl.OriginHeight){this.contextEl.drawImage(canvasEl,Math.abs(this.canvasEl.width-this.canvasEl.height),0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height); -break;}this.contextEl.drawImage(canvasEl,0,0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height);break;case 180:this.canvasEl.width=this.imageEl.OriginWidth*this.getScaleLevel();this.canvasEl.height=this.imageEl.OriginHeight*this.getScaleLevel(); -if(this.imageEl.OriginWidth>this.imageEl.OriginHeight){this.contextEl.drawImage(canvasEl,0,Math.abs(this.canvasEl.width-this.canvasEl.height),this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height);break;}this.contextEl.drawImage(canvasEl,Math.abs(this.canvasEl.width-this.canvasEl.height),0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height); -break;case 270:this.canvasEl.width=this.imageEl.OriginHeight*this.getScaleLevel();this.canvasEl.height=this.imageEl.OriginWidth*this.getScaleLevel();if(this.imageEl.OriginWidth>this.imageEl.OriginHeight){this.contextEl.drawImage(canvasEl,0,0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height); -break;}this.contextEl.drawImage(canvasEl,0,Math.abs(this.canvasEl.width-this.canvasEl.height),this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height);break;default:break;}this.previewEl.appendChild(this.canvasEl);this.setCanvasPosition(); +}this.draw();this.fireEvent('rotate',this,'right');},onRotateFail:function(){this.errorEl.show(true);var A=this;(function(){A.errorEl.hide(true);}).defer(this.errorTimeout);},draw:function(){console.log("DRAW");this.previewEl.dom.innerHTML='';var A=document.createElement("canvas"); +var B=A.getContext("2d");A.width=this.imageEl.OriginWidth*this.getScaleLevel();A.height=this.imageEl.OriginWidth*this.getScaleLevel();var C=this.imageEl.OriginWidth/2;if(this.imageEl.OriginWidththis.imageEl.OriginHeight){this.contextEl.drawImage(A,Math.abs(this.canvasEl.width-this.canvasEl.height),0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height); +break;}this.contextEl.drawImage(A,0,0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height);break;case 180:this.canvasEl.width=this.imageEl.OriginWidth*this.getScaleLevel();this.canvasEl.height=this.imageEl.OriginHeight*this.getScaleLevel(); +if(this.imageEl.OriginWidth>this.imageEl.OriginHeight){this.contextEl.drawImage(A,0,Math.abs(this.canvasEl.width-this.canvasEl.height),this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height);break;}this.contextEl.drawImage(A,Math.abs(this.canvasEl.width-this.canvasEl.height),0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height); +break;case 270:this.canvasEl.width=this.imageEl.OriginHeight*this.getScaleLevel();this.canvasEl.height=this.imageEl.OriginWidth*this.getScaleLevel();if(this.imageEl.OriginWidth>this.imageEl.OriginHeight){this.contextEl.drawImage(A,0,0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height); +break;}this.contextEl.drawImage(A,0,Math.abs(this.canvasEl.width-this.canvasEl.height),this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height);break;default:break;}this.previewEl.appendChild(this.canvasEl);this.setCanvasPosition(); },crop:function(){if(!this.canvasLoaded){return;}var A=document.createElement("canvas");var B=A.getContext("2d");A.width=(this.imageEl.OriginWidth>this.imageEl.OriginHeight)?this.imageEl.OriginWidth:this.imageEl.OriginHeight;A.height=(this.imageEl.OriginWidth>this.imageEl.OriginHeight)?this.imageEl.OriginWidth:this.imageEl.OriginHeight; var C=A.width/2;B.translate(C,C);B.rotate(this.rotate*Math.PI/180);B.drawImage(this.imageEl,0,0,this.imageEl.OriginWidth,this.imageEl.OriginHeight,C*-1,C*-1,this.imageEl.OriginWidth,this.imageEl.OriginHeight);var D=document.createElement("canvas");var E=D.getContext("2d"); D.width=this.minWidth;D.height=this.minHeight;switch(this.rotate){case 0:var F=(this.thumbEl.getWidth()/this.getScaleLevel()>this.imageEl.OriginWidth)?this.imageEl.OriginWidth:(this.thumbEl.getWidth()/this.getScaleLevel());var G=(this.thumbEl.getHeight()/this.getScaleLevel()>this.imageEl.OriginHeight)?this.imageEl.OriginHeight:(this.thumbEl.getHeight()/this.getScaleLevel()); diff --git a/roojs-debug.js b/roojs-debug.js index 39f43d3e19..9d3f421294 100644 --- a/roojs-debug.js +++ b/roojs-debug.js @@ -68807,26 +68807,26 @@ Roo.extend(Roo.dialog.UploadCropbox, Roo.Component, { console.log("DRAW"); this.previewEl.dom.innerHTML = ''; - // var canvasEl = document.createElement("canvas"); + var canvasEl = document.createElement("canvas"); - // var contextEl = canvasEl.getContext("2d"); + var contextEl = canvasEl.getContext("2d"); - // canvasEl.width = this.imageEl.OriginWidth * this.getScaleLevel(); - // canvasEl.height = this.imageEl.OriginWidth * this.getScaleLevel(); - // var center = this.imageEl.OriginWidth / 2; + canvasEl.width = this.imageEl.OriginWidth * this.getScaleLevel(); + canvasEl.height = this.imageEl.OriginWidth * this.getScaleLevel(); + var center = this.imageEl.OriginWidth / 2; - // if(this.imageEl.OriginWidth < this.imageEl.OriginHeight){ - // canvasEl.width = this.imageEl.OriginHeight * this.getScaleLevel(); - // canvasEl.height = this.imageEl.OriginHeight * this.getScaleLevel(); - // center = this.imageEl.OriginHeight / 2; - // } + if(this.imageEl.OriginWidth < this.imageEl.OriginHeight){ + canvasEl.width = this.imageEl.OriginHeight * this.getScaleLevel(); + canvasEl.height = this.imageEl.OriginHeight * this.getScaleLevel(); + center = this.imageEl.OriginHeight / 2; + } - // contextEl.scale(this.getScaleLevel(), this.getScaleLevel()); + contextEl.scale(this.getScaleLevel(), this.getScaleLevel()); - // contextEl.translate(center, center); - // contextEl.rotate(this.rotate * Math.PI / 180); + contextEl.translate(center, center); + contextEl.rotate(this.rotate * Math.PI / 180); - // contextEl.drawImage(this.imageEl, 0, 0, this.imageEl.OriginWidth, this.imageEl.OriginHeight, center * -1, center * -1, this.imageEl.OriginWidth, this.imageEl.OriginHeight); + contextEl.drawImage(this.imageEl, 0, 0, this.imageEl.OriginWidth, this.imageEl.OriginHeight, center * -1, center * -1, this.imageEl.OriginWidth, this.imageEl.OriginHeight); this.canvasEl = document.createElement("canvas"); diff --git a/roojs-ui-debug.js b/roojs-ui-debug.js index 923703b962..73aea0da02 100644 --- a/roojs-ui-debug.js +++ b/roojs-ui-debug.js @@ -44315,26 +44315,26 @@ Roo.extend(Roo.dialog.UploadCropbox, Roo.Component, { console.log("DRAW"); this.previewEl.dom.innerHTML = ''; - // var canvasEl = document.createElement("canvas"); + var canvasEl = document.createElement("canvas"); - // var contextEl = canvasEl.getContext("2d"); + var contextEl = canvasEl.getContext("2d"); - // canvasEl.width = this.imageEl.OriginWidth * this.getScaleLevel(); - // canvasEl.height = this.imageEl.OriginWidth * this.getScaleLevel(); - // var center = this.imageEl.OriginWidth / 2; + canvasEl.width = this.imageEl.OriginWidth * this.getScaleLevel(); + canvasEl.height = this.imageEl.OriginWidth * this.getScaleLevel(); + var center = this.imageEl.OriginWidth / 2; - // if(this.imageEl.OriginWidth < this.imageEl.OriginHeight){ - // canvasEl.width = this.imageEl.OriginHeight * this.getScaleLevel(); - // canvasEl.height = this.imageEl.OriginHeight * this.getScaleLevel(); - // center = this.imageEl.OriginHeight / 2; - // } + if(this.imageEl.OriginWidth < this.imageEl.OriginHeight){ + canvasEl.width = this.imageEl.OriginHeight * this.getScaleLevel(); + canvasEl.height = this.imageEl.OriginHeight * this.getScaleLevel(); + center = this.imageEl.OriginHeight / 2; + } - // contextEl.scale(this.getScaleLevel(), this.getScaleLevel()); + contextEl.scale(this.getScaleLevel(), this.getScaleLevel()); - // contextEl.translate(center, center); - // contextEl.rotate(this.rotate * Math.PI / 180); + contextEl.translate(center, center); + contextEl.rotate(this.rotate * Math.PI / 180); - // contextEl.drawImage(this.imageEl, 0, 0, this.imageEl.OriginWidth, this.imageEl.OriginHeight, center * -1, center * -1, this.imageEl.OriginWidth, this.imageEl.OriginHeight); + contextEl.drawImage(this.imageEl, 0, 0, this.imageEl.OriginWidth, this.imageEl.OriginHeight, center * -1, center * -1, this.imageEl.OriginWidth, this.imageEl.OriginHeight); this.canvasEl = document.createElement("canvas"); diff --git a/roojs-ui.js b/roojs-ui.js index a169601baf..d5b73c0752 100644 --- a/roojs-ui.js +++ b/roojs-ui.js @@ -1968,13 +1968,15 @@ var bh=Math.ceil(this.canvasEl.height/this.getScaleLevel());this.startScale=this }this.draw();this.fireEvent('rotate',this,'left');},onRotateRight:function(e){if(!this.isDocument&&(this.canvasEl.height180)?0:this.rotate+90;this.draw();return;}this.scale=this.startScale;this.onRotateFail();return false;}this.rotate=(this.rotate>180)?0:this.rotate+90;if(this.isDocument){this.setThumbBoxSize();this.setThumbBoxPosition();this.setCanvasPosition(); -}this.draw();this.fireEvent('rotate',this,'right');},onRotateFail:function(){this.errorEl.show(true);var A=this;(function(){A.errorEl.hide(true);}).defer(this.errorTimeout);},draw:function(){console.log("DRAW");this.previewEl.dom.innerHTML='';this.canvasEl=document.createElement("canvas"); -this.contextEl=this.canvasEl.getContext("2d");switch(this.rotate){case 0:this.canvasEl.width=this.imageEl.OriginWidth*this.getScaleLevel();this.canvasEl.height=this.imageEl.OriginHeight*this.getScaleLevel();this.contextEl.drawImage(canvasEl,0,0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height); -break;case 90:this.canvasEl.width=this.imageEl.OriginHeight*this.getScaleLevel();this.canvasEl.height=this.imageEl.OriginWidth*this.getScaleLevel();if(this.imageEl.OriginWidth>this.imageEl.OriginHeight){this.contextEl.drawImage(canvasEl,Math.abs(this.canvasEl.width-this.canvasEl.height),0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height); -break;}this.contextEl.drawImage(canvasEl,0,0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height);break;case 180:this.canvasEl.width=this.imageEl.OriginWidth*this.getScaleLevel();this.canvasEl.height=this.imageEl.OriginHeight*this.getScaleLevel(); -if(this.imageEl.OriginWidth>this.imageEl.OriginHeight){this.contextEl.drawImage(canvasEl,0,Math.abs(this.canvasEl.width-this.canvasEl.height),this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height);break;}this.contextEl.drawImage(canvasEl,Math.abs(this.canvasEl.width-this.canvasEl.height),0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height); -break;case 270:this.canvasEl.width=this.imageEl.OriginHeight*this.getScaleLevel();this.canvasEl.height=this.imageEl.OriginWidth*this.getScaleLevel();if(this.imageEl.OriginWidth>this.imageEl.OriginHeight){this.contextEl.drawImage(canvasEl,0,0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height); -break;}this.contextEl.drawImage(canvasEl,0,Math.abs(this.canvasEl.width-this.canvasEl.height),this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height);break;default:break;}this.previewEl.appendChild(this.canvasEl);this.setCanvasPosition(); +}this.draw();this.fireEvent('rotate',this,'right');},onRotateFail:function(){this.errorEl.show(true);var A=this;(function(){A.errorEl.hide(true);}).defer(this.errorTimeout);},draw:function(){console.log("DRAW");this.previewEl.dom.innerHTML='';var A=document.createElement("canvas"); +var B=A.getContext("2d");A.width=this.imageEl.OriginWidth*this.getScaleLevel();A.height=this.imageEl.OriginWidth*this.getScaleLevel();var C=this.imageEl.OriginWidth/2;if(this.imageEl.OriginWidththis.imageEl.OriginHeight){this.contextEl.drawImage(A,Math.abs(this.canvasEl.width-this.canvasEl.height),0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height); +break;}this.contextEl.drawImage(A,0,0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height);break;case 180:this.canvasEl.width=this.imageEl.OriginWidth*this.getScaleLevel();this.canvasEl.height=this.imageEl.OriginHeight*this.getScaleLevel(); +if(this.imageEl.OriginWidth>this.imageEl.OriginHeight){this.contextEl.drawImage(A,0,Math.abs(this.canvasEl.width-this.canvasEl.height),this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height);break;}this.contextEl.drawImage(A,Math.abs(this.canvasEl.width-this.canvasEl.height),0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height); +break;case 270:this.canvasEl.width=this.imageEl.OriginHeight*this.getScaleLevel();this.canvasEl.height=this.imageEl.OriginWidth*this.getScaleLevel();if(this.imageEl.OriginWidth>this.imageEl.OriginHeight){this.contextEl.drawImage(A,0,0,this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height); +break;}this.contextEl.drawImage(A,0,Math.abs(this.canvasEl.width-this.canvasEl.height),this.canvasEl.width,this.canvasEl.height,0,0,this.canvasEl.width,this.canvasEl.height);break;default:break;}this.previewEl.appendChild(this.canvasEl);this.setCanvasPosition(); },crop:function(){if(!this.canvasLoaded){return;}var A=document.createElement("canvas");var B=A.getContext("2d");A.width=(this.imageEl.OriginWidth>this.imageEl.OriginHeight)?this.imageEl.OriginWidth:this.imageEl.OriginHeight;A.height=(this.imageEl.OriginWidth>this.imageEl.OriginHeight)?this.imageEl.OriginWidth:this.imageEl.OriginHeight; var C=A.width/2;B.translate(C,C);B.rotate(this.rotate*Math.PI/180);B.drawImage(this.imageEl,0,0,this.imageEl.OriginWidth,this.imageEl.OriginHeight,C*-1,C*-1,this.imageEl.OriginWidth,this.imageEl.OriginHeight);var D=document.createElement("canvas");var E=D.getContext("2d"); D.width=this.minWidth;D.height=this.minHeight;switch(this.rotate){case 0:var F=(this.thumbEl.getWidth()/this.getScaleLevel()>this.imageEl.OriginWidth)?this.imageEl.OriginWidth:(this.thumbEl.getWidth()/this.getScaleLevel());var G=(this.thumbEl.getHeight()/this.getScaleLevel()>this.imageEl.OriginHeight)?this.imageEl.OriginHeight:(this.thumbEl.getHeight()/this.getScaleLevel()); -- 2.39.2