/// <reference name="MicrosoftAjax.js"/>

Type.registerNamespace("Windows");

Windows.ContentSliderBehavior = function(element) {
    Windows.ContentSliderBehavior.initializeBase(this, [element]);

	this.scrollLeftButtonClickDelegate = Function.createDelegate(this, this.ScrollLeftClicked);
	this.scrollRightButtonClickDelegate = Function.createDelegate(this, this.ScrollRightClicked);

	this.slideRightScrollContentTick = Function.createDelegate(this, this.SlideRightScrollContentTick);
	this.slideLeftScrollContentTick = Function.createDelegate(this, this.SlideLeftScrollContentTick);

	this.leftArrowMouseOverDelegate = Function.createDelegate(this, this.LeftArrowMouseOver);
	this.rightArrowMouseOverDelegate = Function.createDelegate(this, this.RightArrowMouseOver);
	this.leftArrowMouseOutDelegate = Function.createDelegate(this, this.LeftArrowMouseOut);
	this.rightArrowMouseOutDelegate = Function.createDelegate(this, this.RightArrowMouseOut);
	
	this.currentPosition = 0;
	this.destinationPosition = 0;
	this.currentSlideIndex = 0;
	this.numberOfPixelsToMoveSliderBy = 170;
	this.isScrolling = false;
}

Windows.ContentSliderBehavior.prototype = {
    initialize: function() {
        Windows.ContentSliderBehavior.callBaseMethod(this, 'initialize');
        
		this._scrollLeftButtonPanelElement = document.getElementById(this.get_ScrollLeftButtonPanel());
		this._scrollRightButtonPanelElement = document.getElementById(this.get_ScrollRightButtonPanel());
		$addHandler(this._scrollLeftButtonPanelElement, "click", this.scrollLeftButtonClickDelegate);
		$addHandler(this._scrollRightButtonPanelElement, "click", this.scrollRightButtonClickDelegate);

		
		this._contentItemsSliderContainerPanelElement = document.getElementById(this.get_SlidingDivID());
		
		this._leftArrowImageElement = document.getElementById(this.get_LeftArrowImage());
		this._rightArrowImageElement = document.getElementById(this.get_RightArrowImage());
		$addHandler(this._leftArrowImageElement, "mouseover", this.leftArrowMouseOverDelegate);
		$addHandler(this._rightArrowImageElement, "mouseover", this.rightArrowMouseOverDelegate);
		$addHandler(this._leftArrowImageElement, "mouseout", this.leftArrowMouseOutDelegate);
		$addHandler(this._rightArrowImageElement, "mouseout", this.rightArrowMouseOutDelegate);
		
		this.InitializeSlider();
    },
    dispose: function() {
        Windows.ContentSliderBehavior.callBaseMethod(this, 'dispose');
    },
    
    
    InitializeSlider: function()
    {
		this.SetArrowTransparency();
    },
    SetOpacity: function(element, opacityValue) {
        element.style.opacity = opacityValue / 10;
        element.style.filter = 'alpha(opacity=' + opacityValue * 10 + ')';
    },
    SetArrowTransparency: function()
    {
		if (this.currentSlideIndex == 0) {
			this.SetOpacity(this._leftArrowImageElement, 4);
			this._leftArrowImageElement.src = this.get_LeftOrangeArrowImagePath();
		}
		else if (this.currentSlideIndex == this.get_NumberOfClicksToEndOfSlides()) {
			this.SetOpacity(this._rightArrowImageElement, 4);
			this._rightArrowImageElement.src = this.get_RightOrangeArrowImagePath();
		}
		else {
			this.SetOpacity(this._leftArrowImageElement, 10);
			this.SetOpacity(this._rightArrowImageElement, 10);
		}
    },
    LeftArrowMouseOver: function()
    {
		if (this.currentSlideIndex > 0)
		{
			this._leftArrowImageElement.src = this.get_LeftGreenArrowImagePath();
		}
    },
    RightArrowMouseOver: function()
    {
		if (this.currentSlideIndex < this.get_NumberOfClicksToEndOfSlides())
		{
			this._rightArrowImageElement.src = this.get_RightGreenArrowImagePath();
		}
    },
    LeftArrowMouseOut: function()
    {
		this._leftArrowImageElement.src = this.get_LeftOrangeArrowImagePath();
    },
    RightArrowMouseOut: function()
    {
		this._rightArrowImageElement.src = this.get_RightOrangeArrowImagePath();
    },
    
    //Event Handlers:
	SlideRightScrollContentTick: function() {
		if (this.currentPosition > this.destinationPosition) {
			this.currentPosition -= 10;
			this._contentItemsSliderContainerPanelElement.style.left = this.currentPosition + 'px';
		}
		else {
			clearInterval(this.slideInterval);
			this.isScrolling = false;
			this._contentItemsSliderContainerPanelElement.style.left = this.destinationPosition + 'px';
			this.currentPosition = this.destinationPosition;
		}
	},
	SlideLeftScrollContentTick: function() {
		if (this.currentPosition < this.destinationPosition) {
			this.currentPosition += 10;
			this._contentItemsSliderContainerPanelElement.style.left = this.currentPosition + 'px';
		}
		else {
			clearInterval(this.slideInterval);
			this.isScrolling = false;
			this._contentItemsSliderContainerPanelElement.style.left = this.destinationPosition + 'px';
			this.currentPosition = this.destinationPosition;
		}
	},
	ScrollLeftClicked: function() {
		if (!this.isScrolling) {
			if (this.currentSlideIndex != 0) {
				this.isScrolling = true;
				this.currentSlideIndex--;
				clearInterval(this.slideInterval);
				this.destinationPosition = this.currentPosition + this.numberOfPixelsToMoveSliderBy;
				this.slideInterval = setInterval(this.slideLeftScrollContentTick, 2);
			}
			this.SetArrowTransparency();
		}
	},
	ScrollRightClicked: function() {
		if (!this.isScrolling) {
			if (this.currentSlideIndex != this.get_NumberOfClicksToEndOfSlides()) {
				this.isScrolling = true;
				clearInterval(this.slideInterval);
				this.currentSlideIndex++;
				this.destinationPosition = this.currentPosition - this.numberOfPixelsToMoveSliderBy;
				this.slideInterval = setInterval(this.slideRightScrollContentTick, 2);
			}
			this.SetArrowTransparency();
		}
	},
    
    //Properties:
	get_ScrollLeftButtonPanel: function() {
		return this._ScrollLeftButtonPanel;
	},
	set_ScrollLeftButtonPanel: function(value) {
		if (this._ScrollLeftButtonPanel != value) {
			this._ScrollLeftButtonPanel = value;
			this.raisePropertyChanged('ScrollLeftButtonPanel');
		}
	},
	get_ScrollRightButtonPanel: function() {
		return this._ScrollRightButtonPanel;
	},
	set_ScrollRightButtonPanel: function(value) {
		if (this._ScrollRightButtonPanel != value) {
			this._ScrollRightButtonPanel = value;
			this.raisePropertyChanged('ScrollRightButtonPanel');
		}
	},
	get_LeftArrowImage: function() {
		return this._LeftArrowImage;
	},
	set_LeftArrowImage: function(value) {
		if (this._LeftArrowImage != value) {
			this._LeftArrowImage = value;
			this.raisePropertyChanged('LeftArrowImage');
		}
	},
	get_RightArrowImage: function() {
		return this._RightArrowImage;
	},
	set_RightArrowImage: function(value) {
		if (this._RightArrowImage != value) {
			this._RightArrowImage = value;
			this.raisePropertyChanged('RightArrowImage');
		}
	},
	get_SlidingDivID: function() {
		return this._SlidingDivID;
	},
	set_SlidingDivID: function(value) {
		if (this._SlidingDivID != value) {
			this._SlidingDivID = value;
			this.raisePropertyChanged('SlidingDivID');
		}
	},
	get_NumberOfClicksToEndOfSlides: function() {
		return this._NumberOfClicksToEndOfSlides;
	},
	set_NumberOfClicksToEndOfSlides: function(value) {
		if (this._NumberOfClicksToEndOfSlides != value) {
			this._NumberOfClicksToEndOfSlides = value;
			this.raisePropertyChanged('NumberOfClicksToEndOfSlides');
		}
	},
	get_LeftOrangeArrowImagePath: function() {
		return this._LeftOrangeArrowImagePath;
	},
	set_LeftOrangeArrowImagePath: function(value) {
		if (this._LeftOrangeArrowImagePath != value) {
			this._LeftOrangeArrowImagePath = value;
			this.raisePropertyChanged('LeftOrangeArrowImagePath');
		}
	},
	get_RightOrangeArrowImagePath: function() {
		return this._RightOrangeArrowImagePath;
	},
	set_RightOrangeArrowImagePath: function(value) {
		if (this._RightOrangeArrowImagePath != value) {
			this._RightOrangeArrowImagePath = value;
			this.raisePropertyChanged('RightOrangeArrowImagePath');
		}
	},
	get_LeftGreenArrowImagePath: function() {
		return this._LeftGreenArrowImagePath;
	},
	set_LeftGreenArrowImagePath: function(value) {
		if (this._LeftGreenArrowImagePath != value) {
			this._LeftGreenArrowImagePath = value;
			this.raisePropertyChanged('LeftGreenArrowImagePath');
		}
	},
	get_RightGreenArrowImagePath: function() {
		return this._RightGreenArrowImagePath;
	},
	set_RightGreenArrowImagePath: function(value) {
		if (this._RightGreenArrowImagePath != value) {
			this._RightGreenArrowImagePath = value;
			this.raisePropertyChanged('RightGreenArrowImagePath');
		}
	}
}
Windows.ContentSliderBehavior.registerClass('Windows.ContentSliderBehavior', Sys.UI.Behavior);

if (typeof(Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();