// variables
var itemFlag = false, detailWindowFlag = false;
var circular = null, detailWindow = null, hoverItem = null;
var terminationDate = null;
var storeID = null;
// end variables










// ajax functions
function populateForm(simpleCircularPageID, pageWidth, tempTerminationDate, tempStoreID) {
    terminationDate = tempTerminationDate;
    storeID = tempStoreID;

    var xmlHTTP = getXMLHTTPObject();
    if (!xmlHTTP) {return;}
    
    xmlHTTP.onreadystatechange=function() {
        if (xmlHTTP.readyState==4) {
            var responseText = xmlHTTP.responseText;
            
            if (responseText.length > 0) {
                responseText = responseText.substr(11);
                responseText = responseText.substring(0, responseText.length - 12);
            }
            
            responseArray = responseText.split("</highlight><highlight>");
            
            for (j = 0; j != responseArray.length; j++) {
                var response = responseArray[j];
                
                var left = new Number(response.substring(response.indexOf("<left>") + 6, response.indexOf("</left>")));
                var top = new Number(response.substring(response.indexOf("<top>") + 5, response.indexOf("</top>")));
                var width = new Number(response.substring(response.indexOf("<width>") + 7, response.indexOf("</width>")));
                var height = new Number(response.substring(response.indexOf("<height>") + 8, response.indexOf("</height>")));
                var categorizedFlag = new Number(response.substring(response.indexOf("<categorized>") + 13, response.indexOf("</categorized>")));
                var data = response.substr(response.indexOf("</height>") + 9);
                
                addRectangle(j, left, top, width, height, data);
            }
        }
    }

    var date = new Date();
    var timestamp = date.getTime();

    xmlHTTP.open("GET", "/circular/clickablepopulate.jsp?simpleCircularPageID=" + simpleCircularPageID + "&pageWidth=" + pageWidth + "&time=" + timestamp, true);
    xmlHTTP.send(null);
}

function viewMoreRecipes(keywords, start) {
    var xmlHTTP = getXMLHTTPObject();
    if (!xmlHTTP) {return;}

    var queryString = "";
    
    if (keywords != null) {
        keywords = keywords.replace(/%/g, '%25');
        keywords = keywords.replace(/&/g, '%26');
        queryString += "keyword=" + keywords;
    }

    if (start != null) {
        if (queryString != "") {queryString += "&";}
        queryString += "start=" + start;
    }

    var tempQueryString = queryString;
    if (tempQueryString != "") {tempQueryString = "?" + tempQueryString;}

    xmlHTTP.onreadystatechange=function() {
        if (xmlHTTP.readyState==4) {
            closeDetailWindow();
            
            var previousPage = document.getElementById("previousPage");
            if (previousPage != null) {previousPage.style.visibility = "hidden";}
            var nextPage = document.getElementById("nextPage");
            if (nextPage != null) {nextPage.style.visibility = "hidden";}
            
            document.getElementById("recipeWindow").innerHTML = xmlHTTP.responseText;
            document.getElementById("blackoutWindow").style.visibility = "visible";
            document.getElementById("recipeWindow").style.visibility = "visible";
            
            try {                
                pageTracker._trackPageview("/circular/clickablerecipes.jsp" + tempQueryString);
            } catch(err) {}      
        }
    }

    var date = new Date();
    var timestamp = date.getTime();

    if (queryString != "") {queryString = "?" + queryString + "&time=" + timestamp;} else {queryString = "?time=" + timestamp;}

    xmlHTTP.open("GET", "/circular/clickablerecipes.jsp" + queryString, true);
    xmlHTTP.send(null);
}

function showRecipeDetails(recipeID, hideBackButton) {
    var xmlHTTP = getXMLHTTPObject();
    if (!xmlHTTP) {return;}

    xmlHTTP.onreadystatechange=function() {
        if (xmlHTTP.readyState==4) {
            document.getElementById("recipeWindow").innerHTML = xmlHTTP.responseText;
            document.getElementById("blackoutWindow").style.visibility = "visible";
            document.getElementById("recipeWindow").style.visibility = "visible";

            try {
                pageTracker._trackPageview("/circular/clickablerecipedetails.jsp?recipeid=" + recipeID + "&hideBackButton=" + hideBackButton);
            } catch(err) {}      
        }
    }

    var date = new Date();
    var timestamp = date.getTime();

    xmlHTTP.open("GET", "/circular/clickablerecipedetails.jsp?recipeid=" + recipeID + "&hideBackButton=" + hideBackButton + "&time=" + timestamp, true);
    xmlHTTP.send(null);
}

function closeMoreRecipeWindow() {
    var previousPage = document.getElementById("previousPage");
    if (previousPage != null) {previousPage.style.visibility = "visible";}
    var nextPage = document.getElementById("nextPage");
    if (nextPage != null) {nextPage.style.visibility = "visible";}

    document.getElementById("blackoutWindow").style.visibility = "hidden";
    document.getElementById("recipeWindow").style.visibility = "hidden";
}
// end ajax functions
















// global functions
function mouseMove(ev) {
    ev = ev || window.event;
    var target = (ev.target || ev.srcElement);
        
    if (document.getElementById("detailWindow").style.visibility == "visible" && target.id == "circular") {closeDetailWindow();}
}
// end global functions



















// initialization functions
function setCircular(item) {
    if (!item) return;

    circular = item;
}

function setDetailWindow(item) {
    if (!item) return;

    detailWindow = item;

    detailWindow.onmousemove = function(ev) {detailWindowFlag = true; document.body.style.cursor = 'default';}
    detailWindow.onmouseout = function(ev) {detailWindowFlag = false;}
}

function addRectangle(itemIndex, left, top, width, height, data) {
    var itemRect = document.getElementById('highlightRectangle' + itemIndex);
    var filler = document.getElementById('highlightFiller' + itemIndex);
    var hiddenData = document.getElementById('data' + itemIndex);

    if (!itemRect) return;
    
    itemRect.style.left = left + "px";
    itemRect.style.top = top + "px";
    itemRect.style.width = width + "px";
    itemRect.style.height = height + "px";
    filler.style.backgroundColor = '';
    hiddenData.value = data;
    
    itemRect.onmousedown = function(ev) {
        var ingredient = data.substring(data.indexOf("<ingredient>") + 12, data.indexOf("</ingredient>"));    
        var deal = data.substring(data.indexOf("<deal>") + 6, data.indexOf("</deal>"));
        var details = data.substring(data.indexOf("<details>") + 9, data.indexOf("</details>"));
        var department = data.substring(data.indexOf("<department>") + 12, data.indexOf("</department>"));

        addToShoppingList(ingredient, department, deal, details, null, terminationDate, storeID);

//        if (deal != '') {ingredient += ' [' + deal + ']';}
//        addToShoppingList(ingredient);


    }

    itemRect.onmouseover = function(ev) {itemFlag = true; loadDetails(itemIndex);}
    itemRect.onmousemove = function(ev) {itemFlag = true; document.body.style.cursor='pointer'; filler.style.backgroundColor = 'black'; itemRect.style.border='2px dashed red';}
    itemRect.onmouseout = function(ev) {itemFlag = false; document.body.style.cursor='default'; filler.style.backgroundColor = ''; itemRect.style.border=''}
}
// end initialization functions


















// detail window
function loadDetails(itemIndex) {
    var highlightRect = document.getElementById("highlightRectangle" + itemIndex);
    var data = document.getElementById("data" + itemIndex);
    
    var ingredient = data.value.substring(data.value.indexOf("<ingredient>") + 12, data.value.indexOf("</ingredient>"));
    if (document.getElementById("ingredient") != null) {if (ingredient != '') {document.getElementById("ingredient").style.display = ''; document.getElementById("ingredient").innerHTML = ingredient;} else {document.getElementById("ingredient").style.display = 'none';}}

    var deal = data.value.substring(data.value.indexOf("<deal>") + 6, data.value.indexOf("</deal>"));
    if (document.getElementById("deal") != null) {if (deal != '') {document.getElementById("deal").style.display = ''; document.getElementById("deal").innerHTML = deal;} else {document.getElementById("deal").style.display = 'none';}}

    var details = data.value.substring(data.value.indexOf("<details>") + 9, data.value.indexOf("</details>"));
    if (document.getElementById("details") != null) {if (details != '') {while (details.indexOf('\n') != -1) {details = details.replace('\n', '<br />');} document.getElementById("details").style.display = ''; document.getElementById("details").innerHTML = details;} else {document.getElementById("details").style.display = 'none';}}

    var department = data.value.substring(data.value.indexOf("<department>") + 12, data.value.indexOf("</department>"));

    var underline = '';
    if (document.getElementById("deal") == null) {underline = 'style="text-decoration: none;"';}

    var clickToAdd = ingredient;
//    if (deal != '') {clickToAdd += ' [' + deal + ']';}
    if (clickToAdd != '') {document.getElementById("clickToAdd").style.display = ''; document.getElementById("clickToAdd").innerHTML = '<a ' + underline + ' href="javascript: addToShoppingList(\'' + clickToAdd.replace(/'/g, "\\\'") + '\', \'' + department + '\', \'' + deal.replace(/'/g, "\\\'") + '\', \'' + details.replace(/'/g, "\\\'") + '\', null, ' + terminationDate + ', ' + storeID + ')">Click item to add to shopping list!</a>';} else {document.getElementById("clickToAdd").style.display = 'none';}

    var recipeID = data.value.substring(data.value.indexOf("<recipeID>") + 10, data.value.indexOf("</recipeID>"));
    if (recipeID != '') {document.getElementById("recipeBorder").style.display = ''; document.getElementById("recipeSection").style.display = ''; document.getElementById("recipeTitle").style.display = ''; document.getElementById("recipeTitle").innerHTML = 'FEATURED RECIPE - <a href="javascript:showRecipeDetails(' + recipeID + ', true)">click to view</a>';} else {document.getElementById("recipeBorder").style.display = 'none'; document.getElementById("recipeSection").style.display = 'none'; document.getElementById("recipeTitle").style.display = 'none';}

    var recipeName = data.value.substring(data.value.indexOf("<recipeName>") + 12, data.value.indexOf("</recipeName>"));
    if (recipeName != '') {document.getElementById("recipeName").style.display = ''; document.getElementById("recipeName").innerHTML = '<a style="text-decoration: none;" href="javascript:showRecipeDetails(' + recipeID + ', true)">' + recipeName + '</a>';} else {document.getElementById("recipeName").style.display = 'none';}

    var recipeFile = data.value.substring(data.value.indexOf("<recipeFile>") + 12, data.value.indexOf("</recipeFile>"));
    if (recipeFile != '') {document.getElementById("recipeFile").style.display = ''; document.getElementById("recipeFile").innerHTML = '<a href="javascript:showRecipeDetails(' + recipeID + ', true)"><img border="0" id="recipePicture" src="/shoptocook/Content/RecipeImages/' + recipeFile + '" style="border: 1px black solid;" /></a>';} else {document.getElementById("recipeFile").style.display = 'none';}

    var keywords = data.value.substring(data.value.indexOf("<keywords>") + 10, data.value.indexOf("</keywords>"));
    if (keywords != '') {document.getElementById("moreRecipes").style.display = ''; document.getElementById("moreRecipes").innerHTML = '<a href="javascript: viewMoreRecipes(\'' + keywords + '\', null);">Click here for more recipes!</a>';} else {document.getElementById("moreRecipes").style.display = 'none';}

    var leftPos = (new Number(highlightRect.style.left.replace('px', '')) - 213);
    
    if (leftPos < 0) {
        detailWindow.style.left = (new Number(highlightRect.style.left.replace('px', '')) + new Number(highlightRect.style.width.replace('px', ''))) + 'px';
    } else {
        detailWindow.style.left = leftPos + 'px';
    }
    
    detailWindow.style.top = new Number(highlightRect.style.top.replace('px', '')) + 'px';
    detailWindow.style.visibility = 'visible';
}

function closeDetailWindow() {
    detailWindow.style.visibility = 'hidden';
}
// end detail window




















// generic functions
function isOnCircular(ev) {
    var mousePos = mouseCoords(ev, circular);
    
    return (mousePos.circularX >= 0 && mousePos.circularX <= circular.clientWidth && mousePos.circularY >= 0 && mousePos.circularY <= circular.clientHeight);
}

function findPosX(obj) {
    var curleft = 0;
    if (obj.offsetParent)
        while(1) {
            curleft += obj.offsetLeft;
            if (!obj.offsetParent) break;
            obj = obj.offsetParent;
        }
    else if(obj.x)
        curleft += obj.x;
    return curleft;
}

function findPosY(obj) {
    var curtop = 0;
    if (obj.offsetParent)
        while(1) {
            curtop += obj.offsetTop;
            if (!obj.offsetParent) break;
            obj = obj.offsetParent;
        }
    else if(obj.y)
        curtop += obj.y;
    return curtop;
}

function mouseCoords(ev, obj) {
    var originX = findPosX(circular);
    var originY = findPosY(circular);

    var layerX = ev.layerX;
    var layerY = ev.layerY;

    if (typeof ev.layerX == 'undefined' && typeof ev.offsetX == 'number') {
        layerX = ev.offsetX;
        layerY = ev.offsetY;
    }

    if (ev.pageX || ev.pageY){
        return {
            pageX:ev.pageX, 
            pageY:ev.pageY, 
            circularX:ev.pageX-originX, 
            circularY:ev.pageY-originY,
            layerX:layerX,
            layerY:layerY,
            layerWidth:obj.clientWidth,
            layerHeight:obj.clientHeight
        };
    }
    
    var root = document.documentElement || document.body;

    return {
        pageX:ev.clientX + root.scrollLeft,
        pageY:ev.clientY + root.scrollTop, 
        circularX:(ev.clientX + root.scrollLeft)-originX, 
        circularY:(ev.clientY + root.scrollTop)-originY,
        layerX:layerX,
        layerY:layerY,
        layerWidth:obj.clientWidth,
        layerHeight:obj.clientHeight
    };
}
// end generic functions