﻿/// <reference path="slideShowParam.js"/>
/// <reference path="slideShowTween.js"/>


var plugin;
var main;
var stage_width;
var tile_spacing;

var directory = "./images/";

var pressed = false;
var screen_cnt = 1;

var objsArr = new Array();
objsArr["tilesHolder"] = new Object();
function mainCanvasLoaded(sender) 
{
	main = sender.findName("mainCanvas");
	plugin = sender.getHost();
	
	contentArr = new Array(tile_img_count);
    for (i=0; i < tile_img_count; i++)
        contentArr[i] = i.toString();
	
	stage_width = 890;
	tile_spacing = (stage_width / 2 + tile_img_width / 2) + (borderWidth * 2);
	
	if(headerShow)
	{
	    if(headerImage)
        {
            var imgHeader = main.findName("headerImage");
	        imgHeader["Canvas.Top"] = headerTop;
	        imgHeader["Canvas.Left"] = ((stage_width - imgHeader.Width) / 2) + (borderWidth * 2);
	        imgHeader.Visibility = "Visible"; 
        }
        else
        {
            var txtHeader = main.findName("headerText");
	        txtHeader.Text = header;
            txtHeader.FontSize = headerSize;
	        txtHeader["Canvas.Top"] = headerTop;
	        txtHeader["Canvas.Left"] = ((stage_width - txtHeader.ActualWidth) / 2) + (borderWidth * 2);
	        txtHeader.Foreground = headerColor;
	        txtHeader.Visibility = "Visible";
	    }
	}
	
	if(!roundable)
	{
	    roundX = 0;
	    roundY = 0;
	}
	
	if(!borderShow)
	{
	    borderWidth = 0;
	}
   
	plugin.content.onResize = myResize;
	
	buildImages();
}


function myResize(sender) 
{
    sender.findName("MST").scaleX = plugin.content.actualWidth / stage_width;
    sender.findName("MST").scaleY = sender.findName("MST").scaleX;	
}

var tilesHolder_left;

function buildImages() 
{
	tilesHolder_left = stage_width / 2 - tile_img_width / 2;

	var tileHolder_str = '<Canvas Name="tilesHolder" Canvas.Left="' + tilesHolder_left + '" Canvas.Top="100">';	
	
	for(i=0; i < contentArr.length; i++)
	{		
		tileHolder_left = i * tile_spacing;
		tileHolderReflection_top = (tile_img_height * 2);
				
		tileHolder_str += '<Canvas Name="tileHolder_' + i + '" Canvas.Left="' + tileHolder_left + '" Canvas.Top="' + tile_top + '" >';
		tileHolder_str += '<TextBlock Name = "txtm_' + i + '" Width="55" Height="15" Canvas.Left="' + tileHolder_left + '" Canvas.Top="-25" Text="' + MagazineNames[i] + '" TextWrapping="NoWrap" FontSize="12" Foreground= "#FFFFFFFF"/>';

	    if (reflectionShow)	
	    {
		    tileHolder_str += '	<Canvas Name="imgHolderReflection_' + i + '" Canvas.Top="' + (tileHolderReflection_top + borderWidth) + '">';
		    tileHolder_str += '		<Canvas.OpacityMask>';
		    tileHolder_str += '			<LinearGradientBrush  StartPoint="0,0" EndPoint="0,1">';           
		    tileHolder_str += '	      		<GradientStop Offset="0.37" Color="#00000000"  />';    
		    tileHolder_str += '	      		<GradientStop Offset="1" Color="#88000000"  />';
		    tileHolder_str += '	      	</LinearGradientBrush>';          
		    tileHolder_str += '		</Canvas.OpacityMask>';
		    tileHolder_str += '		<Canvas.RenderTransform><TransformGroup><ScaleTransform Name="ReflectionScaleTransform_'+i+'" ScaleY="-1" ScaleX="1" CenterX="0" CenterY="0" /></TransformGroup></Canvas.RenderTransform>';
            if (reflectionBorderShow)
                tileHolder_str += '     <Rectangle Canvas.Left="-' + (borderWidth / 2) + '" Canvas.Top="-' + (borderWidth / 2) + '" Width="' + (tile_img_width + borderWidth) + '" Height="' + (tile_img_height + borderWidth) + '" Fill="' + borderColor + '" Stroke="' + borderColor + '" RadiusX="' + roundX + '" RadiusY="' + roundY + '"/>';
            tileHolder_str += '		<Image Name="imgReflection_' + i + '" Stretch="Fill" Width="' + tile_img_width + '" Height="' + tile_img_height + '" Source="' + directory + contentArr[i] + '.jpg">';
		    if (roundable)
	            tileHolder_str += '     <Image.Clip><RectangleGeometry RadiusX="' + roundX + '" RadiusY="' + roundY + '" Rect="0,0,' + tile_img_width + ',' + tile_img_height + '"></RectangleGeometry></Image.Clip>';	
		    tileHolder_str += '     </Image>';
		    tileHolder_str += '	</Canvas>';
		}		

		tileHolder_str += '	<Canvas Name="imgHolder_' + i + '"  >';
		if (borderShow)
            tileHolder_str += ' <Rectangle Canvas.Left="-' + (borderWidth / 2) + '" Canvas.Top="-' + (borderWidth / 2) + '" Width="' + (tile_img_width + borderWidth) + '" Height="' + (tile_img_height + borderWidth) + '" Fill="' + borderColor + '" Stroke="' + borderColor + '" RadiusX="' + roundX + '" RadiusY="' + roundY + '"/>';
		tileHolder_str += '		<Image Name="img_' + i + '" Cursor="Hand" Stretch="Fill" Width="' + tile_img_width + '" Height="' + tile_img_height + '" MouseEnter="tileEnter" MouseLeave="tileLeaveX" MouseLeftButtonDown="tilePressX" Source="' + directory + contentArr[i] + '.jpg">';
		if (roundable)
		    tileHolder_str += '     <Image.Clip><RectangleGeometry RadiusX="' + roundX + '" RadiusY="' + roundY + '" Rect="0,0,' + tile_img_width + ',' + tile_img_height + '"></RectangleGeometry></Image.Clip>';
		tileHolder_str += '     </Image>';
		tileHolder_str += '	</Canvas>';

		tileHolder_str += '</Canvas>';
		
	}

	tileHolder_str += '</Canvas>';	           
	tileHolderTag = plugin.content.createFromXaml(tileHolder_str);
	main.children.add(tileHolderTag);

	for (i = 0; i < contentArr.length; i++) {
	    var eleman = main.findName("txtm_" + i);
	    eleman["Canvas.Left"] = (tile_img_width - eleman.Text.length) / 2 - (3 * eleman.Text.length) + 5;
	}	
}

function arrowEnter(sender) 
{
	sender.opacity = 0.7;
}

function arrowLeave(sender)
{
	sender.opacity = 0.15;
}

function arrowPress(sender,eventArgs) 
{
	holder = objsArr["tilesHolder"];
	holderRef = sender.findName("tilesHolder");
	var propX = holderRef["Canvas.Left"];
	var num = (contentArr.length - 1) * tile_spacing - tilesHolder_left;

	rightArrowRef = main.findName("arrowRight");
	leftArrowRef = main.findName("arrowLeft");

	//window.status = propX + " " + num;
	
	if(!pressed) 
	{
		pressed=true

		if(sender.name == "arrowRight") 
		{
			leftArrowRef.visibility = "Visible";
			leftArrowRef.opacity = 0.15;
			
			if(propX != -num) 
			{
				var final_propX = propX - tile_spacing;
				
				screen_cnt++;
				if(screen_cnt == contentArr.length) 
				{
					rightArrowRef.visibility = "Collapsed";				
				}				
				
			}
			else 
			{
				var final_propX = propX;
				screen_cnt = contentArr.length;
			}
		}
		else 
		{
			rightArrowRef.visibility = "Visible";
			rightArrowRef.opacity = 0.15;
			
			if(propX != tilesHolder_left) 
			{
				var final_propX = propX + tile_spacing;
				screen_cnt--;
				if(screen_cnt == 1)
				{
					leftArrowRef.visibility = "Collapsed";				
				}
			}
			else 
			{
				var final_propX = propX;
				screen_cnt = 1;
			}
		}

		holder.tweenX = new Tween(new Object(),'x',Tween.regularEaseOut,propX,final_propX,time_to_move);

		holder.tweenX.onMotionChanged = function(event)
		{	
			holderRef["Canvas.Left"] = event.target._pos;
		}

		holder.tweenX.onMotionFinished = function(event)
		{
			pressed = false;	
		}

		holder.tweenX.start();	
	}
}

function tilePressX()
{
	location.replace("go.aspx?id=" + Magazines[(screen_cnt-1)]); 
}