﻿// JScript File


var brand_bgi = -1;
var frontbg=false;
var brandbg_loaded_counter = 0;


function close_brand_pgframe()
{
    document.getElementById('home_brand_pg_frame').style.display='none';
}

function click_brandmenu(i)
{
    go_promopg(brand_catpg[i]);
}

function go_promopg(promoid)
{
    document.getElementById('home_brand_pg_frame').style.display='';
    ajax_loadcontent("home_brand_pg_frame","get_promopg.aspx?id="+promoid);    
}

function go_listpg(catid)
{
    document.getElementById('home_brand_pg_frame').style.display='';
    ajax_loadcontent("home_brand_pg_frame","get_brandlist.aspx?id="+catid);
}

function mouseover_brandmenu(i)
{
    for (var j=1; j<=5; j++) document.getElementById('menudrop'+j).style.display='none'; 
    var dropitem = document.getElementById('menudrop'+i);
    dropitem.style.display='';    
}

function brandbg_loaded()
{
    brandbg_loaded_counter ++;
    //alert(brandbg_loaded_counter+" bg loaded");
    if (brandbg_loaded_counter >= brand_bg.length) //all bg loaded
    {
        //alert('start rotate');
        //background
        rotate_brandbg();
        setInterval ( "rotate_brandbg()", 6000 );    
        
        //hide loading flash
        document.getElementById('home_brand_loading').style.display="none";   
        
        //load drop video
        load_dropmedia(true);
    }
}

function rotate_brandbg()
{
    brand_bgi++;
    if (brand_bgi<0) brand_bgi=0;
    if (brand_bgi >= brand_bg.length) brand_bgi=0;
    //document.getElementById('home_brand').style.background="black url('brand/webphotos/"+brand_bg[brand_bgi]+"')";
    var dm = domain_image;
    if (brand_bgi%2>0) dm=domain_flv;
    if (frontbg)
    {    
        document.getElementById('back_bg').style.background="black url('"+dm+lang_dir+"/brand/webphotos/"+brand_bg[brand_bgi]+"')";
        document.getElementById('home_brand_backbg_caption').innerHTML = brand_bgc[brand_bgi];   
    }
    else
    {
        document.getElementById('front_bg').style.background="black url('"+dm+lang_dir+"/brand/webphotos/"+brand_bg[brand_bgi]+"')";
        document.getElementById('home_brand_frontbg_caption').innerHTML = brand_bgc[brand_bgi];   
    }
    
    fronttoback(''); 
}

function load_dropmedia(flvonly)
{
    for (var i=1; i<=5; i++)
    {
        var drpdiv = document.getElementById('menudropmedia'+i);
        var media = document.getElementById('menudropmediasrc'+i).innerHTML;
        if (flvonly && media.substr(media.length-3).toLowerCase()=="flv")
            drpdiv.innerHTML=WriteFlashStr('brand/images/drop_player.swf','flvpath='+domain_flv+lang_dir+'/brand/webphotos/'+media,132,87);
        if (!flvonly && media.substr(media.length-3).toLowerCase()!="flv")
            drpdiv.innerHTML="<img src='"+domain_image+lang_dir+"/brand/webphotos/"+media+"' border='0' />";
    }
}

function fronttoback(backimg)
{
    var timef=1;
    var astep = 0.1;
    
    var frontbgdiv = document.getElementById('front_bg');
    var backbgdiv = document.getElementById('back_bg');
    
    if (!frontbg)
    {
        frontbgdiv = document.getElementById('back_bg');    
        backbgdiv = document.getElementById('front_bg');
    }
    
    
    //if (backbgdiv.style.background!=="url('"+backimg+"')")
    //    backbgdiv.style.background="url('"+backimg+"')";    
    //alert('hello');
    var fronta  = parseFloat(frontbgdiv.style.opacity);            
    var backa = parseFloat(backbgdiv.style.opacity);    
    if (isNaN(fronta)||isNaN(backa))
    {
        fronta=1.0;
        backa=0;
    }    
    
    fronta = fronta-astep;
    backa = backa+astep;
    
    if (backa>1) backa=1; 
    if (backa<0) backa = 0;
    if (fronta>1) fronta=1;
    if (fronta <0) fronta = 0;
   
    
    frontbgdiv.style.filter="alpha(opacity="+fronta*100+")";
    frontbgdiv.style.opacity=fronta;
    
    backbgdiv.style.filter="alpha(opacity="+backa*100+")";
    backbgdiv.style.opacity=backa;    
    
    if (backa<1 || fronta >0)
        bgtimer = setTimeout("fronttoback('"+backimg+"');",timef);
    else
        frontbg = !frontbg;
}

var bgimgarr = new Array();

function setup_brand()
{

   
    //top menu
    var maxtitleh = 0;
    for (var i=1; i<=5; i++) 
    {
        var h = document.getElementById('menutitle'+i).offsetHeight;
        if (h>maxtitleh) maxtitleh = h;
        var dropbg = document.getElementById('menudropbg'+i);
        var drop = document.getElementById('menudrop'+i);
        var dropbgh = drop.offsetHeight+h-87;
        drop.style.display="none";
        var dropbgmidh = dropbgh-9-5;
        
        dropbg.style.top='-'+h+'px';
        dropbg.style.height=dropbgh+'px';
        
        //alert('menudropbgmid'+i+' = '+document.getElementById('menudropbgmid'+i));
        document.getElementById('menudropbgmid'+i).style.height=dropbgmidh+'px';
        //alert(document.getElementById('menudropbgmid'+i).style.height);
    }
    document.getElementById('home_brand_menu_bg_top').style.height=maxtitleh+'px';
    document.getElementById('home_brand_menu_bg_bottom').style.top=maxtitleh+'px';                    
     
    //load background images
    
    for (var j=0; j<brand_bg.length; j++)
    {
        bgimgarr[j] = new Image();
        if (j%2==0)
            bgimgarr[j].src=domain_image+lang_dir+'/brand/webphotos/'+brand_bg[j];
        else
            bgimgarr[j].src=domain_flv+lang_dir+'/brand/webphotos/'+brand_bg[j];
        bgimgarr[j].onload = brandbg_loaded;        
    }   
            
    //load drop image
    load_dropmedia(false);
    
    //correct png
    correctPNG();   
    
    if (jump_promo!=null && jump_promo && jump_id!=null && jump_id) go_promopg(jump_id);     
    if (jump_listing!=null && jump_listing && jump_id!=null && jump_id) go_listpg(jump_id);    
          
    
}

function setup_paging()
{
    if (document.getElementById("home_brand_pg_content_holder").offsetHeight >= document.getElementById("home_brand_pg_content").offsetHeight)
        document.getElementById("home_brand_pg_scrollbar").style.display="none";
    else
        document.getElementById("home_brand_pg_scrollbar").style.display="";
}

function setupbrandlist()
{
        var brandlistlayer=document.getElementById("brand_list_layer");
        var width = 0;
        var colw = 0;
        var coldiv;
        var branditem;
        var itemw = 0;
        for(i = 0; i < brandlistlayer.childNodes.length; i++)                
        {
            if(brandlistlayer.childNodes[i].nodeName == 'DIV')
            {      
                coldiv = brandlistlayer.childNodes[i];           
                
                if (coldiv.className!="brand_column_separator")
                {
                    itemw = 0;
                    colw = 0;
                    for(j = 0; j < coldiv.childNodes.length; j++)
                    {
                        if(coldiv.childNodes[j].nodeName == 'DIV')
                        {                                     
                            branditem = coldiv.childNodes[j];  
                            itemw = parseInt(branditem.offsetWidth);
                            //alert(branditem.innerHTML+" : "+itemw);
                            branditem.style.width=itemw+"px";
                        }
                    } 
                    colw = parseInt(coldiv.offsetWidth);                                                                 
                    //alert(colw);
                    brandlistlayer.childNodes[i].style.width=colw+"px";
                    width = width + colw;
                }
                else width = width +21;
            }
        }
        brandlistlayer.style.width=width+"px";
        if (width>document.getElementById("brand_list_holder").offsetWidth) 
            document.getElementById("brand_list_scrollbar").style.display="";
        else
            document.getElementById("brand_list_scrollbar").style.display="none";
        //scroller.init;
        scroller.reset;
}



    
    function scroll_down_brandpg()
    {
        var contentlayer =document.getElementById("home_brand_pg_content");
        var contenty= parseInt(contentlayer.style.top);
        var contenth= contentlayer.offsetHeight;
        var containerh = document.getElementById("home_brand_pg_content_holder").offsetHeight;
        
        var stepsize=20; //pixel
                               
        var downlimit = contenth-containerh;                                                              
        if (Math.abs(contenty)<downlimit)
        {
            contenty=contenty-stepsize;
            downlimit = contenth-containerh;                                                              
            if (contenty<-1*(downlimit)) contenty = -1*(downlimit);
            contentlayer.style.top = contenty+"px";            
        }      
    }
    
    function scroll_up_brandpg()
    {
        var contentlayer =document.getElementById("home_brand_pg_content");
        var contenty= parseInt(contentlayer.style.top);
        
        var stepsize=20; //pixel
                                      
        if (contenty<0)
        {
            contenty=contenty+stepsize;
            if (contenty>0) contenty=0;
            contentlayer.style.top = contenty+"px";            
        }        
    }   

/**************************************** HORIZONTAL IMAGE SCROLL BAR ***********************************************/    

//We wrap all the code in an object so that it doesn't interfere with any other code
    var scroller = {
      init:   function() {

        //collect the variables
        scroller.docW = document.getElementById("brand_list_layer").offsetWidth;
        scroller.contW = document.getElementById("brand_list_holder").offsetWidth;
        scroller.scrollAreaH = document.getElementById("brand_list_scroll_area").offsetWidth;
          
        //calculate height of scroller and resize the scroller div
        //(however, we make sure that it isn't to small for long pages)
        scroller.scrollW = (scroller.contW * scroller.scrollAreaH) / scroller.docW;
        document.getElementById("brand_list_scroller").style.width = Math.round(scroller.scrollW) + "px";
        
        //what is the effective scroll distance once the scoller's height has been taken into account
        scroller.scrollDist = Math.round(scroller.scrollAreaH-scroller.scrollW);
        
        //make the scroller div draggable
        Drag.init(document.getElementById("brand_list_scroller"),null,-1,scroller.scrollDist,0,0);
        
        //add ondrag function
        document.getElementById("brand_list_scroller").onDrag = function (x,y) {
          var scrollX = parseInt(document.getElementById("brand_list_scroller").style.left);
          var docX = 0 - (scrollX * (scroller.docW - scroller.contW) / scroller.scrollDist);
          var contentlayer =document.getElementById("brand_list_layer");
          contentlayer.style.left = docX + "px";
        }          

        //hide the scroll bar if no scrolling        
        if (scroller.scrollDist<=0)
            document.getElementById("brand_list_scrollbar").style.display="none";
        else
            document.getElementById("brand_list_scrollbar").style.display="";
      },
      
      reset: function () {
        //collect the variables
        scroller.docW = document.getElementById("brand_list_layer").offsetWidth;
        scroller.contW = document.getElementById("brand_list_holder").offsetWidth;
        scroller.scrollAreaH = document.getElementById("brand_list_scroll_area").offsetWidth;
          
        //calculate height of scroller and resize the scroller div
        //(however, we make sure that it isn't to small for long pages)
        scroller.scrollW = (scroller.contW * scroller.scrollAreaH) / scroller.docW;
        document.getElementById("brand_list_scroller").style.width = Math.round(scroller.scrollW) + "px";
        
        //what is the effective scroll distance once the scoller's height has been taken into account
        //scroller.scrollDist = Math.round(scroller.scrollAreaH-scroller.scrollW);
        
        //make the scroller div draggable
        Drag.init(document.getElementById("brand_list_scroller"),null,0,0,-1,scroller.scrollDist);

        //hide the scroll bar if no scrolling
        
        if (scroller.scrollDist<=0)
            document.getElementById("home_passage_scrollbar").style.display="none";
        else
            document.getElementById("home_passage_scrollbar").style.display="";      
      },       
      
      stepup: function () {
        var contentlayer =document.getElementById("brand_list_layer");
        var handler=document.getElementById("brand_list_scroller");
        var contenty= parseInt(contentlayer.style.left);
        var handlery = parseInt(handler.style.left);
        
        var stepsize=60; //pixel
        
        if (contenty<0)
        {
            contenty=contenty+stepsize;
            contentlayer.style.left = contenty+"px";            
        }
        
        if (handlery>0)
        {
            var handlerstep = stepsize * scroller.scrollDist / (scroller.docW - scroller.contW);
            handlery = handlery-handlerstep;
            if (handlery<0) handlery=0;
            handler.style.left = handlery+"px";
        }      
      },
      
      stepdown: function() {
        var contentlayer =document.getElementById("brand_list_layer");
        var handler=document.getElementById("brand_list_scroller");
        var contentx= parseInt(contentlayer.style.left);
        var handlerx = parseInt(handler.style.left);
        
        var stepsize=60; //pixel
        
        if (Math.abs(contentx)<(scroller.docW-scroller.contW))
        {
            contentx=contentx-stepsize;
            contentlayer.style.left = contentx+"px";            
            var handlerstep = stepsize * scroller.scrollDist / (scroller.docW - scroller.contW);
            handlerx = handlerx+handlerstep;
            if (handlerx<0) handlerx=0;
            handler.style.left = handlerx+"px";
        }      
        else
            handler.style.left= scroller.scrollDist+"px";
      }
    }     

    //onload = scroller.init;
    
/**************************************** END OF IMAGE SCROLL BAR ***********************************************/  


      

/**************************************** GENERAL ***********************************************/  
function correctPNG() // correctly handle PNG transparency in Win IE 5.5 & 6.
{
   var arVersion = navigator.appVersion.split("MSIE")
   var version = parseFloat(arVersion[1])
   if ((version >= 5.5 && version < 7) && (document.body.filters)) 
   {
      for(var i=0; i<document.images.length; i++)
      {
         var img = document.images[i]
         var imgName = img.src.toUpperCase()
         if ((imgName.substring(imgName.length-3, imgName.length) == "PNG"))
         {
            var imgID = (img.id) ? "id='" + img.id + "' " : ""
            var imgClass = (img.className) ? "class='" + img.className + "' " : ""
            var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
            var imgStyle = "display:inline-block;" + img.style.cssText 
            if (img.align == "left") imgStyle = "float:left;" + imgStyle
            if (img.align == "right") imgStyle = "float:right;" + imgStyle
            if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
            var strNewHTML = "<span " + imgID + imgClass + imgTitle
            + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
            + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
            + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>" 
            img.outerHTML = strNewHTML
            i = i-1
         }
      }
   }    
}

//ajax
function GetXmlHttpObject()
{
  var xmlHttp=null;
  try { // Firefox, Opera 8.0+, Safari
    xmlHttp=new XMLHttpRequest(); }
  catch (e) { // Internet Explorer
    try { //ie6
      xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); }
    catch (e) {        
      xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); }
      
  }
  return xmlHttp;
}

function stateChanged(ajaxelement, xmlhttp) 
{ 
  //ie6 readyState undefine --> change this to xmlhttp in ajax_loadcontent
  //alert(xmlhttp.readyState); 

  if (xmlhttp.readyState==4)
  {
    ajaxelement.innerHTML=xmlhttp.responseText;
    if (document.getElementById('home_brand_pg_content_holder')!=null) { setup_paging(); correctPNG(); trackbrandpg(); };    
    if (document.getElementById('brand_list_holder')!=null)  { setupbrandlist();    scroller.init(); correctPNG(); tracklistpg(); }
  }
}
function ajax_loadcontent(contentdivid,contentfile)
{
  var xmlhttp=GetXmlHttpObject();
  var ajaxelement = document.getElementById(contentdivid);  
  var loading =  document.getElementById(contentdivid+"_loading");  
  if (loading!=null)
    ajaxelement.innerHTML = loading.innerHTML;
  xmlhttp.onreadystatechange=function() { stateChanged(ajaxelement,xmlhttp); }
  xmlhttp.open("GET",contentfile,true);
  xmlhttp.send(null);
}

//end-of-ajax

function trackbrandpg()
{
    trackEvent(geturl(window.location)+'?jppid='+document.getElementById('home_brand_pg_id').innerHTML+'&title='+document.getElementById('home_brand_pg_title').innerHTML);
}

function tracklistpg()
{
    trackEvent(geturl(window.location)+'?jpcid='+document.getElementById('home_brand_cat_id').innerHTML+'&title='+document.getElementById('home_barnd_pg_header_txt').innerHTML);
}

onload=setup_brand;
