/*
 * KoldCast Featured Scroller Class
 * @author Sean Hsieh (envsn.com)
 *
 */

// This scroller requires a parent object, itemWidth, previous button, next button, and slider 
// with the number of elements it will be preparing 
var Scroller = Class.create({
    
    holder: null,
    itemWidth: null,
    prevBtn: null,
    nextBtn: null,
    slider: null,
    sliderObj: null,
    sliderMarks: null,
    position: 1,
    queue: Effect.Queues.get('scroller'),
	bookmarks: null,
   
    initialize: function(holder, itemWidth, prevBtn, nextBtn, slider, tracker, sliderMarks, bookmarks, exchange) {
        this.holder = $(holder);
        this.itemWidth = itemWidth;
        this.prevBtn = $(prevBtn);
        this.nextBtn = $(nextBtn);
        this.slider = $(slider);
        this.tracker = tracker;
        this.sliderMarks = sliderMarks;
        this.position = 1;                                           // assuming that the slider will begin at item 1
		this.bookmarks = $(bookmarks).childElements();
		this.exchange = $(exchange);
       
        this.prevBtn.observe('click', this.scrollPrevious.bindAsEventListener(this));
        this.nextBtn.observe('click', this.scrollNext.bindAsEventListener(this));
		
		// associating the hover areas to work also as prev/next buttons

		$('leftGradient').observe('click', this.scrollPrevious.bindAsEventListener(this));
		$('rightGradient').observe('click', this.scrollNext.bindAsEventListener(this));
		
		// creating the facade of the left & right edges as continuation of the strip
		;
		$$('li.edge')[1].setStyle({background: 'transparent '+this.holder.childElements()[1].childElements()[0].childElements()[0].getStyle('background-image')+' top left no-repeat'}).addClassName('radius8');
		$$('li.edge')[0].setStyle({background: 'transparent '+this.holder.childElements()[6].childElements()[0].childElements()[0].getStyle('background-image')+' top right no-repeat'}).addClassName('radius8');
        
        var cleanup = this.holder.childElements();
        for (i=2;i<=sliderMarks;i++) {
            cleanup[i].childElements()[2].hide();
            cleanup[i].childElements()[3].hide();
            cleanup[i].childElements()[5].hide();
        }

		this.exchange.innerHTML = cleanup[1].childElements()[4].innerHTML;
        
        this.sliderObj = new Control.Slider(tracker, slider, {
            axis: 'horizontal',
            increment: 1,
            alignX: 0,
            range: $R(1, 6),
            values: $R(1, 6),
            sliderValue: 1,
            minimum: 1,
            maximum: sliderMarks
        });

		for (i=0;i < this.bookmarks.size(); i++) {
			this.bookmarks[i].observe('click', this.setMark.bindAsEventListener(this,i+1));
		}
    },
   
    repeatMarks: function() {
        return 'marks: ' + this.sliderMarks + ' position: ' + this.position;
    },
   
    scrollPrevious: function(e) {
        e.stop();
        if (this.position > 1) {
            this.sliderObj.setValue(this.position-1);
        }
        else {
            // this will only happen when we're at the edge
			this.sliderObj.setValue(6);
        }
    },
   
    scrollNext: function(e) {
        e.stop();
        if (this.position < this.sliderMarks) {
            this.sliderObj.setValue(this.position+1);
        }
        else {
            this.sliderObj.setValue(1);
        }
        return true;
    },

	scrollTo: function(obj, number) {
		var delta = (number - obj.position) / -1;
		new Effect.Move(obj.holder, {
			x: delta * obj.itemWidth,
			y: 0,
			queue: {
				position: 'end',
				scope: 'scroller'
			}
		});
		this.hideInfo(obj.position);
		obj.position = number;
		this.showInfo(obj.position);
	},
    
    setMark: function(e,number) {
		e.stop();
		//console.log("number: " + number + ' old position: ' + this.position);
		this.sliderObj.setValue(number);
    },
    
    showInfo: function(mark) {
        var li = this.holder.childElements()[mark];
        var title = li.childElements()[2];
        var subtitle = li.childElements()[3];
		var description = li.childElements()[4].innerHTML;
        var anchor = li.childElements()[5];
        title.show();
        subtitle.show();
        anchor.show();

		this.exchange.innerHTML = description;
    },
    
    hideInfo: function(mark) {
        var li = this.holder.childElements()[mark];
        var title = li.childElements()[2];
        var subtitle = li.childElements()[3];
        var anchor = li.childElements()[5];
        title.hide();
        subtitle.hide();
        anchor.hide();
    },
   
    slideTo: function(bookmark) {
        //
    }
});

var interval = null;  // will store drop down timer on a global scope

var dropDownCount = function() {
	interval = setTimeout('toggleCategories()', 1500);
}

var dropDownSave = function() {
	clearTimeout(interval);
}

var testFunction = function() {
	alert('boom');
}

function toggleCategories() {
	if ($('categoryList').hasClassName('hide')) {
		$('categoryList').removeClassName('hide');
		$('dropDown').addClassName('active');

		// let's initiate the timer right away in case they never hover into the drop down
		dropDownCount();

		$('categoryList').observe('mouseout', dropDownCount);
		$('categoryList').observe('mouseover', dropDownSave);
	}
	else {
		$('categoryList').addClassName('hide');
		$('dropDown').removeClassName('active');
		
		$('categoryList').stopObserving('mouseout', dropDownCount);
		$('categoryList').stopObserving('mouseover', dropDownSave);
		dropDownSave();
	}
}

document.observe("dom:loaded", function() {
	if ($('background_change') != null) {
		$('bodyBG').setStyle({background: '#000 url('+$('background_change').innerHTML+') top left repeat-x'});
	}
	if ($('background_change2') != null) {
		$('PageWrapper').setStyle({background: 'url('+$('background_change2').innerHTML+') top center no-repeat'});
	}
});