function ListPanelItem(name)
{
    this.Name=name;
    this.Canvas = mss.FindName(name);
	this.LeftButtonDownToken=null;
	this.MouseEnterToken=null;
	this.MouseLeaveToken=null;
	this.eventList=new EventList("Clicked");
}

ListPanelItem.prototype=
{

    StartMouseListening:function()
    {
        this.LeftButtonDownToken=this.Canvas.addEventListener("MouseLeftButtonDown", Event.createDelegate(this, this.handleMouseLeftButtonDown));
        this.MouseEnterToken=this.Canvas.addEventListener("MouseEnter", Event.createDelegate(this, this.handleMouseEnter));
        this.MouseLeaveToken=this.Canvas.addEventListener("MouseLeave", Event.createDelegate(this, this.handleMouseLeave));
    },
    
    StopMouseListening:function()
    {
    	this.Canvas.removeEventListener("MouseLeftButtonDown", this.LeftButtonDownToken);
        this.Canvas.removeEventListener("MouseEnter", this.MouseEnterToken);
        this.Canvas.removeEventListener("MouseLeave", this.MouseLeaveToken);
    },
    
    handleMouseEnter:function(sender,eventArgs) 
    {
       mss.Animate(sender.Name+"_MouseEnter");
    },
    handleMouseLeave:function(sender,eventArgs) 
    {
       mss.Animate(sender.Name+"_MouseLeave");
    },
    handleMouseLeftButtonDown:function(sender,eventArgs) 
    {
       this.eventList.Invoke("Clicked",this);
    }
}

function ListPanel(name)
{
    this.Name=name;
    this.ObjectList=new Array(0);
    this.ItemList= new Array(this.GetItemCount());
    this.TopIndex=-1;
    this.eventList=new EventList("DrawItem","Clicked");
   
    for (var idx=0;idx<this.ItemList.length;idx++)
    {
        var canvasName=this.GetItemName(idx);
        this.ItemList[idx] = new ListPanelItem(canvasName);
        this.ItemList[idx].StartMouseListening();
        this.ItemList[idx].eventList.addListener("Clicked",Event.createDelegate(this,this.handleClicked));
        
    }

}

ListPanel.prototype=
{
    GetItemCount:function()
    {
        var itemCount=0;
        while(true)  
        {
            if (mss.FindName(this.GetItemName(itemCount))==null)
            {
                break;
            }
            itemCount++;
        }
        return itemCount;
    },
    
    GetItemName:function(index)
    {
        return (this.Name+"_Item_"+(index+1));
    },
    
    SetTopIndex:function(index)
    {
        if (this.TopIndex!=index)
        {
            this.TopIndex=index;
            this.Update();
        }
    },
    
    
    Update:function()
    {
        if (this.TopIndex<0)
        {
            return;
        }
        
        for (var idx=0;idx<this.ItemList.length;idx++)
        {

            var dataIdx=idx+this.TopIndex;
            var dataObj=null;
            
            if (dataIdx<this.ObjectList.length)
            {
                dataObj=this.ObjectList[dataIdx];
            }

            var args = new DrawItemArgs(idx,this.ItemList[idx],dataIdx,dataObj);
            this.eventList.Invoke("DrawItem",args);
        }
    },

    handleClicked:function(listPanelItem) 
    {
       var dataIndex=this.getItemIndex(listPanelItem)+this.TopIndex;
       
       if (dataIndex>=this.ObjectList.length)
       {
            return;
       }
       
       var dataObj=this.ObjectList[dataIndex];
       
       var args = new ClickedItemArgs(listPanelItem,dataObj);
       this.eventList.Invoke("Clicked",args);
    },
    
    getItemIndex:function(listPanelItem)
    {
        for (var idx=0;idx<this.ItemList.length;idx++)
        {
            if (this.ItemList[idx].Name == listPanelItem.Name)
            {
                return idx;
            }
        }
        
        return -1;
    },
    
    GoToStart:function()
    {
        this.SetTopIndex(0);
    },
    
    GoToEnd:function()
    {
        var newIndex=this.ObjectList.length-this.ItemList.length;
        if (newIndex<0)
        {
            newIndex=0;
        }
        this.SetTopIndex(newIndex);
    },
    
    PageUp:function()
    {
        var newIndex=this.TopIndex-this.ItemList.length;
        if (newIndex<0)
        {
            newIndex=0;
        }
        this.SetTopIndex(newIndex);
    },
    
    PageDown:function()
    {
        var newIndex=this.TopIndex+this.ItemList.length;
        if (newIndex>this.ObjectList.length-1)
        {
            newIndex=this.ObjectList.length-1;
        }
        this.SetTopIndex(newIndex);
    }
    
}


function DrawItemArgs(itemIndex,itemPanel,objectIndex,object)
{
    this.ItemIndex=itemIndex;
    this.ItemPanel=itemPanel;
    this.ObjectIndex=objectIndex;
    this.Object=object;
}
function ClickedItemArgs(itemPanel,object)
{
    this.ItemPanel=itemPanel;
    this.Object=object;
}