var userAgent = navigator.userAgent.toLowerCase();
var isIE = ((userAgent.indexOf("msie") != -1) && (userAgent.indexOf("opera") == -1) && (userAgent.indexOf("webtv") == -1));
var popupImages = new Array();
var indicatorIcon = "images/icons/indicator.gif";
var closeIcon = "images/icons/close.gif";
var siteURL = "";
var originalImage = ""; // save here image name when we use zoom over it
var zoomWidth = "";
var zoomHeight = "";
var zoomMousePos = "";
function openImage(a, width, height)
{
// when action is linked to element like view me
var image_href = a.href;
var image_title = a.title;
// when action is linked to element like document.getElementById('sample').onmouseover = popupImage;
if (!image_href) {
var image_href = this.href;
var image_title = this.title;
}
if (!image_href)
return false;
var scrollbars = "no";
// add margins to image size
if (width > 0 && height > 0) {
width += 30; height += 30;
}
// check available sizes
var availableHeight = window.screen.availHeight - 60;
var availableWidth = window.screen.availWidth - 20;
if (isNaN(availableHeight)) { availableHeight = 520; }
if (isNaN(availableWidth)) { availableWidth = 760; }
if (height > availableHeight || height == 0) {
height = availableHeight;
scrollbars = "yes";
}
if (width > availableWidth || width == 0) {
width = availableWidth;
scrollbars = "yes";
}
var openImageWin = window.open (image_href, 'openImageWin', 'left=0,top=0,toolbar=no,location=no,directories=no,status=yes,menubar=no,scrollbars=' + scrollbars + ',resizable=yes,width=' + width + ',height=' + height);
openImageWin.focus();
return false;
}
/*************************** MouseOver Effect ***************************/
function popupImageMouseOver(a, globalURL){
if (globalURL) {
siteURL = globalURL;
} else {
siteURL = "";
}
var image_title = a.title;
var image_href = a.href;
if (!image_href) {
var image_href = this.href;
var image_title = this.title;
}
if (!image_href)
return false;
var black_cloud = document.getElementById("black_cloud");
if (!black_cloud) {
var black_cloud = document.createElement('div');
black_cloud.id = "black_cloud";
black_cloud.onclick = hideBlack;
black_cloud.style.position = "absolute";
black_cloud.style.zIndex = "3500";
black_cloud.style.top = "0px";
black_cloud.style.left = "0px";
black_cloud.style.opacity = "0.9";
black_cloud.style.mozOpacity = "0.9";
black_cloud.style.filter = "alpha(opacity=90)";
black_cloud.style.backgroundColor = "";
document.body.appendChild(black_cloud);
} else {
black_cloud.style.visibility = "visible";
}
hideSelectBoxes('black_cloud');
hideFlash();
var black_cloud_inner = document.getElementById("black_cloud_inner");
if (!black_cloud_inner) {
var black_cloud_inner = document.createElement('div');
black_cloud_inner.id = "black_cloud_inner";
black_cloud_inner.style.position = "absolute";
black_cloud_inner.style.zIndex = "4000";
black_cloud_inner.style.padding = "10px";
black_cloud_inner.style.backgroundColor = "white";
document.body.appendChild(black_cloud_inner);
} else {
black_cloud_inner.style.visibility = "visible";
}
black_cloud_inner.style.border = "none";
black_cloud_inner.innerHTML = "
";
centerScreen(black_cloud_inner, 10, 10);
/******************************************/
function loadedImageMouseOver(img){
if (img) {
var image_href = img.src;
var image_title = img.alt;
var image_width = img.width;
var image_height = img.height;
}
if (!image_href) {
var image_href = this.src;
var image_title = this.alt;
var image_width = this.width;
var image_height = this.height;
}
var black_cloud = document.getElementById("black_cloud");
var black_cloud_inner = document.getElementById("black_cloud_inner");
var black_image = document.getElementById("blackImg");
var black_image_onmouseover = black_image.getAttribute('onmouseover');
black_cloud_inner.innerHTML = "";
findImgPosition();
black_cloud_inner.style.border = "1px solid #E2E1E1";
black_image.onmouseout = function() {document.body.removeChild(black_cloud_inner)};
black_cloud_inner.innerHTML += "
";
black_cloud_inner.innerHTML += "
";
black_cloud_inner.innerHTML += image_title + "
";
}
/********************************************/
if (popupImages[image_href]) {
var img = popupImages[image_href];
img.id = "popupImage";
loadedImageMouseOver(img);
} else {
var img = document.createElement('img');
img.id = "popupImage";
img.alt = image_title;
img.onload = loadedImageMouseOver;
img.src = image_href;
popupImages[image_href] = img;
}
return false;
}
/*************************** End MouseOver Effect ***************************/
function popupImage(a, globalURL){
if (globalURL) {
siteURL = globalURL;
} else {
siteURL = "";
}
// when action is linked to element like view me
var image_href = a.href;
var image_title = a.title;
// when action is linked to element like document.getElementById('sample').onmouseover = popupImage;
if (!image_href) {
var image_href = this.href;
var image_title = this.title;
}
if (!image_href)
return false;
var fullSize = getPageSizeWithScroll();
//alert(fullSize[1]);
var black_cloud = document.getElementById("black_cloud");
if (!black_cloud) {
var black_cloud = document.createElement('div');
black_cloud.id = "black_cloud";
black_cloud.onclick = hideBlack;
black_cloud.style.position = "absolute";
black_cloud.style.zIndex = "3500";
black_cloud.style.top = "0px";
black_cloud.style.left = "0px";
black_cloud.style.opacity = "0.9";
black_cloud.style.mozOpacity = "0.9";
black_cloud.style.filter = "alpha(opacity=90)";
black_cloud.style.backgroundColor = "black";
black_cloud.style.width = fullSize[0]+"px";
black_cloud.style.height = fullSize[1]+"px";
document.body.appendChild(black_cloud);
} else {
black_cloud.style.visibility = "visible";
}
hideSelectBoxes('black_cloud');
hideFlash();
var black_cloud_inner = document.getElementById("black_cloud_inner");
if (!black_cloud_inner) {
var black_cloud_inner = document.createElement('div');
black_cloud_inner.id = "black_cloud_inner";
black_cloud_inner.style.position = "absolute";
black_cloud_inner.style.zIndex = "4000";
black_cloud_inner.style.padding = "10px";
black_cloud_inner.style.backgroundColor = "white";
document.body.appendChild(black_cloud_inner);
} else {
black_cloud_inner.style.visibility = "visible";
}
black_cloud_inner.style.border = "none";
black_cloud_inner.innerHTML = "
";
centerScreen(black_cloud_inner, 10, 10);
/****************************************/
function loadedImage(img){
if (img) {
var image_href = img.src;
var image_title = img.alt;
var image_width = img.width;
var image_height = img.height;
}
if (!image_href) {
var image_href = this.src;
var image_title = this.alt;
var image_width = this.width;
var image_height = this.height;
}
var black_cloud = document.getElementById("black_cloud");
black_cloud.style.backgroundColor = "black";
black_cloud.style.width = fullSize[0]+"px";
black_cloud.style.height = fullSize[1]+"px";
var black_cloud_inner = document.getElementById("black_cloud_inner");
black_cloud_inner.innerHTML = "";
centerScreen(black_cloud_inner, image_width, image_height);
black_cloud_inner.innerHTML = "";
black_cloud_inner.innerHTML += "
";
black_cloud_inner.innerHTML += "
";
black_cloud_inner.innerHTML += image_title + "
";
}
/*******************************************/
if (popupImages[image_href]) {
var img = popupImages[image_href];
img.id = "popupImage";
loadedImage(img);
} else {
var img = document.createElement('img');
img.id = "popupImage";
img.alt = image_title;
img.onload = loadedImage;
img.src = image_href;
popupImages[image_href] = img;
}
return false;
}
function hideBlack(){
var black_cloud = document.getElementById("black_cloud");
var black_cloud_inner = document.getElementById("black_cloud_inner");
showSelectBoxes('black_cloud');
showFlash();
document.body.removeChild(black_cloud);
document.body.removeChild(black_cloud_inner);
return false;
}
function centerScreen(black_cloud_inner, width, height){
var window_width = 0;
if (document.body.clientWidth && (window_width==0 || window_width>document.body.clientWidth))
window_width = document.body.clientWidth;
if (window.innerWidth && (window_width==0 || window_width>window.innerWidth))
window_width = window.innerWidth;
if ((window_width-width)/2 > 0)
black_cloud_inner.style.left = Math.round((window_width-width)/2) + "px";
else
black_cloud_inner.style.left = "0px";
var window_height = 0;
if (window.screen.height && (window_height==0 || window_height>window.screen.height))
window_height = window.screen.height;
if ((window_height-height)/3 > 0)
black_cloud_inner.style.top = Math.round((window_height-height)/3) + "px";
else
black_cloud_inner.style.top = "0px";
}
function findImgPosition() {
var black_cloud_inner = document.getElementById("black_cloud_inner");
var el = document.getElementById("blackImg").getElementsByTagName("img")[0];
var x = findPosX(el);
var y = findPosY(el);
function findPosX(obj) {
var curleft = 0;
if (obj.offsetParent) {
while (obj.offsetParent) {
curleft+=obj.offsetLeft;
if (!obj.offsetParent) {
break;
}
obj=obj.offsetParent;
}
} else if (obj.x) {
curleft+=obj.x;
}
black_cloud_inner.style.left = curleft + el.offsetWidth + 50 + "px";
return curleft;
}
function findPosY(obj) {
var curtop = 0;
if (obj.offsetParent) {
while (obj.offsetParent) {
curtop+=obj.offsetTop;
if (!obj.offsetParent) {
break;
}
obj=obj.offsetParent;
}
} else if (obj.y) {
curtop+=obj.y;
}
black_cloud_inner.style.top = curtop + "px";
return curtop;
}
}
function showSelectBoxes(objId) {
if (isIE) {
var obj = document.getElementById(objId);
var selects = obj.overlapObjects;
if (selects && selects.length > 0) {
for (var i = 0; i < selects.length; i++) {
selects[i].style.visibility = "visible";
}
}
obj.overlapObjects = null;
}
}
function hideSelectBoxes(objId, objExclude) {
if (isIE) {
var obj = document.getElementById(objId);
var x = findPosX(obj, false);
var y = findPosY(obj, false);
var w = obj.offsetWidth;
var h = obj.offsetHeight;
if (!obj.overlapObjects) {
obj.overlapObjects = new Array();
}
selects = document.getElementsByTagName("select");
for (i = 0; i != selects.length; i++) {
var selectObj = selects[i];
var objName = selectObj.name;
var isExclude = false;
if (objExclude && objExclude.length) {
for (var ex = 0; ex < objExclude.length; ex++) {
if (objName == objExclude[ex]) {
isExclude = true;
}
}
}
if (isExclude == true || selectObj.style.visibility == "hidden") {
continue;
}
var ox = findPosX(selectObj, false);
var oy = findPosY(selectObj, false);
var ow = selectObj.offsetWidth;
var oh = selectObj.offsetHeight;
if (ox > (x + w) || (ox + ow) < x) {
continue;
}
if (oy > (y + h) || (oy + oh) < y) {
continue;
}
obj.overlapObjects[obj.overlapObjects.length] = selectObj;
selects[i].style.visibility = "hidden";
}
}
}
function hideFlash() {
flash = document.getElementsByTagName('object');
for (var i = 0; i < flash.length; i++) {
flash[i].style.visibility = 'hidden';
}
}
function showFlash() {
flash = document.getElementsByTagName('object');
for (var i = 0; i < flash.length; i++) {
flash[i].style.visibility = 'visible';
}
}
var rolloverImages = new Array();
function rolloverImage(imageId, imageSrc, imageName, superId, superSrc, zoomLinkId)
{
if (!rolloverImages[imageId]) {
rolloverImages[imageId] = new Image();
rolloverImages[imageId].src = imageSrc;
}
document.images[imageName].src = rolloverImages[imageId].src;
if (rolloverImages[imageId].height) {
document.images[imageName].height = rolloverImages[imageId].height;
}
if (rolloverImages[imageId].width) {
document.images[imageName].width = rolloverImages[imageId].width;
}
if (superId) {
var linkSuperObj = document.getElementById(superId);
if (linkSuperObj) {
if (superSrc != "") {
linkSuperObj.href = superSrc;
linkSuperObj.style.display = "inline";
} else {
linkSuperObj.style.display = "none";
}
}
}
if (zoomLinkId) {
var zoomLinkObj = document.getElementById(zoomLinkId);
if (zoomLinkObj) {
if (superSrc != "") {
zoomLinkObj.href = superSrc;
}
}
}
}
// zoom global vars
var zoomDisable = ""; var disableFlag = 0;
function activateZoom(evt, imageName, zWidth, zHeight) {
// clear any zoom before create new
disableZoom();
disableFlag = 0;
originalImage = imageName;
var imgObj = document.images[originalImage];
zoomWidth = zWidth;
zoomHeight = zHeight;
if (!zoomWidth) { zoomWidth = 200; }
if (!zoomHeight) { zoomHeight = 200; }
zoomMousePos = getMousePos(evt);
// automatically disable zoom if user move mouse out of main image before large image loaded
zoomDisable = setTimeout("disableZoom()", 100);
// load super image
var superImg = document.getElementById("blackImg");
if (popupImages[superImg.href]) {
var zoomImgObj = popupImages[superImg.href];
zoomImgObj.id = "zoomImg";
zoomImgObj.style.position = "relative";
loadZoomImage(zoomImgObj);
} else {
var zoomImgObj = document.createElement('img');
zoomImgObj.id = "zoomImg";
zoomImgObj.src = superImg.href;
zoomImgObj.style.position = "relative";
zoomImgObj.onload = function () { loadZoomImage(zoomImgObj) };
initProgress(originalImage);
}
}
function loadZoomImage(zoomImgObj)
{
// disable progress bar
disableProgress(originalImage);
// save all loaded images into array
popupImages[zoomImgObj.src] = zoomImgObj;
// check if blocks wasn't disabled
if (disableFlag == 1) {
return;
}
var imgObj = document.images[originalImage];
imgObj.onmouseout = "";
var posX = findPosX(imgObj, true) + 10;
var posY = findPosY(imgObj, false);
// check zoom image
var zoomImgWidth = zoomImgObj.width;
var zoomImgHeight = zoomImgObj.height;
// correct zoom window size if it's bigger than image
if (zoomWidth > zoomImgWidth) { zoomWidth = zoomImgWidth; }
if (zoomHeight > zoomImgHeight) { zoomHeight = zoomImgHeight; }
var zoomObj = document.createElement("div");
zoomObj.id = "popupBlock";
zoomObj.style.zIndex = "999";
zoomObj.style.position = "absolute";
zoomObj.style.left = posX + "px";
zoomObj.style.top = posY + "px";
zoomObj.style.width = zoomWidth + "px";
zoomObj.style.height = zoomHeight + "px";
zoomObj.style.border = "1px solid black";
zoomObj.style.overflow = "hidden";
document.body.insertBefore(zoomObj, document.body.firstChild);
// add image for zoom
zoomObj.appendChild(zoomImgObj);
var mousePos = zoomMousePos; // last active position
var mousePosX = mousePos[0];
var mousePosY = mousePos[1];
var imgPosX = findPosX(imgObj);
var imgPosY = findPosY(imgObj);
var imgWidth = imgObj.offsetWidth;
var imgHeight = imgObj.offsetHeight;
var moveDivWidth = (imgWidth * zoomWidth) / zoomImgWidth;
var moveDivHeight = (imgHeight * zoomHeight) / zoomImgHeight;
var moveObj = document.createElement("div");
moveObj.id = "moveBlock";
moveObj.style.zIndex = "1999";
moveObj.style.position = "absolute";
moveObj.style.opacity = "0.6";
moveObj.style.mozOpacity = "0.6";
moveObj.style.filter = "alpha(opacity=60)";
moveObj.style.backgroundColor = "#D0D0D0";
moveObj.style.width = moveDivWidth + "px";
moveObj.style.height = moveDivHeight + "px";
moveObj.style.border = "1px solid black";
moveObj.style.cursor = "move";
// calculate initial div position
var posX = mousePos[0] - moveDivWidth / 2;
var posY = mousePos[1] - moveDivHeight / 2;
if (posX < imgPosX) { posX = imgPosX; }
if (posX > (imgPosX + imgWidth - moveDivWidth)) { posX = imgPosX + imgWidth - moveDivWidth; }
if (posY < imgPosY) { posY = imgPosY; }
if (posY > (imgPosY + imgHeight - moveDivHeight)) { posY = imgPosY + imgHeight - moveDivHeight; }
moveObj.style.left = posX + "px";
moveObj.style.top = posY + "px";
moveObj.onmousemove = moveZoom;
moveObj.onmouseout = disableZoom;
document.body.insertBefore(moveObj, document.body.firstChild);
}
function disableZoom()
{
disableFlag = 1;
var popupObj = document.getElementById("popupBlock");
if (popupObj) {
var imageObj = document.getElementById("zoomImg");
if (imageObj) {
popupObj.removeChild(imageObj);
}
document.body.removeChild(popupObj);
}
var moveObj = document.getElementById("moveBlock");
if (moveObj) {
document.body.removeChild(moveObj);
}
}
function moveZoom(e)
{
clearTimeout(zoomDisable);
zoomDisable = "";
var mousePos = getMousePos(e);
var mousePosX = mousePos[0];
var mousePosY = mousePos[1];
var moveObj = document.getElementById('moveBlock');
var zoomImg = document.getElementById("zoomImg");
var popupObj = document.getElementById("popupBlock");
var imgObj = document.images[originalImage];
var imgPosX = findPosX(imgObj);
var imgPosY = findPosY(imgObj);
var imgWidth = imgObj.offsetWidth;
var imgHeight = imgObj.offsetHeight;
var popupWidth = popupObj.offsetWidth;
var popupHeight = popupObj.offsetHeight;
if (zoomImg && zoomImg.width) {
var zoomImgWidth = zoomImg.width;
var zoomImgHeight = zoomImg.height;
var moveDivWidth = (imgWidth * popupWidth) / zoomImgWidth;
var moveDivHeight = (imgHeight * popupHeight) / zoomImgHeight;
var mousePos = getMousePos(e);
var moveObj = document.getElementById("moveBlock");
var posX = mousePos[0] - moveDivWidth / 2;
var posY = mousePos[1] - moveDivHeight / 2;
if (posX < imgPosX) { posX = imgPosX; }
if (posX > (imgPosX + imgWidth - moveDivWidth)) { posX = imgPosX + imgWidth - moveDivWidth; }
if (posY < imgPosY) { posY = imgPosY; }
if (posY > (imgPosY + imgHeight - moveDivHeight)) { posY = imgPosY + imgHeight - moveDivHeight; }
moveObj.style.left = posX + "px";
moveObj.style.top = posY + "px";
if (zoomImg) {
var zoomImgPosX = (posX - imgPosX) * (zoomImgWidth / imgWidth);
var zoomImgPosY = (posY - imgPosY) * (zoomImgHeight / imgHeight);
zoomImg.style.left = -(zoomImgPosX) + "px";
zoomImg.style.top = -(zoomImgPosY) + "px";
}
}
}