/*
-----------------------------------------------------------------------------------------------------------------------
VARIABLES
-----------------------------------------------------------------------------------------------------------------------
*/
var uiXaml;
var appData;
var SECTION_NO;
var PAGE_NO;
var reveal = false;
var iVid;
var iVidToken;
var lVid;
var lVidToken;
var htmlDl;
var htmlDlToken;
var xamlFoot;
var currSection;
var currPage;
var sectionData;
var mainNavSpacing = 30;
var HTML_FILE;
var oVideoPlayer = null;
var loaderLoopNo = 0;
var loaderLoopCount = 101;
var _mix = false;
var fontCollection;
var xamlRestored = true;
var autoTriggerComplete = false;
var autoTrigger;
var nTotalItems;
var nSpinnerWidth = 800;
var nSpinnerHeight = 200;
var nDX = 0;
var nMaxSpeed = .06;
var timerID = null;
var delay = 33;
var nCurMouseX = 0;
var nMinOpacity = .2;
var nMaxOpacity = 1.0;
var nDeltaOpacity = nMaxOpacity-nMinOpacity;
var nMinScale = .4;
var nMaxScale = 1.2;
var fPopupVis = false;
var oCurThumbVideo;
var hiddenSpinner;
var hiddenSpinnerScale;
var hiddenSpinnerX;
var hiddenSpinnerY;
var oVideoLoadStarted = false;
var spinnerInitted = false;
var spinnerAssets;
var _pagenum;
var _imagefolder;
    
/*
-----------------------------------------------------------------------------------------------------------------------
initialize stuff after root is loaded
-----------------------------------------------------------------------------------------------------------------------
*/
function root_Loaded ( plugin, userContext, sender )
{
	agControl = plugin;
	canvas = sender;
  // alert(CROSS_SILVERLIGHT_MAGAZINE_CONFIG_FILE);
  // alert(CROSS_SILVERLIGHT_MAGAZINE_MODULE_PATH);
	// load up some app data
	loadXML ( CROSS_SILVERLIGHT_MAGAZINE_CONFIG_FILE, "appData", createUi );
    
}



/*
-----------------------------------------------------------------------------------------------------------------------
    load some xml into an object
-----------------------------------------------------------------------------------------------------------------------
*/
function loadXML( Url, varName, CallBack, CallBackArgs )
{
	var data = new JKL.ParseXML( Url );
        data.callback_func = CallBack; // callback function
        data.callback_arg  = CallBackArgs; // first argument
	
	    // this actually loads the xml
   	    data.parse();
   	    
   	    this[ varName ] = data;
}

/*
-----------------------------------------------------------------------------------------------------------------------
initialize stuff after UI is loaded
-----------------------------------------------------------------------------------------------------------------------
*/
function createUi( sender, args )
{
    if (agControl)
    {
	    appData = appData.parseResponse();
    	
        loaderStart();

        var playerDl = agControl.createObject( "downloader" );
        playerDl.addEventListener( "completed", loadSpinnerAssets );
       playerDl.open( "GET", CROSS_SILVERLIGHT_MAGAZINE_MODULE_PATH+"xaml/player.xml" );
     
        playerDl.send();
    }
}

//===================================================================================
function loadSpinnerAssets( sender ){

   sectionData = appData.sections;

   var player = agControl.content.createFromXamlDownloader( sender, "" );
   canvas.children.add( player );

    var assetsDl = agControl.createObject( "downloader" );
        assetsDl.addEventListener( "completed", makeSpinner );
        assetsDl.open( "GET", CROSS_SILVERLIGHT_MAGAZINE_MODULE_PATH+"xaml/thumb.xml" );
     
        assetsDl.send();
}   

/*
-----------------------------------------------------------------------------------------------------------------------
    loops the loader
-----------------------------------------------------------------------------------------------------------------------
*/
function loaderLoop( )
{
  //Define customize gallery title,added on 2008/04/14
  var magazineTitle = agControl.content.findName( "progressText" );
  if(magazineTitle!=null)
  {
      magazineTitle.text = CROSS_SILVERLIGHT_MAGAZINE_TITLE;
  }
  
  
    // show current img in png sequence
    var loaderImgName = "ll_" + loaderLoopNo;
    var loaderImg = canvas.findName( loaderImgName );
        loaderImg.opacity = "1";

    // hide prev img in png sequence
    var prevLoaderImgName = ( loaderLoopNo == 0 ) ? "ll_" + loaderLoopCount : "ll_" + ( loaderLoopNo - 1 );
    var prevLoaderImg = agControl.content.findName( prevLoaderImgName );
        prevLoaderImg.opacity = "0";

    loaderLoopNo = ( loaderLoopNo < loaderLoopCount ) ? loaderLoopNo + 1 : 0 ;
    canvas.findName( "load_dot_sb" ).begin();
}

//=======================================================================================
function makeSpinner( sender, eventArgs ){

    // set reference to assets for later
    spinnerAssets = sender;
    
    // get the thumb container
    var thumbCanvas = agControl.content.findName( "Content" );
    
    // get template xaml
    var thumbXaml = sender.getResponseText( "" );//.getResponseText( "thumb.xml" );

    // gather video items
    nTotalItems = sectionData.magazine.length;
   
    for( var cItem = 0; cItem < nTotalItems; cItem ++ )
    {
        var itemNode = sectionData.magazine[ cItem ];
        var mediaInfo = "sectionData.magazine[ " + cItem + " ]";
        var videoName = "th_video_" + cItem;
        var toolTipName = "toolTip" + cItem;
        
        var itemXaml = thumbXaml.replace( 'x:Name="Item"', 'x:Name="Item' + cItem + '"' );
            //alert('spin4');
            itemXaml = itemXaml.replace( 'x:Name="img_item"', 'x:Name="img_item' + cItem + '"' );
            itemXaml = itemXaml.replace( 'x:Name="video"', 'x:Name="video' + cItem + '"' );
            itemXaml = itemXaml.replace( /x:Name="th_video_"/gi, 'x:Name="' + videoName + '"' );
            itemXaml = itemXaml.replace( 'x:Name="ItemScale"', 'x:Name="ItemScale' + cItem + '"' );
            itemXaml = itemXaml.replace( 'Tag="url"', 'Tag="' + mediaInfo + "|" + escape( itemNode.DLurl ) + '"' );
            itemXaml = itemXaml.replace( 'x:Name="toolTip"', 'x:Name="' + toolTipName + '"' );
            itemXaml = itemXaml.replace( 'x:Name="toolTipText"', 'x:Name="toolTipText' + cItem + '"' );
            itemXaml = itemXaml.replace( /Storyboard.TargetName=""/gi, 'Storyboard.TargetName="' + toolTipName + '"' );
            itemXaml = itemXaml.replace( 'x:Name="toolTip_show"', 'x:Name="toolTip' + cItem + '_show"' );
            itemXaml = itemXaml.replace( 'x:Name="toolTip_hide"', 'x:Name="toolTip' + cItem + '_hide"' );
            itemXaml = itemXaml.replace( /videoCover/gi, 'videoCover' + cItem );
        // create the thumb
        var objThis = agControl.content.createFromXaml( itemXaml );
            objThis = thumbCanvas.children.add( objThis );
            objThis = thumbCanvas.children.getItem( objThis );
       
        var imgObj = agControl.content.findName ('img_item' + cItem);
        imgObj.source = itemNode.ThumbnailURL
    }
    
    // set mouse position
    nCurMouseX = 400;
    
    // set up autotrigger item ( pops up once automagically )
    autoTrigger = agControl.content.findName( "Item" + autoTrigger );
    
    spinnerInitted = true;
    updateItems();
    // makePlayer();

}
//=======================================================================================

//=======================================================================================
function updateItems(){
    var nPer = ( nCurMouseX + 240 - nSpinnerWidth ) / nSpinnerWidth;
    nDX += nMaxSpeed*nPer;

    for( var cItem = 0; cItem < nTotalItems; cItem ++ ){
        //---------------------------------------------------------------------
        var objThis = agControl.content.findName("Item" + cItem);
        var nFactor_x = (2 * Math.PI) * (cItem / nTotalItems) + nDX;
        var nFactor_c = (nSpinnerWidth / 2) * Math.cos (nFactor_x);
        var nFactor_s = (nSpinnerHeight / 2) * Math.sin (nFactor_x);
        
        objThis.setValue("Canvas.Left", nFactor_c);
        objThis.setValue("Canvas.Top", nFactor_s); 
        //alert('Left: ' + nFactor_c + ' \nTop: ' + nFactor_s); 
        //---------------------------------------------------------------------
        var nCurZIndex = Math.floor(objThis.getValue("Canvas.Top"));
        objThis.setValue("Canvas.ZIndex", nCurZIndex);
        //---------------------------------------------------------------------
        var nPerY = (objThis.getValue("Canvas.Top")+(nSpinnerHeight/2))/ (nSpinnerHeight);
        var nNewOpacity = nMinOpacity + (nDeltaOpacity*nPerY);
        objThis.setValue("Opacity", nNewOpacity);
        var nCurScale = nMinScale + ((nMaxScale-nMinScale)*nPerY);
        var oCurScale = objThis.findName("ItemScale" + cItem);
        oCurScale.setValue("ScaleX", nCurScale);
        oCurScale.setValue("ScaleY", nCurScale);
        //---------------------------------------------------------------------

    }
    
    if( autoTrigger != undefined && autoTriggerComplete == false )
    {
        if( autoTrigger[ "Canvas.Left" ] > -10 && autoTrigger[ "Canvas.Left" ] < 10 && autoTrigger.opacity > .9 && agControl.content.findName( "home_video_holder" ).visibility == "Visible" )
        {
                
            autoTriggerComplete = true;
            itemRelease( autoTrigger );
        }
        else
        {
            startSpinner();
        } 
    }
    else
    {
        startSpinner();
    }
}
//=======================================================================================

//=======================================================================================
function triggerItem( itemNo )
{
    var item = agControl.content.findName( "Item" + itemNo );
    itemRelease( item );
}
//=======================================================================================

//=======================================================================================
function startSpinner(){
    // hide popup and cover
    agControl.content.findName( "Popup" ).visibility = "Collapsed";
    agControl.content.findName( "ContentCover" ).visibility = "Collapsed";
    
    agControl.content.findName( "spinUpdate" ).stop();
    agControl.content.findName( "spinUpdate" ).begin();
    //timerID = self.setTimeout( "updateItems()", delay )
}
//=======================================================================================
function stopSpinner(){
    var sb = agControl.content.findName( "spinUpdate" );
    if( sb != null )
    {
        sb.stop();
    }
    //clearTimeout(timerID);
}
//=======================================================================================

//=======================================================================================
function itemRollOver(sender, mouseEventArgs){
    if(!fPopupVis){
        stopSpinner();
        
        // set the tooltip text
        setTip( sender );
        
        // show the tooltip
        toggleTip( sender.name, "show" );
        
    }
}//=======================================================================================
function itemRollOut(sender, mouseEventArgs){
    if(!fPopupVis){
        toggleTip( sender.name, "hide" );
        startSpinner();
    }
}
//=======================================================================================
function itemRelease( sender, mouseEventArgs ){
    toggleTip( sender.name, "hide" );
    stopSpinner();
    
    fPopupVis = true;
    var transName = sender.name.replace( "Item", "ItemScale" );
    var trans = agControl.content.findName( transName );
    var vidNode = eval( sender.tag.split( "|" )[ 0 ] );
    
    hiddenSpinner = sender;
    hiddenSpinnerScale = trans.ScaleX * .28;
    hiddenSpinnerX = sender["Canvas.Left"] + 330;
    hiddenSpinnerY = sender["Canvas.Top"] + 150;
    //hiddenSpinner.Visibility = "Collapsed";
    
    var oPopup = agControl.content.findName("Popup");
    var oPopupTrans = agControl.content.findName("PopupScale");
        oPopupTrans.ScaleX = hiddenSpinnerScale;
        oPopupTrans.ScaleY = hiddenSpinnerScale;
        oPopup["Canvas.Left"] = hiddenSpinnerX;
        oPopup["Canvas.Top"] = hiddenSpinnerY;
        oPopup.Visibility = "Visible";
        
    
    // set the text
    setPopupText( vidNode );
    var imgObj = agControl.content.findName ('ImageWindow');
    imgObj.source = vidNode.ThumbnailURL;
    

    agControl.content.findName( "Popup_Open" ).begin();
}
//=======================================================================================
function setPopupText( vidNode )
{
    var controlBg = agControl.content.findName( "vid_controls_bg" );
    
     var titleBlock = agControl.content.findName( "videoTitle" );
    if( vidNode.Title!=null&&vidNode.Title.length>0)//prevent null value
      {
        
         titleBlock.text = vidNode.Title;
      }
      else
      {
         titleBlock.text="";
      }
   
    var descTextBlock = agControl.content.findName( "videoDescTb" );
    var descRun = agControl.content.findName( "videoDesc" );
    if( vidNode.Description!=null&&vidNode.Description.length>0)//prevent null value
      {       
         descRun.text = vidNode.Description;
      }
      else
      {
          descRun.text = "";
      }
        
    var downloadButton = agControl.content.findName( "DownloadButton" );
    
    // empty download url or current user has no rights to download
    if( vidNode.DlURL==null||vidNode.DlURL.length==0 || CROSS_SILVERLIGHT_MAGAZINE_ENABLE_DOWNLOAD==false) 
    {     
       downloadButton.Visibility="Collapsed";
     }
    else     
     {       
        downloadButton.tag = vidNode.DlURL;        
     }
    
   // downloadButton.tag = vidNode.DlURL;
    var viewButton = agControl.content.findName( "ViewButton" );
    viewButton.tag = vidNode.PageNum + '|' + vidNode.ImageFolder;
    // move textblocks to space them out
    descTextBlock[ "Canvas.Top" ] = titleBlock[ "Canvas.Top" ] + titleBlock.actualHeight + 4;
    
    controlBg.height = descTextBlock[ "Canvas.Top" ] + descTextBlock.actualHeight + 10;
        
}

//=======================================================================================
function setTip( sender )
{
        var vidNode = eval( sender.tag.split( "|" )[ 0 ] );
        var toolTipTextName = sender.name.replace( 'Item', 'toolTipText' );
        var toolTipBg = sender.name.replace( 'Item', 'videoCover' );
            toolTipBg = agControl.content.findName( toolTipBg );
        
        var toolTipText = agControl.content.findName( toolTipTextName );
        
       if( vidNode.tooltip!=null&&vidNode.tooltip.length>0)//prevent null value
         {
          toolTipText.text = vidNode.tooltip;
         }
         else
         {
            toolTipText.text = "";
         }
           
            // center the text
            toolTipText["Canvas.Left"] = ( toolTipBg.width - toolTipText.actualWidth ) / 2;
}
//=======================================================================================
function toggleTip( itemName, state )
{
    var toolTipName = itemName.replace( 'Item', 'toolTip' );
    var toolTipSb = agControl.content.findName( toolTipName + "_" + state );
        toolTipSb.stop();
        toolTipSb.begin();
}

/*
-----------------------------------------------------------------------------------------------------------------------
    start the loader
-----------------------------------------------------------------------------------------------------------------------
*/
function loaderStart( )
{
  // start the animations
  canvas.findName( "load_reveal" ).begin();
  canvas.findName( "load_dot_sb" ).begin();
}

//=======================================================================================
function openVideoControls(){
    // cover other buttons
    agControl.content.findName( "ContentCover" ).visibility = "Visible";
    agControl.content.findName( "VideoControls_Open" ).begin();
    
}

/*
-----------------------------------------------------------------------------------------------------------------------
    halt the loader
-----------------------------------------------------------------------------------------------------------------------
*/
function loaderStop( )
{
  // stop the storyboard
  canvas.findName( "load_dot_sb" ).stop();
  
  // hide the loader
  canvas.findName( "load_hide" ).begin();

  // reset png sequence
  /*for( var i=0; i<loaderLoopCount; i++ )
  {
    var loaderImgName = "ll_" + i;
    var loaderImg = canvas.findName( loaderImgName );
        loaderImg.opacity = "0";
  }*/

}

function getMousePos( sender, mouseEventArgs )
{
    nCurMouseX = mouseEventArgs.getPosition(null).x;
}

function textLinkRelease( sender ){
    window.open( sender.tag, '_blank', "location=yes,menubar=yes,toolbar=yes,resizable=yes,scrollbars=yes" );
}

//=======================================================================================
function videoControlRollOver(sender, mouseEventArgs){
    agControl.content.findName(sender.Name + "_MouseEnter").begin();
}
//=======================================================================================
function videoControlRollOut(sender, mouseEventArgs){
    agControl.content.findName(sender.Name + "_MouseLeave").begin ();
}
//=======================================================================================
function closePopup(){
    fPopupVis = false;
    var oPopup = agControl.content.findName("Popup");
    
    // set ending values of storyboard
    agControl.content.findName( "popCloseScaleX" ).value = hiddenSpinnerScale;
    agControl.content.findName( "popCloseScaleY" ).value = hiddenSpinnerScale;
    agControl.content.findName( "popCloseX" ).value = hiddenSpinnerX;
    agControl.content.findName( "popCloseY" ).value = hiddenSpinnerY;
    
    agControl.content.findName("Popup_Close").begin();
    agControl.content.findName("VideoControls_Close").begin();
}
//=======================================================================================
function ViewAction(sender){
    _pagenum = sender.tag.split( "|" )[ 0 ];
    _imagefolder = sender.tag.split( "|" )[ 1 ];
    loaderStop();
    var SB_PlayerCanvas_Close = agControl.content.findName("PlayerCanvas_Close");//.begin();
    //SB_PlayerCanvas_Close.addEventListener("completed", "onCompleteViewMagazine");
    SB_PlayerCanvas_Close.begin();
}

function onCompleteViewMagazine(){
    var magazineDl = agControl.createObject( "downloader" );
        magazineDl.addEventListener( "completed", loadMagazine );
        magazineDl.open( "GET", CROSS_SILVERLIGHT_MAGAZINE_MODULE_PATH+"xaml/scene.xml" );
        
        magazineDl.send();
}

function DownloadAction(sender){
    window.open( sender.tag, '_blank', "location=yes,menubar=yes,toolbar=yes,resizable=yes,scrollbars=yes" );
}

//===================================================================================
function loadMagazine( sender ){
    var mag = agControl.content.findName( "MainCanvas" );
    
    if( mag != undefined ) canvas.children.remove(mag);
    mag = agControl.content.createFromXamlDownloader( sender, "" );
    canvas.children.add( mag );
    var scene = new PageTurn(_pagenum,_imagefolder);
    Silverlight.createDelegate(scene, scene.handleLoad);
    scene.handleLoad(agControl,null,canvas);
}