﻿function ImageTool(page)
{
    this.Page = page;
    
    this.content = page.control.content;
    
    this.ImageThumbnailXaml = this.Page.XamlFiles["ImageThumbnail.xaml"];
    this.Images = this.content.findName("Images");
    this.Overlay = this.content.findName("Overlay");
    this.SupportingToolsFrame = page.control.content.findName("SupportingToolsFrame");
}


ImageTool.prototype.Activate = function()
{
    this.SupportingToolsFrame.children.Clear();
    var xaml = this.Page.XamlFiles["ImageTools.xaml"];
    
    this.SupportingTools = this.Page.control.content.createFromXaml(xaml, true);
    
    this.WindowsLiveSpaces = this.SupportingTools.findName("WindowsLiveSpaces");
    
    this.WindowsLiveSpaces.AddEventListener("MouseLeftButtonDown", Silverlight.createDelegate(this, this.ShowWLS));
    this.Web = this.SupportingTools.findName("Web");
    this.Web.AddEventListener("MouseLeftButtonDown", Silverlight.createDelegate(this, this.ShowWeb));
    
    this.SupportingToolsFrame.children.Add(this.SupportingTools);
}

ImageTool.prototype.Deactivate = function()
{
    this.SupportingToolsFrame.children.Remove(this.SupportingTools);
    
    this.SupportingTools = null;
}


ImageTool.prototype.LeftButtonDown = function(sender, eventArgs)
{
}

ImageTool.prototype.MouseMove = function(sender, eventArgs)
{
}


ImageTool.prototype.LeftButtonUp = function(sender, eventArgs)
{
}


ImageTool.prototype.AddImage = function(imageUrl, layout)
{
    var thumbnail = this.content.createFromXaml(this.ImageThumbnailXaml, true);
    thumbnail.AddEventListener("MouseEnter", EnterThumbnail);
    thumbnail.AddEventListener("MouseLeave", LeaveThumbnail);
    var image = thumbnail.findName("Image");
    image.Source = imageUrl;
    image.addEventListener("ImageFailed", Silverlight.createDelegate(this, this.ImageFailed));
    
    this.Images.children.Add(thumbnail);
    
    if (layout)
    {
        this.LayoutImages();
    }
    image.addEventListener("MouseLeftButtonDown", Silverlight.createDelegate(this, this.StartDragging));
}

ImageTool.prototype.StartDragging = function(sender, eventArgs)
{
    LeaveThumbnail(sender.getParent());
    
    this.Image = this.content.createFromXaml("<Image/>");
    
    this.Image.Width = sender.Width;
    this.Image.Height = sender.Height;
    this.Image.Source = sender.Source;
    this.Position = eventArgs.getPosition(sender);
    var position = eventArgs.getPosition(this.Overlay);
    this.Image["Canvas.Left"] = position.X - this.Position.X;
    this.Image["Canvas.Top"]  = position.Y - this.Position.Y;
    this.Image["Canvas.ZIndex"] = 3;
    
    this.Overlay.children.Add(this.Image);
    
    if (this.Image.CaptureMouse())
    {
        this.Dragging = true;
        this.Image.addEventListener("MouseMove", Silverlight.createDelegate(this, this.DragImage));
        this.Image.addEventListener("MouseLeftButtonUp", Silverlight.createDelegate(this, this.EndDragImage));
    }
}

ImageTool.prototype.DragImage = function(sender, eventArgs)
{
    if (this.Dragging)
    {
        var position = eventArgs.getPosition(this.Overlay);
        this.Image["Canvas.Left"] = position.X - this.Position.X;
        this.Image["Canvas.Top"]  = position.Y - this.Position.Y;
    }
}

ImageTool.prototype.EndDragImage = function(sender, eventArgs)
{
    if (this.Dragging)
    {
        sender.ReleaseMouseCapture();
        
        this.Dragging = false;
    }
}
ImageTool.prototype.AddImages = function(imageArray)
{   
	for (var i = 0; i < imageArray.length; i++) 
	{
	    this.AddImage(imageArray[i], false);
	}
	
	this.LayoutImages();
}

ImageTool.prototype.ImageFailed = function(image, nullArg)
{
    var thumbnail = image.getParent();
    var images = thumbnail.getParent();
    
    images.children.Remove(thumbnail);
    
    this.LayoutImages();
}

ImageTool.prototype.LayoutImages = function()
{    
    var top = 5;
    
    for (var i = 0; i < this.Images.children.Count; i++)
    {
        var thumbnail = this.Images.children.getItem(i);
        
        thumbnail["Canvas.Top"] = top;
        
        top += thumbnail.Height + 5;
    }
    
	this.Images["Canvas.Top"] = -top / 2;
	
	this.Images.Height = top;
}

function onSignin() 
{
    msAnalytics.TrackPage("http://xmldocs.net/MediaOverlayDesigner/WindowsLiveSignIn");    
}

function onSignout() 
{
    msAnalytics.TrackPage("http://xmldocs.net/MediaOverlayDesigner/WindowsLiveSignOut");    
}

function onError() 
{
    alert("Error with Windows Live Spaces Images");
}

function onData(p_items) 
{
    var images = new Array();
	
	try
	{
	    var xaml = Page.XamlFiles["xaml/LiveSpaces.xaml"];
	    
	    var imageTool = Page.Tools["Image"];
	    
	    imageTool.LiveSpaces = Page.control.content.createFromXaml(xaml, true);
	    
	    var photos = imageTool.LiveSpaces.findName("Photos");
	    
	    Page.control.content.Root.children.Add(imageTool.LiveSpaces);

	    for (var i = 0; i < p_items.length; i++) 
	    {
	        images.push(p_items[i].fileAccessControlledURL);
	        
	        var imageXaml = '<Image xmlns="http://schemas.microsoft.com/client/2007"/>';
	        var image = Page.control.content.createFromXaml(imageXaml);
	        image.Width = photos.Width;
	        image.Height = photos.Height;
	        image["Canvas.Left"] = i * image.Width;
	        image.Source = p_items[i].fileAccessControlledURL;
	        photos.children.Add(image);
	    }
	    
	    var lower = imageTool.LiveSpaces.findName("Lower");
	    
	    lower.addEventListener("Completed", Silverlight.createDelegate(imageTool, imageTool.ImagesDownloaded));
	    
	    imageTool.ImagesFromLiveSpaces = images;
	    
	    lower.Begin();
	    
        msAnalytics.TrackPage("http://xmldocs.net/MediaOverlayDesigner/WLSPhotos");
	}
	catch(error)
	{
	}
}

ImageTool.prototype.ImagesDownloaded = function(sender, eventArgs)
{
    Page.Tools["Image"].AddImages(this.ImagesFromLiveSpaces);
    
    var raise = this.LiveSpaces.findName("Raise");
    
	raise.addEventListener("Completed", Silverlight.createDelegate(this, this.RaiseDone));
	
    raise.Begin();
}

ImageTool.prototype.RaiseDone = function(sender, eventArgs)
{
    Page.control.content.Root.children.Remove(this.LiveSpaces);
    
    this.LiveSpaces = null;
}

function LoadImageUrl()
{
    var url = document.getElementById("ImageUrl");
    
	try
	{
	    Page.Tools.Image.AddImage(url.value, true);
	}
	catch(error)
	{
	}
}
    
function EnterThumbnail(sender, eventArgs)
{
    sender["Canvas.ZIndex"] = 1;
    var animation = sender.findName("Enlarge");
    animation.Begin();
}

function LeaveThumbnail(sender, eventArgs)
{
    sender["Canvas.ZIndex"] = 0;
    var animation = sender.findName("Reduce");
    animation.Begin();
}

ImageTool.prototype.ShowWLS = function(sender, eventArgs)
{
    var photos = document.getElementById("WLSPhotos");
    
    this.Page.ShowPane(photos);
}


ImageTool.prototype.ShowWeb = function(sender, eventArgs)
{
    var photos = document.getElementById("WebPhotos");
    
    this.Page.ShowPane(photos);
}
