﻿if (!window.MagnifyingGlass)
	window.MagnifyingGlass = {};

MagnifyingGlass.Page = function() 
{
}

MagnifyingGlass.Page.prototype =
{
	handleLoad: function(control, userContext, rootElement) 
	{
		this.control = control;
		this.rootElement = rootElement;
		
		this.playButton = new ToggleButton(control, "play", "playON", "playOFF", this, this.startAnimation, null, false, true);
		this.glassButton = new ToggleButton(control, "glass", "glassON", "glassOFF", this, this.startDrag, null, true, true);
		
		this.magnifyArea = control.content.findName("magnifyArea");
		this.magnifyArea.AddEventListener("MouseEnter", Silverlight.createDelegate(this, this.showMagnify));
		this.magnifyArea.AddEventListener("MouseLeave", Silverlight.createDelegate(this, this.hideMagnify));
		
		this.magGlass = control.content.findName("magGlass");
		
		this.bigScene = control.content.findName("bigScene");
		this.start = control.content.findName("start");
		this.clip1 = control.content.findName("clip1");
		this.clip2 = control.content.findName("clip2");
		this.clip3 = control.content.findName("clip3");
		this.clip4 = control.content.findName("clip4");
		
		this.rootElement.AddEventListener("MouseMove", Silverlight.createDelegate(this, this.dragGlass));
		
		this.animation = control.content.findName("animation");
		this.isAnimating = false;
	},
	
	showMagnify: function (s, e)
	{
		if (!this.isAnimating)
		{
			s.cursor = "None";
			this.magGlass.Visibility = "Visible";
			this.bigScene.Visibility = "Visible";
			this.magGlass.Opacity = 1;
			this.bigScene.Opacity = 1;
		}
	},
	
	hideMagnify: function (s, e)
	{
		if (!this.isAnimating)
		{
			s.cursor = "Arrow";
			this.magGlass.Visibility = "Collapsed";
			this.bigScene.Visibility = "Collapsed";
		}
	},
	
	dragGlass: function (s,e)
	{
		if (!this.isAnimating)
		{
			x = e.getPosition(null).x;
			y = e.getPosition(null).y;
			this.magGlass["Canvas.Left"] = x - 95;
			this.magGlass["Canvas.Top"] = y - 95;
			var d = 85;
			var dx = x-(d/2);
			var dy = y-(d/2);
			this.start.StartPoint = (d+dx)+","+(d/2+dy);
			this.clip1.Point1 = (d+dx)+","+(d-19+dy);
			this.clip1.Point2 = (d-19+dx)+","+(d+dy);
			this.clip1.Point3 = (d/2+dx)+","+(d+dy);
			this.clip2.Point1 = (19+dx)+","+(d+dy);
			this.clip2.Point2 = (0+dx)+","+(d-19+dy);
			this.clip2.Point3 = (0+dx)+","+(d/2+dy);
			this.clip3.Point1 = (0+dx)+","+(19+dy);
			this.clip3.Point2 = (19+dx)+","+(0+dy);
			this.clip3.Point3 = (d/2+dx)+","+(0+dy);
			this.clip4.Point1 = (d-19+dx)+","+(0+dy);
			this.clip4.Point2 = (d+dx)+","+(19+dy);
			this.clip4.Point3 = (d+dx)+","+(d/2+dy);
			
			this.bigScene["Canvas.Left"] = ((x-(d/2))*-1) + 360;
			this.bigScene["Canvas.Top"] = ((y-(d/2))*-1) + 256;
		}
	},
	
	resetPosition: function (scope)
	{
		scope.magGlass["Canvas.Left"] = -49;
		scope.magGlass["Canvas.Top"] = -54;
		var d = 85;
		var dx = 0;
		var dy = 0;
		scope.start.StartPoint = (d+dx)+","+(d/2+dy);
		scope.clip1.Point1 = (d+dx)+","+(d-19+dy);
		scope.clip1.Point2 = (d-19+dx)+","+(d+dy);
		scope.clip1.Point3 = (d/2+dx)+","+(d+dy);
		scope.clip2.Point1 = (19+dx)+","+(d+dy);
		scope.clip2.Point2 = (0+dx)+","+(d-19+dy);
		scope.clip2.Point3 = (0+dx)+","+(d/2+dy);
		scope.clip3.Point1 = (0+dx)+","+(19+dy);
		scope.clip3.Point2 = (19+dx)+","+(0+dy);
		scope.clip3.Point3 = (d/2+dx)+","+(0+dy);
		scope.clip4.Point1 = (d-19+dx)+","+(0+dy);
		scope.clip4.Point2 = (d+dx)+","+(19+dy);
		scope.clip4.Point3 = (d+dx)+","+(d/2+dy);
		
		scope.bigScene["Canvas.Left"] = 364;
		scope.bigScene["Canvas.Top"] = 256;
	},
	
	startAnimation: function (scope)
	{
		scope.isAnimating = true;
		scope.glassButton.unToggle();
		scope.magnifyArea.cursor = "Arrow";
		scope.magGlass.Visibility = "Visible";
		scope.bigScene.Visibility = "Visible";
		scope.magGlass.Opacity = 0;
		scope.bigScene.Opacity = 0;
		scope.resetPosition(scope);
		scope.animation.Begin();
	},
	startDrag: function (scope)
	{
		scope.isAnimating = false;
		scope.playButton.unToggle(scope);
		scope.rootElement.findName("animation").Stop();
		//scope.rootElement.findName("magGlass").Visibility = "Visible";
		//scope.rootElement.findName("bigScene").Visibility = "Visible";
		//scope.rootElement.findName("magGlass").Opacity = 1;
		//scope.rootElement.findName("bigScene").Opacity = 1;
	}

}
