//-------------------------------------------------------------------------- 
// 
//  Copyright (c) Microsoft Corporation.  All rights reserved. 
// 
//  File: events.js
//
//        code behind dynamically created Journal.xaml markup
// 
//-------------------------------------------------------------------------- 
var silverLight    = null;
var root           = null;
var ip1            = null;
var ip2            = null;
var inkCanvas      = null;
var prevPage       = null;
var page           = null;
var tempCanvas     = null;
var scaleTransform = null;
var mainScale      = null;
var pageIndex      = 0;
var isMoving       = false;

function onLoaded(sender, args)
{
    silverLight    = sender.getHost();
    root           = sender.findName("root");
    ip1            = sender.findName("ip1");
    ip2            = sender.findName("ip2");
    tempCanvas     = sender.findName("tempCanvas");
    mainScale      = sender.findName("mainScale");
    scaleTransform = sender.findName("scaleTransform");
    
    root.cursor = "Stylus";
    inkCanvas = new InkCanvas(ip1, silverLight, null, null);
    var da = silverLight.content.createFromXaml("<DrawingAttributes Color='Black' Width='2' Height='2'/>");    
    inkCanvas.setDefaultDrawingAttributes(da);
    
    silverLight.content.OnFullScreenChange = "onFullScreenChanged";
    silverLight.content.onResize = "onResize";
    
    // hook up mouse wheel event
    if (window.addEventListener)
    {
        // code for mozilla
        window.addEventListener('DOMMouseScroll', onWheel, false);
    }

    // code for Internet Explorer
    window.onmousewheel = document.onmousewheel = onWheel;

    // load first page
    page = sender.findName("page0");
    if (page != null)
    {
         transferContent(ip1, page);
    }
    updateLayout(silverLight.content.actualWidth, silverLight.content.actualHeight);
}

function transferContent(inkPresenterTo, inkPresenterFrom)
{
    for (var i=0; i<inkPresenterFrom.strokes.count; i++)
    {
        inkPresenterTo.strokes.add(inkPresenterFrom.strokes.getItem(i));
    }

    inkPresenterTo.children.clear();
    var elementCount = inkPresenterFrom.children.count;
    for (var i=0; i<elementCount; i++)
    {
        var element = inkPresenterFrom.children.getItem(0);
        inkPresenterFrom.children.remove(element);
        inkPresenterTo.children.add(element);
    }
}

function onForward(sender, args)
{
    if (isMoving == true) return;

    pageIndex++;
    var newPage = sender.findName("page" + pageIndex.toString());
    if (newPage != null)
    {            
        var strokesToSave = inkCanvas.getStrokes();
        ip2.strokes.clear();
        ip2.children.clear();
        transferContent(ip2, ip1);

        // clear previous page
        page.strokes.clear();           
        for (var i=0; i<strokesToSave.count; i++)
        {
            page.strokes.add(strokesToSave.getItem(i));
        }        
        prevPage = page;
        
        // set up new page
        page = newPage;
        inkCanvas.setEditingMode("Ink");        
        root.cursor = "Stylus";     
        inkCanvas.getStrokes().clear();        
        transferContent(ip1, page);

        // kick off transition animation
        tempCanvas.opacity = 1;
        scaleTransform.scaleX = 1;
        scaleTransform.scaleY = 1;
        isMoving = true;
        sender.findName("moveLeft1").begin();
        sender.findName("moveLeft2").begin();

        return;
    }
    pageIndex--;
}

function onBack(sender, args)
{
    if (isMoving == true) return;

    pageIndex--;
    if (pageIndex < 0)
    {
        pageIndex = 0;
        return;
    }
    
    var newPage = sender.findName("page" + pageIndex.toString());
    if (newPage != null)
    {
        var strokesToSave = inkCanvas.getStrokes();
        ip2.strokes.clear();
        ip2.children.clear();
        transferContent(ip2, ip1);
                
        // clear previous page
        page.strokes.clear();           
        for (var i=0; i<strokesToSave.count; i++)
        {
            page.strokes.add(strokesToSave.getItem(i));
        }        
        prevPage = page;
        
        // set up new page
        page = newPage;
        inkCanvas.setEditingMode("Ink");        
        root.cursor = "Stylus";     
        inkCanvas.getStrokes().clear();
        transferContent(ip1, page);
        
        // kick off transition animation
        tempCanvas.opacity = 1;
        scaleTransform.scaleX = 1;
        scaleTransform.scaleY = 1;
        isMoving = true;
        sender.findName("moveRight1").begin();
        sender.findName("moveRight2").begin();

        return;
    }
}

function onMoveComplete(sender,args)
{
   tempCanvas.opacity = 0;
   var imgCount = ip2.children.count;
   for (var i=0; i<imgCount; i++)
   {
      var img = ip2.children.getItem(0);
      ip2.children.remove(img);
      prevPage.children.add(img);
   }
   isMoving = false;
}

function onResize()
{
    updateLayout(silverLight.content.actualWidth, silverLight.content.actualHeight);
}

function onFullScreenChanged(sender, eventArgs)
{
    var zoomIn = silverLight.content.findName("ZoomIn");
    var zoomOut = silverLight.content.findName("ZoomOut");
    zoomIn.Opacity = zoomIn.Opacity == 0 ? 1: 0;
    zoomOut.Opacity = zoomOut.Opacity == 0 ? 1: 0;
    updateLayout(silverLight.content.actualWidth, silverLight.content.actualHeight);
}

function onZoom(sender,args)
{     
    silverLight.content.FullScreen = !silverLight.content.FullScreen;
} 

function onButtonsMouseEnter(sender, args)
{
    sender.findName("fadeIn").begin();
}

function onButtonsMouseLeave(sender, args)
{
    sender.findName("fadeOut").begin();
}

function onInk(sender, args)
{
    inkCanvas.setEditingMode("Ink");
    var da = silverLight.content.createFromXaml("<DrawingAttributes Color='Black' Width='2' Height='2'/>");    
    inkCanvas.setDefaultDrawingAttributes(da);
    root.cursor = "Stylus";     
}

function onHighlight(sender, args)
{
    inkCanvas.setEditingMode("Ink");        
    var da = silverLight.content.createFromXaml("<DrawingAttributes Color='#80ffff00' Width='10' Height='20'/>");    
    inkCanvas.setDefaultDrawingAttributes(da);
    root.cursor = "Stylus";     
}

function onSelect(sender, args)
{
    inkCanvas.setEditingMode("Select");        
    root.cursor = "Hand";     
}

function onErase(sender, args)
{
    inkCanvas.setEditingMode("EraseByStroke");   
    root.cursor = "Eraser";     
}

function panelMouseEnter(sender,args)
{
    sender.findName("panel").Opacity = 1;    
}

function panelMouseLeave(sender, args)
{
    sender.findName("panel").Opacity = 0.5; 
}

function onWheel(event)
{
    var delta = 0;
    if (!event) event = window.event;
    if (event.wheelDelta)
    {
        // code for Internet Explorer
        delta = event.wheelDelta/120;
    }
    else if (event.detail)
    {
        // code for Mozilla
        delta = -event.detail/3;
    }
    if (delta) handleMouseWheel(delta);
    if (event.preventDefault) event.preventDefault();
	event.returnValue = false;
}

function handleMouseWheel(delta)
{
   if (delta > 0)
   {
       scaleTransform.scaleX *= 1.05;
       scaleTransform.scaleY *= 1.05;
   }
   else
   {
       scaleTransform.scaleX *= 0.95;
       scaleTransform.scaleY *= 0.95;
   }
}

function updateLayout(width, height)
{
    if (mainScale != null && root.width !=0 && root.height != 0)
    {
        mainScale.ScaleX = width / root.Width;
        mainScale.ScaleY = height / root.Height;
    }
}