var stRD_clientWidth = 0;
var stRD_ip = "";
var stRD_page = "";
var stRD_recordRate = 0;
var stRD_startTime = 0;
var stRD_mouseX;
var stRD_mouseY;
var stRD_index = 0;
var stRD_nextPage = "";
var stRD_nextPageID = 0;
var stRD_sessionID = 0;
var stRD_autoplay = 0;
var stRD_totalPages = 0;
var stRD_currentPage = 0;
var stRD_navTrail;
var stRD_firstPageID = 0;
var stRD_firstPage = "";
var stRD_navTrailID;

var stR_showNextReplayFrame_intID = 0;
var stR_recordedLeftOffset = 0;
var stR_replayerLeftOffset = 0;

window.onresize = function(e) {
    stR_refreshReplayerLeftOffset();
}

function stR_initiateReplay() {
    var xmlHttp;
    try {  // Firefox, Opera 8.0+, Safari 
        xmlHttp = new XMLHttpRequest(); 
    }
    catch (e) {  // Internet Explorer 
        try {
            xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");   
        }
        catch (e) {
            try {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch (e) {
                alert("Your browser does not support AJAX!");
                return false;   
            }
        } 
    }
    
    xmlHttp.onreadystatechange = function() {
        if (xmlHttp.readyState == 4) {
            var data = xmlHttp.responseText.split("{SPLIT}");
            stRD_clientWidth = data[0];
            stRD_ip = data[1];
            stRD_page = data[2];
            stRD_recordRate = data[3];
            stRD_startTime = data[4];
            stRD_mouseX = data[5].split(",");
            stRD_mouseY = data[6].split(",");
            stRD_nextPage = data[7];    
            stRD_nextPageID = data[8];        
            stRD_autoplay = data[9]; 
            stRD_totalPages = data[10];
            stRD_currentPage = data[11];
            stRD_navTrail = data[12].split("{NAV}");
            stRD_firstPage = data[13];
            stRD_firstPageID = data[14];
            stRD_navTrailID = data[15].split("{NAV}");
            
            if (stRD_clientWidth > st_siteWidth && st_siteAlignment == "center")
                stR_recordedLeftOffset = Math.round((stRD_clientWidth - st_siteWidth) / 2);
                
            stR_refreshReplayerLeftOffset();                
            stR_createPlaybackElements();

            if (stRD_autoplay == "1" || stR_getQS("streplayautoplay") == "1")
                stR_playButtonClicked();
        }  
    }
    
    sid = stR_getQS("streplaysid");
    stRD_sessionID = sid;
    pid = stR_getQS("streplaypid");

    xmlHttp.open("post", "/site/SessionTracker/SessionTrackerAPI.aspx?action=replay&sid=" + sid + "&pid=" + pid, true);
    xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
    xmlHttp.send("");
}

function stR_refreshReplayerLeftOffset() {
    if (st_getPageWidthWithScroll() > st_siteWidth && st_siteAlignment == "center")
        stR_replayerLeftOffset = Math.round((st_getPageWidthWithScroll() - st_siteWidth) / 2); 
}

function stR_getQS(val) {
    var tmpS = window.location.search.substring(1).split('&');
    var tmpS2;
    for (var i = 0; i < tmpS.length; i++) {
        if (tmpS[i].indexOf(val) != -1) {
            tmpS2 = tmpS[i].split('=');
            return tmpS2[1];
        }                
    }
    
    return "";
}

function stR_playButtonClicked() {

    document.getElementById("st_statusBox").innerHTML = "<span style=\"font-size: 10pt; color: #009900\">Playing</span>";

    stR_showNextReplayFrame_intID = setInterval("stR_showNextReplayFrame()", stRD_recordRate);    
    
    document.getElementById("stR_playbutton").disabled = "disabled";
    document.getElementById("stR_stopbutton").disabled = "";
}

function stR_stopButtonClicked() {
    document.getElementById("st_statusBox").innerHTML = "<span style=\"font-size: 10pt; color: #FF0000\">Stopped</span>";
    
    clearInterval(stR_showNextReplayFrame_intID);
    
    document.getElementById("stR_playbutton").disabled = "";
    document.getElementById("stR_stopbutton").disabled = "disabled";    
}

function stR_restartButtonClicked() {
    window.location = stR_createUrl(stRD_firstPage, "streplaysid=" + stRD_sessionID + "&streplaypid=" + stRD_firstPageID + "&streplayautoplay=1");
}

function stR_createPlaybackElements() {
    var controls = document.createElement("div");
    var statusDisplay = "";
    
    if (stRD_currentPage == 1)
        statusDisplay = "Ready";
    else
        statusDisplay = "Playing";
    
    var html = "<center><div style=\"font-size: 14pt; font-weight: bold; padding: 4px; background: #505050\">REPLAY MODE</div></center>";
    html += "<table cellpadding=\"2\" style=\"margin-top: 3px\">";
    html += "<td><td>Date:</td><td><b>" + stRD_startTime + "</b></td></tr>";
    html += "<td><td>IP:</td><td><b>" + stRD_ip + "</b></td></tr>";
    html += "<td><td>Page:</td><td><b>" + stRD_page + "</b></td></tr>";
    html += "</table>";
    html += "<div style=\"border: 1px outset #999999; margin: 10px; padding: 1px\">";
    html += "<div style=\"font-size: 12pt; font-weight: bold\">STATUS: <span id=\"st_statusBox\"><span style=\"color: #009900; font-size: 10pt\">" + statusDisplay + "</span></span></div>";
    html += "</div>";
    html += "<center><div style=\"padding: 3px\">";
    
    html += "<input id=\"stR_playbutton\" type=\"button\" value=\"Play\" onclick=\"stR_playButtonClicked()\" />";
    html += "<input id=\"stR_stopbutton\" type=\"button\" value=\"Stop\" disabled=\"disabled\" onclick=\"stR_stopButtonClicked()\" />";
    html += "<input id=\"stR_restartbutton\" type=\"button\" value=\"Restart\" onclick=\"stR_restartButtonClicked()\" />";
    
    html += "</div></center>";
    html += "<div style=\"margin-top: 10px; margin-left: 3px; margin-bottom: 5px; font-weight: bold; padding: 2px; font-size: 10pt; background: #505050\">NAVIGATION TRAIL (" + stRD_currentPage + " of " + stRD_totalPages + ")</div>";
    html += "<div style=\"margin: 0px; padding: 3px\">";
    var fColor = "";
    for (var i = 0; i < stRD_navTrail.length; i++) {
        if (stRD_navTrail[i] != "") {
            if (i + 1 == stRD_currentPage)
                fColor = "#EEAA11";
            else
                fColor = "white";
                
            html += "<div style=\"padding: 2px; border-bottom: 1px solid #666666\">";
            html += "<a style=\"color: " + fColor + "; text-decoration: none\" href=\"" + stR_createUrl(stRD_navTrail[i], "streplaysid=" + stRD_sessionID + "&streplaypid=" + stRD_navTrailID[i]) + "\">" + stRD_navTrail[i] + "</a>";
            html += "</div>";
        }
    }
    html += "</div>";
    
    controls.innerHTML = html;
    controls.id = "stR_controls";
    controls.style.width = "200px";
    controls.style.position = "absolute";
    controls.style.left = "0px";
    controls.style.top = "0px";
    controls.style.background = "#404040";
    controls.style.border = "2px outset #999999";
    controls.style.padding = "3px";
    controls.style.color = "white";
    controls.style.fontFamily = "arial";
    controls.style.size = "10pt";
    controls.style.zIndex = "3000";
    document.body.appendChild(controls);

    var cursor = document.createElement("div");          
    cursor.id = "stR_cursor";         
    cursor.innerHTML = "<img alt=\"cursor\" src=\"/site/SessionTracker/cursor_red.gif\" />";
    cursor.style.position = "absolute";
    document.body.appendChild(cursor); 
    
    var vGridLine = document.createElement("div");          
    vGridLine.id = "stR_vGridLine";         
    vGridLine.innerHTML = "";
    vGridLine.style.position = "absolute";
    vGridLine.style.borderLeft = "1px dotted #AAAAAA";
    vGridLine.style.height = (getPageHeightWithScroll() + 60) + "px";
    vGridLine.style.top = "0px";
    vGridLine.style.zIndex = "2000";
    document.body.appendChild(vGridLine); 
    
    var hGridLine = document.createElement("div");          
    hGridLine.id = "stR_hGridLine";         
    hGridLine.innerHTML = "";
    hGridLine.style.position = "absolute";
    hGridLine.style.borderTop = "1px dotted #AAAAAA";
    hGridLine.style.width = "100%";
    hGridLine.style.left = "0px";
    hGridLine.style.zIndex = "2000";
    document.body.appendChild(hGridLine);          
}

function stR_showNextReplayFrame() {
    var cursor = document.getElementById("stR_cursor");    
    var renderX = ((stRD_mouseX[stRD_index]*1) - stR_recordedLeftOffset) + stR_replayerLeftOffset;    
   
    cursor.style.left = renderX + "px";
    cursor.style.top = stRD_mouseY[stRD_index] + "px";
    
    document.getElementById("stR_vGridLine").style.left = renderX + "px";
    document.getElementById("stR_hGridLine").style.top = stRD_mouseY[stRD_index] + "px";
    
    stRD_index++;
    
    if (stRD_index + 1 == stRD_mouseX.length) {
        clearInterval(stR_showNextReplayFrame_intID);
        if (stRD_nextPage != "none") {
            window.location = stR_createUrl(stRD_nextPage, "?streplaysid=" + stRD_sessionID + "&streplaypid=" + stRD_nextPageID);
        }
        else
            stR_stopButtonClicked();
    }
}

function stR_createUrl(page, qs) {
    var qsChar;
    if (page.indexOf("?") == -1)
        qsChar = "?";
    else
        qsChar = "&";

    return (page + qsChar + qs).replace("??", "?").replace("/?", "?");
}

function getPageHeightWithScroll() {
    if (window.innerHeight && window.scrollMaxY) {
        // Firefox        
        yWithScroll = window.innerHeight + window.scrollMaxY;
        xWithScroll = window.innerWidth + window.scrollMaxX;
    }
    else if (document.body.scrollHeight > document.body.offsetHeight){
        // all but Explorer Mac
        yWithScroll = document.body.scrollHeight;
        xWithScroll = document.body.scrollWidth;
    } 
    else {
        // works in Explorer 6 Strict, Mozilla (not FF) and Safari
        yWithScroll = document.body.offsetHeight;
        xWithScroll = document.body.offsetWidth;
    }
    
    return yWithScroll;
}

if (window.location.search.substring(1).indexOf("streplaysid") != -1)
    setTimeout("stR_initiateReplay()", 500);