﻿var home, snacks, promo, heroes, hist, d, w, random;
d = document;
w = window;
random = Math.ceil(Math.random() * 3);

function init()
{
    home = d.getElementById("home_button");
    home.style.cursor = "pointer";
    home.style.borderBottom = "dashed 1px #fffaea";

    if(!home.disabled){
        home.onmouseover = function(){this.src = "images/home_on.gif"; this.style.borderBottom = "dashed 1px #db0c41";}
        home.onmouseout = function(){this.src = "images/home_off.gif"; this.style.borderBottom = "dashed 1px #fffaea";}
    }
    else
    {
        home.style.borderBottom = "dashed 1px #db0c41";
    }
    
    snacks = d.getElementById("snacks_button");
    snacks.style.cursor = "pointer";
    snacks.style.borderBottom = "dashed 1px #fffaea";
        
    if(!snacks.disabled){
        snacks.onmouseover = function(){this.src = "images/snacks_on.gif"; this.style.borderBottom = "dashed 1px #db0c41";}
        snacks.onmouseout = function(){this.src = "images/snacks_off.gif"; this.style.borderBottom = "dashed 1px #fffaea";}
    }
    else
    {
        snacks.style.borderBottom = "dashed 1px #db0c41";
    }
        
    
    heroes = d.getElementById("heroes_button");
    heroes.style.cursor = "pointer";
    heroes.style.borderBottom = "dashed 1px #fffaea";
        
    if(!heroes.disabled){
        heroes.onmouseover = function(){this.src = "images/heroes_on.gif"; this.style.borderBottom = "dashed 1px #db0c41";}
        heroes.onmouseout = function(){this.src = "images/heroes_off.gif"; this.style.borderBottom = "dashed 1px #fffaea";}
    }
    else
    {
        heroes.style.borderBottom = "dashed 1px #db0c41";
    }
    
    hist = d.getElementById("history_button");
    hist.style.cursor = "pointer";
    hist.style.borderBottom = "dashed 1px #fffaea";
    
    if(!hist.disabled){
        hist.onmouseover = function(){this.src = "images/history_on.gif"; this.style.borderBottom = "dashed 1px #db0c41";}
        hist.onmouseout = function(){this.src = "images/history_off.gif"; this.style.borderBottom = "dashed 1px #fffaea";}
    }
    else
    {
        hist.style.borderBottom = "dashed 1px #db0c41";
    }

    newsl = d.getElementById("newsletter_button");
    newsl.style.cursor = "pointer";
    newsl.style.borderBottom = "dashed 1px #fffaea";
    
    if(!newsl.disabled){
        newsl.onmouseover = function(){this.src = "images/newsletter_on.gif"; this.style.borderBottom = "dashed 1px #db0c41";}
        newsl.onmouseout = function(){this.src = "images/newsletter_off.gif"; this.style.borderBottom = "dashed 1px #fffaea";}
    }
    else
    {
        newsl.style.borderBottom = "dashed 1px #db0c41";
    }
}


function setThreePiece(page){
	var breaker;
	if(navigator.userAgent.indexOf("MSIE 6.0") == -1){
		breaker = "<br />";	
	}
	else
	{
		breaker = "";	
	}
    switch(page){
    case "promo":
    d.getElementById("ctl00_threepartdiv1").innerHTML = "<div style='height:43px'><span class='main_text_title'>Exclusive Merchandise<br /></span><span class='main_text_text'>Celebrate your dog with exclusive Milk-Bone&reg; products.<br /></span></div><div class='main_text_link'><a href='merchandise.aspx'>LEARN MORE</a></div></div>";
    d.getElementById("ctl00_threepartdiv2").innerHTML = "<div style='height:43px'><span class='main_text_title'>At the Movies<br /></span><span class='main_text_text'>Watch the new Milk-Bone<sup>&reg;</sup> commercial here.<br /></span></div><div class='main_text_link'><a href='movies.aspx' style='width: 55px'>WATCH IT</a></div></div>";
    break;
    default:
    d.getElementById("ctl00_threepartdiv1").innerHTML = "<span class='main_text_title'>In Theaters Now<br /></span><span><span class='main_text_text'>Before you see it in theaters, watch the new Milk-Bone Screenvision film here.<br /></span><span><a href='#'>LEARN MORE</a></span>";
    break;
    }
}


function merch(){
    w.open("","newpop", "width=500, height=500, resizable=no");
}

function changeinfo(size, onoff){
    switch(size){
    case "small":
        (onoff) ? d.getElementById("sma").innerHTML = "2.25-9kg" : d.getElementById("sma").innerHTML = "Small";
        break;
    case "medium":
        (onoff) ? d.getElementById("med").innerHTML = "9-22.5kg" : d.getElementById("med").innerHTML = "Medium";
        break;
    case "large":
        (onoff) ? d.getElementById("lar").innerHTML = "22.5-45kg" : d.getElementById("lar").innerHTML = "Large";
        break;
    case "xlarge":
        (onoff) ? d.getElementById("xlar").innerHTML = "&nbsp&nbsp&nbsp&nbsp>45kg" : d.getElementById("xlar").innerHTML = "Extra Large";
        break;
    }
    onPageTwo = false;
}

function changesizeBiscuit(size, type){
    iPage = 1;
    loadProducts(type+"_"+size)
    productTitle.innerHTML = "";
    linkArea.innerHTML = "";
    infoArea.innerHTML = "";
    changeRightSide(0);
    onPageTwo = false;
}

//set up readystates and http status codes
var readystate_LOADED = 2;
var readystate_COMPLETE = 4;
var httpstatus_OK = 200;

var xmlhttp; //xmlhttprequest object holder
var products;
var productTitle, infoArea, linkArea, moreThanEight, pageName;

moreThanEight = false;

function loadProducts(urlName, multiProducts, size)
{
    document.getElementById("table_loader").innerHTML = "";

    pageName = urlName;

    if(size){

        if(size == "small")
        {
            d.getElementById("aspnetForm").cDog[0].selected = true
        }
        else if(size == "medium")
        {
            d.getElementById("aspnetForm").cDog[1].selected = true
        }
        else if(size == "large")
        {
            d.getElementById("aspnetForm").cDog[2].selected = true
        }
        else
        {
            d.getElementById("aspnetForm").cDog[3].selected = true
        }
    }

    if(urlName == "chewy") //change chewy background image to show new products
    {
        //document.getElementById("flash_product_slider").style.display = "block";
        //document.getElementById("snack_main").style.backgroundImage = "url('images/products_main_chewy_bg.jpg')";
    }

    productTitle =    d.getElementById("right_pro_title");
    infoArea     = d.getElementById("product_info_area");
    linkArea = d.getElementById("right_links");
    
    xmlhttp=null
    if (window.XMLHttpRequest)
    {
        xmlhttp=new XMLHttpRequest();
    }
    else if (window.ActiveXObject)
    {
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
  
    if (xmlhttp!=null)
    {
        xmlhttp.onreadystatechange=state_Change
        //alert(urlName);
        xmlhttp.open("GET",urlName+".xml",true)
        xmlhttp.send(null)
    }
    else
    {
        alert("Your browser does not support XMLHTTP.")
    }
}


var xmlDoc; 
function state_Change()
{
if (xmlhttp.readyState == readystate_COMPLETE)
  {

   xmlDoc = xmlhttp.responseXML.documentElement;
   
  if (xmlhttp.status == httpstatus_OK)
    {
    products = xmlhttp.responseXML.getElementsByTagName("product").length;
    makeTable();
    }
  else
    {
    alert("Problem retrieving XML data")
    }
  }
changeRightSide(-1); // load first events for the first product
}

var nameArray = new Array();
var descriptionArray = new Array();
var guideArray = new Array();
var ingredArray = new Array();
var infoArray = new Array();
var imageArray = new Array();
var logoArray = new Array();
var finalTableHtml = "";

function makeTable(){
    for (var i = 0; i < products; i++){
        nameArray[i]            = xmlDoc.getElementsByTagName("product")[i].attributes[0].value;

    	if(navigator.appVersion.indexOf("Macin") > -1)
		{
			descriptionArray[i] = xmlDoc.getElementsByTagName("product")[i].childNodes[1].firstChild.nodeValue;
            guideArray[i]       = xmlDoc.getElementsByTagName("product")[i].childNodes[3].firstChild.nodeValue;
            ingredArray[i]      = xmlDoc.getElementsByTagName("product")[i].childNodes[5].firstChild.nodeValue;
            infoArray[i]        = xmlDoc.getElementsByTagName("product")[i].childNodes[7].firstChild.nodeValue;
            imageArray[i]       = xmlDoc.getElementsByTagName("product")[i].childNodes[9].firstChild.nodeValue;
            logoArray[i]       = xmlDoc.getElementsByTagName("product")[i].childNodes[11].firstChild.nodeValue;
		}
        else if(!xmlDoc.getElementsByTagName("product")[0].childNodes[1].textContent)
        {
			descriptionArray[i] = xmlDoc.getElementsByTagName("product")[i].childNodes.item(0).text;
            guideArray[i]       = xmlDoc.getElementsByTagName("product")[i].childNodes.item(1).text;
            ingredArray[i]      = xmlDoc.getElementsByTagName("product")[i].childNodes.item(2).text;
            infoArray[i]        = xmlDoc.getElementsByTagName("product")[i].childNodes.item(3).text;
            imageArray[i]       = xmlDoc.getElementsByTagName("product")[i].childNodes.item(4).text;
            logoArray[i]        = xmlDoc.getElementsByTagName("product")[i].childNodes[5].firstChild.nodeValue;
        }
        else
        {	
            descriptionArray[i] = xmlDoc.getElementsByTagName("product")[i].childNodes[1].firstChild.nodeValue;
            guideArray[i]       = xmlDoc.getElementsByTagName("product")[i].childNodes[3].firstChild.nodeValue;
            ingredArray[i]      = xmlDoc.getElementsByTagName("product")[i].childNodes[5].firstChild.nodeValue;
            infoArray[i]        = xmlDoc.getElementsByTagName("product")[i].childNodes[7].firstChild.nodeValue;
            imageArray[i]       = xmlDoc.getElementsByTagName("product")[i].childNodes[9].firstChild.nodeValue;
            logoArray[i]        = xmlDoc.getElementsByTagName("product")[i].childNodes[11].firstChild.nodeValue;
        }
    }
        finalTableHtml = "";
        finalTableHtml += "<table cellpadding='0' cellspacing='5' border='0' width='220' id='products_grid'><tbody>";
          
        try{
        var realNumber = 1;
            for(var i = 0; i < products; i++)
            {
                if(iPage == 1 && i < 4)
                {
                
                if((i % 2) == 0) {finalTableHtml += "<tr>"} // || ((i+1) != products))
                
                finalTableHtml += "<td valign='top' align='center' width='50%'>";
                
                if((nameArray[i] != undefined) || (nameArray[i] == ""))
                {
                    finalTableHtml += "<a href='#' onclick='changeRightSide("+i+")'><img src='" + imageArray[i] +"' border='0' /></a><span id='prodName_" +i+ "'>" +  nameArray[i] + "</span>";
                }
                else
                {
                    finalTableHtml += "&nbsp;"
                }
          
                finalTableHtml += "</td>";
                
                if(((realNumber % 2) == 0) && (i != 0)){finalTableHtml += "</tr>"} //&& ((i+1) == products)
                
                realNumber++;
                } 
                else if(iPage == 2 && i >= 4)
                {
                if((i % 2) == 0) {finalTableHtml += "<tr>"} // || ((i+1) != products))
                
                finalTableHtml += "<td valign='top' align='center' width='50%'>";
                
                if((nameArray[i] != undefined) || (nameArray[i] == ""))
                {
                    finalTableHtml += "<a href='#' onclick='changeRightSide("+i+")'><img src='" + imageArray[i] +"' border='0' /></a><span id='prodName_" +i+ "'>" +  nameArray[i] + "</span>";
                }
                else
                {
                    finalTableHtml += "&nbsp;"
                }
          
                finalTableHtml += "</td>";
                
                if(((realNumber % 2) == 0) && (i != 0)){finalTableHtml += "</tr>"} //&& ((i+1) == products)
                
                realNumber++;
                } 
            }
            if(products > 4)
            {
                finalTableHtml += "<tr><td valign='bottom' colspan='2'><div style='position:  absolute;left:100;bottom:0;'><table><tr>";
                if(iPage == 2)
                {
                   finalTableHtml += "<td><a href='#' onmouseover='roll('black1', 'Content/canada/images/site/paw1_red.jpg')' onmouseout='roll('black1', 'Content/canada/images/site/paw1_black1.jpg')' onclick='loadOrginal(pageName);'><img name'black1' src='Content/canada/images/site/paw1_black1.jpg' /></a></td>";
                   finalTableHtml += "<td><a href='#'><img name='red2' src='Content/canada/images/site/paw1_red2.jpg' /></a></td>";
                }
                else
                {
                   finalTableHtml += "<td><a href='#'><img name='red1' src='Content/canada/images/site/paw1_red.jpg' /></a></td>";
                   finalTableHtml += "<td><a href='#' onmouseover='roll('black2', 'Content/canada/images/site/paw1_red2.jpg')' onmouseout='roll('black2', 'Content/canada/images/site/paw1_black2.jpg')' onclick='loadMore(pageName)'><img name'black2' src='Content/canada/images/site/paw1_black2.jpg' /></a></td>";
                }
                finalTableHtml += "</tr></table></div></td></tr>";
            }
 /*       
            if(products > 4)
            {
                finalTableHtml += "<tr><td valign='bottom'><div class='pagination'><ul class='page'>";
                if(iPage == 2)
                {
                   finalTableHtml += "<li><a class='nav' href='#' onclick='loadOrginal(pageName);'>1</a></li>";
                   finalTableHtml += "<li class='selected'><a class='nav' href='#'>2</a></li>";
                }
                else
                {
                   finalTableHtml += "<li class='selected'><a class='nav' href='#'>1</a></li>";
                   finalTableHtml += "<li><a class='nav' href='#' onclick='loadMore(pageName)'>2</a></li>";
                }
                finalTableHtml += "</ul></div></td></tr>";
            }

*/
            finalTableHtml += "</tbody></table>";

            document.getElementById("table_loader").innerHTML = finalTableHtml;
        }
        catch(e){
            //alert(e.message);
        }
        ///onmouseover="roll('sub_but', 'movedown.gif') onmouseout="roll('sub_but', 'movetup.gif')
       
}

// <Div align='center'> added by vj, 6-21, to align the product logos.
function setRightSide(){
    productTitle.innerHTML = "<DIV align='center'><img src='"+logoArray[0]+"' alt='"+nameArray[0]+"' /></Div>";
    infoArea.innerHTML = descriptionArray[0];
}


function getDescription (index) {
infoArea.innerHTML = descriptionArray[index]
}
function getGuidelines (index) {
infoArea.innerHTML = guideArray[index]
}
function getIngredients (index) {
infoArea.innerHTML = ingredArray[index]
}
function getNutInfo (index) {
infoArea.innerHTML = infoArray[index]
}

function changeRightSide(index)
{
    if (index > -1)
    {
        productTitle.innerHTML = "";
        linkArea.innerHTML = "";
        if(pageName == "chewy")
        {
            infoArea.innerHTML = "<div style='margin:0 0 0 60px'><img src='images/loading1.gif' /></div>";
        }
        else
        {
            infoArea.innerHTML = "<div style='margin:110px 0 0 60px'><img src='images/loading1.gif' /></div>";
        }
        setTimeout("showLoader2(" + index + ")",1000);
    }
}
function roll(img_name, img_src)
{
   d.getElementsByName(img_name).src = img_src;
}


function goToSnacks(){
var inputs = d.getElementById("form1").size;
var counter = 0;
    for (i = 0; i < inputs.length; i++){
        if(inputs[i].checked){
            window.location.href = "biscuits.aspx?size="+inputs[i].value;
        }
        else{
            counter++;
        }
    }

    if(counter == inputs.length){
        alert("Please select a dog size.");
        return false;
    }

}

var onPageTwo = false;

function loadOrginal(pageName){
    iPage = 1;
    var targetHref;
    if(pageName.indexOf("chew") == 0)
    {
        targetHref = "softchew.aspx"; 
        pageName = pageName.split("_");
        if (pageName.length > 1)
        {
            var sizeVal = pageName[1].split("2");
            size = sizeVal[0];
        }
    }
    else{
        pageName = pageName.split("_");
        targetHref = pageName[0] +".aspx";
        if (pageName.length > 1)
        {
            var sizeVal = pageName[1].split("2");
            size = sizeVal[0];
            targetHref = targetHref + "?size=" + size;
        }
    }
    productTitle.innerHTML = "";
    linkArea.innerHTML = "";
    infoArea.innerHTML = "";
    window.location.href = targetHref; 
    
    onPageTwo = false;
}
var iPage = 1;
function loadMore(pageName){
    iPage = 2;
    if(!onPageTwo){
    productTitle.innerHTML = "";
    linkArea.innerHTML = "";
    infoArea.innerHTML = "";
    loadProducts(pageName, null, "");
    }
    changeRightSide(4);
    onPageTwo = true;
}

function showLoader2 (index) 
{
    if(pageName == "chewy")
    {
        infoArea.innerHTML = "<div style='margin:0 0 0 60px'><img src='images/loading2.gif' /></div>";
    }
    else
    {
        infoArea.innerHTML = "<div style='margin:110px 0 0 60px'><img src='images/loading2.gif' /></div>";
    }
    setTimeout("showData(" + index + ")",1000);
}
    
function showData (index) {
    productTitle.innerHTML = "<img src='"+logoArray[index]+"' alt='"+nameArray[index]+"' />";
    infoArea.innerHTML = descriptionArray[index];


     var linkHtml = "<br /><ul class='product-details'><li><a href='#' id='d_button' onclick='javascript:getDescription(" + index + ")'>DESCRIPTION</a></li>";
	    linkHtml+= "<li><a href='#' id='fg_button' onclick='javascript:getGuidelines(" + index + ")'>FEEDING GUIDELINES</a></li>";
        linkHtml+= "<li><a href='#' id='i_button' onclick='javascript:getIngredients(" + index + ")'>INGREDIENTS</a></li>";
        linkHtml+= "<li><a href='#' id='n_button' onclick='javascript:getNutInfo(" + index + ")'>NUTRITIONAL INFORMATION</a></li></ul>";   

   linkArea.innerHTML = linkHtml;
    for(var i = 0; i < 8; i++) 
    {
        if (d.getElementById("prodName_" + i))
        {
            if (i == index)
            {
            /*Vj, 6-15-09; Set the selected product name bcakground color to red (#db0c41).*/
                d.getElementById("prodName_" + i).style.backgroundColor = "#db0c41";
                //d.getElementById("prodName_" + i).style.backgroundColor = "Black";
                //d.getElementById("prodName_" + i).style.font-weight = "Bold"; //added by vj, 6-15
                d.getElementById("prodName_" + i).style.color = "White";
            }
            else
            {
                d.getElementById("prodName_" + i).style.color = "#898989";
                d.getElementById("prodName_" + i).style.backgroundColor = "Transparent";
            }
        }
    }
    }
