/**************************************

Controls Tutorial videos.

***************************************/

// Flash demo variables.
var g_flashFiles = new Array(2);
g_flashFiles[0] = 'tutorial1_overview.swf';
g_flashFiles[1] = 'tutorial2_handprint.swf';

var g_flashFilesLarge = new Array(2);
g_flashFilesLarge[0] = 'tutorial1_overview_large.swf';
g_flashFilesLarge[1] = 'tutorial2_handprint_large.swf';

var g_tutorialTitles = new Array(2);
g_tutorialTitles[0] = '1 : Overview';
g_tutorialTitles[1] = '2 : Handprint';

var g_curTutorialNumber = 0;
var g_size = 'auto';

var g_nextEnabled = true;
var g_prevEnabled = false;

var g_prevOnMouseOver = "MM_swapImage('demoWindow_prev','','/Controls/images/rollovers/button_prev-over.gif',1)";
var g_nextOnMouseOver = "MM_swapImage('demoWindow_next','','/Controls/images/rollovers/button_next-over.gif',1)";

// Shows the correct resolution of the flash file.
function ShowTutorial(tutorialNumber, size)
{
    // Update current.
    if (tutorialNumber >= g_flashFiles.length) {
        tutorialNumber = g_flashFiles.length - 1;
       }
    
    g_curTutorialNumber = tutorialNumber;
    g_size = size;
    
    RefreshTutorialButtons();
        
    // Get requested g_size.
    switch (g_size) {
        case 'small': {
            isLarge = false;
            break;
           }
        
        case 'large': {
            isLarge = true;
            break;            
           }
        
        // Get 'auto' g_size.
        default: {
            isLarge = GetScreenWidth() > 1000;
            break;
           }
    }
    
    // Switch radio buttons to correct value.
    var radioId = 'sizeSmallRadioButton';
    if (isLarge) {
        radioId = 'sizeLargeRadioButton';
       }
    document.getElementById(radioId).checked = true;     
    
    // Set small values by default.
    var width = 720;
    var height = 425;
    
    // If the resolution width is higher than 1000, show larger flash video.
    if (isLarge) {
        width = 1000;
        height = 600;
    }
    
    // Get correct tutorial movie file.
    var folder = "media/";
    var tutorial = folder;

    if (isLarge) {
        tutorial += g_flashFilesLarge[tutorialNumber];
       }
    else {
        tutorial += g_flashFiles[tutorialNumber];
       }
        
    // Set tutorial title.
    document.getElementById('tutorialTitle').innerHTML = g_tutorialTitles[tutorialNumber];
     
    // Update flash object.   
    getFlashMovieObject('embedflashMovie').LoadMovie(0, tutorial);
    getFlashMovieObject('embedflashMovie').width = width;
    getFlashMovieObject('embedflashMovie').height = height;
}

// Goes to the next tutorial.
function NextTutorial()
{    
    if (g_curTutorialNumber + 1 < g_flashFiles.length) {
        g_nextEnabled = true;
        g_prevEnabled = true;
        ++g_curTutorialNumber;
        ShowTutorial(g_curTutorialNumber, g_size);
        
        if (g_curTutorialNumber + 1 == g_flashFiles.length) {
            g_nextEnabled = false;
           }
    }        
    
    RefreshTutorialButtons('next');
    
    return false;
}

// Goes to the previous tutorial.
function PrevTutorial()
{  
    if (g_curTutorialNumber > 0) {
        g_prevEnabled = true;
        g_nextEnabled = true;
        --g_curTutorialNumber;
        ShowTutorial(g_curTutorialNumber, g_size);
        
        if (g_curTutorialNumber == 0) {
            g_prevEnabled = false;
           }
    }    
    
    RefreshTutorialButtons('prev');
        
    return false;
}

// Restarts the current tutorial.
function RestartTutorial()
{
    document.getElementById('playOrPauseCell').innerHTML = '<a href="#FlashTop" onclick="return PlayOrPauseTutorial();" onmouseover="changeImages(\'playorpause\', \'pauseOn\')" onmouseout="changeImages(\'playorpause\', \'pauseOff\')"><img src="/Controls/images/rollovers/button_pause.gif" name="playorpause" width="39" height="23" border="0" id="playorpause"></a>';
    document.getElementById('playOrPauseSpan').innerHTML = 'Pause';
    getFlashMovieObject('embedflashMovie').Rewind();
    getFlashMovieObject('embedflashMovie').Play();
    return false;
}

pauseOn = new Image();
pauseOn.src = '/Controls/images/rollovers/button_pause-over.gif';
pauseOff = new Image();
pauseOff.src = '/Controls/images/rollovers/button_pause.gif';
playOn = new Image();
playOn.src = '/Controls/images/rollovers/button_play-over.gif';
playOff = new Image();
playOff.src = '/Controls/images/rollovers/button_play.gif';  

function changeImages(imgName,img) 
{
    if (document.images)  {
       document[imgName].src = eval(img + ".src");
    }
    return false;    
}

// Play Or Pause the current tutorial.
function PlayOrPauseTutorial()
{
    if(getFlashMovieObject('embedflashMovie').IsPlaying()) {
        document.getElementById('playOrPauseCell').innerHTML = '<a href="#FlashTop" onclick="return PlayOrPauseTutorial();" onmouseover="changeImages(\'playorpause\', \'playOn\')" onmouseout="changeImages(\'playorpause\', \'playOff\')"><img src="/Controls/images/rollovers/button_play.gif" name="playorpause" width="39" height="23" border="0" id="playorpause"></a>';
        document.getElementById('playOrPauseSpan').innerHTML = 'Play';    
        getFlashMovieObject('embedflashMovie').StopPlay();        
    }
    else {
        document.getElementById('playOrPauseCell').innerHTML = '<a href="#FlashTop" onclick="return PlayOrPauseTutorial();" onmouseover="changeImages(\'playorpause\', \'pauseOn\')" onmouseout="changeImages(\'playorpause\', \'pauseOff\')"><img src="/Controls/images/rollovers/button_pause.gif" name="playorpause" width="39" height="23" border="0" id="playorpause"></a>';
        document.getElementById('playOrPauseSpan').innerHTML = 'Pause';            
        getFlashMovieObject('embedflashMovie').Play();       
    }
    return false;
}

// Changes the size of the current video.
function ChangeSize(size)
{
    ShowTutorial(g_curTutorialNumber, size);
    
    ScrollToTop();
}

// Goes to the top of the flash video.
function ScrollToTop()
{
    document.location = "#FlashTop";
}

// Refreshes previous and next image buttons.
function RefreshTutorialButtons(type)
{
    document.getElementById('playOrPauseCell').innerHTML = '<a href="#FlashTop" onclick="return PlayOrPauseTutorial();" onmouseover="changeImages(\'playorpause\', \'pauseOn\')" onmouseout="changeImages(\'playorpause\', \'pauseOff\')"><img src="/Controls/images/rollovers/button_pause.gif" name="playorpause" width="39" height="23" border="0" id="playorpause"></a>';
    document.getElementById('playOrPauseSpan').innerHTML = 'Pause';
    
    // Maintain over states.
    if (type == 'next') {
        TutorialMouseOut('tutorialWindow_prev');
        TutorialMouseOver('tutorialWindow_next');
    }
    else if (type == 'prev') {
        TutorialMouseOver('tutorialWindow_prev');
        TutorialMouseOut('tutorialWindow_next');
    }  
    else
    { g_prevEnabled = true;
        g_nextEnabled = true;
        
        if (g_curTutorialNumber == 0) {
            g_prevEnabled = false;
           }
        else if (g_curTutorialNumber + 1 == g_flashFiles.length) {
            g_nextEnabled = false; 
           }
        
        TutorialMouseOut('tutorialWindow_prev');
        TutorialMouseOut('tutorialWindow_next');    
    }  
}

// Performs mouse over for previous tutorial button, shows enabled or disabled.
function TutorialMouseOut(elementId)
{
    if (elementId == 'tutorialWindow_prev') {
        if (g_prevEnabled) {
            document.getElementById(elementId).src = '/Controls/images/rollovers/button_prev.gif';
           }
        else {
            document.getElementById(elementId).src = '/Controls/images/rollovers/button_prev-disabled.gif';
           }
    }
    else if (elementId == 'tutorialWindow_next') {
        if (g_nextEnabled) {
            document.getElementById(elementId).src = '/Controls/images/rollovers/button_next.gif';
           }
        else {
            document.getElementById(elementId).src = '/Controls/images/rollovers/button_next-disabled.gif';
           }
    }
}

// Performs mouse over for previous tutorial button, shows enabled or disabled.
function TutorialMouseOver(elementId)
{
    if (elementId == 'tutorialWindow_prev') {
        if (g_prevEnabled) {
            document.getElementById(elementId).src = '/Controls/images/rollovers/button_prev-over.gif';
           }
        else {
            document.getElementById(elementId).src = '/Controls/images/rollovers/button_prev-disabled.gif';
           }
    }
    else if (elementId == 'tutorialWindow_next') {
        if (g_nextEnabled) {
            document.getElementById(elementId).src = '/Controls/images/rollovers/button_next-over.gif';
           }
        else {
            document.getElementById(elementId).src = '/Controls/images/rollovers/button_next-disabled.gif';
           }
    }
}

// Gets the current screen width (resolution).
function GetScreenWidth()
{
    var width = 0;
    if (document.body.clientWidth != null)  {
        width = document.body.clientWidth;
       }
    if (window.outerWidth != null) {
        width = window.outerWidth;
       }
    return width;
}

// Gets a flash movie object accross browsers.
function getFlashMovieObject(movieName)
{
  var flashMovie = null;
  if (window.document[movieName])  {
      flashMovie = window.document[movieName];
  }
  else if (document.embeds && document.embeds[movieName]) {
      flashMovie = document.embeds[movieName]; 
  }
  else {
      var movieNameOnly = movieName.replace("embed", "");
      flashMovie = document.getElementById(movieNameOnly);
  }
  
  return flashMovie;
}