function root_Loaded(sender, args) {
    resize();
    sender.getHost().onResized = "javascript:resize";
}

function ppOva(sender, args)
{
	sender.findName("pp").Opacity = 1;
}

function ppOut(sender, args)
{
	sender.findName("pp").Opacity = 0;
}

function ppOva1(sender, args)
{
	sender.findName("pp1").Opacity = 1;
}

function ppOut1(sender, args)
{
	sender.findName("pp1").Opacity = 0;
}

count =0;
Max=5;
var arr= new Array('creek.jpg','dock.jpg','garden.jpg','tree.jpg','waterfall.jpg');

function ppToggle(sender, args)
{
    
    var host = document.getElementById("wpfeControl1");
		//host.findName("animation1").Begin();
        count=count+1;
		if(count%Max==0)
		{
		count=0;
		}
		host.findName("scrollPic").Source=arr[count];
		
		host.findName("thirdImageRef").Fill.ImageSource=arr[count];
		host.findName("thirdImage").Fill.ImageSource=arr[count];
		host.findName("secImageRef").Fill.ImageSource=arr[count];
		host.findName("secImage").Fill.ImageSource=arr[count];
		

		host.findName("firstImageRef").Fill.ImageSource=arr[count];
		host.findName("firstImage").Fill.ImageSource=arr[count];

		host.findName("animation").Begin();
		
}

function ppToggle1(sender, args)
{
    
    var host = document.getElementById("wpfeControl1");
		//host.findName("animation1").Begin();
        count=count-1;
		if(count<0)
		{
		count=Max-1;
		}
		host.findName("scrollPic").Source=arr[count];
		
		host.findName("thirdImageRef").Fill.ImageSource=arr[count];
		host.findName("thirdImage").Fill.ImageSource=arr[count];
		host.findName("secImageRef").Fill.ImageSource=arr[count];
		host.findName("secImage").Fill.ImageSource=arr[count];
		

		host.findName("firstImageRef").Fill.ImageSource=arr[count];
		host.findName("firstImage").Fill.ImageSource=arr[count];

		host.findName("animation").Begin();
		
}

// Roughly equivalent to the WPF Viewbox element
// Stretch=Uniform HorizontalAlignment=left VerticalAlignment=top
function resize () {
   var wpfeControl1 = document.getElementById("wpfeControl1");
   
   var sourceWidth = wpfeControl1.findName("root").width;
   var targetWidth = wpfeControl1.actualWidth;
   var sourceHeight = wpfeControl1.findName("root").height;
   var targetHeight = wpfeControl1.actualHeight;
   
   var scale = 0;
   if (sourceHeight > 0 && sourceWidth > 0) {
       var aspectRatio = sourceWidth/sourceHeight;
       scale = Math.min(targetHeight / sourceHeight, targetWidth / sourceWidth);
   }
   
   var scaleTransform = wpfeControl1.findName("scaleTransform");
   scaleTransform.scaleX = scale;
   scaleTransform.scaleY = scale;
}