﻿// ProImpact zoom functionality
// Author : Roy Beekema
// Release Date : 2011-07-11
//
// Tested : Internet Explorer 7.0-9.0 , FireFox 3.6.6-5.0, Chrome 12, Safari 4.0-5.0, Opera 11.10-11.50
// Required : jQuery 1.4.2 or higher
// Usage : Import this script and set 'document.defaultWidth' to the width the website was designed for.
//
// Example for creating links for zooming.
// <a onclick="window.zoomOut();return false;" href="#">=(-)</a>
// <a onclick="window.resetZoomLevel();return false;" href="#">=(0)</a>	       
// <a onclick="window.zoomIn();return false;" href="#">=(+)</a>

// jQuery detection extensions

$.browser.chrome = navigator.userAgent.indexOf(" Chrome/") >= 0;
$.browser.safari = navigator.userAgent.indexOf(" Safari/") >= 0;
$.browser.enginePattern = /\s(Gecko|Trident|Presto|AppleWebKit)[\/ ]/;
$.browser.browserPattern = /\s(Firefox|Chrome|Safari|Opera|MSIE)[\/ ]/;

// Javascript document extensions
document.defaultWidth = 1024;
document.getDefaultWidth = function ()
{
	return document.defaultWidth;
}

// Javascript window extensions

window.currentZoomLevel = 0;
window.currentZoomStepping = 1;
window.minZoomLevel = 0;
window.maxZoomLevel = 1;
window.zoomEffect // Note : Effects are disabled due to the fact they are not required any more for hidding glitches. This may change in the future
=
{ start: function (number) { if ($.browser.version == "7.0") document.body.style.position = "absolute"; $(document.body).css("opacity", "0." + (10 - (number * 2))); }
, finish: function (number) { $(document.body).css("opacity", number == 5 ? "" : "0." + (number * 2)); }
, count: 5
, duration: 1000
, pausing: 100
}
window.zoomIn = function () { if (window.currentZoomLevel >= window.maxZoomLevel) return; Cookie.set("zoomLevel", ++window.currentZoomLevel, 365); this.applyZoomLevel(window.currentZoomLevel); }
window.zoomOut = function () { if (window.currentZoomLevel <= window.minZoomLevel) return; Cookie.set("zoomLevel", --window.currentZoomLevel, 365); this.applyZoomLevel(window.currentZoomLevel); }

window.getFlipScale = function (level)
{
	var w1 = document.getDefaultWidth(), w2 = window.getWidth();

	return (w1 / w2) / (-level * window.currentZoomStepping);
}
window.getZoomScale = function (level)
{
	var w1 = document.getDefaultWidth(), w2 = window.getWidth();

	return  (level * window.currentZoomStepping) * (w2 / w1);
}
window.resetZoomLevel = function () { if (window.currentZoomLevel == 0) return; Cookie.set("zoomLevel", null); this.applyZoomLevel(window.currentZoomLevel = 0); }
window.getWidth = function ()
{
	var topWidth = top.document.body != null ? (top.document.body.clientWidth || top.document.body.offsetWidth) : 0;

	return topWidth || (window.innerWidth || window.outerWidth);
}
window.getHeight = function ()
{
	var topHeight = top.document.body != null ? (top.document.body.clientHeight || top.document.body.offsetHeight) : 0;

	return topHeight || (window.innerHeight || window.outerHeight);
}
window.rememberZoomLevel = function ()
{
	var zoomLevel = Cookie.get("zoomLevel", Number);

	if (zoomLevel != null)
	{
		var method = function () { window.applyZoomLevel(window.currentZoomLevel = zoomLevel); };

		window.setTimeout(function () { method(); }, 10);
		window.onload = function () { method(); };
	}
}
window.applyZoomLevelWithEffect = function (level)
{
	window.applyWithEffect(function(){window.applyZoomLevel(level)}, window.zoomEffect );
}
window.applyWithEffect = function (action, effect)
{
	var effect = window.zoomEffect || { start: function () { document.body.style.opacity = "0"; }, finish: function () { document.body.style.opacity = ""; } };
	var count = effect.count || 1;
	var duration = (effect.duration || 10);
	var pausing = effect.pausing || 10;

	window.applyEffect(effect.start, count, duration, pausing);

	setTimeout
	(
		function ()
		{
			action();

			window.applyEffect(effect.finish, count, duration, pausing);
		}
	,
		Math.floor((duration - pausing) / 2) + pausing
	);
}
window.applyEffect = function (effectAction, count, duration, pausing)
{
	var number, timeoutFactor = Math.floor(((duration - pausing) / 2) / (count - 1));

	if (count != 0)
		effectAction(1);
	for (number = 1; number < count; number++)
		setTimeout(function () { effectAction(++number); }, number * timeoutFactor);

	number = 1;
}

window.applyZoomLevel = function (level) //	var xFactor = (browser.mozilla || browser.opera) ? 125 : ((browser.webkit || browser.safari) ? 1 : (level < 0 ? 1 : 125)); // Math.floor(level * xFactor);
{
	var browser = $.browser;
	var scale = window.getZoomScale(level);
	var translateX = 0;
	var translateY = 0;
	var ratio = this.getWidth() / this.getHeight();
	var element = document.body; // document.getElementsByTagName("form")[0]; //  ;
	var style = element.style;
	var transform = level == 0 ? "" : "translateX(" + translateX + "px) translateY(" + translateY + "px) scale(" + scale + ")";
	var windowHeight = $(window).height()
	var backgroundSize = (scale == 0 ? null : "auto " + Math.floor(windowHeight * scale) + "px");

	if (style.backgroundSize != null)
		style.backgroundSize = backgroundSize == null ? "" : backgroundSize + " !important"; // IE9 , O11
	else
	{
		var prefix = "-" + (browser.msie ? "ms" : (browser.mozilla ? "moz" : (browser.opera ? "o" : ((browser.safari || browser.webkit) ? "webkit" : "")))) + "-";

		if (style.setProperty != null)
		{
			style.setProperty("background-size", backgroundSize || "", "important"); // FF5
			style.setProperty(prefix + "background-size", backgroundSize || "", "important"); // S4
		}
		else if (element.setAttribute != null) // IE7 IE8
		{
			var backgroundSizeImportant = (backgroundSize == null ? "" : backgroundSize + " !important");

			element.setAttribute("style", "background-size:" + backgroundSizeImportant);
			element.setAttribute("style", prefix + "background-size:" + backgroundSizeImportant);
		}
		else
			throw new Error("CSS background-size not supported and no alternative available");
	}

	if (browser.mozilla)
	{
		style.MozTransform = transform; // FF3.6 FF4 FF5

		if (level != 0)
		{
			translateX = document.documentElement.scrollWidth - document.documentElement.offsetWidth;
			translateY = document.documentElement.scrollHeight - document.documentElement.offsetHeight;

			style.MozTransform = "translateX(" + translateX + "px) translateY(" + translateY + "px) scale(" + scale + ")";
		}
	}
	else if (browser.opera)
	{
		style.OTransform = transform; // O11

		if (level != 0)
		{
			translateX = document.documentElement.scrollWidth - document.documentElement.offsetWidth;
			translateY = document.documentElement.scrollHeight - document.documentElement.offsetHeight;

			style.OTransform = "translateX(" + translateX + "px) translateY(" + translateY + "px) scale(" + scale + ")";
		}
	}
	else if (browser.chrome)
	{
		style.webkitTransform = transform; // S4 S5 C12

		if (level != 0)
		{
			translateX = document.documentElement.scrollWidth - document.documentElement.offsetWidth;
			translateY = document.documentElement.scrollHeight - document.documentElement.offsetHeight;

			style.webkitTransform = "translateX(" + translateX + "px) translateY(" + translateY + "px) scale(" + scale + ")";
		}
	}
	else if (browser.webkit || browser.safari)
	{
		/*	var windowWidth = $(window).width();
		var documentHeight = $(document).height();
		var topOffset = (((documentHeight / windowHeight) - 1) * 1.145); * 85;

		style.paddingBottom = (525 * level) + "px";

		topOffset += (53 * level);

		if (scale <= 1)
		{
		style.width = "";
		style.overflowX = "";
		}
		else
		{
		style.width = (windowWidth * scale) + "px";
		style.overflowX = "scroll";
		}
		var windowWidth = $(window).width();
		*/
		element.style.zoom = String(scale);
	}
	else if (browser.msie && !(browser.version == "6.0" || browser.version == "7.0" || browser.version == "8.0"))
	{
		style.msTransform = transform; // IE9

		if (level != 0)
		{
			translateX = document.documentElement.scrollWidth - document.documentElement.offsetWidth // Projects + 18 // Home - 8
			translateY = document.documentElement.scrollHeight - $(document.body).height();

			style.msTransform = "translateX(" + translateX + "px) translateY(" + translateY + "px) scale(" + scale + ")";
		}
	}
	else if (style.transform != null)
	{
		style.transform = transform;

		if (level != 0)
		{
			translateX = document.documentElement.scrollWidth - document.documentElement.offsetWidth;
			translateY = document.documentElement.scrollHeight - document.documentElement.offsetHeight;

			style.transform = "translateX(" + translateX + "px) translateY(" + translateY + "px) scale(" + scale + ")";
		}
	}
	else if (browser.msie)
	{
		if (browser.version == "6.0")
		{
			return;
		}
		else
		{
			if (browser.version == "7.0")
			{
				document.body.style.position = "absolute";
			}

			if (browser.version == "7.0" || browser.version == "8.0")
			{
				$("body *").css("behavior", "none");
			}

			element.style.zoom = String(scale);
		}
	}
	else
		throw new Error("CSS transformations not supported and no alternative available")

	if (browser.mozilla || browser.opera || browser.webkit || browser.safari || (browser.msie && !(browser.version == "6.0" || browser.version == "7.0" || browser.version == "8.0")))
	{
		if (scale >= 1)
			var scrollX = Math.floor((window.getWidth() * (scale - 1)) / 2);
		else
			var scrollX = document.defaultWidth;

		setTimeout(function () { window.scrollTo(scrollX, 0); }, 10);
	}
	else if (browser.version == "8.0")
	{
		var scrollX = Math.floor(($(document).width() - $(document.body).width()) / 2);

		window.scrollTo(scrollX, 0); ;
	}
	else
	{
		window.scrollTo(0, 0);
	}
}

$(document).ready(function ()
{
	if ($.browser.msie && ($.browser.version == "7.0" || $.browser.version == "8.0"))
	{
		setTimeout(function () { window.rememberZoomLevel() }, 1000);

	//	Internet Explorer 7 and 8 use style.zoom instead of style.transform and will trigger the resize event again, so no scaling on resize.
	}
	else
	{
		setTimeout(function () { window.rememberZoomLevel() }, 10);

		if ($.browser.webkit && !$.browser.chrome) return; // Safari uses style.zoom instead of style.transform and triggers the resize event again, so no scaling on resize.

		window.onresize = function () { window.rememberZoomLevel(); }
	}
});

