// -----------------------------------------------------------------------------------

//

//	Lightbox v2.02

//	by Lokesh Dhakar - http://www.huddletogether.com

//	3/31/06

//

//	For more information on this script, visit:

//	http://huddletogether.com/projects/lightbox2/

//

//	Licensed under the Creative Commons Attribution 2.5 License - http://creativecommons.org/licenses/by/2.5/

//	

//	Credit also due to those who have helped, inspired, and made their code available to the public.

//	Including: Scott Upton(uptonic.com), Peter-Paul Koch(quirksmode.org), Thomas Fuchs(mir.aculo.us), and others.

//

//

// -----------------------------------------------------------------------------------

/*



 Table of Contents

 -----------------

 Configuration

 Global Variables



 Extending Built-in Objects	

 - Object.extend(Element)

 - Array.prototype.removeDuplicates()

 - Array.prototype.empty()



 Lightbox Class Declaration

 - initialize()

 - start()

 - changeImage()

 - resizeImageContainer()

 - showImage()

 - updateDetails()

 - updateNav()

 - enableKeyboardNav()

 - disableKeyboardNav()

 - keyboardAction()

 - preloadNeighborImages()

 - end()



 Miscellaneous Functions

 - getPageScroll()

 - getPageSize()

 - getKey()

 - listenKey()

 - showSelectBoxes()

 - hideSelectBoxes()

 - pause()

 - initLightbox()



 Function Calls

 - addLoadEvent(initLightbox)



 */

// -----------------------------------------------------------------------------------

//
//	Configuration
//
var fileLoadingImage = "/views/frontend/img/loading.gif";

var fileBottomNavCloseImage = "/views/frontend/img/closelabel.gif";

var resizeSpeed = 7; // controls the speed of the image resizing (1=slowest
						// and 10=fastest)

var borderSize = 10; // if you adjust the padding in the CSS, you will need
						// to update this variable

// -----------------------------------------------------------------------------------

//

// Global Variables

//

var imageArray = new Array;

var activeImage;

if (resizeSpeed > 10) {
	resizeSpeed = 10;
}

if (resizeSpeed < 1) {
	resizeSpeed = 1;
}

resizeDuration = (11 - resizeSpeed) * 0.15;

// -----------------------------------------------------------------------------------

//

// Additional methods for Element added by SU, Couloir

// - further additions by Lokesh Dhakar (huddletogether.com)

//

Object.extend(Element, {

	getWidth : function(element) {

		element = $(element);

		return element.offsetWidth;

	},

	setWidth : function(element, w) {

		element = $(element);

		element.style.width = w + "px";

	},

	setHeight : function(element, h) {

		element = $(element);

		element.style.height = h + "px";

	},

	setTop : function(element, t) {

		element = $(element);

		element.style.top = t + "px";

	},

	setSrc : function(element, src) {

		element = $(element);

		element.src = src;

	},

	setHref : function(element, href) {

		element = $(element);

		element.href = href;

	},

	setInnerHTML : function(element, content) {

		element = $(element);

		element.innerHTML = content;

	}

});

// -----------------------------------------------------------------------------------

//

// Extending built-in Array object

// - array.removeDuplicates()

// - array.empty()

//

Array.prototype.removeDuplicates = function() {

	for (i = 1; i < this.length; i++) {

		if (this[i][0] == this[i - 1][0]) {

			this.splice(i, 1);

		}

	}

}

// -----------------------------------------------------------------------------------

Array.prototype.empty = function() {

	for (i = 0; i <= this.length; i++) {

		this.shift();

	}

}

// -----------------------------------------------------------------------------------

//

// Lightbox Class Declaration

// - initialize()

// - start()

// - changeImage()

// - resizeImageContainer()

// - showImage()

// - updateDetails()

// - updateNav()

// - enableKeyboardNav()

// - disableKeyboardNav()

// - keyboardNavAction()

// - preloadNeighborImages()

// - end()

//

// Structuring of code inspired by Scott Upton (http://www.uptonic.com/)

//

var Lightbox = Class.create();

Lightbox.prototype = {

	// initialize()

	// Constructor runs on completion of the DOM loading. Loops through anchor
	// tags looking for

	// 'lightbox' references and applies onclick events to appropriate links.
	// The 2nd section of

	// the function inserts html at the bottom of the page which is used to
	// display the shadow

	// overlay and the image container.

	//

	initialize : function() {

		if (!document.getElementsByTagName) {
			return;
		}

		var anchors = document.getElementsByTagName('a');

		// loop through all anchor tags

		for ( var i = 0; i < anchors.length; i++) {

			var anchor = anchors[i];

			var relAttribute = String(anchor.getAttribute('rel'));

			// use the string.match() method to catch 'lightbox' references in
			// the rel attribute

			if (anchor.getAttribute('href')
					&& (relAttribute.toLowerCase().match('lightbox'))) {

				anchor.onclick = function() {
					myLightbox.start(this);
					return false;
				}

			}

		}

		// The rest of this code inserts html at the bottom of the page that
		// looks similar to this:

		//

		// <div id="overlay"></div>

		// <div id="lightbox">

		// <div id="outerImageContainer">

		// <div id="imageContainer">

		// <img id="lightboxImage">

		// <div style="" id="hoverNav">

		// <a href="#" id="prevLink"></a>

		// <a href="#" id="nextLink"></a>

		// </div>

		// <div id="loading">

		// <a href="#" id="loadingLink">

		// <img src="img/loading.gif">

		// </a>

		// </div>

		// </div>

		// </div>

		// <div id="imageDataContainer">

		// <div id="imageData">

		// <div id="imageDetails">

		// <span id="caption"></span>

		// <span id="numberDisplay"></span>

		// </div>

		// <div id="bottomNav">

		// <a href="#" id="bottomNavClose">

		// <img src="img/close.gif">

		// </a>

		// </div>

		// </div>

		// </div>

		// </div>

		var objBody = document.getElementsByTagName("body").item(0);

		var objOverlay = document.createElement("div");

		objOverlay.setAttribute('id', 'overlay');

		objOverlay.style.display = 'none';

		objOverlay.onclick = function() {
			myLightbox.end();
			return false;
		}

		objBody.appendChild(objOverlay);

		var objLightbox = document.createElement("div");

		objLightbox.setAttribute('id', 'lightbox');

		objLightbox.style.display = 'none';

		objBody.appendChild(objLightbox);

		var objOuterImageContainer = document.createElement("div");

		objOuterImageContainer.setAttribute('id', 'outerImageContainer');

		objLightbox.appendChild(objOuterImageContainer);

		var objImageContainer = document.createElement("div");

		objImageContainer.setAttribute('id', 'imageContainer');

		objOuterImageContainer.appendChild(objImageContainer);

		var objLightboxImage = document.createElement("img");

		objLightboxImage.setAttribute('id', 'lightboxImage');

		objImageContainer.appendChild(objLightboxImage);

		var objHoverNav = document.createElement("div");

		objHoverNav.setAttribute('id', 'hoverNav');

		objImageContainer.appendChild(objHoverNav);

		var objPrevLink = document.createElement("a");

		objPrevLink.setAttribute('id', 'prevLink');

		objPrevLink.setAttribute('href', '#');

		objHoverNav.appendChild(objPrevLink);

		var objNextLink = document.createElement("a");

		objNextLink.setAttribute('id', 'nextLink');

		objNextLink.setAttribute('href', '#');

		objHoverNav.appendChild(objNextLink);

		var objLoading = document.createElement("div");

		objLoading.setAttribute('id', 'loading');

		objImageContainer.appendChild(objLoading);

		var objLoadingLink = document.createElement("a");

		objLoadingLink.setAttribute('id', 'loadingLink');

		objLoadingLink.setAttribute('href', '#');

		objLoadingLink.onclick = function() {
			myLightbox.end();
			return false;
		}

		objLoading.appendChild(objLoadingLink);

		var objLoadingImage = document.createElement("img");

		objLoadingImage.setAttribute('src', fileLoadingImage);

		objLoadingLink.appendChild(objLoadingImage);

		var objImageDataContainer = document.createElement("div");

		objImageDataContainer.setAttribute('id', 'imageDataContainer');

		objImageDataContainer.className = 'clearfix';

		objLightbox.appendChild(objImageDataContainer);

		var objImageData = document.createElement("div");

		objImageData.setAttribute('id', 'imageData');

		objImageDataContainer.appendChild(objImageData);

		var objImageDetails = document.createElement("div");

		objImageDetails.setAttribute('id', 'imageDetails');

		objImageData.appendChild(objImageDetails);

		var objCaption = document.createElement("span");

		objCaption.setAttribute('id', 'caption');

		objImageDetails.appendChild(objCaption);

		var objNumberDisplay = document.createElement("span");

		objNumberDisplay.setAttribute('id', 'numberDisplay');

		objImageDetails.appendChild(objNumberDisplay);

		var objBottomNav = document.createElement("div");

		objBottomNav.setAttribute('id', 'bottomNav');

		objImageData.appendChild(objBottomNav);

		var objBottomNavCloseLink = document.createElement("a");

		objBottomNavCloseLink.setAttribute('id', 'bottomNavClose');

		objBottomNavCloseLink.setAttribute('href', '#');

		objBottomNavCloseLink.onclick = function() {
			myLightbox.end();
			return false;
		}

		objBottomNav.appendChild(objBottomNavCloseLink);

		var objBottomNavCloseImage = document.createElement("img");

		objBottomNavCloseImage.setAttribute('src', fileBottomNavCloseImage);

		objBottomNavCloseLink.appendChild(objBottomNavCloseImage);

	},

	//

	// start()

	// Display overlay and lightbox. If image is part of a set, add siblings to
	// imageArray.

	//

	start : function(imageLink) {

		hideSelectBoxes();

		// stretch overlay to fill page and fade in

		var arrayPageSize = getPageSize();

		Element.setHeight('overlay', arrayPageSize[1]);

		new Effect.Appear('overlay', {
			duration :0.2,
			from :0.0,
			to :0.8
		});

		imageArray = [];

		imageNum = 0;

		if (!document.getElementsByTagName) {
			return;
		}

		var anchors = document.getElementsByTagName('a');

		// if image is NOT part of a set..

		if ((imageLink.getAttribute('rel') == 'lightbox')) {

			// add single image to imageArray

			imageArray.push(new Array(imageLink.getAttribute('href'), imageLink
					.getAttribute('title')));

		} else {

			// if image is part of a set..

			// loop through anchors, find other img in set, and add them to
			// imageArray

			for ( var i = 0; i < anchors.length; i++) {

				var anchor = anchors[i];

				if (anchor.getAttribute('href')
						&& (anchor.getAttribute('rel') == imageLink
								.getAttribute('rel'))) {

					imageArray.push(new Array(anchor.getAttribute('href'),
							anchor.getAttribute('title')));

				}

			}

			imageArray.removeDuplicates();

			while (imageArray[imageNum][0] != imageLink.getAttribute('href')) {
				imageNum++;
			}

		}

		// calculate top offset for the lightbox and display

		var arrayPageSize = getPageSize();

		var arrayPageScroll = getPageScroll();

		var lightboxTop = arrayPageScroll[1] + (arrayPageSize[3] / 15);

		Element.setTop('lightbox', lightboxTop);

		Element.show('lightbox');

		this.changeImage(imageNum);

	},

	//

	// changeImage()

	// Hide most elements and preload image in preparation for resizing image
	// container.

	//

	changeImage : function(imageNum) {

		activeImage = imageNum; // update global var

		// hide elements during transition

		Element.show('loading');

		Element.hide('lightboxImage');

		Element.hide('hoverNav');

		Element.hide('prevLink');

		Element.hide('nextLink');

		Element.hide('imageDataContainer');

		Element.hide('numberDisplay');

		imgPreloader = new Image();

		// once image is preloaded, resize image container

		imgPreloader.onload = function() {

			Element.setSrc('lightboxImage', imageArray[activeImage][0]);

			myLightbox.resizeImageContainer(imgPreloader.width,
					imgPreloader.height);

		}

		imgPreloader.src = imageArray[activeImage][0];

	},

	//

	// resizeImageContainer()

	//

	resizeImageContainer : function(imgWidth, imgHeight) {

		// get current height and width

		this.wCur = Element.getWidth('outerImageContainer');

		this.hCur = Element.getHeight('outerImageContainer');

		// scalars based on change from old to new

		this.xScale = ((imgWidth + (borderSize * 2)) / this.wCur) * 100;

		this.yScale = ((imgHeight + (borderSize * 2)) / this.hCur) * 100;

		// calculate size difference between new and old image, and resize if
		// necessary

		wDiff = (this.wCur - borderSize * 2) - imgWidth;

		hDiff = (this.hCur - borderSize * 2) - imgHeight;

		if (!(hDiff == 0)) {
			new Effect.Scale('outerImageContainer', this.yScale, {
				scaleX :false,
				duration :resizeDuration,
				queue :'front'
			});
		}

		if (!(wDiff == 0)) {
			new Effect.Scale('outerImageContainer', this.xScale, {
				scaleY :false,
				delay :resizeDuration,
				duration :resizeDuration
			});
		}

		// if new and old image are same size and no scaling transition is
		// necessary,

		// do a quick pause to prevent image flicker.

		if ((hDiff == 0) && (wDiff == 0)) {

			if (navigator.appVersion.indexOf("MSIE") != -1) {
				pause(250);
			} else {
				pause(100);
			}

		}

		Element.setHeight('prevLink', imgHeight);

		Element.setHeight('nextLink', imgHeight);

		Element.setWidth('imageDataContainer', imgWidth + (borderSize * 2));

		this.showImage();

	},

	//

	// showImage()

	// Display image and begin preloading neighbors.

	//

	showImage : function() {

		Element.hide('loading');

		new Effect.Appear('lightboxImage', {
			duration :0.5,
			queue :'end',
			afterFinish : function() {
				myLightbox.updateDetails();
			}
		});

		this.preloadNeighborImages();

	},

	//

	// updateDetails()

	// Display caption, image number, and bottom nav.

	//

	updateDetails : function() {

		Element.show('caption');

		Element.setInnerHTML('caption', imageArray[activeImage][1]);

		// if image is part of set display 'Image x of x'

		if (imageArray.length > 1) {

			Element.show('numberDisplay');

			Element.setInnerHTML('numberDisplay', "Zdjecie "
					+ eval(activeImage + 1) + " z " + imageArray.length);

		}

		new Effect.Parallel(

		[ new Effect.SlideDown('imageDataContainer', {
			sync :true,
			duration :resizeDuration + 0.25,
			from :0.0,
			to :1.0
		}),

		new Effect.Appear('imageDataContainer', {
			sync :true,
			duration :1.0
		}) ],

		{
			duration :0.65,
			afterFinish : function() {
				myLightbox.updateNav();
			}
		}

		);

	},

	//

	// updateNav()

	// Display appropriate previous and next hover navigation.

	//

	updateNav : function() {

		Element.show('hoverNav');

		// if not first image in set, display prev image button

		if (activeImage != 0) {

			Element.show('prevLink');

			document.getElementById('prevLink').onclick = function() {

				myLightbox.changeImage(activeImage - 1);
				return false;

			}

		}

		// if not last image in set, display next image button

		if (activeImage != (imageArray.length - 1)) {

			Element.show('nextLink');

			document.getElementById('nextLink').onclick = function() {

				myLightbox.changeImage(activeImage + 1);
				return false;

			}

		}

		this.enableKeyboardNav();

	},

	//

	// enableKeyboardNav()

	//

	enableKeyboardNav : function() {

		document.onkeydown = this.keyboardAction;

	},

	//

	// disableKeyboardNav()

	//

	disableKeyboardNav : function() {

		document.onkeydown = '';

	},

	//

	// keyboardAction()

	//

	keyboardAction : function(e) {

		if (e == null) { // ie

			keycode = event.keyCode;

		} else { // mozilla

			keycode = e.which;

		}

		key = String.fromCharCode(keycode).toLowerCase();

		if ((key == 'x') || (key == 'o') || (key == 'c')) { // close lightbox

			myLightbox.end();

		} else if (key == 'p') { // display previous image

			if (activeImage != 0) {

				myLightbox.disableKeyboardNav();

				myLightbox.changeImage(activeImage - 1);

			}

		} else if (key == 'n') { // display next image

			if (activeImage != (imageArray.length - 1)) {

				myLightbox.disableKeyboardNav();

				myLightbox.changeImage(activeImage + 1);

			}

		}

	},

	//

	// preloadNeighborImages()

	// Preload previous and next img.

	//

	preloadNeighborImages : function() {

		if ((imageArray.length - 1) > activeImage) {

			preloadNextImage = new Image();

			preloadNextImage.src = imageArray[activeImage + 1][0];

		}

		if (activeImage > 0) {

			preloadPrevImage = new Image();

			preloadPrevImage.src = imageArray[activeImage - 1][0];

		}

	},

	//

	// end()

	//

	end : function() {

		this.disableKeyboardNav();

		Element.hide('lightbox');

		new Effect.Fade('overlay', {
			duration :0.2
		});

		showSelectBoxes();

	}

}

// -----------------------------------------------------------------------------------

//

// getPageScroll()

// Returns array with x,y page scroll values.

// Core code from - quirksmode.org

//

function getPageScroll() {

	var yScroll;

	if (self.pageYOffset) {

		yScroll = self.pageYOffset;

	} else if (document.documentElement && document.documentElement.scrollTop) { // Explorer
																					// 6
																					// Strict

		yScroll = document.documentElement.scrollTop;

	} else if (document.body) {// all other Explorers

		yScroll = document.body.scrollTop;

	}

	arrayPageScroll = new Array('', yScroll)

	return arrayPageScroll;

}

// -----------------------------------------------------------------------------------

//

// getPageSize()

// Returns array with page width, height and window width, height

// Core code from - quirksmode.org

// Edit for Firefox by pHaez

//

function getPageSize() {

	var xScroll, yScroll;

	if (window.innerHeight && window.scrollMaxY) {

		xScroll = document.body.scrollWidth;

		yScroll = window.innerHeight + window.scrollMaxY;

	} else if (document.body.scrollHeight > document.body.offsetHeight) { // all
																			// but
																			// Explorer
																			// Mac

		xScroll = document.body.scrollWidth;

		yScroll = document.body.scrollHeight;

	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla
				// and Safari

		xScroll = document.body.offsetWidth;

		yScroll = document.body.offsetHeight;

	}

	var windowWidth, windowHeight;

	if (self.innerHeight) { // all except Explorer

		windowWidth = self.innerWidth;

		windowHeight = self.innerHeight;

	} else if (document.documentElement
			&& document.documentElement.clientHeight) { // Explorer 6 Strict
														// Mode

		windowWidth = document.documentElement.clientWidth;

		windowHeight = document.documentElement.clientHeight;

	} else if (document.body) { // other Explorers

		windowWidth = document.body.clientWidth;

		windowHeight = document.body.clientHeight;

	}

	// for small pages with total height less then height of the viewport

	if (yScroll < windowHeight) {

		pageHeight = windowHeight;

	} else {

		pageHeight = yScroll;

	}

	// for small pages with total width less then width of the viewport

	if (xScroll < windowWidth) {

		pageWidth = windowWidth;

	} else {

		pageWidth = xScroll;

	}

	arrayPageSize = new Array(pageWidth, pageHeight, windowWidth, windowHeight)

	return arrayPageSize;

}

// -----------------------------------------------------------------------------------

//

// getKey(key)

// Gets keycode. If 'x' is pressed then it hides the lightbox.

//

function getKey(e) {

	if (e == null) { // ie

		keycode = event.keyCode;

	} else { // mozilla

		keycode = e.which;

	}

	key = String.fromCharCode(keycode).toLowerCase();

	if (key == 'x') {

	}

}

// -----------------------------------------------------------------------------------

//

// listenKey()

//

function listenKey() {
	document.onkeypress = getKey;
}

// ---------------------------------------------------

function showSelectBoxes() {

	selects = document.getElementsByTagName("select");

	for (i = 0; i != selects.length; i++) {

		selects[i].style.visibility = "visible";

	}

}

// ---------------------------------------------------

function hideSelectBoxes() {

	selects = document.getElementsByTagName("select");

	for (i = 0; i != selects.length; i++) {

		selects[i].style.visibility = "hidden";

	}

}

// ---------------------------------------------------

//

// pause(numberMillis)

// Pauses code execution for specified time. Uses busy code, not good.

// Code from http://www.faqts.com/knowledge_base/view.phtml/aid/1602

//

function pause(numberMillis) {

	var now = new Date();

	var exitTime = now.getTime() + numberMillis;

	while (true) {

		now = new Date();

		if (now.getTime() > exitTime)

			return;

	}

}

// ---------------------------------------------------

function initLightbox() {
	myLightbox = new Lightbox();
}

Event.observe(window, 'load', initLightbox, false);