﻿// -----------------------------------------------------------------------------------
//
//	Britebox v1.0
//	A modal plugin for Litebox 1.0 (http://doknowevil.net/litebox)
//	02/15/07
//
//	Source edited from Lightbox v2.02
//	by Lokesh Dhakar - http://www.huddletogether.com
//
//	For more information on this script, visit:
//	http://doknowevil.net/litebox
//
//	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.
//
// -----------------------------------------------------------------------------------

// added by Ryan Sullivan from original prototype framework
if (!window.Event) {
  var Event = new Object();
}

Object.extend(Event, {
  observers: false,

  _observeAndCache: function(element, name, observer, useCapture) {
    if (!this.observers) this.observers = [];
    if (element.addEventListener) {
      this.observers.push([element, name, observer, useCapture]);
      element.addEventListener(name, observer, useCapture);
    } else if (element.attachEvent) {
      this.observers.push([element, name, observer, useCapture]);
      element.attachEvent('on' + name, observer);
    }
  },

  unloadCache: function() {
    if (!Event.observers) return;
    for (var i = 0, length = Event.observers.length; i < length; i++) {
      Event.stopObserving.apply(this, Event.observers[i]);
      Event.observers[i][0] = null;
    }
    Event.observers = false;
  },

  observe: function(element, name, observer, useCapture) {
    element = $(element);
    useCapture = useCapture || false;

    if (name == 'keypress' &&
        (navigator.appVersion.match(/Konqueror|Safari|KHTML/)
        || element.attachEvent))
      name = 'keydown';

    Event._observeAndCache(element, name, observer, useCapture);
  },

  stopObserving: function(element, name, observer, useCapture) {
    element = $(element);
    useCapture = useCapture || false;

    if (name == 'keypress' &&
        (navigator.appVersion.match(/Konqueror|Safari|KHTML/)
        || element.detachEvent))
      name = 'keydown';

    if (element.removeEventListener) {
      element.removeEventListener(name, observer, useCapture);
    } else if (element.detachEvent) {
      try {
        element.detachEvent('on' + name, observer);
      } catch (e) {}
    }
  }
});

// ------------------------------------
// modal functionality by Ryan Sullivan
// ------------------------------------
//
//	Modal object literal properties:
//	url:				url of page to be opened in box (String)
//	[width]:			fixed width of box in pixels; modal will not be resizable until it is closed (Number | Number + 'px')
//	[height]:			fixed height of box in pixels; modal will not be resizable until it is closed (Number | Number + 'px')
//	[top]:				fixed top of the box in pixels (Number | Number + 'px')
//	[left]:				fixed left of the box in pixels (Number | Number + 'px')
//	[relativeTo]:		id of element to which box will be relatively positioned (String)
//	[borderSize]:		size of the box border in pixels (Number | Number + 'px')
//	[overlay]:			determines if overlay is rendered ('no' | *)
//	[overlayOpacity]:	opacity percentage value of overlay (Number 0-100)
//	[overlayColor]:		color of overlay (CSS compatible value)
//	[modal]:			determines if box is modal, i.e. must be closed before returning to parent application ('yes' | *) (DO NOT COMBINE WITH [chrome])
//	[chrome]:			determines if box chrome (close button, page title) is shown ('no' | *) (DO NOT COMBINE WITH [modal])
//	[title]:			text of title/caption (String)
//	[showTitle]:		determines page title/caption is shown ('no' | *)
//

Object.extend(Lightbox.prototype, {

	//
	//	initializeModal()
	//	Inserts html at the bottom of the page which is used to display the page container.
	//	initialize() addition
	//
	initializeModal: function() {
		
		// create modal element
		var objLightboxPage = document.createElement('object');
		objLightboxPage.setAttribute('type','text/html');
//		if(document.all) {
			objLightboxPage = document.createElement('iframe');
			objLightboxPage.setAttribute('frameBorder','0');
			objLightboxPage.setAttribute('scrolling','no');
//		}
		objLightboxPage.setAttribute('id','lightboxPage');
		objLightboxPage.style.overflow = 'hidden';

		// insert modal element
		if($('lightboxPage')) { $('lightboxPage').parentNode.removeChild($('lightboxPage')); }
		$('imageContainer').insertBefore(objLightboxPage,$('imageContainer').childNodes[0]);
		pageEffect = new fx.Opacity(objLightboxPage, { duration: 350, onComplete: function() { imageDetailsEffect.custom(0,1); }});
		pageEffect.hide();
	},

	//
	//	startModal()
	//	Display overlay and modal.
	//	initialize() addition and start() substitute
	//
	startModal: function(modal) {
		if(!modal) { return; }

		var styleSheet = getStyleSheet('lightbox.css');

		// get padding from style sheet if available
		var imageContainerStyleRule = getStyleRuleById(styleSheet,'imageContainer');
		if(imageContainerStyleRule) {
			borderSize = (!isNaN(parseInt(imageContainerStyleRule.style.padding.replace('px','')))) ? parseInt(imageContainerStyleRule.style.padding.replace('px','')) : borderSize;
		}
		if(modal.borderSize) {
			borderSize = (isNaN(modal.borderSize)) ? parseInt(modal.borderSize.replace('px','')) : modal.borderSize;
			$('imageContainer').style.padding = borderSize + 'px';
		}

		var overlay = (modal.overlay != 'no');
		var overlayOpacity = 0.8;

		if(overlay) {
			// get overlay opacity from style sheet if available
			var overlayStyleRule = getStyleRuleById(styleSheet,'overlay');
			overlayOpacity = (overlayStyleRule && !isNaN(parseFloat(overlayStyleRule.style.opacity))) ? parseFloat(overlayStyleRule.style.opacity) : overlayOpacity;
			overlayOpacity = (!isNaN(parseInt(modal.overlayOpacity))) ? modal.overlayOpacity/100 : overlayOpacity;
			$('overlay').style.backgroundColor = modal.overlayColor || $('overlay').style.backgroundColor;
		}

		if(modal.chrome == 'no') { Element.hide('imageDataContainer'); } // don't show chrome if chrome = no

		Element.hide('lightboxImage');
		Element.hide('hoverNav');

		// don't allow clicking on overlay to close if modal = yes
		$('overlay').onclick = (modal.modal == 'yes') ? function() { return false; } : function() { myLightbox.endModal(overlay,overlayOpacity); return false; }
		$('loadingLink').onclick = function() { myLightbox.endModal(overlay,overlayOpacity); return false; }
		$('bottomNavClose').onclick = function() { myLightbox.endModal(overlay,overlayOpacity); return false; }

		Event.observe('lightboxPage','load',function(){ myLightbox.modalOnLoad(modal); });

		// start() substitute
		//
		hideSelectBoxes();

		// stretch overlay to fill page and fade in
		var arrayPageSize = getPageSize();
		Element.setHeight('overlay', arrayPageSize[1]);
		if(overlay) { overlayEffect.custom(0,overlayOpacity); } // don't show overlay if overlay = no

		this.changePosition(modal);
		Event.observe(window, "resize", function(){ myLightbox.changePosition(modal); });

		Element.show('lightbox');
		myLightbox.changePage();
		$('lightboxPage').setAttribute('src',modal.url);
	},

	modalOnLoad: function(modal) {

		// hide elements during transition
		myLightbox.changePage();

		var doc = $('lightboxPage').contentDocument || $('lightboxPage').contentWindow.document;
		doc.getElementsByTagName('html')[0].style.overflow = 'auto';
		doc.body.style.overflow = 'auto';

		// get dynamic size of body of page in frame
		var framePageSize = getFramePageSize($('lightboxPage'));
		var framePageWidth = framePageSize[0];
		var framePageHeight = framePageSize[1];

		// use CSS properties of body of page in frame
		if(doc.body.style.width && doc.body.style.height) { $('lightboxPage').style.overflow = 'auto'; }
		framePageWidth = (doc.body.style.width) ? parseInt(doc.body.style.width.replace('px','')) : framePageWidth;
		framePageHeight = (doc.body.style.height) ? parseInt(doc.body.style.height.replace('px','')): framePageHeight;

		// use properties from modal parameter
		if(modal.width || modal.height) { $('lightboxPage').style.overflow = 'auto'; }
		if(modal.width) { framePageWidth = (isNaN(modal.width)) ? parseInt(modal.width.replace('px','')) : modal.width; doc.body.style.width = framePageWidth + 'px'; }
		if(modal.height) { framePageHeight = (isNaN(modal.height)) ? parseInt(modal.height.replace('px','')) : modal.height; doc.body.style.height = framePageHeight + 'px'; }

		// add space for scrollbar if content is too high
		if(framePageHeight < framePageSize[1]) {
			$('lightboxPage').style.overflow = 'auto';
			framePageWidth += 17;
			doc.body.style.width = (parseInt(doc.body.style.width.replace('px','')) + 17) + 'px';
		}

		// use title of page in frame as caption or specified title
		if(modal.showTitle != 'no') { Element.show('caption'); }
		Element.setInnerHTML('caption', doc.title);
		if(modal.title) { Element.setInnerHTML('caption', modal.title); }

		// attach page change transition to any elements in frame that change the page
//		if(doc.forms[0]) { Event.observe(doc.forms[0],'submit',function(){ myLightbox.changePage(); }); }
		
		// once page is preloaded, resize page container
		myLightbox.resizePageContainer(framePageWidth,framePageHeight);
	},

	//
	//	changePosition()
	//	Changes position of box if it is relatively positioned to an element.
	//
	changePosition: function(modal) {
		
		// calculate top offset
		var arrayPageSize = getPageSize();
		var arrayPageScroll = getPageScroll();
		var lightboxTop = arrayPageScroll[1] + (arrayPageSize[3] / 15);
		if(modal.top) { lightboxTop = isNaN(modal.top) ? parseInt(modal.top.replace('px','')) : modal.top; }
		if(modal.relativeTo) { lightboxTop += $(modal.relativeTo).offsetTop; }
		Element.setTop('lightbox', lightboxTop);

		// calculate left offset
		if(modal.left || modal.relativeTo) {
			var lightboxLeft = 0;
			if(modal.left) {
				$('lightbox').style.width = 'auto';
				$('outerImageContainer').style.margin = '0';
				$('imageDataContainer').style.margin = '0';
				lightboxLeft = isNaN(modal.left) ? parseInt(modal.left.replace('px','')) : modal.left;
			}
			if(modal.relativeTo) {
				if(!modal.left) { $('lightbox').style.width = $(modal.relativeTo).offsetWidth + 'px'; }
				lightboxLeft += $(modal.relativeTo).offsetLeft;
			}
			$('lightbox').style.left = lightboxLeft + 'px';
		}
	},

	//
	//	changePage()
	//	Hide most elements in preparation for resizing page container.
	//	changeImage() substitute
	//
	changePage: function() {
		
		// hide elements during transition
		Element.show('loading');
		imageDetailsEffect.hide();
		pageEffect.hide();
		navEffect.hide();
		Element.hide('numberDisplay');
	},

	//
	//	resizePageContainer()
	//	resizeImageContainer(), showImage(), updateDetails() substitute
	//
	resizePageContainer: function(imgWidth, imgHeight) {

		// get current height and width
		this.wCur = Element.getWidth('outerImageContainer');
		this.hCur = Element.getHeight('outerImageContainer');

		// calculate size difference between new and old image, and resize if necessary
		wDiff = (this.wCur - borderSize * 2) - imgWidth;
		hDiff = (this.hCur - borderSize * 2) - imgHeight;
		
		// Resize the outerImageContainer very sexy like
		reHeight = new fx.Height('outerImageContainer', { duration: resizeDuration });
		reHeight.custom(Element.getHeight('outerImageContainer'),imgHeight+(borderSize*2)); 
		reWidth = new fx.Width('outerImageContainer', { duration: resizeDuration, onComplete: function() { pageEffect.custom(0,1); }});
		reWidth.custom(Element.getWidth('outerImageContainer'),imgWidth+(borderSize*2));

		// 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.setWidth('imageDataContainer', imgWidth + (borderSize * 2));
		Element.setWidth('hoverNav', imgWidth + (borderSize * 2));
		
		// showImage() substitute
		//
		Element.hide('loading');
		Element.setWidth( 'lightboxPage', imgWidth);
		Element.setHeight('lightboxPage', imgHeight);
	},

	//
	//	endModal()
	//	end() substitute
	//
	endModal: function(overlay,overlayOpacity) {
		Element.hide('lightbox');
		$('outerImageContainer').style.margin = '0 auto';
		$('outerImageContainer').style.width = '250px';
		$('outerImageContainer').style.height = '250px';
		$('imageDataContainer').style.margin = '0 auto';
		$('lightbox').style.left = '0';
		$('lightbox').style.width = '100%';
		pageEffect.toggle();
		if(typeof(overlay) != 'undefined' && overlay) {
			overlayEffect.custom(overlayOpacity,0);
		} else {
			if($('overlay').style.opacity > 0) { overlayEffect.custom(0.8,0); }
		}
//		$('lightboxPage').parentNode.removeChild($('lightboxPage'));
		showSelectBoxes();
		$('overlay').onclick = function() { myLightbox.end(); return false; }
		$('loadingLink').onclick = function() { myLightbox.end(); return false; }
		$('bottomNavClose').onclick = function() { myLightbox.end(); return false; }
		$('overlay').style.backgroundColor = '';
		$('imageContainer').style.padding = '';
		Element.show('hoverNav');
		Element.show('lightboxImage');
	}
});

// Fx/Mac fix for SWFObject
if(!navigator.oscpu || (navigator.oscpu && !navigator.oscpu.match(/Mac/))) {
	Event.observe(window, "load", function() { initLightbox();myLightbox.initializeModal(); });
}

//
//	getFramePageSize()
//	Returns array with page width, height
//	modification of getPageSize()
//
function getFramePageSize(frame){
	
	var doc = frame.contentDocument || frame.contentWindow.document;
	if(!doc) { return []; }

	return new Array(doc.body.scrollWidth, doc.body.scrollHeight);
}

// ------------------------------------

// Additional methods added by Ryan Sullivan
function getStyleSheet(styleSheetName) {
    
	if(!document.styleSheets || !styleSheetName) { return; }
	var styleSheet;
	for (var i = 0; i < document.styleSheets.length; i++) {
	    if(document.styleSheets[i].href == null) { continue; }
	    if(document.styleSheets[i].href.indexOf(styleSheetName) != -1) { styleSheet = document.styleSheets[i]; }
	}
	return styleSheet;
}

function getStyleRuleById(styleSheet,elementID) {

	var elem = document.getElementById(elementID);
	if(!elem) { return; }

	var styleRule;
	var rules = styleSheet.cssRules || styleSheet.rules;
	for(var i = 0; i < rules.length; i++) {
		if(rules[i].selectorText == "#" + elementID) { styleRule = rules[i]; }
	}
	return styleRule;
}
