if (!window.PiOpH)
	window.PiOpH = {};

PiOpH.Circle = function(id,root,control,rootElement,x,y,text) 
{
        this.id = id;
        
		//plugin
        this.control = control;
        this.root = root;
        
        //xaml node
        this.rootElement = rootElement;
        this.rootElement["Canvas.ZIndex"] = 1;
        
        this.x = x;
        this.y = y
        this.text = text;
              
        this.pressed = false;
		
		// Sample event hookup:	
	    rootElement.addEventListener("MouseEnter", Silverlight.createDelegate(this, this.onMouseEnter));
	    rootElement.addEventListener("MouseLeave", Silverlight.createDelegate(this, this.onMouseLeave));
	    rootElement.addEventListener("MouseLeftButtonDown", Silverlight.createDelegate(this, this.onMouseLeftButtonDown));
 		rootElement.findName("left").addEventListener("MouseLeftButtonDown",Silverlight.createDelegate(this,this.onPijlLeft));
		rootElement.findName("up").addEventListener("MouseLeftButtonDown",Silverlight.createDelegate(this,this.onPijlUp));
		rootElement.findName("down").addEventListener("MouseLeftButtonDown",Silverlight.createDelegate(this,this.onPijlDown));
		rootElement.findName("right").addEventListener("MouseLeftButtonDown",Silverlight.createDelegate(this,this.onPijlRight));
		
		//positioneren
		this.rootElement["Canvas.Left"] = x;
        this.rootElement["Canvas.Top"] = y;  
        
         // tekst voor het element invullen
        rootElement.findName("txtCo").Text = text;
        
        // een kleur kiezen
        switch (text)
        {
            case " 3": 
            rootElement.findName("ellipse").Fill = "#FFBEBE00";
            break;
            case " 1": 
            rootElement.findName("ellipse").Fill = "#FFBEBE00";
            break;
            case " 4": 
            rootElement.findName("ellipse").Fill = "#FFBEBE00";
            break;
            default : rootElement.findName("ellipse").Fill = "#FFF18C00";
        }
        
        if(text == " π")
        {
            // een gradient kleur toekennen
            rootElement.findName("ellipse").Fill = document.getElementById("SilverlightControl").content.createFromXaml("<LinearGradientBrush EndPoint='1,0.5' StartPoint='0,0.5'><GradientStop Color='#FFF18C00' Offset='0'/><GradientStop Color='#FFBEBE00' Offset='1'/></LinearGradientBrush>",true);
        }
        
        //event handler management
        this._events = null;
}

PiOpH.Circle.prototype =
{	

    onMouseEnter:function(sender)
    {
        if(this.checkLeft() == true)
            this.rootElement.findName("left").visibility = "visible";
         
         if(this.checkRight() == true)
            this.rootElement.findName("right").visibility = "visible";
            
         if(this.checkDown() == true)
            this.rootElement.findName("down").visibility = "visible";
            
         if(this.checkUp() == true)
            this.rootElement.findName("up").visibility = "visible";
    },
    
    onMouseLeave:function(sender)
    {
        this.rootElement.findName("left").visibility = "Collapsed";
        this.rootElement.findName("right").visibility = "Collapsed";
        this.rootElement.findName("up").visibility = "Collapsed";
        this.rootElement.findName("down").visibility = "Collapsed";
    },
    
    onPijlLeft:function(sender)
    {
        this.moveLeft();
    },
    
    onPijlUp:function(sender)
    {
        this.moveUp();
    },
    
    onPijlDown:function(sender)
    {
        this.moveDown();
    },
    
    onPijlRight:function(sender)
    {
        this.moveRight();
    },
    
    get_events:function()
    {
        if(this._events == null)
            this._events = new Sys.EventHandlerList();
            
         return this._events;
    },
    
    add_itemMoved :function(handler)
    {
        this.get_events().addHandler("itemMoved",handler);
    },
    
    remotve_itemMoved :function(handler)
    {
        this.get_events().removeHandler("itemMoved",handler);
    },
    
    _raiseEvent :function(eventName,eventArgs)
    {
        var handler = this.get_events().getHandler(eventName);
        
        if(handler)
        {
            if(!eventArgs)
            {
                eventArgs = new Sys.EventArgs.Empty;
            }
            
            handler(this,eventArgs);
        }
    },
    
    getX:function()
    {
        return this.x;
    },
    
    getY:function()
    {
        return this.y;
    },
    
	onMouseLeftButtonDown:function(sender, mouseEventArgs) 
	{
		this.rootElement["Canvas.ZIndex"] = 2;
	},
	
	checkUp:function()
	{
		for(var rij = 0 ; rij < 5 ; rij++)
	    {
	        for(var kolom = 0 ; kolom < 3 ; kolom++)
	        {
	            var circle = rasterPI[rij][kolom];
	            
	            //we overlopen de array en enkel de elementen die een cirkel zijn, anders zijn ze null
	            if(circle != null)
	            {
	                if(circle.id == this.id)
	                {
	                    if(rij > 0)
	                    {
	                        if(rasterPI[rij - 1][kolom] == "")
	                        {
	                            return true;
	                        }
	                    }
	                }
	            }
	        }   
	    }
	    
	    return false;
	
	},
	
    checkDown:function()
	{
		for(var rij = 0 ; rij < 5 ; rij++)
	    {
	        for(var kolom = 0 ; kolom < 3 ; kolom++)
	        {
	            var circle = rasterPI[rij][kolom];
	            
	            //we overlopen de array en enkel de elementen die een cirkel zijn, anders zijn ze null
	            if(circle != null)
	            {
	                if(circle.id == this.id)
	                {
	                    if(  rij < 4)
	                    {
	                        if(rasterPI[rij + 1][kolom] == "")
	                        {
	                            return true;
	                        }
	                    }
	                }
	            }
	        }   
	    }
	    
	    return false;
	
	},
	
	checkLeft:function()
	{
		for(var rij = 0 ; rij < 5 ; rij++)
	    {
	        for(var kolom = 0 ; kolom < 3 ; kolom++)
	        {
	            var circle = rasterPI[rij][kolom];
	            
	            //we overlopen de array en enkel de elementen die een cirkel zijn, anders zijn ze null
	            if(circle != null)
	            {
	                if(circle.id == this.id)
	                {
	                    if(kolom > 0)
	                    {
	                        if(rasterPI[rij][kolom -1] == "")
	                        {
	                            return true;
	                        }
	                    }
	                }
	            }
	        }   
	    }
	    
	    return false;
	
	},
	
    checkRight:function()
	{
		for(var rij = 0 ; rij < 5 ; rij++)
	    {
	        for(var kolom = 0 ; kolom < 3 ; kolom++)
	        {
	            var circle = rasterPI[rij][kolom];
	            
	            //we overlopen de array en enkel de elementen die een cirkel zijn, anders zijn ze null
	            if(circle != null)
	            {
	                if(circle.id == this.id)
	                {
	                    if(kolom < 2)
	                    {
	                        if(rasterPI[rij][kolom + 1] == "")
	                        {
	                            return true;
	                        }
	                    }
	                }
	            }
	        }   
	    }
	    
	    return false;
	
	},
	
	moveDown:function()
	{
	 var size = 62;
	    
	    for(var rij = 0 ; rij < 5 ; rij++)
	    {
	        for(var kolom = 0 ; kolom < 3 ; kolom++)
	        {
	            var circle = rasterPI[rij][kolom];
	            
	            //we overlopen de array en enkel de elementen die een cirkel zijn, anders zijn ze null
	            if(circle != null)
	            {
	                if(circle.id == this.id)
	                {
	                    //we kijken of ze niet uit de letter H proberen te geraken of dat ze niet volledig omwalt zijn door andere cirkels
	                    
	                    if( rij < 4)
	                    {
	                        
	                        if(rasterPI[rij + 1][kolom] == "")
	                        {
	                            var offset = (size + 17);
	                            this.rootElement.findName("moveY").value += offset;//hoeveel hij moet verplaatsen
	                            this.rootElement.findName("MoveItemY").begin();
	                            
	                            circle.y = (circle.y + offset);
	                            rasterPI[rij + 1][kolom] = circle;
	                            rasterPI[rij][kolom] = ""; 
	                            checkUitgespeeld();
	                            return;
	                        }
	                    }
	                    
	             
	                }
	            }
	        }
	    }
	},
	
    moveUp:function()
	{
	 var size = 62;
	    
	    for(var rij = 0 ; rij < 5 ; rij++)
	    {
	        for(var kolom = 0 ; kolom < 3 ; kolom++)
	        {
	            var circle = rasterPI[rij][kolom];
	            
	            //we overlopen de array en enkel de elementen die een cirkel zijn, anders zijn ze null
	            if(circle != null)
	            {
	                if(circle.id == this.id)
	                {
	                    //we kijken of ze niet uit de letter H proberen te geraken of dat ze niet volledig omwalt zijn door andere cirkels
	                    
	                    if(rij > 0)
	                    {
	                        
	                        if(rasterPI[rij - 1][kolom] == "")
	                        {
	                            var offset = (size + 17);
	                            this.rootElement.findName("moveY").value = (this.rootElement.findName("moveY").value - offset);//hoeveel hij moet verplaatsen 
	                            this.rootElement.findName("MoveItemY").begin();
	                            
	                            circle.y = (circle.y - offset);
                                rasterPI[rij - 1][kolom] = circle;
	                            rasterPI[rij][kolom] = ""; 
	                            checkUitgespeeld();
	                            return;
	                        }
	                    }
	                    
	             
	                }
	            }
	        }
	    }
	},
	
		
    moveRight:function()
	{
	 var size = 62;
	    
	    for(var rij = 0 ; rij < 5 ; rij++)
	    {
	        for(var kolom = 0 ; kolom < 3 ; kolom++)
	        {
	            var circle = rasterPI[rij][kolom];
	            
	            //we overlopen de array en enkel de elementen die een cirkel zijn, anders zijn ze null
	            if(circle != null)
	            {
	                if(circle.id == this.id)
	                {
	                    //we kijken of ze niet uit de letter H proberen te geraken of dat ze niet volledig omwalt zijn door andere cirkels
	                    
	                    if(kolom < 2)
	                    {
	                        
	                        if(rasterPI[rij][kolom + 1] == "")
	                        {
	                            var offset = (size + 17);
	                            this.rootElement.findName("startX").value =(this.rootElement.findName("moveX").value);
	                            this.rootElement.findName("moveX").value += offset;//hoeveel hij moet verplaatsen
	                            this.rootElement.findName("MoveItemX").begin();
	                            
	                            circle.x = (circle.x + offset);
	                         
	                            rasterPI[rij][kolom + 1] = circle;
	                            rasterPI[rij][kolom] = ""; 
	                            checkUitgespeeld();
	                            return;
	                        }
	                    }
	                    
	             
	                }
	            }
	        }
	    }
	},
		
	moveLeft:function()
	{
	 var size = 62;
	    
	    for(var rij = 0 ; rij < 5 ; rij++)
	    {
	        for(var kolom = 0 ; kolom < 3 ; kolom++)
	        {
	            var circle = rasterPI[rij][kolom];
	            
	            //we overlopen de array en enkel de elementen die een cirkel zijn, anders zijn ze null
	            if(circle != null)
	            {
	                if(circle.id == this.id)
	                {
	                    //we kijken of ze niet uit de letter H proberen te geraken of dat ze niet volledig omwalt zijn door andere cirkels
	                    
	                    if(kolom > 0)
	                    {
	                        
	                        if(rasterPI[rij][kolom - 1] == "")
	                        {
	                            var offset = (size + 17);
	                            
	                            this.rootElement.findName("startX").value =(this.rootElement.findName("moveX").value);
	                            this.rootElement.findName("moveX").value = (this.rootElement.findName("moveX").value - offset);//hoeveel hij moet verplaatsen
	                            this.rootElement.findName("MoveItemX").begin();
	                            
	                            circle.x = (circle.x - offset);
	                            
	                            rasterPI[rij][kolom - 1] = circle;
	                            rasterPI[rij][kolom] = ""; 
	                            checkUitgespeeld();
	                            return;
	                        }
	                    }
	                }
	            }
	        }
	    }
	}
}