/// <reference path="file://F:/mySites/VS2008 Solutions/ValveWorld/js/photogallery_cmpl_na.js" />
/*
	Developed by Robert Nyman, http://www.robertnyman.com
	Code/licensing: http://code.google.com/p/getelementsbyclassname/
	Modified to support MSIE5.0/Win (removed array.push)
*/	
var getElementsByClassName = function (className, tag, elm){
	if (document.getElementsByClassName) {
		getElementsByClassName = function (className, tag, elm) {
			elm = elm || document;
			var elements = elm.getElementsByClassName(className),
				nodeName = (tag)? new RegExp("\\b" + tag + "\\b", "i") : null,
				returnElements = [],
				current;
			for(var i=0, il=elements.length; i<il; i+=1){
				current = elements[i];
				if(!nodeName || nodeName.test(current.nodeName)) {
					returnElements[returnElements.length] = current;
				}
			}
			return returnElements;
		};
	}
	
	else if (document.evaluate) {
		getElementsByClassName = function (className, tag, elm) {
			tag = tag || "*";
			elm = elm || document;
			var classes = className.split(" "),
				classesToCheck = "",
				xhtmlNamespace = "http://www.w3.org/1999/xhtml",
				namespaceResolver = (document.documentElement.namespaceURI === xhtmlNamespace)? xhtmlNamespace : null,
				returnElements = [],
				elements,
				node;
			for(var j=0, jl=classes.length; j<jl; j+=1){
				classesToCheck += "[contains(concat(' ', @class, ' '), ' " + classes[j] + " ')]";
			}
			try	{
				elements = document.evaluate(".//" + tag + classesToCheck, elm, namespaceResolver, 0, null);
			}
			catch (e) {
				elements = document.evaluate(".//" + tag + classesToCheck, elm, null, 0, null);
			}
			while ((node = elements.iterateNext())) {
				returnElements[returnElements.length] = node;
			}
			return returnElements;
		};
	}
	else {
		getElementsByClassName = function (className, tag, elm) {
			tag = tag || "*";
			elm = elm || document;
			var classes = className.split(" "),
				classesToCheck = [],
				elements = (tag === "*" && elm.all)? elm.all : elm.getElementsByTagName(tag),
				current,
				returnElements = [],
				match;
			for(var k=0, kl=classes.length; k<kl; k+=1){
				classesToCheck[classesToCheck.length] = new RegExp("(^|\\s)" + classes[k] + "(\\s|$)");
			}
			for(var l=0, ll=elements.length; l<ll; l+=1){
				current = elements[l];
				match = false;
				for(var m=0, ml=classesToCheck.length; m<ml; m+=1){
					match = classesToCheck[m].test(current.className);
					if (!match) {
						break;
					}
				}
				if (match) {
					returnElements[returnElements.length] = current;
				}
			}
			return returnElements;
		};
}
	return getElementsByClassName(className, tag, elm);
};

function hasClass (ele,cls) {
	return ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)'));
}

function addClass (ele,cls) {
	if (!hasClass(ele,cls)) ele.className += " "+cls;
}

function removeClass (ele,cls) {
	if (hasClass(ele,cls)) {
		var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)');
		ele.className=ele.className.replace(reg,' ');
	}
}

function findPos (obj) {
	//throws exception when obj is null
	if(obj == null) return { left : 0, top : 0 };
	
	var curleft = curtop = 0;
	if (obj.offsetParent) {
		curleft = obj.offsetLeft
		curtop = obj.offsetTop
		while (obj = obj.offsetParent) {
			curleft += obj.offsetLeft
			curtop += obj.offsetTop
		}
	}
	return {left : curleft, top : curtop};
}

//<![CDATA[
var PhotoGallery = {
    classNames: {
        disabled: 'disabled',
        selected: 'selected'
    },

    url: {
        seperator: '#',
        prefix: 'foto-'
    },

    photo: null,
    photos: [],

    carousel: null,

    currentSelectedIdx: 0,

    ad: null,

    caption: null,
    captions: [],

    firstrun: true,

    init: function(photo, carousel, carouselPrevious, carouselNext, carouselContainer, caption, ad) {
        // Initialize carousel
        Carrousel.init(carousel, carouselPrevious, carouselNext, carouselContainer);

        // Store elements
        PhotoGallery.carousel = Carrousel;
        PhotoGallery.photo = photo;
        PhotoGallery.caption = caption;

        // Apply onclick behaviour to carousel elements
        for (var i = 0; i < PhotoGallery.carousel.elements.length; i++) {
            var thumbnail = PhotoGallery.carousel.elements[i];
            if (hasClass(thumbnail, PhotoGallery.classNames.selected)) {
                PhotoGallery.currentSelectedIdx = i;
            }
            thumbnail.onclick = PhotoGallery.onclick;
        }

        // Overwrite previous / next button behaviour
        PhotoGallery.carousel.prev.onclick = PhotoGallery.left;
        PhotoGallery.carousel.next.onclick = PhotoGallery.right;
        PhotoGallery.carousel.prev.ondblclick = PhotoGallery.left;
        PhotoGallery.carousel.next.ondblclick = PhotoGallery.right;

        // Set currently selected photo based on URL fragment
        // else default to the selected element in the HTML
        var idx = PhotoGallery.getIndexFromUrlFragment();
        if (idx) {
            idx = (idx > 0 && idx <= PhotoGallery.carousel.elements.length) ? idx - 1 : 0;
        } else {
            idx = PhotoGallery.currentSelectedIdx;
        }

        // Call currently selected photo
        PhotoGallery.onclick.call(PhotoGallery.carousel.elements[idx]);

        // Remove hide class from image
        removeClass(photo, 'hide');

        // Finish initialization
        PhotoGallery.firstrun = false;
    },

    left: function() {
        if (PhotoGallery.currentSelectedIdx > 0) {
            PhotoGallery.onclick.call(PhotoGallery.carousel.elements[PhotoGallery.currentSelectedIdx - 1]);
        }
        PhotoGallery.displayCurrent();

        return false;
    },

    right: function() {
        if (PhotoGallery.currentSelectedIdx < PhotoGallery.carousel.elements.length - 1) {
            PhotoGallery.onclick.call(PhotoGallery.carousel.elements[PhotoGallery.currentSelectedIdx + 1]);
        }
        PhotoGallery.displayCurrent();

        return false;
    },


    onclick: function() {
        // Deselect previously selected thumbnail
        removeClass(PhotoGallery.carousel.elements[PhotoGallery.currentSelectedIdx], PhotoGallery.classNames.selected);

        // Find, select and scroll currently selected into view
        PhotoGallery.currentSelectedIdx = PhotoGallery.carousel.getElementIndex(this);
        addClass(PhotoGallery.carousel.elements[PhotoGallery.currentSelectedIdx], PhotoGallery.classNames.selected);
        PhotoGallery.carousel.scrollIntoView(this);

        // Display current photo
        PhotoGallery.displayCurrent();

        if (!PhotoGallery.firstrun) {
            // Set URL fragment to current index
            PhotoGallery.setIndexInUrlFragment();
        }

        return false;
    },

    onmouseout: function() {
        this.blur();
    },

    displayCurrent: function() {
        var src = PhotoGallery.photos[PhotoGallery.currentSelectedIdx];
        if (src) {
            // Replace photo
            PhotoGallery.photo.src = src;

        }
        var text = PhotoGallery.captions[PhotoGallery.currentSelectedIdx];
        if (text) {
            PhotoGallery.caption.innerHTML = text;
        }
        else { PhotoGallery.caption.innerHTML = ''; }

    },

    parseUrl: function() {
        var chunks = window.location.href.split(PhotoGallery.url.seperator);
        return { url: chunks[0], fragment: chunks[1] };
    },

    getIndexFromUrlFragment: function() {
        var idx = 0;
        var url = PhotoGallery.parseUrl();
        if (url.fragment) {
            idx = url.fragment.replace(PhotoGallery.url.prefix, '');
        }
        return idx;
    },

    setIndexInUrlFragment: function() {
        // TODO: Implement iframe methode for IE using a jQuery plugin or YUI History Manager
        var url = PhotoGallery.parseUrl(top.location);
        var hash = PhotoGallery.url.seperator + PhotoGallery.url.prefix + (PhotoGallery.currentSelectedIdx + 1);

        // Use replace() to prevent a new entry in the history
        top.location.replace(url.url + hash);
    }
};
//]]>

//*************************************************
//The carousel
//*************************************************

var Carrousel = {
	parent : null,
	prev : null,
	next : null,
	container : null,
	
	elementWidth : null,
	totalWidth : null,
	elements : null,
	nElementsShown : null,
	
	hasCalculated : false,

	init : function (parent, prev, next, container) {
		Carrousel.parent = parent;
		Carrousel.prev = prev;
		Carrousel.next = next;
		Carrousel.container = container;
		
		Carrousel.elements = parent.getElementsByTagName('li');
		
		if (!hasClass(Carrousel.parent, 'hide')) {
			Carrousel.calculateDimensions();
		}
		
		if (Carrousel.prev) {
			Carrousel.prev.onclick = Carrousel.left;
		}
		
		if (Carrousel.next) {
			Carrousel.next.onclick = Carrousel.right;
		}
	},
	
	calculateDimensions : function () {
		if (Carrousel.elements.length) {
			Carrousel.elementWidth = Carrousel.elements[0].offsetWidth;
			Carrousel.nElementsShown = Math.floor(Carrousel.parent.offsetWidth / Carrousel.elementWidth);
			Carrousel.totalWidth = Carrousel.elements.length * Carrousel.elementWidth;
		}
		Carrousel.hasCalculated = true;
	},
	
	left : function () {
		var left = Carrousel.getOffset();		
		var setWidth = Carrousel.nElementsShown * Carrousel.elementWidth;
		
		if (setWidth > left) {
			left += setWidth;			
			if (left > 0) {
				left = 0;
			}			
			Carrousel.setOffset(left);
		}
		return false;
	},
	
	right : function () {
		var left = Carrousel.getOffset();		
		var setWidth = Carrousel.nElementsShown * Carrousel.elementWidth;
		
		if (setWidth < Carrousel.totalWidth + left) {
			left -= setWidth;
			if (Carrousel.totalWidth + left < Carrousel.parent.offsetWidth) {
				left = 0 - (Carrousel.totalWidth - Carrousel.parent.offsetWidth) - 10; // ?!
			}			
			Carrousel.setOffset(left);
		}
		return false;
	},
	
	scrollIntoView : function (obj) {
		var parentPos = findPos(Carrousel.parent);
		var objPos = findPos(obj);
		
		if (objPos.left < parentPos.left) {
			var idx = Carrousel.getElementIndex(obj);
			var expected = 0 - (idx * Carrousel.elementWidth);
			
			Carrousel.setOffset(expected);
		} else if (objPos.left + obj.offsetWidth > parentPos.left + Carrousel.parent.offsetWidth) {
			var idx = Carrousel.getElementIndex(obj);
			if (idx < Carrousel.elements.length - 1) {
				var expected = 0 - ((idx + 1) * Carrousel.elementWidth) + (Carrousel.nElementsShown * Carrousel.elementWidth);				
			} else {
				var expected = 0 - (Carrousel.totalWidth - Carrousel.parent.offsetWidth) - 10; // ?!			
			}			
			Carrousel.setOffset(expected);
		}
	},
	
	getElementIndex : function (obj) {
		var idx = -1;
		for (var i = 0; i < Carrousel.elements.length; i++) {
			if (Carrousel.elements[i] === obj) { // Test for exact reference
				idx = i;
				break;
			}
		}
		return idx;
	},
	
	getOffset : function () {
		var left = Carrousel.container.style.left;
		left = left.length ? parseInt(left.replace('px', '')) : 0;
		return left;
	},
	
	setOffset : function (str) {
		Carrousel.container.style.left = str + 'px';
	}
};