tonyair/silverstripe-reports
1
0
Fork 0
mirror of https://github.com/silverstripe/silverstripe-reports synced 2024-06-28 15:39:25 +02:00
Code Issues Projects Releases Wiki Activity

mujma: ENHANCEMENT: Added preserving ratio during resize.

Browse Source 
(merged from branches/gsoc)


git-svn-id: svn://svn.silverstripe.com/silverstripe/open/modules/cms/trunk@42048 467b73ca-7a2a-4603-9d3b-597d59a354a9
This commit is contained in:
Ingo Schommer 2007-09-16 02:24:11 +00:00
parent 296344fd15
commit 2d04f8e14b
3 changed files with 32 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
javascript/ImageEditor/Crop.js
View File

@ -84,6 +84,16 @@ var Crop = {
}, },
onResize: function(width,height) { onResize: function(width,height) {
if(width + parseInt(this.cropBox.style.left) > Element.getDimensions(this.imageContainer).width) {
this.cropBox.style.left = parseInt(this.cropBox.style.left) - Math.abs(Element.getDimensions(this.imageContainer).width - (width + parseInt(this.cropBox.style.left))) + "px";
}
if(parseInt(this.cropBox.style.left) < 0) {
this.cropBox.style.left = "0px";
}
if(width > Element.getDimensions(this.imageContainer).width) {
this.cropBox.style.width = Element.getDimensions(this.imageContainer).width + "px";
width = Element.getDimensions(this.imageContainer).width;
}
this.placeGreyBox(width,height); this.placeGreyBox(width,height);
}, },
getMousePos: function(event) { getMousePos: function(event) {

2
javascript/ImageEditor/Resize.js
View File

@ -5,7 +5,7 @@ var Resize = {
initialize: function(element) { initialize: function(element) {
this.element = element; this.element = element;
this.leftBoxConstraint = 2; this.leftBoxConstraint = 1;
this.topBoxConstraint = 0; this.topBoxConstraint = 0;
this.getRelativeMousePos = Resize.getRelativeMousePos.bind(this); this.getRelativeMousePos = Resize.getRelativeMousePos.bind(this);
options = { options = {

38
javascript/ImageEditor/Resizeable.js
View File

@ -25,12 +25,13 @@ Resizeable = {
} }
}, },
leftUpperDrag: function(event,top,left,height,width,parentTop,parentLeft,relativeMouseX,relativeMouseY) { leftUpperDrag: function(event,top,left,height,width,parentTop,parentLeft,relativeMouseX,relativeMouseY,ratio) {
newWidth = left - relativeMouseX + width;
newHeight = top - relativeMouseY + height; newHeight = top - relativeMouseY + height;
newWidth = Math.round(newHeight / ratio);
if(this.resize(newWidth,newHeight)) { if(this.resize(newWidth,newHeight)) {
this.element.style.top = top - (newHeight - height) + "px"; this.element.style.top = top - (newHeight - height) + "px";
this.element.style.left = left - (newWidth - width) + "px"; this.element.style.left = left - (newWidth - width) + "px";
if(parseInt(this.element.style.left) < 0) this.element.style.left = "1px";
} }
}, },
@ -39,16 +40,19 @@ Resizeable = {
if(this.resize(newWidth,-1000)) this.element.style.left = left - (left - relativeMouseX) + "px"; if(this.resize(newWidth,-1000)) this.element.style.left = left - (left - relativeMouseX) + "px";
}, },
leftLowerDrag: function(event,top,left,height,width,parentTop,parentLeft,relativeMouseX,relativeMouseY) { leftLowerDrag: function(event,top,left,height,width,parentTop,parentLeft,relativeMouseX,relativeMouseY,ratio) {
newWidth = left - relativeMouseX + width;
newHeight = relativeMouseY - (top + height) + height; newHeight = relativeMouseY - (top + height) + height;
if(this.resize(newWidth,newHeight)) this.element.style.left = left - (left - relativeMouseX) + "px"; newWidth = Math.round(newHeight / ratio);
if(this.resize(newWidth,newHeight)) {
this.element.style.left = left - (newWidth - width) + "px";
if(parseInt(this.element.style.left) < 0) this.element.style.left = "1px";
}
}, },
rightUpperDrag: function(event,top,left,height,width,parentTop,parentLeft,relativeMouseX,relativeMouseY) { rightUpperDrag: function(event,top,left,height,width,parentTop,parentLeft,relativeMouseX,relativeMouseY,ratio) {
newWidth = relativeMouseX - left - width + width; newHeight = top - relativeMouseY + height;
newHeight = top - relativeMouseY + height; newWidth = Math.round(newHeight / ratio);
if(this.resize(newWidth,newHeight)) this.element.style.top = (top - (newHeight - height) ) + 'px'; if(this.resize(newWidth,newHeight)) this.element.style.top = (top - (newHeight - height) ) + 'px';
}, },
rightMiddleDrag: function(event,top,left,height,width,parentTop,parentLeft,relativeMouseX,relativeMouseY) { rightMiddleDrag: function(event,top,left,height,width,parentTop,parentLeft,relativeMouseX,relativeMouseY) {
@ -56,9 +60,9 @@ Resizeable = {
this.resize(newWidth,-1000); this.resize(newWidth,-1000);
}, },
rightLowerDrag: function(event,top,left,height,width,parentTop,parentLeft,relativeMouseX,relativeMouseY) { rightLowerDrag: function(event,top,left,height,width,parentTop,parentLeft,relativeMouseX,relativeMouseY,ratio) {
newWidth = relativeMouseX - left;
newHeight = relativeMouseY - top; newHeight = relativeMouseY - top;
newWidth = Math.round(newHeight / ratio);
this.resize(newWidth,newHeight); this.resize(newWidth,newHeight);
}, },
@ -76,26 +80,26 @@ Resizeable = {
onResize: function(event) { onResize: function(event) {
if(EventStack.getLastEventElement() != null && this.isVisible && this.isEnabled) { if(EventStack.getLastEventElement() != null && this.isVisible && this.isEnabled) {
lastEventElement = EventStack.getLastEventElement(); lastEventElement = EventStack.getLastEventElement();
var relativeMouseX = this.getMousePos(event).x - this.element.getParentLeft(); var relativeMouseX = this.getMousePos(event).x - this.element.getParentLeft();
var relativeMouseY = this.getMousePos(event).y - this.element.getParentTop(); var relativeMouseY = this.getMousePos(event).y - this.element.getParentTop();
if(Element.hasClassName(lastEventElement,'leftUpperClickBox')) { if(Element.hasClassName(lastEventElement,'leftUpperClickBox')) {
this.leftUpperDrag(event,this.element.getTop(),this.element.getLeft(),this.element.getHeight(),this.element.getWidth(),this.element.getParentTop(),this.element.getParentLeft(),relativeMouseX,relativeMouseY); this.leftUpperDrag(event,this.element.getTop(),this.element.getLeft(),this.element.getHeight(),this.element.getWidth(),this.element.getParentTop(),this.element.getParentLeft(),relativeMouseX,relativeMouseY,this.originalHeight/this.originalWidth);
} }
if(Element.hasClassName(lastEventElement,'leftMiddleClickBox')) { if(Element.hasClassName(lastEventElement,'leftMiddleClickBox')) {
this.leftMiddleDrag(event,this.element.getTop(),this.element.getLeft(),this.element.getHeight(),this.element.getWidth(),this.element.getParentTop(),this.element.getParentLeft(),relativeMouseX,relativeMouseY); this.leftMiddleDrag(event,this.element.getTop(),this.element.getLeft(),this.element.getHeight(),this.element.getWidth(),this.element.getParentTop(),this.element.getParentLeft(),relativeMouseX,relativeMouseY);
} }
if(Element.hasClassName(lastEventElement,'leftLowerClickBox')) { if(Element.hasClassName(lastEventElement,'leftLowerClickBox')) {
this.leftLowerDrag(event,this.element.getTop(),this.element.getLeft(),this.element.getHeight(),this.element.getWidth(),this.element.getParentTop(),this.element.getParentLeft(),relativeMouseX,relativeMouseY); this.leftLowerDrag(event,this.element.getTop(),this.element.getLeft(),this.element.getHeight(),this.element.getWidth(),this.element.getParentTop(),this.element.getParentLeft(),relativeMouseX,relativeMouseY,this.originalHeight/this.originalWidth);
} }
if(Element.hasClassName(lastEventElement,'rightUpperClickBox')) { if(Element.hasClassName(lastEventElement,'rightUpperClickBox')) {
this.rightUpperDrag(event,this.element.getTop(),this.element.getLeft(),this.element.getHeight(),this.element.getWidth(),this.element.getParentTop(),this.element.getParentLeft(),relativeMouseX,relativeMouseY); this.rightUpperDrag(event,this.element.getTop(),this.element.getLeft(),this.element.getHeight(),this.element.getWidth(),this.element.getParentTop(),this.element.getParentLeft(),relativeMouseX,relativeMouseY,this.originalHeight/this.originalWidth);
} }
if(Element.hasClassName(lastEventElement,'rightMiddleClickBox')) { if(Element.hasClassName(lastEventElement,'rightMiddleClickBox')) {
this.rightMiddleDrag(event,this.element.getTop(),this.element.getLeft(),this.element.getHeight(),this.element.getWidth(),this.element.getParentTop(),this.element.getParentLeft(),relativeMouseX,relativeMouseY); this.rightMiddleDrag(event,this.element.getTop(),this.element.getLeft(),this.element.getHeight(),this.element.getWidth(),this.element.getParentTop(),this.element.getParentLeft(),relativeMouseX,relativeMouseY);
} }
if(Element.hasClassName(lastEventElement,'rightLowerClickBox')) { if(Element.hasClassName(lastEventElement,'rightLowerClickBox')) {
this.rightLowerDrag(event,this.element.getTop(),this.element.getLeft(),this.element.getHeight(),this.element.getWidth(),this.element.getParentTop(),this.element.getParentLeft(),relativeMouseX,relativeMouseY); this.rightLowerDrag(event,this.element.getTop(),this.element.getLeft(),this.element.getHeight(),this.element.getWidth(),this.element.getParentTop(),this.element.getParentLeft(),relativeMouseX,relativeMouseY,this.originalHeight/this.originalWidth);
} }
if(Element.hasClassName(lastEventElement,'upperMiddleClickBox')) { if(Element.hasClassName(lastEventElement,'upperMiddleClickBox')) {
this.upperMiddleDrag(event,this.element.getTop(),this.element.getLeft(),this.element.getHeight(),this.element.getWidth(),this.element.getParentTop(),this.element.getParentLeft(),relativeMouseX,relativeMouseY); this.upperMiddleDrag(event,this.element.getTop(),this.element.getLeft(),this.element.getHeight(),this.element.getWidth(),this.element.getParentTop(),this.element.getParentLeft(),relativeMouseX,relativeMouseY);