﻿
Type.registerNamespace('Infragistics.Web.UI');
Type.registerNamespace("Infragistics.Web.UI.ImageViewerObjects");

var $IGIV = Infragistics.Web.UI.ImageViewerObjects;

$IG.WebImageViewer = function(element)
{
    /// <summary>
    /// Displays Images in scrollable format. 
    /// </summary>
	$IG.WebImageViewer.initializeBase(this, [element]);
}

$IG.WebImageViewer.prototype =
{
    _thisType:'imageViewer',
    
    /******OVERRIDES**********/
	initialize:function()
	{
	    this.__initializing = true;
	    this._itemsToAdd = {};
	    this.__imgRes = this._get_clientOnlyValue("res");
	    this._element.tabIndex = this._get_clientOnlyValue("ti");
	    this._imageDisabledClass = this._get_clientOnlyValue("imgD");
	    $IG.WebImageViewer.callBaseMethod(this, 'initialize');        
        
        this._otherImageHoverClass = this._get_clientOnlyValue("imgOH");        
        
        /* When Scrolling through the images, white spaces are showing up between some images, due to Text Elements
         * being rendered in the markup via white space. So lets remove them so that we don't have that issue.*/
         var childNodes = this._imageArea.childNodes;
         for(var i = childNodes.length - 1; i >= 0; i--)
         {
            if(!childNodes[i].getAttribute)
                this._imageArea.removeChild(childNodes[i]);
         }
        
        this._scrollWheel = new $IGIV.ScrollWheel(this._imageArea, this.get_orientation(), this.get_enabled());        
        
        this._dragScroll = new $IGIV.DragScroll(this._imageArea, this.get_orientation(), this._get_clientOnlyValue("ohc"), this._get_clientOnlyValue("chc"), this.get_enableDragScrolling());
        this._dragScroll.setEnabled(this.get_enabled() && this.get_enableDragScrolling());
        this._dragScroll.onDragScrollStarting = Function.createDelegate(this, this.__dragScrollStarting); 
        this._dragScroll.onDragScrollComplete = Function.createDelegate(this, this.__dragScrollComplete);      
        
        this.__ensureDragWrapSet();  
        
        this.set_enableDragScrolling(this.get_enableDragScrolling());
        
        this._kbBehavior = new $IG.ImageViewerKbBehavior(this._element, this); 
            
        if(this._thisType == 'imageViewer')
			this._raiseClientEvent('Initialize');
		
		this.__initScrollPos();			
		       
		this.__initializing = false;
		
	},
	
	_ensureFlags:function()
    {
        $IG.WebImageViewer.callBaseMethod(this, "_ensureFlag");
        this._ensureFlag($IG.ClientUIFlags.Enabled, $IG.DefaultableBoolean.True);
        this._ensureFlag($IG.ClientUIFlags.Hoverable, $IG.DefaultableBoolean.True);
        this._ensureFlag($IG.ClientUIFlags.Draggable, $IG.DefaultableBoolean.False);
        this._ensureFlag($IG.ClientUIFlags.Droppable, $IG.DefaultableBoolean.False);
        this._ensureFlag($IG.ClientUIFlags.Selectable, $IG.DefaultableBoolean.True);
        
    },
	
	_setupMarkerElements:function()
	{
	    this._imageArea = this._elements["imageArea"];	    
	    
	    if($util.IsSafari && this.get_orientation() == $IG.Orientation.Vertical)
	        this._imageArea.style.height =  this._imageArea.offsetHeight + "px";
	    
	    this._scrollHelper = new $IG.ScrollHelper(this._imageArea);
	},
	
	_addHandlers:function() 
	{
	   $IG.WebImageViewer.callBaseMethod(this, '_addHandlers');
	   this._registerHandlers(["mousedown","click", "selectstart", "mouseover", "mouseout"]);
	},
	
	_addOtherHandlers:function() 
	{
	    $IG.WebImageViewer.callBaseMethod(this, '_addOtherHandlers');
	    this._registerOtherHandlers([{"mouseup":document,"scroll":this._imageArea}]);
	},
	
	_createItem:function(element, adr)
    {
        this._itemCollection._addObject($IG.ImageItem, element, adr);
    },
    
    _createObject:function(element, obj)
	{
		if(obj == 'header')
		{
			this._header = new $IG.CaptionArea(obj, element, this._objectsManager.get_objectProps(0), this, "headerContent");
			this._objectsManager.register_object(0, this._header);
		}
		else if(obj == 'footer')
		{
			this._footer = new $IG.CaptionArea(obj, element, this._objectsManager.get_objectProps(1), this, "footerContent");
			this._objectsManager.register_object(1, this._footer);
	    }
	},
	
	_setupCollections:function()
    {
        this._itemCollection = this._collectionsManager.register_collection(0,$IG.ImageItemCollection);
        this._collectionsManager.registerUIBehaviors(this._itemCollection);
    },
	
	_onSubmitOtherHandler:function(e)
	{
	   this.__storeScrollPos();
	   $IG.WebImageViewer.callBaseMethod(this, '_onSubmitOtherHandler', [e]);
	},
	 
	_responseComplete:function(callbackObject, responseObject)
    {
        var currentControl = this;        
        var props = eval(responseObject.context[0]);
        var html = responseObject.context[1];
        var div = document.createElement("DIV");
        div.innerHTML = html;
        var id = currentControl._id;
        
        if(!currentControl._element)
            currentControl = ig_controls[id];
        
        var childNodeCount = div.childNodes.length;
        for(var i = 0;i < childNodeCount; i++)
        {
            var child = div.childNodes[i];
            if(child.getAttribute && child.id == id)
            {
                currentControl._element.className = child.className;                    
                for(var i in child.style)
                {
                    try{currentControl._element.style[i] = child.style[i];}catch(exception){};
                }
                currentControl._element.innerHTML = child.innerHTML;
                break;   
            }
        }
        var name = currentControl.get_name();
        currentControl.dispose();
        var control = $create($IG.WebImageViewer, {"id":id,"name":name,"props":props}, null, null, $get(id));
        
        var type = callbackObject.serverContext.type;
        if(type == "add" || type == "addRange" || type == "insert")
        {
            var items = responseObject.context[2];
            if(items != null && items.length > 0)
            {
                for(var i = 0; i < items.length; i++)
                {
                    var item = control.get_items()._getObjectByAdr(items[i]);
                    if(type == "add" || type == "addRange")
                        control._raiseClientEvent('ImageItemAdded', 'ImageViewer', null, null, item);                    
                    else if(type == "insert")
                        control._raiseClientEvent('ImageItemInserted', 'ImageViewer', null, null, item);
                }
            }
        }
        else if(type == "remove")
        {
            var item = callbackObject.clientContext.item;
            control._raiseClientEvent('ImageItemRemoved', 'ImageViewer', null, null, item);                    
        }
        else if(type == "removeRange")
        {
            var items = callbackObject.clientContext.items;
            for(var i = 0; i < items.length; i++)
                control._raiseClientEvent('ImageItemRemoved', 'ImageViewer', null, null, items[i]);                    
        }
    },
	
	dispose:function()
	{
        $clearHandlers(this.get_element());
		$IG.WebImageViewer.callBaseMethod(this, 'dispose');
	},
	/******END OVERRIDES**********/
	
	/******PROPERTIES******/
	
	get_scrollAnimations:function()
	{
	    ///<summary>
	    /// Returns the object that contains the settings to change the type of Animation that will occur when the WebImageViewer scrolls Images into view. 
	    ///</summary>
	    if(this._scrollAnimations == null)
	    { 
	        this._scrollAnimations = new $IG.ScrollAnimations("ScrollAnimations", this._imageArea, this._objectsManager.get_objectProps(2), this);
		    this._objectsManager.register_object(2, this._scrollAnimations);
		}
	    return this._scrollAnimations;
	},
	
	get_wrapAround:function()
	{
	    ///<summary>
	    /// Returns/sets if images will loop around infinitely in the WebImageViewer.
	    ///</summary>
	    return this._get_value($IG.ImageViewerProps.WrapAround, true);
	},
	
	get_orientation:function()
	{
	   ///<summary>
	   /// Return/sets the orientation of the WebImageViewer. 
	   /// Note: setting the orientation of the WebImageViewer on the client, will result in an AJAX callback.
	   ///</summary>
	    return this._get_value($IG.ImageViewerProps.Orientation);
	},
	
	set_orientation:function(val)
	{
	    if(val != this.get_orientation())
	    {
	        var cbo = this._callbackManager.createCallbackObject();
            cbo.serverContext.type = "orientation";
            cbo.serverContext.value = val;
            this._callbackManager.execute(cbo);
	    }
	},
	
	get_hoverClass:function()
	{ 
	    ///<summary>
	    /// Returns the hover CSS class that is applied when an ImageItem is hovered.
	    ///</summary>
	    return this._get_clientOnlyValue("imgH");
	},
	get_selectedClass:function()
	{
	    ///<summary>
	    /// Returns the selected CSS class that is applied when an ImageItem is selected.
	    ///</summary>
	    return this._get_clientOnlyValue("imgS");
	},
	
	get_enableDragScrolling:function()
	{
	    ///<summary>
	    /// Returns/sets if the user can MouseDown over the image area of the WebImageViewer and scroll the Images by dragging.
	    ///</summary>
	    return this._get_value($IG.ImageViewerProps.DragScroll, true);
	},
	set_enableDragScrolling:function(val)
	{ 
	    this._set_value($IG.ImageViewerProps.DragScroll, val);
	    this._dragScroll.setEnabled(this.get_enabled() && val);	 	    
	},
		
	
	get_enabled:function()
	{
	    ///<summary>
	    /// Returns/sets whether thie ImageViewer is enabled.
	    ///</summary>
	    return this._getFlags().getEnabled();  
	},
	
	set_enabled:function(value)
	{	    
	    this._dragScroll.setEnabled(value && this.get_enableDragScrolling());
	    this._scrollWheel.setEnabled(value);
	    var items = this.get_items()._items;
	    var count = items.length;
	    for(var i = 0; i < count; i++)
	        items[i].set_enabled(value);
	    
	    if(value)
	        this.__ensureDisabledImages();
	    else
	    {
	        this._get_nextButton().setState($IG.ImageState.Disabled);
	        this._get_prevButton().setState($IG.ImageState.Disabled);
        }
        this._getFlags().setEnabled(value);
	},
	
	get_selectedItem:function(item)
	{
	    /// <summary>
        /// Returns/Sets the ImageItem that is to be Selected.
        /// When set to null, no image will be selected.
        /// </summary>
	    var items = this.__getUIBehaviors().getSelectedItems();
	    if(items != null && items.length > 0)
	        return items[0];    
	    return null;
	},
	
	set_selectedItem:function(item)
	{
	    this.__getUIBehaviors().select(item);
	},
	
	get_selectedIndex:function()
	{
	    /// <summary>
        /// Returns/Sets the index of the ImageItem that is to be selected.
        /// When set to -1, no image will be selected.
        /// </summary>
	    var items = this.__getUIBehaviors().getSelectedItems();
	    if(items != null && items.length > 0)
	        return items[0].get_index();
	    return -1; 
	},
	set_selectedIndex:function(index)
	{
	    var items = this.get_items()._items;
	    if(index >= items.length)
	        return;
	    else if(index <= -1 )
	        this.__getUIBehaviors().unSelectAll();
	    else
	        this.__getUIBehaviors().select(items[index]);
	},	
		
	get_items:function()
	{
	    /// <summary>
        /// The collection of ImageItems in the WebImageViewer.
        /// </summary>
	    return this._itemCollection;
	},
	
	
	get_header:function()
	{
	    /// <summary>
        /// A templatable object that can be used to display information at the top of the control.
        /// </summary>
	    return this._header;
	}, 
	
	get_footer:function()
	{
	    /// <summary>
        /// A templatable object that can be used to display information at the bottom of the control.
        /// </summary>
	    return this._footer;
	},
	
	/******END PROPERTIES******/
	
	/******PUBLIC METHODS******/
		
	navigateNext:function()
	{
	    /// <summary>
        /// Simulates what happens when a user presses the next button. 
        /// Note: if the ScrollAnimation is set to continuous, you must call the endNavigation method to stop navigation.
        /// </summary>
        this.__scrollPlay($IG.ScrollNavigationDirection.Next)
	},
	
	navigatePrev:function()
	{
	    /// <summary>
        /// Simulates what happens when a user presses the previous button. 
        /// Note: if the ScrollAnimation is set to continuous, you must call the endNavigation method to stop navigation.
        /// </summary>
        this.__scrollPlay($IG.ScrollNavigationDirection.Prev)
	},
	
	endNavigation:function()
	{
	    /// <summary>
        /// If the navigateNext or navigatePrev methods are called, and the ScrollAnimation is set to continuous, this method will end the current animation that is occurring.
        /// </summary>
        var type = this.get_scrollAnimations().get_type();
        if(type == $IG.ScrollAnimation.Continuous)
	        this.get_scrollAnimations().get_continuousAnimation().stop()
	},
			
	getVisibleAreaWidth:function()
	{
	    /// <summary>
	    /// Returns the width of the visible image area.
        /// </summary>
        /// <returns integer="true">An integer.</returns>
	    return this._imageArea.offsetWidth;
	},
	
	getVisibleAreaHeight:function()
	{
	    /// <summary>
	    /// Returns the height of the visible image area.
        /// </summary>
        /// <returns integer="true">An integer.</returns>
	    return this._imageArea.offsetHeight;
	},
    	
	/******END PUBLIC METHODS*****/
	
	/******EVENT HANDLERS*****/

	_onMouseoverHandler:function(elem, adr, evnt)
	{
	    if(!this.get_enabled())
	        return;
	    
	    if(adr == "next")
	        this.__setNextButtonState($IG.ImageState.Hover);	        
	    if(adr == "prev")
	        this.__setPrevButtonState($IG.ImageState.Hover);
	},

	_onMouseoutHandler:function(elem, adr, evnt)
	{
	    if(!this.get_enabled())
	        return;
	     
	     this.endNavigation();
	     
	    if(adr == "next")
	        this.__setNextButtonState($IG.ImageState.Normal);
	    if(adr == "prev")
	        this.__setPrevButtonState($IG.ImageState.Normal);
	},
	
    _onMousedownHandler:function(elem, adr, evnt)
    {
        if(!this.get_enabled() || evnt.button != 0)
	        return;
        if(adr == "next")        
        {
            this.__setNextButtonState($IG.ImageState.Pressed);
            this.navigateNext();
        }
        else if(adr == "prev") 
        {
            this.__setPrevButtonState($IG.ImageState.Pressed);
           this.navigatePrev();
        }
    }, 
     _onMouseupOtherHandler:function(elem, evnt)
    {     
        if(!this.get_enabled())
	        return;               
        
        this.endNavigation();
        
        var next = this._get_nextButton();
        var prev = this._get_prevButton();
        
        this.__setPrevButtonState($IG.ImageState.Normal);
        this.__setNextButtonState($IG.ImageState.Normal);
        
        
        if(elem == prev.get_element())
            this.__setPrevButtonState($IG.ImageState.Hover);
        else if(elem == next.get_element())
            this.__setNextButtonState($IG.ImageState.Hover);
    }, 
    
    _onClickHandler:function(elem, adr, evnt)
    {
        if(!this.get_enabled())
	    {
	        $util.cancelEvent(evnt);
	        return;
	    }
        if(elem.tagName == "BUTTON")
            $util.cancelEvent(evnt);
            
        if(adr == "next")   
            this._raiseClientEvent('NextButtonClicked', 'ImageViewerButton', evnt, null, this._get_nextButton().get_element());   
        else if(adr == "prev")
            this._raiseClientEvent('PrevButtonClicked', 'ImageViewerButton', evnt, null, this._get_prevButton().get_element());   
            
        var item = this._get_item(adr)
        if(item)
        { 
            if(item.get_enabled())
                this._raiseClientEvent('ImageClick', 'ImageViewer', evnt, null, item);            
            else
                $util.cancelEvent(evnt);
        }
    },
    
    _onSelectstartHandler:function(elem, adr, evnt)
    {
        $util.cancelEvent(evnt);
    },
    
    _onScrollOtherHandler:function(elem, evnt)
    {   
        this.__ensureDisabledImages();        
    },
    /****** END EVENT HANDLERS*****/
    
    /******* UI BEHAVIORS *********/
    _hoverItem:function(item, val)
    {
       this.__hoverItem(item,val, true);
    },
    
    _selectItem:function(item, val)
    {
       this.__selectItem(item, val, true);
    },
    /******* END UI BEHAVIORS *********/
    
    /******* PRIVATE METHDOS *********/
    
    _get_nextButton:function()
    {
        if(this._nextButton == null)
        {
            this._nextButton = new $IG.ImageObject("next", this._elements["next"], this._objectsManager.get_objectProps(3), this);
			this._objectsManager.register_object(3, this._nextButton);
        }
        return this._nextButton;
    },
    
    _get_prevButton:function()
    {
        if(this._prevButton == null)
        {
            this._prevButton = new $IG.ImageObject("prev", this._elements["prev"], this._objectsManager.get_objectProps(4), this);
			this._objectsManager.register_object(4, this._prevButton);
        }
        return this._prevButton;
    },
    
    __scrollPlay:function(direction, type)
    {
        var scrollAnimations = this.get_scrollAnimations();
        if(!type)
            type = scrollAnimations.get_type();
        if(type == $IG.ScrollAnimation.Continuous)
        {
            var continuous = scrollAnimations.get_continuousAnimation();
            continuous.play(direction);
        }
        else if(type == $IG.ScrollAnimation.NextItem)
        {
            var nextItem = scrollAnimations.get_nextItemAnimation();
            nextItem.play(direction);
        }
        else if(type == $IG.ScrollAnimation.Page)
        {
            var page = scrollAnimations.get_pageAnimation();
            page.play(direction);
        }
    },
    __ensureDisabledImages:function(overrideWrap)
    {        
        if(overrideWrap)     
            return;
        
        var nextButton = this._get_nextButton();
        var prevButton = this._get_prevButton();
        
        var wrap = this.__getWrapResolved();
        if(wrap)
        {
            if(nextButton.getState() == $IG.ImageState.Disabled)
                nextButton.setState($IG.ImageState.Normal);
            if(prevButton.getState() == $IG.ImageState.Disabled)
                prevButton.setState($IG.ImageState.Normal);
            return;
        }
        
        this._scrollHelper.update(null, this.get_orientation());
        
        if(nextButton.get_element() != null)
        {
            if(this._scrollHelper.getScrollPos() + this._scrollHelper.getSize(this._imageArea) >= this._scrollHelper.getScrollSize())
                nextButton.setState($IG.ImageState.Disabled);
            else
            {
                
                if(!this.__isScrolling || nextButton.getState() == $IG.ImageState.Disabled)
                    nextButton.setState($IG.ImageState.Normal);
            }
        }
        if(prevButton.get_element() != null)
        {   
            if(this._scrollHelper.getScrollPos() == 0)
                prevButton.setState($IG.ImageState.Disabled);
            else
            {
                if(!this.__isScrolling || prevButton.getState() == $IG.ImageState.Disabled)
                    prevButton.setState($IG.ImageState.Normal);
            }
        }
    },
    
    __setPrevButtonState:function(state)
    {
        var prev = this._get_prevButton();
        if(prev.getState() != $IG.ImageState.Disabled)
            prev.setState(state);
    },
    
    __setNextButtonState:function(state)
    {
        var next = this._get_nextButton();
        if(next.getState() != $IG.ImageState.Disabled)
            next.setState(state);
    },
    
    __getWrapResolved:function()
    {
        var wrap = this.get_wrapAround();
        if(wrap)
        {
            this._scrollHelper.update(null, this.get_orientation());
            var viewSize = this._scrollHelper.getSize(this._imageArea);
            var items = this.get_items();
            var length = items.get_length();
            wrap = false;
            for(var i = 0; i < length; i++)
            {
                var item = items.getItem(i);
                var elem = item._element;
                if(!item.__imageReady)
                {
                    this.__wrapSet = false;
                    return true;
                }
                var pos = this._scrollHelper.getPos(elem);
                if(pos > viewSize)
                    return true;
            } 
        }                
        return wrap; 
    },
    
    __getUIBehaviors:function()
    {
        return this._itemCollection._getUIBehaviorsObj();
    }, 
    
    __isScrolling:function()
    {
        var scrollAnimations = this.get_scrollAnimations();
        var type = scrollAnimations.get_type();
        if(type == $IG.ScrollAnimation.Continuous)
        {
            var continuous = scrollAnimations.get_continuousAnimation();
            return continuous.isPlaying();
        }
        else if(type == $IG.ScrollAnimation.NextItem)
        {
            var nextItem = scrollAnimations.get_nextItemAnimation();
            return nextItem.isPlaying();
        }
        else if(type == $IG.ScrollAnimation.Page)
        {
            var page = scrollAnimations.get_pageAnimation();
            return page.isPlaying();
        }
        return false; 
    }, 
    __dragScrollStarting:function()
    {
        var elem = this._dragScroll._currentEvnt.target;
        var obj = $util.resolveMarkedElement(elem);
        if(obj != null)
        {
            var item = this._get_item(obj[1])
            if(item)
                this.__hoverItem(item,false, false);
        }      
    },
    
    __dragScrollComplete:function()
    {
        var elem = this._dragScroll._currentEvnt.target;
        var obj = $util.resolveMarkedElement(elem);
        if(obj != null)
        {
            var item = this._get_item(obj[1])
            if(item && item.get_enabled())
                this.__hoverItem(item,true, false);
        }   
    },
    __selectItem:function(item, val, fireEvent)
    {
        if(!this.__initializing)
        {
            $util.removeCompoundClass(item._element, this.get_selectedClass());
            $util.removeCompoundClass(item._element, item.get_selectedCssClass());
        }
        if(val)
        {
            $util.addCompoundClass(item._element, this.get_selectedClass());
            $util.addCompoundClass(item._element, item.get_selectedCssClass());
            if(fireEvent && !this.__initializing)
                this._raiseClientEvent('ImageSelected', 'ImageViewer', null, null, item);
        }
        
    },
    
    __hoverItem:function(item, val, fireEvent)
    {
        if(this._dragScroll.isDragging())
            return;
            
        if(val)
        {  
            var hoverImage = item.get_hoverImageUrl();
            if(hoverImage && hoverImage.length > 0)
                item._element.src = hoverImage;       
           var itemAdr = item._get_address();                
           for(var adr in this._itemCollection._items)
           {
                var otherItem = this._itemCollection._items[adr];
                if(adr != itemAdr)
                    $util.addCompoundClass(otherItem._element, this._otherImageHoverClass);
            }
            $util.removeCompoundClass(item._element, this._otherImageHoverClass);
            $util.addCompoundClass(item._element, this.get_hoverClass());
            
            $util.addCompoundClass(item._element, item.get_hoverCssClass());            
           
            if(fireEvent)
			    this._raiseClientEvent('ImageMouseOver', 'ImageViewer', null, null, item);
        }
        else
        {
            for(var adr in this._itemCollection._items)
                $util.removeCompoundClass(this._itemCollection._items[adr]._element, this._otherImageHoverClass);
            
            $util.removeCompoundClass(item._element, this.get_hoverClass());
            
            $util.removeCompoundClass(item._element, item.get_hoverCssClass());            
            
            item.get_element().src = item.get_imageUrl();
            
            if(fireEvent)
                this._raiseClientEvent('ImageMouseOut', 'ImageViewer', null, null, item);
        }
    },
    
    __initScrollPos:function()
    {
        var firstItem = this._get_value($IG.ImageViewerProps.FirstItem)
		var scrollPos = this._get_value($IG.ImageViewerProps.ScrollPosition);
		
		if(firstItem != 0)
		{
		    var count = this._itemCollection.get_length();
		    if(count > 0)
		    {
		        var item = this._get_item(firstItem);
		        if(item != null)
		        {
		            if(firstItem < count/2)
		                this._scrollHelper.scrollItemIntoView($IG.ScrollNavigationDirection.Next, this.get_orientation(), item._element.parentNode, scrollPos, this.get_wrapAround());		            
		            else
		                this._scrollHelper.scrollItemIntoView($IG.ScrollNavigationDirection.Prev, this.get_orientation(), item._element.parentNode, scrollPos,this.get_wrapAround());		            
		        }
		    }
		}
		else if(scrollPos != 0)
		{
		    if(this.get_orientation() == $IG.Orientation.Horizontal)
		        this._imageArea.scrollLeft = scrollPos;
		    else
		        this._imageArea.scrollTop = scrollPos;
		}
    }, 
    
    __getFirstItemAdr:function()
    {
        var firstItem;
	    var children = this._imageArea.childNodes;
	    var count = children.length;
	    for(var i = 0; i < count; i++)
	    {
	        var elem = children[i];
	        if(elem.getAttribute)
	        {
	            while(elem != null && elem.getAttribute && elem.childNodes.length > 0)
	            {
	                if(elem.getAttribute("adr"))
	                    break;    	    
	                elem = this._scrollHelper.resolveItem(elem);    
	            }
	            firstItem =  elem.getAttribute("adr");
	            break;
	        }
	    }
	    return firstItem; 
    },
    
    __storeScrollPos:function()
    {
        var firstItem = this.__getFirstItemAdr();
	    this._clientStateManager.set_value($IG.ImageViewerProps.FirstItem, firstItem);
	    if(this.get_orientation() == $IG.Orientation.Horizontal)
	        this._clientStateManager.set_value($IG.ImageViewerProps.ScrollPosition, this._imageArea.scrollLeft);
	    else
	        this._clientStateManager.set_value($IG.ImageViewerProps.ScrollPosition, this._imageArea.scrollTop);
    },
    
    __resolveUrl:function(url)
    {
        if(url.replace)
            return url.replace("~", this.__imgRes).replace("//", "/").replace("http:/", "http://");
        else
           return "";
    }, 
    
    __ensureDragWrapSet:function()
    {
        if(this._dragScroll && !this.__wrapSet)
        {
            this.__wrapSet = true;
            var wrap = this.__getWrapResolved();
            this._dragScroll.setWrap(wrap);
            this._scrollWheel.setWrap(wrap);  
            this.__ensureDisabledImages(wrap);      
        }
    },
    
    __notifyItemLoaded:function()
    {
        this.__ensureDragWrapSet();
        if(this.__itemsLoaded)
            return;
        if(!this._scrollHelper)
            return;
        var wrap = (this.get_wrapAround() && this.__getWrapResolved());
        if(wrap)
            this.__itemsLoaded = true;
        
        if(!this.__enabledEnsured)    
        {
            this.__initializing = true;
            this.set_enabled(this.get_enabled());   
            this.__initializing = false;
            this.__enabledEnsured = true;
        }
      
        this.__ensureDisabledImages();
    }    
    /******* END PRIVATE METHDOS *********/
    
}

$IG.WebImageViewer.registerClass('Infragistics.Web.UI.WebImageViewer', $IG.NavControl);


$IG.ImageItem = function(adr, element, props, control, csm)
{    
    /// <summary>
    /// Represents an item in the WebImageViewer control. 
    /// </summary>
    
    this._control = control;
         
	$IG.ImageItem.initializeBase(this, [adr, element, props, control,csm]);
	
	var imgUrl = this.get_imageUrl();
    if(this.get_enabled())
    {
        if(imgUrl != null && imgUrl.length > 0)
        {
            if($util.IsIE)
                $addHandler(element, "readystatechange", Function.createDelegate(this, this._readyStateChanged) );  
            else
                $addHandler(element, "load", Function.createDelegate(this, this._readyStateChanged) );   
        }
    }
    else
    {
        $util.addCompoundClass(this._element, this._owner._imageDisabledClass);
        $util.addCompoundClass(this._element, this.get_disabledCssClass());
        element.style.visibility = "";
    }
	    
    element.src = imgUrl;
	
    this._calcActualSizeOfImage();
    
    var tooltip = this.get_tooltip();
    if(tooltip != null && tooltip.length > 0)
        this._element.title = tooltip;
}

$IG.ImageItem.prototype =
{
    isVisible:function()
    {
        ///<summary>
        /// Determines if the item is in the visible image area.
        ///</summary>
        ///<returns>True if the image is in the visible area, otherwise false. </returns>
        return this.__isVisible(this._element);
    },
    
    _ensureFlags:function()
    {
        $IG.ImageItem.callBaseMethod(this, "_ensureFlag");
        this._ensureFlag($IG.ClientUIFlags.Selectable, $IG.DefaultableBoolean.True);
        this._ensureFlag($IG.ClientUIFlags.Draggable, $IG.DefaultableBoolean.False);
        this._ensureFlag($IG.ClientUIFlags.Droppable, $IG.DefaultableBoolean.False);
        this._ensureFlag($IG.ClientUIFlags.Visible, $IG.DefaultableBoolean.True);
    },
    __isVisible:function(element)
    {
        if(!element)
            element = this._element;
       
       var contentArea  = null;
       try
       {
            contentArea = element.offsetParent;
       }
       catch(ex){};
       if(contentArea == null) /* SJZ - In firefox, if the element's display is none, then it does not have an OffsetParent*/
            return false;
       while(contentArea != null && contentArea.offsetWidth <= element.offsetWidth)
            contentArea = contentArea.offsetParent;
       if(this._control.get_orientation() == $IG.Orientation.Horizontal)
       {     
           var visibleAreaWidth = contentArea.offsetWidth;
           var startVisibleArea = contentArea.scrollLeft;
           var endVisibleArea = visibleAreaWidth + startVisibleArea;
           
           if(element.offsetLeft > startVisibleArea && element.offsetLeft < endVisibleArea)
                return true;
            
           var endImage = element.offsetLeft + element.offsetWidth;
           if(endImage > startVisibleArea && endImage < endVisibleArea)
                return true;
        }
        else
        {
            var visibleAreaHeight = contentArea.offsetHeight;
            var startVisibleArea = contentArea.scrollTop;
            var endVisibleArea = visibleAreaHeight - startVisibleArea; 
            
            if(element.offsetTop > startVisibleArea && element.offsetTop < endVisibleArea)
                return true;
            
            var endImage = element.offsetTop + element.offsetHeight;
            if(endImage > startVisibleArea && endImage < endVisibleArea)
                 return true; 
        }
       
       return false;
    },
    
    _calcActualSizeOfImage:function()
    {
        /*Determine Actual Height and Width of Image*/
	    var img = document.createElement("IMG");
        img.src = this.get_imageUrl();
        img.style.visibility = "hidden";
        document.body.appendChild(img);
        this._actualHeight = img.offsetHeight;		
        this._actualWidth = img.offsetWidth;		
        document.body.removeChild(img);
    },
    
    _readyStateChanged:function(evnt)
    {
        if((evnt.target.readyState == "complete" && !this._imageLoaded) ||(!$util.IsIE && !this._imageLoaded))
        {
            this.__imageReady = true;
            this._fadeInImage(evnt.target);
            this._calcActualSizeOfImage();
            this._control.__notifyItemLoaded();
        }
    }, 
    
    _fadeInImage:function(element)
    {
        /* SJZ - Need to delay the fade in, b/c the imageviewer control may still need to scroll intoview at this point
         * and if this is the case, we need to give it a little time to do so, and we can do that via a short time out*/         
        this.__fadeInElem = element;
        this.__timerId = setInterval(Function.createDelegate(this, this.__beginFade), 1);
    },
    
    __beginFade:function()
    {
                     
        if(this.__isVisible(this._element))
        {
            this.__opacityAnimation = new $IG.OpacityAnimation(this._element);
            this.__opacityAnimation.onNext = Function.createDelegate(this, this.__opacityAnimationBegin)
            this.__opacityAnimation.onEnd = Function.createDelegate(this, this.__opacityAnimationEnd)
            this.__opacityAnimation.play(0, 100, true);    
        }
        else
            this._element.style.visibility = "";   
        this._imageLoaded = true;
        this._element == null;
        clearInterval(this.__timerId);
        this.__timerId = null;
    },
    
    __opacityAnimationBegin:function()
    {
        this._element.style.visibility = "";   
    },
     __opacityAnimationEnd:function()
    {
        this.__opacityAnimation = null;
    },
    
	get_imageUrl:function() 
	{
	    ///<summary>
        ///Returns/sets the image url of the ImageItem.
        ///</summary>
	    return this._control.__resolveUrl(this._get_value($IG.ImageItemProps.ImagePath));
	},
	
	set_imageUrl:function(val)
	{	   
	    this._set_value($IG.ImageItemProps.ImagePath, val);
	    this._element.src = this.get_imageUrl();
	},
	
	get_altText:function() 
	{ 
	    ///<summary>
        ///Returns/sets the alt text of the ImageItem.
        ///</summary>
	    return this._get_value($IG.ImageItemProps.AltText);
	},
	set_altText:function(val)
	{
	    this._element.alt = val;
	    this._set_value($IG.ImageItemProps.AltText, val);
	},
	
	get_hoverImageUrl:function() 
	{ 
	    ///<summary>
        ///Returns/sets the image url that will be uesed when an image is hovered.
        ///</summary>
	    return this._control.__resolveUrl(this._get_value($IG.ImageItemProps.HoverImageUrl ));
	},
	set_hoverImageUrl:function(val){this._set_value($IG.ImageItemProps.HoverImageUrl , val);},
	
	get_cssClass:function() 
	{ 
	    ///<summary>
        ///Returns/sets the CSS class that will be applied to the ImageItem.
        ///</summary>
	    return this._get_value($IG.ImageItemProps.CssClass);
	},
	set_cssClass:function(val)
	{
	    $util.removeCompoundClass(this._element, this.get_cssClass());
	    $util.addCompoundClass(this._element, val);
	    this._set_value($IG.ImageItemProps.CssClass, val);
	},
	
	get_selectedCssClass:function() 
	{ 
	    ///<summary>
        ///Returns/sets the CSS class that will be applied to the ImageItem when it is selected.
        ///</summary>
	    return this._get_value($IG.ImageItemProps.SelectedCssClass);
	},
	set_selectedCssClass:function(val)
	{
	    if(this.isSelected())
	    {
	        $util.removeCompoundClass(this._element, this.get_selectedCssClass());
	        $util.addCompoundClass(this._element, val);
	    }
	    this._set_value($IG.ImageItemProps.SelectedCssClass, val);
	},
	
	get_hoverCssClass:function()
	{ 
	    ///<summary>
        ///Returns/sets the CSS class that will be applied to the ImageItem when it is hovered.
        ///</summary>
	    return this._get_value($IG.ImageItemProps.HoverCssClass);
	},
	set_hoverCssClass:function(val)
	{
	    if(this._getFlags().getHovered())  
	    {
	        $util.removeCompoundClass(this._element, this.get_hoverCssClass());
	        $util.addCompoundClass(this._element, val);
	    }
	    this._set_value($IG.ImageItemProps.HoverCssClass, val);
	},
	
	get_disabledCssClass:function() 
	{ 
	    ///<summary>
        ///Returns/sets the CSS class that will be applied to the ImageItem when it is disabled.
        ///</summary>
	    return this._get_value($IG.ImageItemProps.DisabledCssClass);
	},
	set_disabledCssClass:function(val)
	{
	    if(!this.get_enabled())  
	    {
	        $util.removeCompoundClass(this._element, this.get_disabledCssClass());
	        $util.addCompoundClass(this._element, val);
	    }
	    this._set_value($IG.ImageItemProps.DisabledCssClass, val);
	},
	
	
	get_actualHeight:function()
	{
	    ///<summary>
        ///Returns the height of the Image.
        ///Note: this is not referring to the height being displayed in the browser, but the true height of the image.
        ///</summary>
	    return this._actualHeight;
	},
	get_actualWidth:function()
	{
	    ///<summary>
        ///Returns the width of the Image.
        ///Note: this is not referring to the width being displayed in the browser, but the true width of the image.
        ///</summary>
	    return this._actualWidth;
	},
	
	set_navigateUrl:function(value)
	{
	    this.__resolveAnchor().href = value;
	    return $IG.ImageItem.callBaseMethod(this, "set_navigateUrl", [value]);
	},
    set_target:function(value)
    {
        this.__resolveAnchor().target = value;
        return $IG.ImageItem.callBaseMethod(this, "set_target", [value]);
    },
    set_tooltip:function(value)
    {
        this._element.title = value;
        return $IG.ImageItem.callBaseMethod(this, "set_tooltip", [value]);
    },
	
	isSelected:function()
	{
	    ///<summary>
        /// Determines if the item is selected.
        ///</summary>
        ///<returns>True if the image is in selected. </returns>
	    return this._getFlags().getSelected();  
	},
	
	get_enabled:function()
	{	
	    ///<summary>
        ///Returns/sets whether the ImageItem is enabled.
        ///</summary>
	    return this._getFlags().getEnabled(this._owner);  
	},
	
	set_enabled:function(val)
	{
	    if(this._control.__initializing && val)
	        return; 
	    if(val)
            this._getFlags().setEnabled($IG.DefaultableBoolean.NotSet);  
        else
            this._getFlags().setEnabled($IG.DefaultableBoolean.False);  
        if(val)	        
        {
            $util.removeCompoundClass(this._element, this._owner._imageDisabledClass);
            $util.removeCompoundClass(this._element, this.get_disabledCssClass());
        }
        else
        {
            $util.addCompoundClass(this._element, this._owner._imageDisabledClass);
            $util.addCompoundClass(this._element, this.get_disabledCssClass());
        }
	},
	
	get_visible:function(val)
	{
	    ///<summary>
        ///Returns/sets whether the ImageItem is visible.
        ///</summary>
	    return this._getFlags().getVisible(this._owner);  
	}, 
	
	set_visible:function(val)
	{
	    if(val)
	        this._element.style.display = "";
	     else
	        this._element.style.display = "none";
	    return this._getFlags().setVisible(val);  
	},
	
	get_index:function()
	{
	    ///<summary>
        ///Returns the index of the item in the WebImageViewer's ImageItemCollection.
        ///</summary>
	    return parseInt(this._get_address());
	},
	
	select:function()
	{
	    ///<summary>
        ///Sets the ImageItem as selected.
        ///</summary>
	    this._owner.set_selectedItem(this);
	},
	
	__resolveAnchor:function()
	{
	    return this._element.parentNode; 
	},
	
	
	get_imageViewer:function() 
	{ 
	    ///<summary>
        ///Returns a reference to the WebImageViewer that the ImageItem belongs to.
        ///</summary>
	    return this._owner; 
	},
	
	dispose:function()
	{
	    if(this.__opacityAnimation)
	        this.__opacityAnimation.stop();
		$IG.ImageItem.callBaseMethod(this, 'dispose');
	}
}

$IG.ImageItem.registerClass('Infragistics.Web.UI.ImageItem', $IG.ListItem);
/******************************************END IMAGE ITEM************************************/

/******************************************ImageItemCollection*******************************/
$IG.ImageItemCollection = function(control, clientStateManager, index, manager)
{
    /// <summary>
    /// A collection of ImageItems.
    /// </summary>
    $IG.ImageItemCollection.initializeBase(this, [control, clientStateManager, index, manager]);
}

$IG.ImageItemCollection.prototype = 
{
    add:function(item)
    {        
        ///<summary>
        ///Adds the specified ImageItem via an AJAX callback.
        ///</summary>
        ///<param name="item">The ImageItem that should be added</param>
        if(item == null)
            return;
        var cbo = this._control._callbackManager.createCallbackObject();
        cbo.serverContext.type = "add";
        cbo.serverContext.props = Sys.Serialization.JavaScriptSerializer.serialize(item._csm.get_transactionList())
        this._control._callbackManager.execute(cbo, true);
    },
    
    addRange:function(items)
    {
        ///<summary>
        ///Adds all the specified ImageItems via an AJAX callback.
        ///</summary>
        ///<param name="items">An array of ImageItems</param>
        if(items == null || items.length == 0)
            return;
        if(items.length == 1)
        {
            this.add(items[0]);
            return;
        }
        var cbo = this._control._callbackManager.createCallbackObject();
        cbo.serverContext.type = "addRange";
        var props = [];
        for(var i = 0; i < items.length; i++)
            props.push(items[i]._csm.get_transactionList());
        cbo.serverContext.props = Sys.Serialization.JavaScriptSerializer.serialize(props)
        this._control._callbackManager.execute(cbo, true);
    },
    
    remove:function(imgItem)
    {
        ///<summary>
        ///Removes the specified ImageItem from the collection.
        ///</summary>
        ///<param name="imgItem">The ImageItem that should be removed.</param>
        if(imgItem != null)
	    {
	        var cbo = this._control._callbackManager.createCallbackObject();
            cbo.serverContext.type = "remove";
            cbo.clientContext.item = imgItem;
            cbo.serverContext.index = imgItem.get_index();
            this._control._callbackManager.execute(cbo, true);
        }
    },
        
    removeRange:function(items)
    {
        ///<summary>
        ///Removes all specified ImageItems from the collection.
        ///</summary>
        ///<param name="imgItem">An array of ImageItems that should be removed.</param>
        if(items == null || items.length == 0)
            return;
        
        if(items.length == 1)
        {
            this.remove(items[0]);
            return;
        }
        
        var cbo = this._control._callbackManager.createCallbackObject();
        cbo.serverContext.type = "removeRange";
        cbo.clientContext.items = items;
        var props = [];
        for(var i = 0; i < items.length; i++)
            props.push(items[i].get_index());
        cbo.serverContext.props =  Sys.Serialization.JavaScriptSerializer.serialize(props);
        this._control._callbackManager.execute(cbo, true);
    },
    
    insert:function(index, item)
    {
        ///<summary>
        ///Creates an ImageItem with the specified parameters an inserts the Item at the specified index. via an AJAX callback.
        ///</summary>
        ///<param name="index">The index in which to insert the ImageItem.</param>
        ///<param name="item">The ImageItem that should be added</param>
        if(item == null)
            return;
        var cbo = this._control._callbackManager.createCallbackObject();
        if(index >= 0 && index < this.get_length())
            cbo.serverContext.type = "insert";
        else
            cbo.serverContext.type = "add";        
        cbo.serverContext.index = index;
        cbo.serverContext.props = Sys.Serialization.JavaScriptSerializer.serialize(item._csm.get_transactionList())
        this._control._callbackManager.execute(cbo, true);
    }, 
    
    createItem:function()
    {
        ///<summary>
        ///Creates an empty item that can be used in the add, addRange, and insert methods.
        ///</summary>
        var props = new Array();
        var clientProps = new Array();
        var length = $IG.ImageItemProps.Count;
        for(var i = 0; i < length; i++)
            clientProps.push(null);
        props.push(clientProps);
        var elem = document.createElement("IMG");
        var csm = new $IG.ObjectClientStateManager(props);
        var item = new $IG.ImageItem("-1", elem, props, this._control, csm);
        return item;
    },
    
    getItem:function(index)
    {
        ///<summary>
        ///Returns the ImageItem at the specified index. 
        ///</summary>
        if(index >= 0 && index < this.get_length())
            return this._items[index];
        return null;
    }
}
$IG.ImageItemCollection.registerClass('Infragistics.Web.UI.ImageItemCollection', $IG.ObjectCollection);
/******************************************End ImageItemCollection****************************/

/******************************************Caption Area**************************************/
$IG.CaptionArea = function(obj, element, props, control, mkrAttribute)
{
    /// <summary>
    /// A templatable object that can be used to just display text. 
    /// </summary>
    
	var csm = obj ? new $IG.ObjectClientStateManager(props[0]) : null;	
	$IG.CaptionArea.initializeBase(this, [obj, element, props, control, csm]);
	this._mkrAttribute = mkrAttribute;
}

$IG.CaptionArea.prototype =
{
    get_text:function()
    { 
        ///<summary>
        ///Returns/sets the text of the object.
        ///</summary>
        return this._get_value($IG.CaptionAreaProps.Text);
    },
	set_text:function(val)
	{
	    if(this._contentElement == null)
	        this._contentElement = this._owner._elements[this._mkrAttribute];
	    this._contentElement.innerHTML = val;
	    this._set_value($IG.CaptionAreaProps.Text, val);
	}
}

$IG.CaptionArea.registerClass('Infragistics.Web.UI.CaptionArea', $IG.UIObject);
/******************************************END Caption Area**************************************/

/******************************************Drag Scroll Behavior**************************************/
$IGIV.DragScroll = function(elem, orientation, openHandCursor, closeHandCursor, enabled)
{
    this._dragOperation = {};
    this._element = elem;     
    this._openHandCursor = openHandCursor;
    this._closeHandCursor = closeHandCursor;
    this.setEnabled(enabled);
    this._scrollHelper = new $IG.ScrollHelper(elem);    
    this._orientation = orientation; 
    $addHandler(document, "mousemove", Function.createDelegate(this, this._onMousemoveHandler) );   
    $addHandler(document, "mouseup", Function.createDelegate(this, this._onMouseupHandler) );  
    $addHandler(elem, "mousedown", Function.createDelegate(this, this._onMousedownHandler) );  
    $addHandler(elem, "click", Function.createDelegate(this, this._onClickHandler) );
};

$IGIV.DragScroll.prototype = 
{
    setEnabled:function(enabled)
    {
        this._enabled = enabled; 
        if(!enabled)
            this._resetCursors();
        else
            this._setCursor(this._openHandCursor);
    },
    
    setWrap:function(wrap)
    {
        this._scrollHelper.update(null, null, wrap);
    },
    
    onDragScrollStarting:function()
    {
    },
    
    onDragScrollComplete:function()
    {        
    },
    
    
    isDragging:function()
    {
        return this._isDragging; 
    },
    
    _resetCursors:function()
    {
        this._element.style.cursor = "";
        var children = this._element.childNodes;
        for(var i = 0; i < children.length; i++)
        {
            if(children[i].getAttribute)
                children[i].style.cursor = "";
        }
    },
    
    _setCursor:function(cursor)
    {
        this._element.style.cursor = "url(" + cursor + "), pointer";
        var children = this._element.childNodes;
        for(var i = 0; i < children.length; i++)
        {
            if(children[i].getAttribute)
                children[i].style.cursor = "url(" + cursor + "), pointer";
        }
    },
    
    _onClickHandler:function(evnt)
    {
        if(!this._enabled)
            return; 
            
        this._currentEvnt = evnt;
        if(this._isDragging)
            $util.cancelEvent(evnt);
        this.__dragCompleted(evnt);
    },
    
    __dragCompleted:function()
    {
        if(this._isDragging)
        {
            this._isDragging = false;     
            this.onDragScrollComplete();  
        }
        this._dragOperation.mouseDown = false; 
        this._setCursor(this._openHandCursor);        
    },

    _onMouseupHandler:function(evnt)
    {   
        if(!this._enabled)
            return; 
        this._currentEvnt = evnt;
        if(this._startElement != evnt.target)
            this.__dragCompleted();
    },    
    _onMousedownHandler:function(evnt)
    {
        if(!this._enabled)
            return; 
            
        this._currentEvnt = evnt;
        this._startElement = evnt.target; 
        this._dragOperation.mouseDown = true; 
        this._dragOperation.x = evnt.screenX;
        this._dragOperation.y = evnt.screenY;
        this._scrollHelper.update(null, this._orientation)
        this._dragOperation.scrollPos = this._scrollHelper.getScrollPos(); 	
        this._setCursor(this._closeHandCursor);
    },
    
    _onMousemoveHandler:function(evnt)
    {
        if(!this._enabled)
            return; 
        this._currentEvnt = evnt;
        if(this._dragOperation.mouseDown)
        {   
            if(this._element.childNodes.length == 0)
                return; 
                
            this.onDragScrollStarting();
            this._isDragging = true;
            $util.cancelEvent(evnt);
            
            var newScrollPos = this._dragOperation.scrollPos + this._dragOperation.x - evnt.screenX; 
            if(this._orientation == $IG.Orientation.Vertical)
                newScrollPos = this._dragOperation.scrollPos + this._dragOperation.y - evnt.screenY; 
            if(newScrollPos > this._scrollHelper.getScrollPos()) /*NEXT <----*/
            {
                this._scrollHelper.update($IG.ScrollNavigationDirection.Next, this._orientation)
                this._scrollHelper.ensureCurrentItem();                	
                if(this._scrollHelper._currentItem == null)
                    return;
                if(this._scrollHelper.scrollTo(newScrollPos, newScrollPos - this._scrollHelper.getCurrentItemSize()))
                {
                    this._dragOperation.scrollPos = (this._dragOperation.x - evnt.screenX) * (-1);
                    if(this._orientation == $IG.Orientation.Vertical)
                        this._dragOperation.scrollPos = (this._dragOperation.y - evnt.screenY) * (-1);
                }
            }
            else /*PREVIOUS ---->*/
            {   
                this._scrollHelper.update($IG.ScrollNavigationDirection.Prev, this._orientation)
                
                this._scrollHelper.ensureCurrentItem();                	
                if(this._scrollHelper._nextCurrentItem == null)
                    return;
                var item = this._scrollHelper.resolveItem(this._scrollHelper._nextCurrentItem);
                if(this._orientation == $IG.Orientation.Vertical)
                {
                    var oldHeight = item.offsetHeight
                    if(this._scrollHelper.scrollTo(newScrollPos, oldHeight))
                    {
                        this._dragOperation.scrollPos = oldHeight;
                        this._dragOperation.y = evnt.screenY;
                    }
                }
                else
                {
                    var oldWidth = item.offsetWidth;
                    if(this._scrollHelper.scrollTo(newScrollPos, oldWidth))
                    {
                        this._dragOperation.scrollPos = oldWidth;
                        this._dragOperation.x = evnt.screenX;
                    }
                }
            }
	    }
    }
}
$IGIV.DragScroll.registerClass('Infragistics.Web.UI.ImageViewerObjects.DragScroll');
/******************************************END Drag Sroll Behavior**************************************/


/******************************************ImageViewer ScrollWheel Behavior**************************************/
$IGIV.ScrollWheel = function(elem, orientation, enabled )
{
    this._scrollDelta = 20;
    this._element = elem;    
    this._orientation =  orientation;
    this._scrollHelper = new $IG.ScrollHelper(elem);
    $addHandler(document, "mousewheel", Function.createDelegate(this, this._scrollWheelIE) );   
    $addHandler(window, "DOMMouseScroll", Function.createDelegate(this, this._scrollWheelFirefox) );  
    this.setEnabled(enabled);
};

$IGIV.ScrollWheel.prototype = 
{
    setEnabled:function(enabled)
    {
        this._enabled = enabled;
    },
    
    setWrap:function(wrap)
    {
        this._scrollHelper.update(null, null, wrap);
    },
    
    _scrollWheelIE:function(evnt)
    {
        if(this._enabled && this.ensureElement(evnt.target))
        {
            var delta = evnt.rawEvent.wheelDelta;
            if(delta < 120)
                this.scrollNext();
            else
                this.scrollPrev();
            $util.cancelEvent(evnt);   
        }
    },
    _scrollWheelFirefox:function(evnt)
    {
        if(this._enabled && this.ensureElement(evnt.target))
        {
            var delta = evnt.rawEvent.detail;
            if(delta < 3)
                this.scrollNext();
            else
                this.scrollPrev();
            $util.cancelEvent(evnt);   
        }
    },
    scrollNext:function()
    {
        this._scrollHelper.update($IG.ScrollNavigationDirection.Next, this._orientation)
        this._scrollHelper.scrollTo(this._scrollHelper.getScrollPos() + this._scrollDelta);
    },
    scrollPrev:function()
    {
        this._scrollHelper.update($IG.ScrollNavigationDirection.Prev, this._orientation)
        var scrollPos = this._scrollHelper.getScrollPos() - this._scrollDelta;
        this._scrollHelper.scrollTo(scrollPos, this._scrollHelper.getNextCurrentItemSize() + scrollPos);
    },
    ensureElement:function(elem)
    {
        while(elem != null && elem != this._element)
            elem = elem.parentNode;
        return (elem == this._element);
    }
    
}
$IGIV.ScrollWheel.registerClass('Infragistics.Web.UI.ImageViewerObjects.ScrollWheel');
/******************************************END ImageViewer ScrollWheel Behavior**************************************/


/******************************************Scroll Helper**************************************/
$IG.ScrollHelper = function(elem)
{
    this._element = elem; 
};

$IG.ScrollHelper.prototype = 
{
    update:function(direction, orientation, wrap)
    {
        if(direction != null)
            this._direction = direction;
        if(orientation != null)        
            this._orientation = orientation; 
        if(wrap != null)
            this._wrap = wrap;
    },
    
    resolveItem:function(elem)
    {
        if(elem == null)
            return null;
        return elem.childNodes[0];
    },
    
    resolveParent:function(elem)
    {
        if(elem == null)
            return null;
        return elem.parentNode;
    },
    
    ensureCurrentItem:function()
    {
        if(this._wrap)
        {
            if(this._element.childNodes.length > 1)
            {
                var currentElem = this._element.childNodes[0];
                var item = this.resolveItem(currentElem);
                while(!currentElem.getAttribute || item.style.display == "none")
                {
                    currentElem = currentElem.nextSibling;
                    item = this.resolveItem(currentElem);
                }
                    
                if(this._direction == $IG.ScrollNavigationDirection.Next)
                {
                    var elem = currentElem;
                    var item = this.resolveItem(elem);
                    while(!elem.getAttribute || item.style.display == "none")
                    {
                        elem = elem.nextSibling;
                        item = this.resolveItem(elem);
                    }
                }
                else
                {
                    var elem = this._element.childNodes[this._element.childNodes.length-1];
                    var item = this.resolveItem(elem);
                    while(!elem.getAttribute || item.style.display == "none")
                    {
                        elem = elem.previousSibling;
                        item = this.resolveItem(elem);
                    }
                }
                this._currentItem = currentElem; 
                this._nextCurrentItem = elem;
            }
        }
        else
        {
            var children = this._element.childNodes;
            var childCount = children.length;
            var currentScrollPos = this.getScrollPos();
            for(var i = 0; i < childCount; i++)            
            {
                var childElem = children[i];
                var itemElem = this.resolveItem(childElem);
                var size = this.getSize(itemElem);
                var scrollPos = this.getPos(itemElem);
                if(size > 0)
                {
                    if(scrollPos <= currentScrollPos && scrollPos + size > currentScrollPos)
                    {
                        this._currentItem = childElem;
                        if(this._direction == $IG.ScrollNavigationDirection.Next)
                        {
                            var nextCurrentChildElem = childElem.nextSibling
                            var nextCurrentItemElem = itemElem;
                            while(!nextCurrentChildElem.getAttribute || nextCurrentItemElem.style.display == "none")
                            {
                                nextCurrentChildElem = nextCurrentChildElem.nextSibling;
                                nextCurrentItemElem = this.resolveItem(nextCurrentChildElem);
                            }
                            this._nextCurrentItem = nextCurrentChildElem;
                            return;
                        }
                        else
                        {
                            if(scrollPos == currentScrollPos)
                            {
                                var nextCurrentChildElem = childElem.previousSibling
                                var nextCurrentItemElem = itemElem;
                                while(nextCurrentChildElem != null && (!nextCurrentChildElem.getAttribute || nextCurrentItemElem.style.display == "none"))
                                {
                                    nextCurrentChildElem = nextCurrentChildElem.previousSibling;
                                    nextCurrentItemElem = this.resolveItem(nextCurrentChildElem);
                                }
                                this._nextCurrentItem = nextCurrentChildElem;
                                return;
                            }
                            else
                                this._nextCurrentItem = this._currentItem;
                        }
                    }
                }   
            }
        }
    },
    
    moveNextItem:function(scrollPos)
    {
        if(this._currentItem == null)
            return; 
        /* Need to hide the content area, while moving elements around, 
         * otherwise we'll see a flicker. This only needs to be done in IE. 
         * If this is done in firefox, there will be a flicker */
        if($util.IsIE)
            this._element.style.visibility = "hidden";
        this.setScrollPos(scrollPos);    
        this._element.removeChild(this._currentItem);
        this._element.appendChild(this._currentItem);
        this._element.style.visibility = "";
        this.ensureCurrentItem();
    },
    
    movePrevItem:function(newScrollPos)
    {
        this.ensureCurrentItem();
        if(this._nextCurrentItem == null)
            return; 
         /* Need to hide the content area, while moving elements around, 
         * otherwise we'll see a flicker. This only needs to be done in IE. 
         * If this is done in firefox, there will be a flicker */
        if($util.IsIE)
            this._element.style.visibility = "hidden";
        this._element.removeChild(this._nextCurrentItem);
        this._element.insertBefore(this._nextCurrentItem,this._element.childNodes[0] );        
        if(newScrollPos == null)
            this.setScrollPos(this.getCurrentItemSize());
        else 
            this.setScrollPos(newScrollPos);
        this._element.style.visibility = "";            
        this.ensureCurrentItem();
    },
    
    getSize:function(elem)
    {        
        return (this._orientation == $IG.Orientation.Horizontal)? elem.offsetWidth: elem.offsetHeight;
    },
    
    getCurrentItemIndex:function()
    {
        this.ensureCurrentItem();
        if(this._currentItem == null)
            return -1; 
        var children = this._element.childNodes;
        var count = children.length;
        for(var i = 0; i < count; i++)
        {
            if(children[i] == this._currentItem)
                return i;
        }
        return -1; 
    },
    
    getCurrentItemSize:function()
    {
        this.ensureCurrentItem();
        if(this._currentItem == null)
            return 0; 
        return (this._orientation == $IG.Orientation.Horizontal)? this.resolveItem(this._currentItem).offsetWidth: this.resolveItem(this._currentItem).offsetHeight;
    },
    
    getNextCurrentItemSize:function()
    {
        this.ensureCurrentItem();
        if(this._nextCurrentItem == null)
            return 0; 
        return (this._orientation == $IG.Orientation.Horizontal)? this.resolveItem(this._nextCurrentItem).offsetWidth: this.resolveItem(this._nextCurrentItem).offsetHeight;
    },
    
    getNextCurrentItemPos:function()
    {
        this.ensureCurrentItem();
        if(this._nextCurrentItem == null)
            return -1; 
        return (this._orientation == $IG.Orientation.Horizontal)? this.resolveItem(this._nextCurrentItem).offsetLeft: this.resolveItem(this._nextCurrentItem).offsetTop;
    },
    
    getPos:function(elem)
    {
        return (this._orientation == $IG.Orientation.Horizontal)?  elem.offsetLeft:elem.offsetTop; 
    },
    
    getScrollPos:function()
    {
        return (this._orientation == $IG.Orientation.Horizontal)? this._element.scrollLeft:this._element.scrollTop; 
    },
    
    setScrollPos:function(val)
    {
        if(this._orientation == $IG.Orientation.Horizontal)
            this._element.scrollLeft = val; 
        else
            this._element.scrollTop = val; 
    },
    
    getScrollSize:function()
    {
        return (this._orientation == $IG.Orientation.Horizontal)? this._element.scrollWidth:this._element.scrollHeight; 
    }, 
    
    scrollItemIntoView:function(direction, orientation,firstItem, scrollPos, wrap)
    {
        this.update(direction, orientation, wrap);
        this.ensureCurrentItem();
        if(wrap)
        {
            if(direction == $IG.ScrollNavigationDirection.Next)
            {
                while(this._currentItem != firstItem)
                    this.moveNextItem(0);
                this.setScrollPos(scrollPos);    
            }
            else
            {
                while(this._currentItem != firstItem)
                    this.movePrevItem();
	            this.setScrollPos(scrollPos); 
            }
        }
        else
        {
                while(this._currentItem != firstItem)
                    this.moveNextItem(0);
                this.setScrollPos(scrollPos);            
        }
    }, 
    scrollTo:function(newScrollPos, elseScrollPos)
    {
       this.ensureCurrentItem();
       if(this._currentItem == null)
            return false;
       if(!this._wrap)
       {
            this.setScrollPos(newScrollPos);
            return false;
       }
       else
       {
           if(this._direction == $IG.ScrollNavigationDirection.Next)
           {            
                if(this.getCurrentItemSize() <= newScrollPos)
                {
                    if(elseScrollPos != null)
                        this.moveNextItem(elseScrollPos);    
                    else
                        this.moveNextItem(0);    
                    return true; 
                }
                else
                    this.setScrollPos(newScrollPos);
            }
            else
            {
                if(newScrollPos < 0 || (this.getScrollPos() == 0 && newScrollPos != 0))
                {
                    this.movePrevItem();                    
                    this.setScrollPos(elseScrollPos);
                    return true;
                }
                this.setScrollPos(newScrollPos);
            }
            return false; 
        }
    }, 
    
    findCurrentFocalItem:function(nextItemAlignment)
    {
        this.ensureCurrentItem();
        var size = this.getSize(this._element); 
        if(nextItemAlignment == $IG.NextItemAlignment.Near)
        { 
            if(this.getScrollPos() == 0)
                return this.resolveItem(this._currentItem); 
        }
        else if(nextItemAlignment == $IG.NextItemAlignment.Center)
        {
            var pos = parseInt((size/2) + this.getScrollPos()); 
            var count = this._element.childNodes.length; 
            for(var i = 0; i < count; i++)
            {
                var elem = this.resolveItem(this._element.childNodes[i]);
                var elemSize = this.getSize(elem)/2; 
                var elemPos = this.getPos(elem); 
                var total = elemSize + elemPos;
                var diff = (pos - total);
                if(Math.ceil(total) == pos || Math.floor(total) == pos || diff <= 1 )
                    return elem;
            }
        }
        else if(nextItemAlignment == $IG.NextItemAlignment.Far)
        {
            var pos = size + this.getScrollPos(); 
            var count = this._element.childNodes.length; 
            for(var i = 0; i < count; i++)
            {
                var elem = this.resolveItem(this._element.childNodes[i]);
                var elemSize = this.getSize(elem); 
                var elemPos = this.getPos(elem); 
                if(Math.ceil(elemSize + elemPos) == pos || Math.floor(elemSize + elemPos) == pos)
                    return elem;
            }
        }
        
    },
    
    findClosestToNextItemAlignment:function(nextItemAlignment)
    {
        var closest = this.findCurrentFocalItem(nextItemAlignment); 
        if(closest == null)
        {
            var nextItem = this.findNextFocalItem(nextItemAlignment, $IG.ScrollNavigationDirection.Next); 
            var prevItem = this.findNextFocalItem(nextItemAlignment, $IG.ScrollNavigationDirection.Prev); 
            var nextItemScrollPos = this.getPos(nextItem);
            var prevItemScrollPos = this.getPos(prevItem);
            var nextItemSize = this.getSize(nextItem);
            var prevItemSize = this.getSize(prevItem);
            var scrollPos = this.getScrollPos(); 
            
            if(nextItemAlignment == $IG.NextItemAlignment.Near)
            {
                var nextDist = Math.abs(scrollPos - nextItemScrollPos); 
                var prevDist = Math.abs(scrollPos - prevItemScrollPos); 
                return (nextDist < prevDist)?nextItem:prevItem;                
            }
            else if(nextItemAlignment == $IG.NextItemAlignment.Center)
            {
               var center = parseInt(this.getSize(this._element)/2) + scrollPos; 
               var nextDist = Math.abs(center - (nextItemSize/2 + nextItemScrollPos));
               var prevDist = Math.abs(center - (prevItemSize/2 + prevItemScrollPos));
               return (nextDist < prevDist)?nextItem:prevItem;                
            }
            else if(nextItemAlignment == $IG.NextItemAlignment.Far)
            {
               var size = this.getSize(this._element) + scrollPos; 
               var nextDist = Math.abs(size - (nextItemSize + nextItemScrollPos));
               var prevDist = Math.abs(size - (prevItemSize + prevItemScrollPos));
               return (nextDist < prevDist)?nextItem:prevItem;    
            }
        }
        else
            return closest;
    },
    
    findNextFocalItem:function(nextItemAlignment, direction)
    {
       this._direction = direction;
       this.ensureCurrentItem();
       if(nextItemAlignment == $IG.NextItemAlignment.Near)
            return this.resolveItem(this._nextCurrentItem);
       else if(direction == $IG.ScrollNavigationDirection.Next)
       {
                            
            if(nextItemAlignment == $IG.NextItemAlignment.Center)
            {
                var size = this.getSize(this._element);
                var center = size/2;
                size = center + this.getScrollPos();
                var count = this._element.childNodes.length; 
                for(var i = 0; i < count; i++)
                {                    
                    var image = this.resolveItem(this._element.childNodes[i]);
                    var imageSize = this.getSize(image);                    
                    if(size - (imageSize/2) < -1.5)
                        return image;
                     else 
                        size -= imageSize;
                }
            }
            else if(nextItemAlignment == $IG.NextItemAlignment.Far)
            {
                var size = this.getSize(this._element) + this.getScrollPos();
                var count = this._element.childNodes.length; 
                for(var i = 0 ; i < count; i++)
                {
                    var image = this.resolveItem(this._element.childNodes[i]);
                    var imageSize = this.getSize(image);                    
                    size -= imageSize;
                    if(size < 0)
                        return image; 
                }
            }
        }
        else
        {
            if(nextItemAlignment == $IG.NextItemAlignment.Center)
            {
                var lastIndex = this._getLastVisibleItemIndex();
                var size = this.getSize(this._element);
                var center = size/2;
                size = center + this.getScrollPos();
                for(var i = lastIndex ; i >= 0; i--)
                {
                    var image = this.resolveItem(this._element.childNodes[i]);
                    var imageSize = this.getSize(image)/2;                    
                    var imagePos = this.getPos(image);
                    if(imageSize == 0)
                        continue; 
                    if(imagePos + imageSize < size-1 )
                         return image;
                }
                return this.resolveItem(this._element.childNodes[this._element.childNodes.length-1])
            }
            else if(nextItemAlignment == $IG.NextItemAlignment.Far)
            {
                var lastIndex = this._getLastVisibleItemIndex();
                var size = this.getSize(this._element)+ this.getScrollPos();
                for(var i = lastIndex ; i >= 0; i--)
                {
                    var image = this.resolveItem(this._element.childNodes[i]);
                    var imageSize = this.getSize(image);                    
                    var imagePos = this.getPos(image); 
                    if(imageSize == 0)
                        continue;
                    if(imagePos + imageSize < size )
                        return image;
                }
                return this.resolveItem(this._element.childNodes[this._element.childNodes.length-1])
            }
        }
    },
    
    _getLastVisibleItemIndex:function()
    {
        var begin = this.getScrollPos();
        var size = this.getSize(this._element) + begin;
        var count = this._element.childNodes.length; 
        for(var i = 0 ; i < count; i++)
        {
            var image = this.resolveItem(this._element.childNodes[i]);
            var imageSize = this.getSize(image);  
            size -= imageSize; 
            if(size <= 0)
            {
                return i;
            }
        }
        return -1; 
    }

}
$IG.ScrollHelper.registerClass('Infragistics.Web.UI.ScrollHelper');
/******************************************END Scroll Helper**************************************/


/******************************************ScrollAnimationBase**************************************/
$IG.ScrollAnimationBase = function(elem)
{
    $IG.ScrollAnimationBase.initializeBase(this, [elem]);
    this._scrollHelper = new $IG.ScrollHelper(elem);
}
$IG.ScrollAnimationBase.prototype = 
{
    play:function(orientation, direction, wrap, duration, equationType, maxSpeed)
    {         
        if(!this.get_isAnimating())
        {
            this._scrollHelper.update(direction, orientation, wrap);
            this._orientation = orientation;
            this._direction = direction;
            this._wrap = wrap; 
            this.set_duration(duration);
            this._equationType = equationType;
            $IG.ScrollAnimationBase.callBaseMethod(this, "play");
        }
    },
    
    scrollNext:function(){},
    scrollPrev:function(){},
    initNext:function(){},
    initPrev:function(){},
    
    _init:function()
    {
        if(this._direction == $IG.ScrollNavigationDirection.Next)
            this.initNext();
        else if(this._direction == $IG.ScrollNavigationDirection.Prev)
            this.initPrev();
    },
    
    _next:function()
    {
        if(this._direction == $IG.ScrollNavigationDirection.Next)
            this.scrollNext();
        else if(this._direction == $IG.ScrollNavigationDirection.Prev)
            this.scrollPrev();
    },
    
     /********************Private Methods**********************************/
    __scrollToNextHelper:function(pos)
    {   
        if(this._direction == $IG.ScrollNavigationDirection.Next)
        {
            var currentScrollPos = this._scrollHelper.getScrollPos();
            var scrollPos = currentScrollPos + (pos - this._lastPos);            
            this._lastPos = parseInt(pos);
            var elseScrollPos = (parseInt(scrollPos) - currentScrollPos) - (this._scrollHelper.getNextCurrentItemSize() - currentScrollPos);
            this._scrollHelper.scrollTo(scrollPos, elseScrollPos)        
        }
        else
        {
            var currentScrollPos = this._scrollHelper.getScrollPos();
            var scrollPos = currentScrollPos + (pos - this._lastPos);            
            this._lastPos = pos;            
            var elseScrollPos = this._scrollHelper.getNextCurrentItemSize() + scrollPos;            
            this._scrollHelper.scrollTo(scrollPos, elseScrollPos)     
        }
    }
    /********************END Private Methods**********************************/
};
$IG.ScrollAnimationBase.registerClass("Infragistics.Web.UI.ScrollAnimationBase", $IG.AnimationBase);
/*************************************END ScrollAnimationBase*************************************/

/*************************************ContinuousScrollAnimation****************************/
$IG.ContinuousScrollAnimation = function(elem)
{
    $IG.ContinuousScrollAnimation.initializeBase(this, [elem]);
};
$IG.ContinuousScrollAnimation.prototype = 
{
    _calc:function()
    {
        var t = this._time;
        if(t > this._duration)
            t = this._duration; 
        return $IG.ContinuousScrollAnimation.callBaseMethod(this, "_calc", [this._equationType, t,0,this._maxSpeed, this._duration]);
    },
    
    play:function(orientation, direction, wrap, duration, equationType, maxSpeed)
    { 
        this._maxSpeed = maxSpeed;
        $IG.ContinuousScrollAnimation.callBaseMethod(this, "play", [orientation, direction, wrap, duration, equationType]);
    },
    
    scrollNext:function()
    {
        if(!this._wrap && this._scrollHelper.getScrollPos() + this._scrollHelper.getSize(this._scrollHelper._element) == this._scrollHelper.getScrollSize())
            this.stop();
        else
        {
            var pos = this._calc();
            var newScrollPos = this._scrollHelper.getScrollPos() + pos;
            this._scrollHelper.scrollTo(newScrollPos, newScrollPos - this._scrollHelper.getCurrentItemSize());
        }
    },
    
    scrollPrev:function()
    {
        if(!this._wrap && this._scrollHelper.getScrollPos() == 0)
            this.stop();
        else
        {
            var pos = this._calc();
            var newScrollPos = this._scrollHelper.getScrollPos() - pos;
            if(newScrollPos <= 0 && this._wrap)
                this._scrollHelper.movePrevItem(this._scrollHelper.getNextCurrentItemSize() + newScrollPos);
            else
                this._scrollHelper.setScrollPos(newScrollPos);
        }
    }
};
$IG.ContinuousScrollAnimation.registerClass("Infragistics.Web.UI.ContinuousScrollAnimation", $IG.ScrollAnimationBase);
/************************************************END ContinuousScrollAnimation*****************************************/

/************************************************NextItemScrollAnimation****************************************/
$IG.NextItemScrollAnimation = function(elem)
{
    $IG.NextItemScrollAnimation.initializeBase(this, [elem]);
};
$IG.NextItemScrollAnimation.prototype = 
{
    _calc:function(begin, end)
    {
        return $IG.NextItemScrollAnimation.callBaseMethod(this, "_calc", [this._equationType, this._time , begin,end, this._duration]) * (-1);
    },
    
    play:function(orientation, direction, wrap, duration, equationType, alignment)
    {
        this._alignment = alignment;
        $IG.NextItemScrollAnimation.callBaseMethod(this, "play", [orientation, direction, wrap, duration, equationType]);
    },
    
    /****************NEXT***************/
    initNext:function()
    {
        if(this._wrap)
            this._end =   this._scrollHelper.getNextCurrentItemSize();
        else
            this._end =   this._scrollHelper.getNextCurrentItemPos();  
        this._begin = this._scrollHelper.getScrollPos(); 
        
        if(this._alignment == $IG.NextItemAlignment.Near)
            this.initNextNear();    
        else if(this._alignment == $IG.NextItemAlignment.Center)
            this.initNextCenter();
        else if(this._alignment == $IG.NextItemAlignment.Far)
            this.initNextFar();
    },
    
    scrollNext:function()
    {   
        if(this._alignment == $IG.NextItemAlignment.Near)
            this.scrollNextNear();        
        else if(this._alignment == $IG.NextItemAlignment.Center)
            this.scrollNextCenter();        
        else if(this._alignment == $IG.NextItemAlignment.Far)
            this.scrollNextFar();        
    },
    
    initNextNear:function()
    {
        if(this._wrap)
        {
            if(this._begin != 0)
                this._end = this._end - this._begin;
        }
        else
        {
            var size = this._scrollHelper.getSize(this._element);
            var total = this._end + size
            var scrollSize = this._scrollHelper.getScrollSize();
            if(total > scrollSize)
                this._end = scrollSize - size;
        }
    },
    
    scrollNextNear:function()
    {
        if(this._wrap)
        {
            var pos = this._calc(this._begin, this._end) * -1;
            this._scrollHelper.scrollTo(pos);
            
            if(this._time == this._duration)
                this.stop();
        }
        else
        {
            var pos = this._calc(this._begin, this._end - this._begin) * -1;
            if(pos <= this._end)
                this._scrollHelper.scrollTo(pos)
            
            if(this._time == this._duration)
            {
                this._scrollHelper.scrollTo(this._end)
                this.stop();
            }
        }
    },
    
    initNextCenter:function()
    {
         var size = this._scrollHelper.getSize(this._element);
        if(!this._wrap)
        {
            if(size + this._begin  == this._scrollHelper.getScrollSize())
            {
                this.stop();
                return;
            }
        }
        
        var center = size/2;
        this._nextImage = this._scrollHelper.findNextFocalItem(this._alignment, this._direction);
        if(this._nextImage == null)
        {
            this.stop();
            return;
        }                
        this._end = ((this._scrollHelper.getSize(this._nextImage)/2) + this._scrollHelper.getPos(this._nextImage)- this._begin) - center ;
        if(!this._wrap)
        {
            var total = this._end + this._begin + size
            var scrollSize = this._scrollHelper.getScrollSize();
            if(total > scrollSize)
                this._end = scrollSize - (this._begin + size);
        }
        
        this._lastPos = 0; 
    },
    
    scrollNextCenter:function()
    {
        var pos = this._calc(0, this._end) * -1;
        this.__scrollToNextHelper(pos);
        if(this._time == this._duration)
            this.stop();
    },
    
    initNextFar:function()
    {
        this._nextImage = this._scrollHelper.findNextFocalItem(this._alignment, this._direction);
        if(this._nextImage == null)
        {
            this.stop();
            return;
        }
        this._end = ((this._scrollHelper.getSize(this._nextImage)) + this._scrollHelper.getPos(this._nextImage)- this._begin) - this._scrollHelper.getSize(this._element) ;
        this._lastPos = 0; 
    },
    
    scrollNextFar:function()
    {
        var pos = this._calc(0, this._end) * -1;
        this.__scrollToNextHelper(pos);
        if(this._time == this._duration)
            this.stop();
    },
    
    /************END NEXT***************/
    
    /************PREV*************/
    
    initPrev:function()
    {
        if(this._alignment == $IG.NextItemAlignment.Near)
            this.initPrevNear();        
        else if(this._alignment == $IG.NextItemAlignment.Center)
            this.initPrevCenter();        
        else if(this._alignment == $IG.NextItemAlignment.Far)
            this.initPrevFar();        
    },
    
    scrollPrev:function()
    {
        if(this._alignment == $IG.NextItemAlignment.Near)
            this.scrollPrevNear();        
        else if(this._alignment == $IG.NextItemAlignment.Center)
            this.scrollPrevCenter();        
        else if(this._alignment == $IG.NextItemAlignment.Far)
            this.scrollPrevFar();        
    },
    
    initPrevNear:function()
    {
        this._lastPos = this._begin = this._scrollHelper.getScrollPos();
        if(this._wrap)
        {                    
            if(this._begin == 0)
            {
                this._scrollHelper.movePrevItem();
                this._end = this._scrollHelper.getCurrentItemSize();
            }
            else
                this._end = this._begin;
        }
        else
        {
            this._end =   this._scrollHelper.getNextCurrentItemPos();  
            if(this._end == -1)
            {
                this.stop();
                return;
            }    
        }
    },
    
    scrollPrevNear:function()
    {
        if(this._wrap)
        {
            var pos = this._calc(this._begin, this._end) * (-1);            
            this._scrollHelper.setScrollPos(this._scrollHelper.getScrollPos() + this._lastPos - pos);
            this._lastPos = pos; 
            
            if(this._time == this._duration)
            {
                this._scrollHelper.setScrollPos(0);
                this.stop();
            }
        }
        else
        {      
            var pos = this._calc(this._begin, this._begin - this._end) * -1;            
            this._scrollHelper.setScrollPos(this._begin - (pos - this._begin)); 
            
            if(this._time == this._duration)
            {
                this._scrollHelper.scrollTo(this._end);
                this.stop();
            }
        }
    },
    
    initPrevCenter:function()
    {
        this._begin = this._scrollHelper.getScrollPos();
        if(!this._wrap && this._begin == 0)
        {
            this.stop();
            return;
        }
        var size = this._scrollHelper.getSize(this._element);
        var center = size/2;
        this._nextImage = this._scrollHelper.findNextFocalItem(this._alignment, this._direction);
        if(this._nextImage == null)
        {
            this.stop();
            return;
        }   
        this._end =  center - ((this._scrollHelper.getSize(this._nextImage)/2) + this._scrollHelper.getPos(this._nextImage)) + this._begin ;
        if(!this._wrap)
        {
            if(this._end > this._begin)
                this._end = this._begin;
        }
        else
        {
            if(this._end < 0)
            {
                this._scrollHelper.movePrevItem(this._scrollHelper.getNextCurrentItemSize() + this._begin);                    
                this._end =  ((this._scrollHelper.getSize(this._nextImage)/2) + this._scrollHelper.getPos(this._nextImage)) +  center + this._begin;
            }
            else
            {
                if(this._begin == 0)
                    this._scrollHelper.movePrevItem();                    
            }
        }
        this._lastPos = 0; 
    },
    
    scrollPrevCenter:function()
    {
        var pos = parseInt(this._calc(0, this._end));
        this.__scrollToNextHelper(pos);
                
        if(this._time == this._duration)
            this.stop();
    },
    
    initPrevFar:function()
    {
        this._begin = this._scrollHelper.getScrollPos();
        if(!this._wrap && this._begin == 0)
        {
            this.stop();
            return;
        }
        this._nextImage = this._scrollHelper.findNextFocalItem(this._alignment, this._direction);
        if(this._nextImage == null)
        {
            this.stop();
            return;
        }                
        this._end =   this._scrollHelper.getSize(this._element) - ((this._scrollHelper.getSize(this._nextImage)) + this._scrollHelper.getPos(this._nextImage)) + this._begin ;
        if(!this._wrap)
        {
            if(this._end > this._begin)
                this._end = this._begin;
        }
        else
        {
            if(this._end < 0)
            {
                this._scrollHelper.movePrevItem(this._scrollHelper.getNextCurrentItemSize() + this._begin);                    
                this._end =   this._scrollHelper.getSize(this._element) + this._begin;
            }
            else
            {
                if(this._begin == 0)
                    this._scrollHelper.movePrevItem();                    
            }
        }
        this._lastPos = 0; 
    },
    
    scrollPrevFar:function()
    {
        var pos = parseInt(this._calc(0, this._end));
        this.__scrollToNextHelper(pos);
                
        if(this._time == this._duration)
            this.stop();
    }
    /*********************END PREV****************************************/
    
};
$IG.NextItemScrollAnimation.registerClass("Infragistics.Web.UI.NextItemScrollAnimation", $IG.ScrollAnimationBase);
/********************************************END NextItemScrollAnimation*********************************************/

/******************************************PageScrollAnimation********************************/
$IG.PageScrollAnimation = function(elem)
{
    $IG.PageScrollAnimation.initializeBase(this, [elem]);
};
$IG.PageScrollAnimation.prototype = 
{
    _calc:function(begin, end)
    {
        return  $IG.PageScrollAnimation.callBaseMethod(this, "_calc", [this._equationType, this._time , begin,end, this._duration]);
    },
    
    /**************NEXT*********************/
    initNext:function()
    {
        this._begin = this._scrollHelper.getScrollPos();
        var size = this._scrollHelper.getSize(this._element)+this._begin;
        var count = this._element.childNodes.length; 
        var nextVisibleImage = null;             
        var totalSize = 0; 
        for(var i = 0 ; i < count; i++)
        {
            var elem = this._element.childNodes[i];
            if(elem.getAttribute)
            {   
                var elemSize = this._scrollHelper.getSize(this._scrollHelper.resolveItem(elem)); 
                size -= elemSize; 
                if(size < 0)
                {
                    nextVisibleImage = elem;
                    break;
                }
                else if(size == 0)
                {
                    nextVisibleImage = this._element.childNodes[i+1];
                    break;
                }
                totalSize += elemSize;                         
            }
        }
        if(nextVisibleImage != null)
        {    
           this._end = this._scrollHelper.getPos(this._scrollHelper.resolveItem(nextVisibleImage));            
           if(this._end < totalSize)
                this._end = totalSize;
           if(this._end <= 0)
                this._end =  this._scrollHelper.getSize(this._scrollHelper.resolveItem(nextVisibleImage));                    
           this._end -= this._begin; 
           this._lastPos = 0; 
        }
        else
        {
            this.stop();
            return;
        }
        if(!this._wrap)
        {
            var size = this._scrollHelper.getSize(this._element);
            var total = this._end + this._begin + size
            var scrollSize = this._scrollHelper.getScrollSize();
            if(total > scrollSize)
                this._end = scrollSize - (this._begin + size);
        }
        
    },
    
    scrollNext:function()
    {
        var pos =  this._calc(0, this._end);
        this.__scrollToNextHelper(pos);    
        if(this._time == this._duration)
               this.stop();
    },
    /**************END NEXT *******************/
    
    initPrev:function()
    {
        this._begin = this._scrollHelper.getScrollPos();                    
        this._end = 0;         
        if(this._wrap)
            this.initPrevWrap();
        else
            this.initPrevNoWrap();
    },
    
    initPrevWrap:function()
    {
        var count = this._element.childNodes.length; 
        var nextVisibleImage = null; 
        var size = this._scrollHelper.getSize(this._element) - this._begin;
        for(var i = count -1 ; i >= 0; i--)
        {
            var elem = this._element.childNodes[i];
            if(elem.getAttribute)
            {                    
                size -= this._scrollHelper.getSize(this._scrollHelper.resolveItem(elem)); 
                if(size == 0)
                {
                    nextVisibleImage = elem;
                    break;
                }
                else if(size <=0)
                {
                    if(i == count -1)
                    {
                        if((this._scrollHelper.getSize(this._element) - this._begin) < 0)
                            nextVisibleImage = this._element.childNodes[0];
                        else
                        {
                            nextVisibleImage = elem;
                            this._end += this._scrollHelper.getSize(this._scrollHelper.resolveItem(nextVisibleImage));                                 
                        }
                    }
                    else
                    {
                        /* If there are images that are "invisible", we need to account for them
                         * and ignore them, otherwise we'll have to click the previous button twice */
                        if(this._end == 0)
                        {
                            var index = count-1; 
                            do
                            {
                                var elem = this._element.childNodes[index--];
                                var height = elem.offsetHeight;
                                var width = elem.offsetWidth;
                            }while(height == 0 || width == 0);
                                
                            nextVisibleImage = this._element.childNodes[index+1];
                            this._end += this._scrollHelper.getSize(this._scrollHelper.resolveItem(nextVisibleImage));                              
                        }
                        else
                            nextVisibleImage = this._element.childNodes[i+1]
                    }
                    break;
                }
                this._end += this._scrollHelper.getSize(this._scrollHelper.resolveItem(elem)); 
            }
        }
        
        if(nextVisibleImage != null)
        {
           this._lastPos = 0;  
           this._end += this._begin;
        }
        else
        {
            this.stop();
            return;
        }           
    
    },
    
    initPrevNoWrap:function()
    {
        var count = this._element.childNodes.length; 
        var nextVisibleImage = null; 
        
        var size = this._scrollHelper.getSize(this._element);
        for(var i = this._scrollHelper.getCurrentItemIndex(); i >=0 && size > 0; i--)
        {
            nextVisibleImage = this._element.childNodes[i];
            size -= this._scrollHelper.getSize(this._scrollHelper.resolveItem(nextVisibleImage)); 
        }
        
        if(nextVisibleImage != null)
            this._end = this._scrollHelper.getPos(nextVisibleImage);
    },
    
    scrollPrev:function()
    {
        if(this._wrap)
        {
            var pos =  this._calc(0, -this._end);
            this.__scrollToNextHelper(parseInt(pos));
            if(this._time == this._duration)
                this.stop();
        }
        else
        {
            var pos = this._calc(this._begin, this._begin - this._end);
            this._scrollHelper.setScrollPos(this._begin - (pos - this._begin));   
            if(this._time == this._duration)
            {
                this._scrollHelper.scrollTo(this._end);
                this.stop();
            }             
        }
    }
   
};
$IG.PageScrollAnimation.registerClass("Infragistics.Web.UI.PageScrollAnimation", $IG.ScrollAnimationBase);
/***********************************END PageScrollAnimation **********************************************/

/******************************************ImageViewer Keyboard Behavior**************************************/
$IG.ImageViewerKbBehavior = function(elem, control)
{
    this._element = elem;
    this._control = control;
    $addHandler(elem, "keydown", Function.createDelegate(this, this._onKeydownHandler) );   
    $addHandler(elem, "keyup", Function.createDelegate(this, this._onKeyupHandler) );   
};

$IG.ImageViewerKbBehavior.prototype = 
{    
    _onKeydownHandler:function(evnt)
    {   
        var handled = true;     
        if(this._control.get_orientation() == $IG.Orientation.Horizontal)
        {
            if(evnt.keyCode == Sys.UI.Key.left)
                this._control.navigatePrev();
            else if(evnt.keyCode == Sys.UI.Key.right)
                this._control.navigateNext();
            else 
                handled = false;
        }
        else
        {
            if(evnt.keyCode == Sys.UI.Key.up)
                this._control.navigatePrev();
            else if(evnt.keyCode == Sys.UI.Key.down)
                this._control.navigateNext();
            else  
                handled = false;
        }
     
        if(handled)
        {
            $util.cancelEvent(evnt);   
            this._element.focus();        
        }
    }, 
    
    _onKeyupHandler:function(evnt)
    {
        $util.cancelEvent(evnt);
        this._control.endNavigation();
    }
};

$IG.ImageViewerKbBehavior.registerClass("Infragistics.Web.UI.ImageViewerKbBehavior");
/******************************************END ImageViewer Keyboard Behavior**************************************/

/***********************************************ScrollAnimations**************************************************/
$IG.ScrollAnimations  = function(obj, element, props, control, csm)
{
    /// <summary>
    /// The object that contains the settings to change the type of Animation that will occur when the WebImageViewer
    /// scroll Images into view. 
    /// </summary>
    
    if(csm == null)
        csm =  new $IG.ObjectClientStateManager(props[0]);	
	$IG.ScrollAnimations.initializeBase(this, [obj, element, props, control, csm]);
}
$IG.ScrollAnimations.prototype =
{
    get_type:function()
    {
        /// <summary>
        /// Gets/Sets the type of animation that will be peformed by the control. 
        /// </summary>
        return this._get_value($IG.ScrollAnimationsProps.Type);
    },
    set_type:function(type){this._set_value($IG.ScrollAnimationsProps.Type, type);},
    
    get_continuousAnimation:function()
    {
        /// <summary>
        /// Returns an instance of the ContinuousAnimation object. 
        /// </summary>
        if(this._continuous == null)
        {
            this._continuous = new $IG.ContinuousAnimation("Continuous", this._element, this._objectManager.get_objectProps(0), this._owner);
		    this._objectManager.register_object(0, this._continuous);
        }
        return this._continuous;
    },
    
    get_nextItemAnimation:function()
    {
        /// <summary>
        /// Returns an instance of the NextItemAnimation object. 
        /// </summary>
        if(this._nextItem == null)
        {
            this._nextItem = new $IG.NextItemAnimation("NexItem", this._element, this._objectManager.get_objectProps(1), this._owner);
		    this._objectManager.register_object(1, this._nextItem);
        }
        return this._nextItem;
    },
    
    get_pageAnimation:function()
    {
        /// <summary>
        /// Returns an instance of the PageAnimation object. 
        /// </summary>
        if(this._page == null)
        {
            this._page = new $IG.PageAnimation("Page", this._element, this._objectManager.get_objectProps(2), this._owner);
		    this._objectManager.register_object(2, this._page);
        }
        return this._page;
    },
    _createObjects:function(objectManager)
    {
        this._objectManager = objectManager;
    }
}
$IG.ScrollAnimations.registerClass('Infragistics.Web.UI.ScrollAnimations', $IG.ObjectBase);

/***********************************************End ScrollAnimations**************************************************/

/***********************************************AnimationObject**************************************************/
$IG.AnimationObject  = function(obj, element, props, control, csm)
{
    if(csm == null)
        csm =  new $IG.ObjectClientStateManager(props[0]);	
	$IG.AnimationObject.initializeBase(this, [obj, element, props, control, csm]);
	this._control = control;
	this._animation = null;
}
$IG.AnimationObject.prototype =
{
    get_duration:function()
    {
        /// <summary>
        /// Gets/Sets the duration of the animation.
        /// </summary>
        return this._get_value($IG.AnimationObjectProps.Duration);
    },
    set_duration:function(val){this._set_value($IG.AnimationObjectProps.Duration, val);},
    
    get_equationType:function()
    {
        /// <summary>
        /// Gets/Sets the equation that will be used in the animation.
        /// </summary>
        return this._get_value($IG.AnimationObjectProps.EquationType);
    },
    set_equationType:function(val){this._set_value($IG.AnimationObjectProps.EquationType, val);}
}
$IG.AnimationObject.registerClass('Infragistics.Web.UI.AnimationObject', $IG.ObjectBase);

/***********************************************End AnimationObject**************************************************/

/***********************************************ContinuousAnimation**************************************************/
$IG.ContinuousAnimation  = function(obj, element, props, control, csm)
{
    /// <summary>
    /// An object that allows for customization of the Continuous Animation.
    /// </summary>
    
    if(csm == null)
        csm =  new $IG.ObjectClientStateManager(props[0]);	
    $IG.ContinuousAnimation.initializeBase(this, [obj, element, props, control, csm]);    
}
$IG.ContinuousAnimation.prototype =
{
    get_equationType:function(){return this._get_value($IG.ContinuousAnimationProps.EquationType);},
    
    get_maxSpeed:function()
    {
        /// <summary>
        /// Gets/Sets the maximum speed of the animation.
        /// </summary>
        return this._get_value($IG.ContinuousAnimationProps.MaxSpeed);
    },
    set_maxSpeed:function(val){this._set_value($IG.ContinuousAnimationProps.MaxSpeed, val);},
    get_equationType:function(){return this._get_value($IG.ContinuousAnimationProps.EquationType);},
    set_equationType:function(val){this._set_value($IG.ContinuousAnimationProps.EquationType, val);},
    play:function(direction)
    {   
        /// <summary>
        /// Plays the current animation in the specified direction
        /// </summary>       
        ///<param name="direction">The direction in which the animation should occur </param>
        
        if(this._animation == null)
            this._animation = new $IG.ContinuousScrollAnimation(this._element);
      
        this._animation.play(this._control.get_orientation(), direction, this._control.__getWrapResolved(), this.get_duration(), this.get_equationType(), this.get_maxSpeed()); 
    },
    isPlaying:function()
    {
        /// <summary>
        /// Returns true if the animation is currently running.
        /// </summary>
        
        if(this._animation == null)
            return false;
        else
            return this._animation.get_isAnimating();
    },   
    
    stop:function()
    {
        /// <summary>
        /// Ends the current animation.
        /// </summary>
        
        if(this._animation != null)
            this._animation.stop();
    }
}
$IG.ContinuousAnimation.registerClass('Infragistics.Web.UI.ContinuousAnimation', $IG.AnimationObject);
/***********************************************End ContinuousAnimation**************************************************/

/***********************************************NextItemAnimation**************************************************/
$IG.NextItemAnimation  = function(obj, element, props, control, csm)
{
    /// <summary>
    /// An object that allows for customization of the NextItem Animation. 
    /// </summary>
    
    if(csm == null)
        csm =  new $IG.ObjectClientStateManager(props[0]);	
    $IG.NextItemAnimation.initializeBase(this, [obj, element, props, control, csm]);    
}
$IG.NextItemAnimation.prototype =
{
    get_alignment:function()
    {
        /// <summary>
        /// Gets/Sets where the next item will align in the visible area of the control. 
        /// </summary>
        return this._get_value($IG.NextItemAnimationProps.Aligment);
    },
    set_alignment:function(val){this._set_value($IG.NextItemAnimationProps.Aligment, val);},
    
    _ensureAnimation:function()
    {
        if(this._animation == null)
            this._animation = new $IG.NextItemScrollAnimation(this._element);
    },
    
    play:function(direction)
    {  
         /// <summary>
        /// Plays the current animation in the specified direction
        /// </summary>       
        ///<param name="direction">The direction in which the animation should occur </param>
        
        this._ensureAnimation();
        this._animation.play(this._control.get_orientation(), direction, this._control.__getWrapResolved(), this.get_duration(), this.get_equationType(), this.get_alignment()); 
    },
    isPlaying:function()
    {
        /// <summary>
        /// Returns true if the animation is currently running.
        /// </summary>
        
        if(this._animation == null)
            return false;
        else
            return this._animation.get_isAnimating();
    },
    get_equationType:function(){return this._get_value($IG.NextItemAnimationProps.EquationType);},
    set_equationType:function(val){this._set_value($IG.NextItemAnimationProps.EquationType, val);},
    moveItemIntoFocus:function(item)
	{
	    /// <summary>
        /// Scrolls the given ImageItem to the Alignment point specified on the control. 
        /// This method will continuously perform a ScrollAnimation of type NextItem until the ImageItem is scrolled into alignment.
        /// </summary>
        ///<param name="imageItem">The ImageItem that should be scrolled into focus.</param>
	    if(!this._control.get_enabled())
	        return;
	        
        var control = this._control;
        var scrollHelper = this._control._scrollHelper;
	    if(this.__moveIntoFocus == null)
	    {
	        this._ensureAnimation();	        
	        scrollHelper.update(null, control.get_orientation(), control.get_wrapAround());
	        var focalElement = scrollHelper.findClosestToNextItemAlignment(this.get_alignment());
	        var focalAdr = parseInt(focalElement.getAttribute("adr"));
	        	        
	        this.__moveIntoFocus = {};
	        this.__moveIntoFocus.item = item;
	        this.__moveIntoFocus.direction = $IG.ScrollNavigationDirection.Prev;
	        
	        var count = control.get_items()._items.length;
	        var index = item.get_index();
	        var actualIndex = index - focalAdr; 
	        if(actualIndex < 0)
	            actualIndex = count - 1 - focalAdr + index; 
	        
	        if(actualIndex < count/2)
	            this.__moveIntoFocus.direction = $IG.ScrollNavigationDirection.Next; 
	        this.__moveIntoFocus.oldOnEnd = this._animation.onEnd;
	        this._animation.onEnd = Function.createDelegate(this, this.moveItemIntoFocus);
	        control._dragScroll.setEnabled(false);
	    }
	    if(scrollHelper.findCurrentFocalItem(this.get_alignment()) == this.__moveIntoFocus.item._element)
	    {
	       this._animation.onEnd = this.__moveIntoFocus.oldOnEnd
	       this.__moveIntoFocus = null;
	       this._animation._scrollHelper._currentItem = null;
	       control._dragScroll.setEnabled(control.get_enableDragScrolling());
	    }
	    else
	        this.play(this.__moveIntoFocus.direction);
	}

}
$IG.NextItemAnimation.registerClass('Infragistics.Web.UI.NextItemAnimation', $IG.AnimationObject);
/***********************************************End NextItemAnimation**************************************************/

/***********************************************PageAnimation**************************************************/
$IG.PageAnimation  = function(obj, element, props, control, csm)
{
    /// <summary>
    /// An object that allows for customization of the Page Animation. 
    /// </summary>
    if(csm == null)
        csm =  new $IG.ObjectClientStateManager(props[0]);	
    $IG.PageAnimation.initializeBase(this, [obj, element, props, control, csm]);    
}
$IG.PageAnimation.prototype =
{
    get_equationType:function(){return this._get_value($IG.PageAnimationProps.EquationType);},
    set_equationType:function(val){this._set_value($IG.PageAnimationProps.EquationType, val);},
    play:function(direction)
    {  
        /// <summary>
        /// Plays the current animation in the specified direction
        /// </summary>       
        ///<param name="direction">The direction in which the animation should occur </param>
        
        if(this._animation == null)
            this._animation = new $IG.PageScrollAnimation(this._element);
      
        this._animation.play(this._control.get_orientation(), direction, this._control.__getWrapResolved(), this.get_duration(), this.get_equationType()); 
    },
    isPlaying:function()
    {
        /// <summary>
        /// Returns true if the animation is currently running.
        /// </summary>
        
        if(this._animation == null)
            return false;
        else
            return this._animation.get_isAnimating();
    }
}
$IG.PageAnimation.registerClass('Infragistics.Web.UI.PageAnimation', $IG.AnimationObject);
/***********************************************End NextItemAnimation**************************************************/

/**************************************************EVENT ARGS****************************************/
$IG.ImageViewerEventArgs = function()
{
    /// <summary>
    /// EventArgs that contain the ImageItem that triggered the event.
    /// </summary>
	$IG.ImageViewerEventArgs.initializeBase(this);
}
$IG.ImageViewerEventArgs.prototype =
{
	getImageItem: function()
	{
	    /// <summary>
        /// Returns the ImageItem assoicated with the event. 
        /// </summary>
	    return this._props[2];
	}
}
$IG.ImageViewerEventArgs.registerClass('Infragistics.Web.UI.ImageViewerEventArgs', $IG.EventArgs);


$IG.ImageViewerButtonEventArgs = function()
{
    /// <summary>
    /// EventArgs that contain the Button Element that triggered the event.
    /// </summary>
    
	$IG.ImageViewerButtonEventArgs.initializeBase(this);
}
$IG.ImageViewerButtonEventArgs.prototype =
{
	getButtonElem: function()
	{
	    /// <summary>
        /// Returns the HTML DOM element associated with the event.
        /// </summary>
	    return this._props[2];
	}
}
$IG.ImageViewerButtonEventArgs.registerClass('Infragistics.Web.UI.ImageViewerButtonEventArgs', $IG.EventArgs);
/**********************************************END EVENT ARGS****************************************/

/******************************************ImageItemProps ENUM************************************/
$IG.ImageItemProps = new function()
{
    this.ImagePath        =[$IG.ListItemProps.Count + 0, ""];
    this.AltText          =[$IG.ListItemProps.Count + 1, ""];
    this.HoverImageUrl    =[$IG.ListItemProps.Count + 2, ""];
    this.CssClass         =[$IG.ListItemProps.Count + 3, ""];
    this.SelectedCssClass =[$IG.ListItemProps.Count + 4, ""];
    this.HoverCssClass    =[$IG.ListItemProps.Count + 5, ""];
    this.DisabledCssClass =[$IG.ListItemProps.Count + 6, ""];
    this.Count            = $IG.ListItemProps.Count + 7;
};
/******************************************END LayoutPaneProps ENUM********************************/

/******************************************ImageViewerProps ENUM************************************/
$IG.ImageViewerProps = new function()
{
    this.Orientation   = [$IG.ControlMainProps.Count + 0, 0];
    this.FirstItem     = [$IG.ControlMainProps.Count + 1, 0];
    this.ScrollPosition= [$IG.ControlMainProps.Count + 2, 0];
    this.DragScroll    = [$IG.ControlMainProps.Count + 3, true]; 
    this.WrapAround    = [$IG.ControlMainProps.Count + 4, true]; 
    this.Count         =  $IG.ControlMainProps.Count + 5;
};
/******************************************END ImageViewerProps ENUM********************************/

/******************************************CaptionAreaProps ENUM************************************/
$IG.CaptionAreaProps = new function()
{
    this.Text      =[$IG.ControlObjectProps.Count + 0, ""];
    this.Count     = $IG.ControlObjectProps.Count + 1;
};
/******************************************END CaptionAreaProps ENUM********************************/


/******************************************ScrollAnimation ENUM******************************/
$IG.ScrollAnimation = function () 
{
   ///<summary>
   ///Specifies the Animation that should be used to scroll an item into view.
   ///</summary>
}
$IG.ScrollAnimation.prototype = 
{  
   Continuous:0,   
   NextItem:1,   
   Page:2
   
};
$IG.ScrollAnimation.registerEnum("Infragistics.Web.UI.ScrollAnimation");
/******************************************END ScrollNavigationAnimationType ENUM**************************/

/******************************************NextItemAlignment ENUM******************************/
$IG.NextItemAlignment = function () 
{
    /// <summary>
    /// Specifies where an item should align when scrolled into view. 
    /// </summary>
}
$IG.NextItemAlignment.prototype = 
{
   Near:0, 
   Center:1,
   Far:2
};
$IG.NextItemAlignment.registerEnum("Infragistics.Web.UI.NextItemAlignment");
/******************************************END Orientation ENUM**************************/

/******************************************ScrollNavigationAnimationOrientation ENUM******************************/
$IG.ScrollNavigationDirection = function () 
{
    /// <summary>
    /// The direction in which a Navigation should occur.
    /// </summary>
}
$IG.ScrollNavigationDirection.prototype = 
{
   Next:0, 
   Prev:1
};
$IG.ScrollNavigationDirection.registerEnum("Infragistics.Web.UI.ScrollNavigationDirection");
/******************************************END ScrollNavigationAnimationOrientation ENUM**************************/

/******************************************ScrollAnimationsProps ENUM************************************/
$IG.ScrollAnimationsProps = new function()
{
    this.Type           =[$IG.ObjectBaseProps.Count + 0, 0];
    this.Count               = $IG.ObjectBaseProps.Count + 1;
};
/******************************************END ScrollAnimationsProps ENUM********************************/

/******************************************AnimationObjectProps ENUM************************************/
$IG.AnimationObjectProps = new function()
{
    this.Duration           =[$IG.ObjectBaseProps.Count + 0, 400];
    this.EquationType       =[$IG.ObjectBaseProps.Count + 1, $IG.AnimationEquationType.Linear];
    this.Count              = $IG.ObjectBaseProps.Count + 2;
};
/******************************************END AnimationObjectProps ENUM********************************/

/******************************************ContinuousAnimation ENUM************************************/
$IG.ContinuousAnimationProps = new function()
{
    this.EquationType       =[$IG.AnimationObjectProps.EquationType[0], $IG.AnimationEquationType.EaseOut];
    this.MaxSpeed              = [$IG.AnimationObjectProps.Count + 0, 50];
    this.Count              = $IG.AnimationObjectProps.Count + 1;
};
/******************************************END ContinuousAnimation ENUM********************************/

/******************************************NextItemAnimationProps ENUM************************************/
$IG.NextItemAnimationProps = new function()
{
    this.EquationType       =[$IG.AnimationObjectProps.EquationType[0], $IG.AnimationEquationType.EaseInOut];
    this.Aligment           = [$IG.AnimationObjectProps.Count + 0, $IG.NextItemAlignment.Near];
    this.Count              = $IG.AnimationObjectProps.Count + 1;
};
/******************************************END NextItemAnimationProps ENUM********************************/

/******************************************PageAnimationProps ENUM************************************/
$IG.PageAnimationProps = new function()
{
    this.EquationType       =[$IG.AnimationObjectProps.EquationType[0], $IG.AnimationEquationType.EaseInOut];
    this.Count              = $IG.AnimationObjectProps.Count + 0;
};
/******************************************END PageAnimationProps ENUM********************************/


if(typeof(Sys)!=='undefined')Sys.Application.notifyScriptLoaded();