%PDF- %PDF-
| Direktori : /proc/self/root/home/bitrix/www/local/components/p4/p.user.profile/cropresizer/ |
| Current File : //proc/self/root/home/bitrix/www/local/components/p4/p.user.profile/cropresizer/cropresizer.js |
/***************************************************************
* FC-CropResizer
*
* Copyright (C) 2008 by Alexander Burtsev - http://fastcoder.org/
*
* This program is free software; you can redistribute it and/or
* modify it under the terms of the BSD Licenses
***************************************************************/
var cropresizer = { // NAMESPACE
archive : {},
getObject : function(id) {
if (typeof this.archive[id] == "undefined") {
this.archive[id] = new this.fc(id);
}
return this.archive[id];
}
};
cropresizer.fc = function(id) { // Constructor
// Vars
this.id = id;
// Image data
this.iWidth = 0;
this.iHeight = 0;
this.iMaxWidth = 0;
this.iMaxHeight = 0;
this.iMinWidth = 0;
this.iMinHeight = 0;
this.iTop = 0;
this.iLeft = 0;
this.iRate = 0;
// Crop block data
this.cropWidth = 100;
this.cropHeight = 100;
this.cropTop = 0;
this.cropLeft = 0;
this.cropBackground = false;
// Move
this.X0 = 0;
this.Y0 = 0;
// Resize div data
this.resizeWidth = 16;
this.resizeHeight = 16;
this.resizeTop = 0;
this.resizeLeft = 0;
// Resize move
this.iBuferWidth = 0;
this.iBuferHeight = 0;
// Flags
this.cropMoveState = false;
this.resizeMoveState = false;
this.saveProportions = true;
this.withContainer = true;
this.stopSelection = true;
this.showCropSize = true;
this.debugMode = true;
// Handlers
this.onUpdate = null;
// Nodes
this.image = null;
this.crop = null;
this.resize = null;
}
cropresizer.fc.prototype = {
// Const
ERRORS : {
1 : "Object initialisation error",
2 : "Image was not found",
3 : "Element in not image",
4 : "Callback-function [onUpdate] was not defined",
5 : "HTML-element BODY was not defined"
},
// Methods
// Default
gebi : function(id) {
return document.getElementById(id);
},
addHandler : function(object, event, handler, useCapture) {
if (object.addEventListener) {
object.addEventListener(event, handler, useCapture ? useCapture : false);
} else if (object.attachEvent) {
object.attachEvent('on' + event, handler);
} else alert(this.errorArray[9]);
},
defPosition : function(event) {
var x = y = 0;
if (document.attachEvent != null) {
x = window.event.clientX + document.documentElement.scrollLeft + document.body.scrollLeft;
y = window.event.clientY + document.documentElement.scrollTop + document.body.scrollTop;
}
if (!document.attachEvent && document.addEventListener) { // Gecko
x = event.clientX + window.scrollX;
y = event.clientY + window.scrollY;
}
return {x:x, y:y};
},
absPosition : function(obj) {
var x = y = 0;
while(obj) {
x += obj.offsetLeft;
y += obj.offsetTop;
obj = obj.offsetParent;
}
return {x:x, y:y};
},
domReady : function(i) { /* Copyright http://ajaxian.com/ */
var u =navigator.userAgent;
var e=/*@cc_on!@*/false;
var st = setTimeout;
if (/webkit/i.test(u)) {
st(
function() {
var dr=document.readyState;
if(dr=="loaded"||dr=="complete") i();
else st(arguments.callee,10);
},
10
);
} else if ((/mozilla/i.test(u)&&!/(compati)/.test(u)) || (/opera/i.test(u))) {
document.addEventListener("DOMContentLoaded", i, false);
} else if (e) {(
function(){
var t=document.createElement('doc:rdy');
try {
t.doScroll('left'); i(); t=null;
} catch(e) {st(arguments.callee,0);}
})();
} else window.onload=i;
},
// Common
debug : function(keys) {
if (!this.debugMode) return;
var mes = "";
for (var i = 0; i < keys.length; i++) mes += this.ERRORS[keys[i]] + " : ";
mes = mes.substring(0, mes.length - 3);
alert(mes);
},
init : function(hash, node) {
if (typeof node == "undefined") {
var _this = this;
this.domReady(
function() {_this.init(hash, 1)}
);
return;
}
this.image = this.gebi(this.id);
if (this.image == null) {
this.debug([1,2]);
return;
}
if (this.image.nodeName.toLowerCase() != "img") {
this.debug([1,3]);
return;
}
try {
for (var i in hash) this[i] = hash[i];
if (this.onUpdate == null) {
this.debug([1,4]);
return;
}
if (!document.body) {
this.debug([1,5]);
return;
}
this.image.ondragstart = function() {return false;} // IE fix
// Set default
this.redefine();
this.iMaxWidth = this.iWidth;
this.iMaxHeight = this.iHeight;
this.iMinWidth = this.cropWidth;
this.iMinHeight = this.cropHeight;;
this.iRate = this.iWidth / this.iHeight;
if (this.withContainer) this.addContainer();
this.drawCropBlock();
this.drawResizeBlock();
// Add handers
var _this = this;
this.addHandler(document, "mousemove", function (evt) {
_this.cropMoveHandler(evt);
_this.resizeMoveHandler(evt);
});
this.addHandler(document, "mouseup", function () {
_this.cropMoveState = false;
_this.resizeMoveState = false;
_this.redefine();
});
this.addHandler(_this.crop, "mousedown", function (evt) {
_this.cropMoveState = true;
evt = evt || window.event;
if (evt.preventDefault && _this.stopSelection)
evt.preventDefault();
_this.X0 = _this.defPosition(evt).x;
_this.Y0 = _this.defPosition(evt).y;
});
this.addHandler(_this.resize, "mousedown", function (evt) {
_this.resizeMoveState = true;
evt = evt || window.event;
if (evt.preventDefault && _this.stopSelection)
evt.preventDefault();
_this.X0 = _this.defPosition(evt).x;
_this.Y0 = _this.defPosition(evt).y;
_this.iBuferWidth = _this.iWidth;
_this.iBuferHeight = _this.iHeight;
});
} catch(e) {this.debug([1]);}
},
addContainer : function() {
var div = document.createElement("div");
div.style.width = this.iMaxWidth + "px";
div.style.height = this.iMaxHeight + "px";
div.appendChild(this.image.cloneNode(true));
this.image.parentNode.replaceChild(div, this.image);
this.image = div.firstChild;
},
redefine : function() {
this.iTop = this.absPosition(this.image).y;
this.iLeft = this.absPosition(this.image).x;
this.iWidth = this.image.style.width ? parseInt(this.image.style.width) : this.image.offsetWidth;
this.iHeight = this.image.style.height ? parseInt(this.image.style.height) : this.image.offsetHeight;
this.resizeTop = this.iTop + this.iHeight;
this.resizeLeft = this.iLeft + this.iWidth;
if (this.crop) {
this.cropLeft = parseInt(this.crop.style.left);
this.cropTop = parseInt(this.crop.style.top);
}
this.onUpdate();
},
// Crop
drawCropBlock : function() {
if (!this.gebi("cropDivId_" + this.id)) {
this.crop = document.createElement("div");
this.crop.id = "cropDivId_" + this.id;
this.crop.className = "cropDiv";
this.crop.style.width = this.cropWidth + "px";
this.crop.style.height = this.cropHeight + "px";
this.crop.style.display = "none";
document.body.appendChild(this.crop);
}
this.crop = this.gebi("cropDivId_" + this.id);
this.cropTop = this.iTop + (this.iHeight - this.cropHeight) / 2;
this.cropLeft = this.iLeft + (this.iWidth - this.cropWidth) / 2;
this.crop.style.top = this.cropTop + "px";
this.crop.style.left = this.cropLeft + "px";
if (this.cropBackground) this.crop.style.background = this.cropBackground;
this.crop.innerHTML = "<div>" + (this.showCropSize ? "<span>" + this.cropWidth + "x" + this.cropHeight + "</span>" : "") + "<div></div></div>";
this.crop.style.display = "";
},
cropMoveHandler : function(evt) {
if (!this.cropMoveState) return;
evt = evt || window.event;
var newX = this.defPosition(evt).x - this.X0 + this.cropLeft;
var newY = this.defPosition(evt).y - this.Y0 + this.cropTop;
if (newX < this.iLeft) newX = this.iLeft;
if (newX + this.cropWidth > this.iLeft + this.iWidth) newX = this.iLeft + this.iWidth - this.cropWidth;
if (newY < this.iTop) newY = this.iTop;
if (newY + this.cropHeight > this.iTop + this.iHeight) newY = this.iTop + this.iHeight - this.cropHeight;
this.crop.style.top = newY + "px";
this.crop.style.left = newX + "px";
},
// Resize
drawResizeBlock : function() {
if (!this.gebi("resizeDivId_" + this.id)) {
this.resize = document.createElement("div");
this.resize.id = "resizeDivId_" + this.id;
this.resize.className = "resizeDiv";
this.resize.innerHTML = "<img src=\"i/0.gif\" width=\"1\" height=\"1\" alt=\"\">";
this.resize.style.width = this.resizeWidth + "px";
this.resize.style.height = this.resizeHeight + "px";
this.resize.style.display = "none";
document.body.appendChild(this.resize);
}
this.resize = this.gebi("resizeDivId_" + this.id);
this.setResizeVars();
this.resize.style.display = "";
},
setResizeVars : function() {
this.redefine();
this.resize.style.top = (this.resizeTop - 10) + "px";
this.resize.style.left = (this.resizeLeft - 10) + "px";
},
resizeMoveHandler : function(evt) {
if (!this.resizeMoveState) return;
evt = evt || window.event;
var nW, nH;
hW = this.iBuferWidth + this.defPosition(evt).x - this.X0;
hH = this.iBuferHeight + this.defPosition(evt).y - this.Y0;
if (this.iRate < 1) {
hW = this.iBuferWidth + this.defPosition(evt).x - this.X0;
if (this.saveProportions) hH = hW / this.iRate;
else hH = this.iBuferHeight + this.defPosition(evt).y - this.Y0;
} else {
hH = this.iBuferHeight + this.defPosition(evt).y - this.Y0;
if (this.saveProportions) hW = this.iRate * hH;
else hW = this.iBuferWidth + this.defPosition(evt).x - this.X0;
}
if (hW <= this.iMinWidth) hW = this.iMinWidth;
if (hW > this.iMaxWidth) hW = this.iMaxWidth;
if (hH <= this.iMinHeight) hH = this.iMinHeight;
if (hH > this.iMaxHeight) hH = this.iMaxHeight;
if (this.iRate < 1) {
this.image.style.width = hW + "px";
this.image.style.height = (this.saveProportions ? hW / this.iRate : hH) + "px";
} else {
this.image.style.height = hH + "px";
this.image.style.width = (this.saveProportions ? this.iRate * hH : hW) + "px";
}
var crop_dY = this.resizeTop - this.cropTop - this.cropHeight;
var crop_dX = this.resizeLeft - this.cropLeft - this.cropWidth;
if (crop_dY < 0) this.crop.style.top = (this.cropTop + crop_dY) + "px";
if (crop_dX < 0) this.crop.style.left = (this.cropLeft + crop_dX) + "px";
this.setResizeVars();
}
}