/*//////////////////////////////////////////////////////////////////////////////////////
Script Fader v1.0
*////////////////////////////////////////////////////////////////////////////////////////


  // Default User-Set Variables - Display  (Override in Page to set)
  var intContainer_HighlightNode = 2     // The Array Element to be the Primary Selection Node, Start at 0. (Keep as 2)
  var intContainer_TopBuffer     = 5;    // Inner Buffer in Container Div, Top
  var intContainer_BotBuffer     = 5;    // Inner Buffer in Container Div, Bottom
  var intContainer_LeftBuffer    = 10;   // Inner Buffer in Container Div, Left
  var intImage_Buffer            = 25;   // Buffer Between Images
  var intLabel_YBuffer           = 45;   // Buffer Between Image and Product Name
  var floatImage_Opacity         = 80;   // Default Opacity
  var floatImage_Opacity_Max     = 99;   // Highlighted Opacity
  var floatImage_Opacity_Min     = 60;   // Background Opacity
  var floatIText_Opacity         = 00;   // Default Opacity
  var floatIText_Opacity_Max     = 99;   // Highlighted Opacity
  var floatIText_Opacity_Min     = 00;   // Background Opacity
  var intLabel_Width             = 250;  // Product Name Label Width
  var intLabel_Height            = 45;   // Product Name Label Width
  var boolDisplayLabelCentered   = true; // Sets the Display of the Product Name to be centered over Image.
  var boolDynamicPosition        = false;

  // Developer Defined Variables - Behavior  (Override in Page to set)
  var intFadeDelay               = 25;   // ms Delay between frames  (Suggested 25)
  var intFadeSteps               = 50;   // Numbers of steps in Shift (More = Smoother)  Max suggested 50
    
  // Global Variables - Static (Do Not Adjust)
  var FadeTimer        = "";
  var TextTimer        = "";
  
  // Global Counters (Do Not Adjust)
  var intGlobalFadeIterationCount = 0;

  // Global Derived Variables (These will be reset as appropriate via GenerateCoordinates()

  // Defined Arrays
  arrImageName         = new Array();
  arrLabelName         = new Array();
  arrImageDim_W        = new Array();
  arrImageDim_H        = new Array();
  arrImageLoc_X        = new Array();
  arrImageLoc_Y        = new Array();
  arrITextLoc_X        = new Array();
  arrITextLoc_Y        = new Array();
  arrImgSrc            = new Array();
  arrImgUrl            = new Array();
  arrItemPrdCode       = new Array();
  arrItemName          = new Array();
  arrOpacity           = new Array();
  arrOpacity_Text      = new Array();
  arrProdQtyListName   = new Array();

  // Populate the Derived Array Values for Image Location
  function GenerateCoordinates() {
    // Derived Variables

    for (x=0; x< arrImageName.length; x++) {
      var Img = document.getElementById(arrImageName[x]);
      var intAccumulatedLeftPixels = 0;

      Img.src = arrImgSrc[x];
      if (boolDynamicPosition) { 
        intContainer_Width  = parseInt(document.getElementById("Product_Container").style.width);
        intContainer_Height = parseInt(document.getElementById("Product_Container").style.height);
      }
      else{
        intContainer_Width = 0;
        intContainer_Height = 0;
      }

      arrImageLoc_X.push(Math.round(intContainer_LeftBuffer + GetBuffer(x) + intImage_Buffer * x));
      arrImageLoc_Y.push(Math.round(intContainer_Height - (arrImageDim_H[x] + intContainer_BotBuffer)));
      
      if (boolDisplayLabelCentered) {
        arrITextLoc_X.push(Math.round(arrImageLoc_X[x] - ( intLabel_Width - arrImageDim_W[x]) / 2 ));
        arrITextLoc_Y.push(Math.round(arrImageLoc_Y[x] - intLabel_YBuffer));
      } 
      else {
        arrITextLoc_X.push(Math.round(arrImageLoc_X[x] ));
        arrITextLoc_Y.push(Math.round(arrImageLoc_Y[x] - intLabel_YBuffer));
      }
    }  
  } // GenerateCoordinates()
  
  function GetBuffer(Node) {
    var intGetBuffer = 0;
    for (x=0; x< Node; x++) {
      intGetBuffer += arrImageDim_W[x];
    }
    return intGetBuffer;
  }
  
  /////////////////////////
  // Begin Object Builds //
  function BuildImages() {
    // Derived Variables
    if (boolDynamicPosition) { 
      intContainer_Width  = parseInt(document.getElementById("Product_Container").style.width);
      intContainer_Height = parseInt(document.getElementById("Product_Container").style.height);
    }
    else{
      intContainer_Width = 0;
      intContainer_Height = 0;
    }
    for (x=0; x < arrImageName.length; x++) {

      var Img   = document.getElementById(arrImageName[x]);
      var Lbl   = document.getElementById(arrLabelName[x]);

      Img.src = arrImgSrc[x];
      Img.alt = arrItemName[x];
      Lbl.innerHTML = arrItemName[x];
      
      // Apply Opacity for default Nodes
      SetElementOpacity(arrImageName[x], floatImage_Opacity);
      SetElementOpacity(arrLabelName[x], floatIText_Opacity);
      
      Lbl.style.display = 'inline';
      
      // Set the Positioning
    if (boolDynamicPosition) { 
      Img.style.left   = arrImageLoc_X[x] + 'px';
      Img.style.top    = arrImageLoc_Y[x] + 'px';
      Lbl.style.left   = arrITextLoc_X[x] + 'px';
      Lbl.style.top    = arrITextLoc_Y[x] + 'px';
      Lbl.style.width  = intLabel_Width   + 'px';
      Lbl.style.height = intLabel_Height  + 'px';
    }
    
      if (boolDisplayLabelCentered) {
        Lbl.style.textAlign = 'center';
      }
      else {
        Lbl.style.textAlign = 'left';
      }      
    }
    
    SetOpacity(-1);
    ActivateAllEvents();
  } // BuildImages(pos)

  // End Object Build //
  //////////////////////
       
  //////////////////////////////////////
  // Begin Fade Functionality //
  function FadeIn_0() { FadeIn(0); }
  function FadeIn_1() { FadeIn(1); }
  function FadeIn_2() { FadeIn(2); }
  function FadeIn_3() { FadeIn(3); }
  function FadeIn_4() { FadeIn(4); }
  function FadeOut() { FadeIn(-1); }

  function FadeIn(Node) {
    // Call Fade In
    if (Node >= 0) {
      ResetGlobalFadeCounter();
      clearInterval(FadeTimer);
      FadeTimer = setInterval("FadeElement(" + Node + ")", intFadeDelay);
    }
    else {
      // Reset to default
      ResetGlobalFadeCounter();
      clearInterval(FadeTimer);
      FadeTimer = setInterval("FadeElement(" + Node + ")", intFadeDelay);      
    }
  }
      
  function FadeElement(Node, Finalize) {
    if(intGlobalFadeIterationCount >= intFadeSteps) { 
      clearInterval(FadeTimer);
      ResetGlobalFadeCounter();
      eval(Finalize);
      return; }
    else {
      intGlobalFadeIterationCount++;
      if (Node >= 0) {
        for (x = 0; x < arrImageName.length; x++) {
          if (x == Node) {
            intOpacity_Max = Math.round( arrOpacity[x] + ((floatImage_Opacity_Max - arrOpacity[x]) / intFadeSteps * intGlobalFadeIterationCount) );
            intOpacity_Text_Max = Math.round( arrOpacity_Text[x] + ((floatIText_Opacity_Max - arrOpacity_Text[x]) / intFadeSteps * intGlobalFadeIterationCount) );

            SetElementOpacity(arrImageName[x], intOpacity_Max);
            SetElementOpacity(arrLabelName[x], intOpacity_Text_Max);
            SetOpacity(x, intOpacity_Max, intOpacity_Text_Max)
          }
          else {
            intOpacity_Min = Math.round( arrOpacity[x] + ((floatImage_Opacity_Min - arrOpacity[x]) / intFadeSteps * intGlobalFadeIterationCount) );
            intOpacity_Text_Min = Math.round( arrOpacity_Text[x] + ((floatIText_Opacity_Min - arrOpacity_Text[x]) / intFadeSteps * intGlobalFadeIterationCount) );

            SetElementOpacity(arrImageName[x], intOpacity_Min);
            SetElementOpacity(arrLabelName[x], intOpacity_Text_Min);
            SetOpacity(x, intOpacity_Min, intOpacity_Text_Min)
          }
        }
      }
      else {
        for (x = 0; x < arrImageName.length; x++) {
            intOpacity = Math.round( arrOpacity[x] + ((floatImage_Opacity - arrOpacity[x]) / intFadeSteps * intGlobalFadeIterationCount) );
            intOpacity_Text = Math.round( arrOpacity_Text[x] + ((floatIText_Opacity - arrOpacity_Text[x]) / intFadeSteps * intGlobalFadeIterationCount) );

            SetElementOpacity(arrImageName[x], intOpacity);
            SetElementOpacity(arrLabelName[x], intOpacity_Text);
            SetOpacity(x, intOpacity, intOpacity_Text)
        }
      }        
    }
  }
  // End Popup & Fade Functionality //
  ////////////////////////////////////

  /////////////////////////////////
  // Begin Utility Functionality //
  function SetOpacity(Node, Image_Value, Text_Value) {
    // Clear The List
    while (arrOpacity.length <  arrImageName.length) {
      arrOpacity.push('');
    }

    while (arrOpacity_Text.length <  arrImageName.length) {
      arrOpacity_Text.push('');
    }
    
    if (Node == -1) {
      for (x=0; x < arrImageName.length; x++) {
        arrOpacity[x] = floatImage_Opacity;
        arrOpacity_Text[x] = floatIText_Opacity;
      }
      return;
    }
    
    arrOpacity[Node] = Image_Value;
    arrOpacity_Text[Node] = Text_Value;
  }
  
  function SetElementOpacity(Object, Value) {
    document.getElementById(Object).style.filter = "Alpha(Opacity=" + Value + ")"; // IE
    document.getElementById(Object).style.MozOpacity = Math.min(Value, 99)/100;    // FireFox
    document.getElementById(Object).style.opacity = Math.min(Value, 99)/100;       // Safari & Chrome
  }
  
  function ResetAllQuantities() {
    for (x = 0; x<arrProdQtyListName.length; x++) {
      document.getElementById(arrProdQtyListName[x]).selectedIndex = 0;
    }
  }
  
  function DisableAllEvents() {
    for (x=0; x<arrImageName.length; x++) {
      document.getElementById(arrImageName[x]).onmouseover = '';
      document.getElementById(arrImageName[x]).onmouseout  = '';
      document.getElementById(arrImageName[x]).onclick     = '';
    } 
  }
  
  function ActivateAllEvents() {
    for (x=0; x<arrImageName.length; x++) {
      eval("document.getElementById(arrImageName[" + x + "]).onmouseover = FadeIn_" + x);
      eval("document.getElementById(arrImageName[" + x + "]).onmouseout = FadeOut");
      eval("document.getElementById(arrImageName[" + x + "]).onclick = NavigateToProduct_" + x);

      eval("document.getElementById(arrLabelName[" + x + "]).onmouseover = FadeIn_" + x);
      eval("document.getElementById(arrLabelName[" + x + "]).onmouseout = FadeOut");
      eval("document.getElementById(arrLabelName[" + x + "]).onclick = NavigateToProduct_" + x);

    }
    document.getElementById(arrImageName[intContainer_HighlightNode]).focus();
  }

  function NavigateToProduct_0() { NavigateToProduct(0); }
  function NavigateToProduct_1() { NavigateToProduct(1); }
  function NavigateToProduct_2() { NavigateToProduct(2); }
  function NavigateToProduct_3() { NavigateToProduct(3); }
  function NavigateToProduct_4() { NavigateToProduct(4); }

  function NavigateToProduct(Node) {
    location.href = arrImgUrl[Node];
  }
    
  function ResetGlobalFadeCounter() {
    intGlobalFadeIterationCount = 0;
  }  
  // End Utility Functionality //
  ///////////////////////////////
