/*
Zoom PopUp Widget
Copyright 2009 Digital Commerce SLW Inc. Toronto Canada
*/
function zoomPopup(zoomUrl, originalUrl) {
var newWin =
window.open('','Zoom','location=0,toolbar=0,menubar=0,resizable=1,width=800,height=600,scrollbars=1');
newWin.moveTo(30,30);
var html = buildImageViewer(zoomUrl, originalUrl);
//alert(html);
newWin.document.write(html);
newWin.document.close();
newWin.focus();
return newWin;
}
function buildImageViewer(srcHiRes, srcLowRes) {
var i = 0
var html = []
html[i++] = "Zoom Popup"
html[i++] = ""
// create a reference to this script file
html[i++] = ""
var onload = "zp_onload('"+srcHiRes+"','"+ srcLowRes+"')"
html[i++] = ''
html[i++] = ""
html[i++] = ""
html[i++] = ""
return html.join("\n")
}
var zp = {}
function zp_onload(srcHiRes, srcLowRes) {
zp.hiResLoaded = false
zp.imageHiRes = new Image();
zp.imageHiRes.onload = function(){zp_displayHires()};
zp.imageHiRes.src = srcHiRes;
zp.image = document.getElementById("mainImage");
zp.aspect = zp.image.width/zp.image.height;
zp.normalWidth = zp.image.width * 2; //show loRes image at 2x
zp.currentWidth = zp.normalWidth
zp.increment = parseInt(zp.normalWidth/4);
zp_displayHires()
zoomNormal()
}
function zp_displayHires() {
if ((!zp.hiResLoaded) && zp.image && zp.imageHiRes.width && zp.imageHiRes.width > 60) {
zp.hiResLoaded = true;
zp.image.src = zp.imageHiRes.src;
zp.aspect = zp.imageHiRes.width/zp.imageHiRes.height;
zp.normalWidth = zp.imageHiRes.width
zp.increment = zp.normalWidth/4
zoomNormal()
}
}
// Modifies image element size so that entire image is seen within existing window
function fitImage() {
zp_displayHires()
winBox = getWindowSize();
//alert("window aspect:"+(winWidth/winHeight) + "\nimage aspect:"+(zp.aspect))
if ((zp.aspect) > (winWidth/winHeight)) {
zp.image.style.height = "auto"
zp.image.style.width = winBox.width + "px"
}
else {
zp.image.style.width = "auto"
zp.image.style.height = winBox.height + "px"
}
showScale();
}
// Resizes window to fit current image dimensions
function fitWindow() {
zp_displayHires()
if (zp.image && zp.image.width > 60) {
winBox = getWindowSize();
window.resizeBy(zp.image.width - winBox.width, zp.image.height - winBox.height);
showScale();
}
}
function showScale() {
var sc = parseInt((100*zp.currentWidth)/zp.normalWidth);
//alert(sc)
document.getElementById("zp_scale").innerHTML = sc + "%"
}
function zoomIn() {
if (zp.image) {
zp_displayHires()
zp.currentWidth = zp.currentWidth + zp.increment
zp.image.style.height = "auto"
zp.image.style.width = zp.currentWidth + "px"
fitWindow()
}
}
function zoomNormal() {
if (zp.image) {
zp_displayHires()
zp.currentWidth = zp.normalWidth
zp.image.style.width = zp.normalWidth + "px"
zp.image.style.height = "auto"
fitWindow()
}
}
function zoomOut() {
if (zp.image) {
zp_displayHires();
var newWidth = zp.currentWidth - zp.increment;
if (newWidth > 250) zp.currentWidth = newWidth;
zp.image.style.height = "auto"
zp.image.style.width = zp.currentWidth + "px"
fitWindow()
}
}
function getWindowSize() {
var winWidth, winHeight
if(window.innerWidth){ //checking for browsers that support window.innerWidth
winWidth = window.innerWidth-40;
winHeight = window.innerHeight-60;
}
else if (document.body.clientWidth) { //checking for browsers that support document.body.clientWidth
winWidth = document.body.clientWidth-30;
winHeight = document.body.clientHeight-50;
}
return {width:winWidth, height:winHeight};
}