silverstripe-reports/javascript/ImageEditor/Resize.js
Ingo Schommer fd8ba77c27 mujma: BUGFIX: Removed image flickering after operation(crop,rotate,resize), problem still occurs under Safari.
(merged from branches/gsoc)


git-svn-id: svn://svn.silverstripe.com/silverstripe/open/modules/cms/trunk@41986 467b73ca-7a2a-4603-9d3b-597d59a354a9
2007-09-16 00:49:34 +00:00

73 lines
3.0 KiB
JavaScript

/**
* @author Mateusz
*/
var Resize = {
initialize: function(element) {
this.element = element;
this.leftBoxConstraint = 20;
this.topBoxConstraint = 100;
this.getRelativeMousePos = Resize.getRelativeMousePos.bind(this);
options = {
resizeStop: Resize.resizeStop.bind(this),
onDrag: Resize.onDrag.bind(this),
onResize: Resize.onResize.bind(this),
getMousePos: Resize.getMousePos.bind(this)
};
new Positioning.addBehaviour(this.element);
this.imageContainerResize = new Resizeable.initialize(element,options);
this.imageContainerResize.setVisible(false);
},
resizeStop: function(event) {
if(EventStack.getLastEventElement() != null) {
imageElement = $('image');
EventStack.clearStack();
if(this.imageContainerResize.isEnabled) {
if(this.imageContainerResize.originalWidth != imageElement.width || this.imageContainerResize.originalHeight != imageElement.height) {
$('imageContainer').style.backgroundImage = 'url("")';
imageTransformation.resize(imageElement.width,imageElement.height,Resize.resizeCallback.bind(this));
effects.disableRotate();
crop.disable();
this.imageContainerResize.disable();
imageHistory.disable();
}
}
}
},
resizeCallback: function() {
$('imageContainer').style.backgroundImage = 'url("' + $('image').src + '")';
},
onDrag: function()
{
if(this.element.getTop() < this.topBoxConstraint) this.element.style.top = this.topBoxConstraint + "px";
if(this.element.getLeft() < this.leftBoxConstraint) this.element.style.left = this.leftBoxConstraint + "px";
if(this.element.getTop() + this.element.getHeight() >= this.element.getParentHeight()) this.element.style.top = this.element.getParentHeight() - this.element.getHeight() - 3 + 'px';
if(this.element.getLeft() + this.element.getWidth() > this.element.getParentWidth()) this.element.style.left = this.element.getParentWidth() - this.element.getWidth() - 3 + 'px';
imageBox.reCenterIndicator();
},
onResize: function(width,height) {
$('image').style.width = width + "px";
$('image').style.height = height + "px";
},
getMousePos: function(event) {
relativeMouseX = this.getRelativeMousePos(event).x;
relativeMouseY = this.getRelativeMousePos(event).y;
if(relativeMouseX <= this.leftBoxConstraint) x = this.leftBoxConstraint + this.element.getParentLeft(); else x = relativeMouseX + this.element.getParentLeft();
if(relativeMouseY <= this.topBoxConstraint) y = this.topBoxConstraint + this.element.getParentTop(); else y = relativeMouseY + this.element.getParentTop();
if(relativeMouseX >= this.element.getParentWidth()) {
x = this.element.getParentLeft() + this.element.getParentWidth();
}
if(relativeMouseY >= this.element.getParentHeight()) y = this.element.getParentTop() + this.element.getParentHeight();
return {x: x,y: y};
},
getRelativeMousePos: function(event) {
relativeMouseX = Event.pointerX(event) - this.element.getParentLeft();
relativeMouseY = Event.pointerY(event) - this.element.getParentTop();
return {x: relativeMouseX,y: relativeMouseY};
}
}