var active_btn = 'HIW-U.gif';
     var sh_index = 0;

	 function Fader(el, fadeIn)
      {
        var me = this;
        this.el = (typeof(el) == "object")?el:(typeof(el) == "string")?document.getElementById(el):null;
        this.fadeIn = fadeIn;
        this.doFade = doFade;
        this.setOpacity = setOpacity;
        this.showElement = showElement;
        this.opacity = 0;
        
        this.doFade();
        
        function setOpacity()
        {
          if (typeof(this.el.style.opacity) != null) this.el.style.opacity = this.opacity / 100;
          if (typeof(this.el.style.filter) != null) this.el.style.filter = "alpha(opacity=" + this.opacity + ")";
          this.opacity += (this.fadeIn)?1:-1;
        }

        function showElement(show)
        {
          if (this.el && this.el.style) this.el.style.display = (show)?"block":(this.fadeIn)?"block":"none";
        }
        
        function doFade()
        {
                                   
          this.showElement(true);
          if (this.fadeIn)
          {
            this.opacity = 0;
            this.setOpacity();
            
            for (var i=0; i<=100; i++)
            {
              var newFunc = function() { me.setOpacity(); };
              setTimeout(newFunc, 3*i);
            }
          }
          else
          {
            this.opacity = 100;
            this.setOpacity();
            
            for (var i=0; i<=100; i++)
            {
              var newFunc = function() { me.setOpacity(); };
              setTimeout(newFunc, 3*i);
            }
          }
          
          var newFunc = function () { me.showElement(); };
          
          setTimeout(newFunc, 300);
        }
      }

      function fade(obj, fadeIn)
      {
        if (obj) new Fader(obj, fadeIn);
      }

      function fadeIn(objID)
      {
        fade(objID, true);
      }
      
      function fadeOut(objID)
      {
        fade(objID, false);
      }

      function changeImage(el, alt)
      {
          main_image.src = el;
          main_image.alt = alt;
      }

      function hover(btn, el)
      {
          if(active_btn != btn)
          {
          	this.el = (typeof(btn) == "object")?btn:(typeof(btn) == "string")?document.getElementById(btn):null;
          	this.el.src = el;
         }
      }

      function changeActiveBtn(el)
      {
          if(active_btn != '' && active_btn != el)
          {
           	this.el = (typeof(active_btn) == "object")?active_btn:(typeof(active_btn) == "string")?document.getElementById(active_btn):null;
           	this.el.src = '/images/btn/' + active_btn;
          }

          /*
          if(el == 'IMG_UP.gif')
          {
               this.el = (typeof(el) == "object")?el:(typeof(el) == "string")?document.getElementById(el):null;
               this.el.useMap = "#sh_controls";
          }
          else if(active_btn == 'IMG_UP.gif')
          {
               this.el = (typeof(active_btn) == "object")?active_btn:(typeof(active_btn) == "string")?document.getElementById(active_btn):null;
               this.el.useMap = "";
          }
          */

          active_btn = el;
      }

      function nextImage(ar)
      {
           sh_index++;
           main_image.src = sh_array[sh_index%sh_array.length];
      }

      function previousImage(ar)
      {
          sh_index--;
          if(sh_index < 0)
               sh_index = sh_array.length - 1;

          main_image.src = sh_array[sh_index%sh_array.length];
      }

      function onClickBtn(im, alt, btn)
      {
          if(btn == active_btn)
               return;

          var from = '';
          var to = '';
          var white = 'visible';
          var bImage = true;

          switch(btn)
          {
               case 'HIW-U.gif':
                    to = 'main_image';
               break;

               case 'INF-U.gif':
                    to = 'info';
                    bImage = false;
               break;

               case 'SCR-U.gif':
                    to = 'main_image';
               break;

               case '360-U.gif':
                    to = 'main_image';
               break;

               case 'SPC-U.gif':
                    to = 'spec'
                    bImage = false;
               break;

               case 'IMG-U.gif':
                    to = '';
                    white = 'hidden';
                    bImage = false;
               break;

               case 'DLD-U.gif':
                    to = 'downloads';
                    bImage = false;
               break;
          }

          switch(active_btn)
          {
               case 'HIW-U.gif':
                    from = 'main_image';
               break;

               case 'INF-U.gif':
                    from = 'info';
               break;

               case 'SCR-U.gif':
                    from = 'main_image';
               break;

               case '360-U.gif':
                    from = 'main_image';
               break;

               case 'SPC-U.gif':
                    from = 'spec';
               break;

               case 'IMG-U.gif':
                    from = '';
               break;

               case 'DLD-U.gif':
                    from = 'downloads';
               break;
          }

          whiteBg.style.visibility = white;

          fadeOut(document.getElementById(from));

          if(bImage)
          	setTimeout("changeImage('"+im+"', '"+alt+"');", 300);
          else
               setTimeout("setVisibility('"+to+"', 'visible')", 300);

          setTimeout("fadeIn('"+to+"')", 300);

		changeActiveBtn(''+btn);


          if(btn == 'HIW-U.gif')
               main_image.useMap = '#hiw';
          else
               main_image.useMap = '';
      }

      function setVisibility(el, b)
      {
          document.getElementById(el).style.visibility = ''+b;
      }

      function setProductVisible(b)
      {
          mainProduct.style.visibility = ''+b;
      }

      function setDownloadsVisible(b)
      {
          downloads.style.visibility = ''+b;
      }

      function setInfoVisible(b)
      {
          info.style.visibility = ''+b;
      }

      function setSpecVisible(b)
      {
          spec.style.visibility = ''+b;
      }