var slider = {};

slider.preloader = new Array();
slider.isIE = ((navigator.appVersion.indexOf("MSIE")!= -1)&&!window.opera);

// DOM nodes
slider.nodes = {};
slider.nodes.blackout = null;
slider.nodes.container = null;
slider.nodes.mainImg = null;

// constants
slider.params = {};
slider.params.startCentered = true;
slider.params.defaultHeight = 445;
slider.params.slideSlow = 1;
slider.params.slideMedium = 2;
slider.params.slideFast = 10;

// blackout variables
slider.blackout = {};
slider.blackout.timer = null;
slider.blackout.opacity = null;

// slide variables
slider.slideVars = {};
slider.slideVars.timer = null;
slider.slideVars.direction = null;
slider.slideVars.amount = null;
slider.slideVars.maxSlide = null;


/* 'Public' functions */

slider.init = function() {
	slider.nodes.blackout = id("blackout");
	slider.nodes.container = id("sliderContainer");
	slider.nodes.mainImg = id("sliderMainImage");
	
	// shhh ;)
	window.onresize = slider.resized;
	
	// main image events
	slider.nodes.mainImg.onload = slider.loaded;
	slider.nodes.mainImg.onmousedown = nodrag;
	
	// preload images
	var port = id('portfolioContainer');
	var imgs = port.getElementsByTagName('img');
	for (var i=0; i<imgs.length; i++) {
		var img = new Image();
		img.src = slider.thumbToMain(imgs[i].src);
		slider.preloader.push(img);
	}
	
}

slider.show = function(img) {
	// default height before image is loaded
	slider.nodes.container.style.height = slider.params.defaultHeight + "px";
	
	// put the slider near the top of the viewable part of the page
	if (window.pageYOffset) {
		var scrollY = window.pageYOffset;
	}
	else {
		var scrollY = document.body.scrollTop
	}
	slider.nodes.container.style.top = scrollY + 150 + "px";
	
	
	// start image loading and reset slide
	var src = slider.thumbToMain(img.src);
	slider.nodes.mainImg.style.marginLeft = "0px";
	slider.slideVars.maxSlide = 0;
	slider.nodes.mainImg.src = src;
	
	// start blackout animation
	slider.blackout.opacity = 0;
	slider.setNodeOpacity(slider.nodes.blackout, slider.blackout.opacity);
	slider.nodes.blackout.style.display = "block";
	slider.blackout.timer = setInterval(slider.fadeInBlackout, 35);
}

slider.close = function() {
	// cancel timer if running
	clearInterval(slider.blackout.timer);
	// hide slider image
	slider.nodes.container.style.display = "none";
	// fade out blackout
	slider.blackout.timer = setInterval(slider.fadeOutBlackout, 10);
}

slider.loaded = function() {
	// image has loaded, so can read img height and set container to that height
	// IE fails at this (fires too early), but this is set again anyway on display of slider
	slider.nodes.container.style.height = slider.nodes.mainImg.height + "px";
	slider.maxSlide();
}

slider.resized = function() {
	slider.maxSlide();
}

slider.startSlide = function(hotspot) {
	// direction
	if (CSSClass.is(hotspot, "slideLeft")) {
		slider.slideVars.direction = -1;
	}
	else {
		slider.slideVars.direction = 1;
	}
	// speed
	if (CSSClass.is(hotspot, "slideFast")) {
		slider.slideVars.amount = slider.params.slideFast;
	}
	else if (CSSClass.is(hotspot, "slideMedium")) {
		slider.slideVars.amount = slider.params.slideMedium;
	}
	else {
		slider.slideVars.amount = slider.params.slideSlow;
	}
	// start slide timer
	slider.slideVars.timer = setInterval(slider.slide, 10);
}

slider.endSlide = function() {
	clearInterval(slider.slideVars.timer);
}

/* 'Private' functions */

slider.showSlider = function() {
	slider.nodes.container.style.display = "block";
	slider.nodes.container.style.height = slider.nodes.mainImg.height + "px";
	slider.maxSlide();
	// center image
	if (slider.slideVars.maxSlide > 0 && slider.params.startCentered) {
		var centerShift = -(slider.slideVars.maxSlide/2);
		slider.nodes.mainImg.style.marginLeft = centerShift + "px";
	}
}

slider.maxSlide = function() {
	// calculate and set max slide
	var max = slider.nodes.mainImg.width - slider.nodes.container.offsetWidth;
	if (max < 0) max = 0;
	slider.slideVars.maxSlide = max;
	
	// set slider to that if currently greater
	var ml = parseInt(slider.nodes.mainImg.style.marginLeft, 10);
	if (ml < -max) {
		slider.nodes.mainImg.style.marginLeft = -max + "px";
	}
}

slider.slide = function() {
	var ml = parseInt(slider.nodes.mainImg.style.marginLeft, 10);
	var max = slider.slideVars.maxSlide;
	var budge = slider.slideVars.amount * slider.slideVars.direction;
	
	ml += budge;
	if (ml > 0) ml = 0;
	if (ml < -max) ml = -max;
	slider.nodes.mainImg.style.marginLeft = ml + "px";
}

slider.thumbToMain = function(src) {
	var thumbFilename = src.match(/[\/]([^\/]+)$/)[1];
	var mainFilename = "big-" + thumbFilename;
	return src.replace(thumbFilename, mainFilename);
}

slider.fadeInBlackout = function() {
	slider.blackout.opacity += 0.09;
	if (slider.blackout.opacity >= 0.5) {
		slider.blackout.opacity = 0.85;
		clearInterval(slider.blackout.timer);
		// show slider image
		slider.showSlider();
	}
	slider.setNodeOpacity(slider.nodes.blackout, slider.blackout.opacity);
}

slider.fadeOutBlackout = function() {
	slider.blackout.opacity -= 0.09;
	if (slider.blackout.opacity <= 0.05) {
		slider.blackout.opacity = 0;
		clearInterval(slider.blackout.timer);
		// hide blackout
		slider.nodes.blackout.style.display = "none";
	}
	slider.setNodeOpacity(slider.nodes.blackout, slider.blackout.opacity);
}

slider.setNodeOpacity = function(n, op) {
	if (slider.isIE) {
		// IE only code so the poor thing can cope
		n.style.filter = "alpha(opacity=" + op*100 + ")";
	}
	else {
		// code for normal correctly programmed browsers
		n.style.opacity = op;
	}
}

/*
function sliderLoaded() {
	return;
	//alert(img1.height);
	img1.style.marginLeft = "0px";
	var h = img1.height + "px";
	cont.style.height = h;
	var nl = cont.childNodes;
	for (var i=0; i<nl.length; i++) {
		if (CSSClass.is(nl[i], "sliderHotSpot")) {
			nl[i].style.height = h;
		}
	}
}
*/

/* Global Stuffs */

function id(e) {
	if (typeof e == "string") return document.getElementById(e);
	return e;
}

function nodrag(event){
	event = event || window.event;
	if(event.preventDefault) {
		event.preventDefault();
	}
}

/* CSS Class */

var CSSClass = {};

// Return true if element is a member of the class c; false otherwise
CSSClass.is = function(e, c) {
	e = id(e);
	
	// pre-screen prior to regexp
	var classes = e.className;
	if (!classes) return false; // no classes
	if (classes == c) return true;  // Class c only
	
	return classes.search("\\b" + c + "\\b") != -1;
};

// Add class c to element e if not already present
CSSClass.add = function(e, c) {
	e = id(e);
	
	if (CSSClass.is(e, c)) return;
	if (e.className) c = " " + c;
	e.className += c;
};

// Remove all occurences of class c from e
CSSClass.remove = function(e, c) {
	e = id(e);
	e.className = e.className.replace(new RegExp("\\b" + c + "\\b\\s*", "g"), "");
}

// remove all occurances of c+"XX" where XX = 00-99
CSSClass.removeSeries = function(e, c) {
	e = id(e);
	e.className = e.className.replace(new RegExp("\\b" + c + "\\d\\d\\b\\s*", "g"), "");
}