function createSilverlight()
{
	var scene = new BookvarWebSite.Page();
	Silverlight.createObjectEx({
		source: "Controls/Features.xml",
		parentElement: document.getElementById("SilverlightControlHost"),
		id: "SilverlightControl",
		properties: {
			width: "100%",
			height: "100%",
			version: "1.0"
		},
		events: {
			onLoad: Delegate.create(scene, scene.handleLoad)
		}
	});
}

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

BookvarWebSite.Page = function() 
{
}

BookvarWebSite.Page.prototype =
{
    cube: null,
    control: null,
    animation: null,
    selectedFeatureIndex: 1,
    isAnimating: false,
  
	handleLoad: function(control, userContext, rootElement) 
	{
		this.control = control;
		this.animation = control.content.findName("moveLeftTimeline")
		
		ScriptHost.add_load( Delegate.create(this, this.scriptsLoaded) );
		
		this.animation.addEventListener("Completed", Delegate.create(this, this.animationCompleted));
		
        var changeFeatureDelegate = Delegate.create(this, this.changeFeature);
		rootElement.addEventListener("MouseLeftButtonDown", changeFeatureDelegate);
		rootElement.addEventListener("MouseLeave", changeFeatureDelegate);
		
		var link = control.content.findName("link");
		link.addEventListener("MouseEnter", Delegate.create(this, this.linkEnter));
		link.addEventListener("MouseLeave", Delegate.create(this, this.linkLeave));
		link.addEventListener("MouseLeftButtonDown", Delegate.create(this, this.linkClick));
	},
	
	linkEnter: function(sender, eventArgs)
	{
        var animation = this.control.content.findName("linkAnimation");
        animation.Begin();
	},
	
    linkLeave: function(sender, eventArgs)
	{
        var animation = this.control.content.findName("linkAnimation");
        animation.Stop();
	},
	
	linkClick: function(sender, eventArgs)
	{
        window.location = 'screenshots.aspx';
	},
	
	changeFeature: function(sender, eventArgs) 
	{
	    if (this.isAnimating)
	    {
	        return;
	    }
        var oldSelectedIndex = this.selectedFeatureIndex;
        while (oldSelectedIndex == this.selectedFeatureIndex)
        {
          this.selectedFeatureIndex = Math.ceil(Math.random() * 6);
        }
        var offset = oldSelectedIndex - this.selectedFeatureIndex;
        
	    this.animation.Stop();
        for(var i=1; i<=6; i++)
        {
            var featureCanvas = this.control.content.findName("Feature" + i);
            featureCanvas.renderTransform.x = - 300 * (oldSelectedIndex - 1);
        }
        for(var i=0; i< this.animation.children.count; i++)
        {
            this.animation.children.getItem(i).keyFrames.getItem(0).value = -300 * (this.selectedFeatureIndex - 1);
        }
        this.isAnimating = true;
        
	    this.animation.Begin();
	    this.cube.rotateToFace(this.selectedFeatureIndex);
	},
	
	scriptsLoaded: function()
	{
        var images = ['ScreenShots/feature4.png','ScreenShots/feature5.png','ScreenShots/feature6.png','ScreenShots/feature2.png','ScreenShots/feature1.png','ScreenShots/feature3.png'];
		this.cube = new Cube.Cube(this.control, images, 250);
	},
	
	animationCompleted: function()
	{
	    this.isAnimating = false;
	}
}