var blockySlider = function() {
	//TODO: gettting delay, isSears and sliderHeight vars from some external globals borderColor = "#90C9EC", 
	delay = delay * 1000;

	var me, timer, timerOn = true,
		slideCnt = 0,
		currSlide = 0,
		bgColorOn = "#254897",
		bgColorOff = "#55a2ec",
		playButtonPath = "slideshow/images/blockyPlay_btn.gif",
		pauseButtonPath = "slideshow/images/blockyPause_btn.gif",
		borderColor = "#ffffff", 
		playImg, slides, numberBtns;

	if (!isSears) {
		bgColorOn = "#7d0707";
		bgColorOff = "#d2021c";
		playButtonPath = "slideshow/images/km_blockyPlay_btn.gif";
		pauseButtonPath = "slideshow/images/km_blockyPause_btn.gif";
		borderColor = "#EBEBEB";
	};

	return {
		init: function() {
			//store objects
			var slideShow = $('#blockySlideShow'),
				slideShowCt = slideShow.parent();

			me = this;

			slides = slideShow.find('.blockySlide');

			//get the number of slides that are going to play
			slideCnt = slides.length;
			//default timer
			timer = setTimeout(function() {
				me.changeSlider(currSlide, slideCnt)
			}, delay);

			//create buttons
			var html = ['<div id="blockySlideBtns">'];
			for (var j=0; j < slideCnt; j++){
				html.push('<div class="blockNumberButtons" id="' + j + '">' +(j+1)+ '</div>');
			}
			html.push('<div class="blockNumberButtons" id="play"><img src="' + pauseButtonPath + '" /></div></div>');
			slideShowCt.append(html.join(''));
			numberBtns = $('#blockySlideBtns .blockNumberButtons');
			playImg = $('#play').find('img');

			//Set up initial look
			slides.eq(0).show(); //display first slide
			numberBtns.css('background-color', bgColorOff);
			$('#play').css('background-color', 'white');
			numberBtns.eq(currSlide).css('background', bgColorOn);

			slideShowCt.css({
				border: '1px solid ' + borderColor,
				background: 'none',
				height: sliderHeight
			});

			//button functionality
			numberBtns.click(function() {
				var id = $(this).attr('id');

				if (id == 'play') {
					me.timerRevolt();
				}
				else if (id == currSlide) {
					//nothing
				}
				else {
					me.clickChangeSlider(id);
					$(this).css('background', bgColorOn);
				}
			});

			numberBtns.hover(
				function() {
					if ($(this).attr('id') != 'play') {
						$(this).css('background', bgColorOn);
					}
				},
				function() {
					var id = $(this).attr('id');
					if (id != 'play' && id != currSlide){
						$(this).css('background', bgColorOff);
					}
				}
			);
		},

		//timed change
		changeSlider: function(idx, slideCnt) {
			//store objects
			slides.eq(idx).fadeOut(1000);
			numberBtns.eq(idx).css('background', bgColorOff);
			currSlide = (idx >= slideCnt-1) ? 0 : currSlide+1;

			slides.eq(currSlide).fadeIn(1000);
			numberBtns.eq(currSlide).css('background', bgColorOn);
			timer = setTimeout(function() {
				me.changeSlider(currSlide,slideCnt)
			}, delay);
		},

		//click change
		clickChangeSlider: function(nextSlide) {
			//store objects
			slides.eq(currSlide).fadeOut(1000);
			numberBtns.eq(currSlide).css('background', bgColorOff);
			slides.eq(nextSlide).fadeIn(1000);
			numberBtns.eq(nextSlide).css('background', bgColorOn);
			clearTimeout(timer);
			timer = 0;
			timerOn = false;
			currSlide = nextSlide;
			playImg.attr('src',playButtonPath);
		},

		//playbutton
		timerRevolt: function() {
			if (timerOn) {
				clearTimeout(timer);
				timer = 0;
				timerOn = false;
				playImg.attr('src',playButtonPath);
			}
			else {
				timerOn = true;
				me.changeSlider(currSlide,slideCnt);
				playImg.attr('src', pauseButtonPath);
			}
		}
	};
}();

$(function(){
	blockySlider.init();
});