if (typeof UI == "undefined") { var UI = new Object(); }
UI.Slider = Class.create();
UI.Slider.prototype = {
    initialize: function(params) {
        this.options = Object.extend({
            visibleHeight: 2,
            visibleWidth: 2,
	        autoScroll: 0,
            randomStartPosition: 0
        },params || {});
       
        this.animating = false;  
        this.timer = null; 
      if (this.options.containerElement) { 
			var elContainer = this.options.containerElement;
            this.container = Element.getElementsByClassName(elContainer, "sliderRender")[0];
            this.itemList = Element.getElementsByClassName(elContainer, "sliderContent")[0];
            var prevEl = Element.getElementsByClassName(elContainer, "sliderPrev")[0];
            var nextEl = Element.getElementsByClassName(elContainer, "sliderNext")[0];
            Event.observe(prevEl, "click", this.doClickPrev.bindAsEventListener(this), false);
            Event.observe(nextEl, "click", this.doClickNext.bindAsEventListener(this), false);
			Event.observe(this.container, "mousedown", this.clearAutoScroll.bindAsEventListener(this), false);
 	    } else {
            this.container = $(this.options.renderElementId);
            this.itemList  = $(this.options.listElementId); 
            Event.observe($(this.options.prevElementId), "click", this.doClickPrev.bindAsEventListener(this), false);
            Event.observe($(this.options.nextElementId), "click", this.doClickNext.bindAsEventListener(this), false);
        }
	  	    
       this.repopulate();

    },
    repopulate: function() {
		this.position = 0;
		this.container.setStyle({left: (this.position + "px")});
		this.container.innerHTML = "";
	    this.pages = [];      
        this.currentPage = 1; 
		var items = [];
        var node = this.itemList.firstChild;
		while (node) {
            var nextNode = node.nextSibling;
            if (node.nodeType == 1) {
                items.push(Element.remove(node));
            }
            node = nextNode;
        }
		 if (this.options.randomStartPosition) { 
            var head = items.splice(Math.floor(Math.random()*items.length));
            items = head.concat(items);
        }

        this.itemWidth  = Math.ceil(parseFloat(Element.getStyle(this.container.parentNode, "width")) / this.options.visibleWidth);
        this.itemHeight = Math.ceil(parseFloat(Element.getStyle(this.container.parentNode, "height")) / this.options.visibleHeight);
        this.pageWidth  = parseInt(Element.getStyle(this.container.parentNode, "width"), 10);
        this.totalPages = Math.ceil(items.length / (this.options.visibleHeight * this.options.visibleWidth));
		var singlePage, row, cell, item;
		for (var p=0; p<this.totalPages; p++) {
            singlePage = document.createElement("table");
            singlePage.appendChild(document.createElement("tbody"));
            singlePage.border = "0";
            singlePage.cellPadding = "0";
            singlePage.cellSpacing = "0";
            Element.addClassName(singlePage, "sliderPage");
            singlePage.width = this.pageWidth;
            Element.setStyle(singlePage, {width: this.pageWidth +'px'});
            
            for (var h=0; h<this.options.visibleHeight; h++) {
                row = document.createElement("tr");
                for (var w=0; w<this.options.visibleWidth; w++) {
                    cell = document.createElement("td");
                    cell.width  = this.itemWidth;
                    cell.height = this.itemHeight;
                    Element.setStyle(cell, {verticalAlign: "top"});
                    item = items.shift();
                    if (item) { 
                        cell.appendChild(item);
                    }
                    row.appendChild(cell);
                }
                singlePage.appendChild(row);                    
            }

            try {
                this.container.appendChild(singlePage);
            } catch(e) {}
        }
		this.itemList.innerHTML = "";
		this.container.innerHTML = this.container.innerHTML;
        this.position = 0;
        this.setAutoTimer();
		this.changeText();
	},
    setAutoTimer: function() {
        if (this.autoScrollTimer) {
            clearInterval(this.autoScrollTimer);
        }
        if (this.options.autoScroll > 0) {
            this.autoScrollTimer = setInterval(this.doNext.bindAsEventListener(this), (this.options.autoScroll * 1000));
        }
    },

    movePage: function(direction) {
     	 if (direction == "front") {
		   var el =  this.container.cleanWhitespace().lastChild;
			while (el.nodeType != 1) {
                el = el.previousElement;
            }
		   this.container.insertBefore(this.container.removeChild(el), this.container.firstChild);
            this.position = this.position - this.pageWidth;

        } else if (direction == "back") {
            var el =  this.container.cleanWhitespace().firstChild;
            while (el.nodeType != 1) {
                el = el.nextElement;
            }
            this.container.appendChild(this.container.removeChild(el));             
            this.position = this.position + this.pageWidth;

        }
		
        this.container.setStyle({left: (this.position + "px")});
    },
    
    doPrev: function() {
		
		this.currentPage--;
        if (this.currentPage < 1) {
            this.movePage("front"); 
            this.currentPage = 1;
        }
		this.position = this.position + this.pageWidth;
        this.container.morph({left: (this.position + "px")}, {duration: 0.5,  transition: Effect.Transitions.sinoidal});
		this.changeText();
    },
    
    doNext: function() {
				
		this.currentPage++;
        if (this.currentPage > this.totalPages) {
            this.movePage("back"); 
            this.currentPage = this.totalPages;
        }       
		this.position = this.position - this.pageWidth;
        this.container.morph({left: (this.position + "px")}, {duration: 0.5,  transition: Effect.Transitions.sinoidal});
		this.changeText();
    },
    changeText: function() {
		 if(this.options.containerElement.className.indexOf("promoSlider") > -1) {
			   var el = this.container.childNodes[this.currentPage-1];
			   var elm = Element.getElementsByClassName(el, "title")[0];
			   var text = document.getElementById('promoText');
			   if(el && elm && text && text.innerHTML != elm.innerHTML) {
					 text.innerHTML = elm.innerHTML;
			   }
			    var sval = document.getElementById("sValue");
				 if(sval && sval.id && elm) {
					var val = elm.id.replace(elm.className,"");
					if(val != '' && val > 0) {
						sval.value = val;
					}
				 }
		}
		
	},	
    doClickPrev: function() {
        this.clearAutoScroll();
        this.doPrev();
    },
    
    doClickNext: function() {
        this.clearAutoScroll();
        this.doNext();
    },

    clearAutoScroll: function() {
        this.options.autoScroll = 0;
        this.setAutoTimer();
    }   

}

