/* *****************************************************************************
*
* Copyright (c) 2007-2010 by Beyond 360 Imaging, LLC. All rights reserved. 
* No part of this document may be reproduced in any form or by any means 
* without written permission from Beyond 360 Imaging, LLC.
*
****************************************************************************** */
var gHsInitialized = false;
var gZoomFunctionLevel = 60;       // Note that the default zoom level used is 60%, but will automatically re-calculated
var gMouseFunction = "mf_rotate";  // can be "mf_rotate", "mf_move" and "mf_none"
var gDragRotateOn = false;
var gMouseFunctionInitialized = false;
var gMoveButtonImg = new Image();
var gRotateButtonImg = new Image();
var gShowHelpTipOnce = true;
var gZoomActive = false;
var gZoomImagesLoaded = 0;
var gZoomOffImg = new Image();
var gZoomOnImg = new Image();
var gZoomImages = []; // new Array();
var gCurZoomImg = new Image();
var gAutoPrint = true;
var gZoomOffsetX;
var gZoomOffsetY;
var gSavedZoomState;
var gPopUpsBlocked = false;
var gStopOnceAtHotSpot = false;
var gControlKeyDown = false;
var gStopAnimAfterThisFrame = false;
var gIntroAudioId = 'introAudioId';  // Needs a function to set this
var gIntroAudioClip=0;               // 0 if no audio is loaded
var gHsAudioMuted = true;            // Always start out as muted
var gAudioOnImg = new Image();
var gAudioOffImg = new Image();
var gSoundManagerError = false;
var gMaxAudioLoadRetries = 50;     // Maximum retries to wait for the intro audio to load. 1 second each retry
var gHsOrigWidth = [];
var gHsOrigHeight = [];
// Hotspot size pulsing effect
var gCurHsPercent = 100;  // percent
var gPercentIncrement = 3;
// Hotspot Opacity effect
var gCurHsOpacity = 100.0;
var gOpacityIncrement = 2.0;
var gHsMinOpacity = 50.0;

function trackGA (category, action, optLabel, optValue)
{
    if (gDocumentLoaded)
    {
        var upcSku;

        if (gUpc12.length == 12)
        {
            upcSku = "UPC=" + gUpc12;
        }
        else if (gSku.length > 2)
        {
            upcSku = "SKU=" + gSku;
        }
        else
        {
            upcSku="UPC=None";
        }
	try {
	  pageTracker._trackEvent(upcSku, action, "VID=" + gVid, optValue);
	} catch (err) { /*alert ('pageTracker call failed') */}
    }
} // trackGA

function opacity (opacStart, opacEnd, millisec, id)
{
    var speed = Math.round (millisec / 100);
    var timer = 0;
    var i = 0;
    if (opacStart > opacEnd)
    {
        for (i = opacStart; i >= opacEnd; i--)
        {
            setTimeout ("changeOpac(" + i + ", '" + id + "')",(timer * speed));
            timer++;
        }
    }
    else if (opacStart < opacEnd)
    {
        for (i = opacStart; i <= opacEnd; i++)
        {
            setTimeout ("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    }
}

function slideOpen (widthStart, widthEnd, millisec, id)
{
    var speed = Math.round (millisec / 100);
    var timer = 0;
    var i = 0;
    if (widthStart > widthEnd)
    {
        for (i = widthStart; i >= widthEnd; i--)
        {
            setTimeout ("changeWidth(" + i + ", '" + id + "')",(timer * speed));
            timer++;
        }
    }
    else if (widthStart < widthEnd)
    {
        for (i = widthStart; i <= widthEnd; i++)
        {
            setTimeout ("changeWidth(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    }
}

function changeWidth (width, id)
{
    $(id).setStyle ({width: width});
}

function checkIEVersion()
{
    // return /msie/i.test(navigator.userAgent) && !/opera/i.test(navigator.userAgent);

    var retval = 0; // 0 means not IE

    if (/MSIE (\d+\.\d+);/.test(navigator.userAgent))
    {
        //retval = new Number(RegExp.$1);
        retval = Number(RegExp.$1);
    }
    else
    {
        retval = 0;
    }
    // alert ("MSIE Version: " + retval);
    return (retval);
}

function changeOpac(opacityLevel, id)
{
    if (checkIEVersion() > 0)
    {
        $(id).setOpacity (opacityLevel/100);
    }
    else
    {
        $(id).setOpacity (opacityLevel/100);
    }
}

function zoomModeControl (controlMode)
{
    if (gShowZoom == 2)
    {
        if (gZoomImagesLoaded == frame_count)
        {
            if (controlMode == "on")
            {
                gZoomActive = true;
                document.getElementById('zoomToggleId').src = gZoomOnImg.src;
                $('animarea').style.cursor = "crosshair";
                $('zoomToggleId').setStyle ({opacity: 1.0});
                //$('zoomToggleId').title = "Hide Spot Zoom";
                //$('zoomToggleId').title = "Magnifier OFF";
                $('zoomToggleId').title = "Click Magnifier OFF";

            }
            else
            {
                Element.hide('zoomDiv');
                gZoomActive = false;
                // document.getElementById('zoomToggleId').src = gZoomOffImg.src;
                document.getElementById('zoomToggleId').src = gZoomOnImg.src;
                //$('zoomToggleId').setStyle ({opacity: 0.25});
                //$('zoomToggleId').setStyle ({opacity: 0.50});
                $('zoomToggleId').setStyle ({opacity: 1.0}); // temp fix
                //$('zoomToggleId').title = "Show Spot Zoom";
                //$('zoomToggleId').title = "Magnifier ON";
                $('zoomToggleId').title = "Click Magnifier ON";
                if (gMouseFunction == "mf_rotate")
                {
                    $('animarea').style.cursor = "e-resize";
                }
                else
                {
                    $('animarea').style.cursor = "move";
                }
            }
        }
    }
}

function dimAllHotspots ()
{
    for (var count = 0; count < spots_size; count++)
    {
	// NOTE: do not change hsmark name as it is referenced in other JS functions
        var hsId = 'hsmark' + count;
        var hsdotName = document.getElementById(hsId);
        //hsdotName.style.visibility = "hidden";
        opacity (100, 30, 400, hsId);
    }
}

function showHSInfo (idNum)
{
  //alert ('showHSInfo');
    //soundManager.stopAll();            // stop all existing sounds
    // gIntroAudioClip.stop();
    if ((gHsAudioMuted == false) && (gSoundManagerError == false))
    {
        // soundManager.stopAll();            // stop all existing sounds
        if (gIntroAudioClip)
        {
            gIntroAudioClip.stop();
        }

        var audioId = LoadHsAudio (idNum);
        // alert ("retId: " + audioId);
        if (audioId != "invalid")
            soundManager.play(audioId);
    }

    // Turn OFF zoom Mode
    zoomModeControl ("off");

    var popupName = 'hspopup' + idNum;

    var posX = anim_area.dimensions.width/2 - parseInt ($(popupName).style.width, 10)/2;
    var posY = anim_area.dimensions.height/2 - parseInt ($(popupName).style.height, 10)/2;
    $('infolayer').style.left = posX + "px";
    $('infolayer').style.top = posY + "px";
    // need to set this here because initially it has no border so that it doesn't show up until needed.
    $('infolayer').style.border = "1px solid #f7b815";
    // Hide the HS Dot
    $('hslayer').style.visibility = "hidden";

    // Dim the product image
    opacity (100, 30, 400, 'imgload');
    opacity (0, 100, 400, popupName);
    opacity (100, 20, 400, 'navarea');
    dimAllHotspots ();
    //alert ('popup coming');
    // Show the popup
    //new Element.show(popupName);
    Element.show(popupName);
    
    // Google Analytics
    trackGA("NAVIGATION", "iCallout.Show", "NA", 0);
}

function setCursor ()
{
    if (gZoomActive)
    {
        $('animarea').style.cursor = "crosshair";
    }
    else
    {
        if (gMouseFunction == "mf_rotate")
        {
            $('animarea').style.cursor = "e-resize";
        }
        else
        {
            $('animarea').style.cursor = "move";
        }
    }
}

function brightAllHotspots ()
{
    for (var count = 0; count < spots_size; count++)
    {
        var hsId = 'hsmark' + count;
        var hsdotName = document.getElementById(hsId);
        opacity (30, 100, 400, hsId);
    }
}

function hsCloseHandler (popupName)
{
    // Dim the popup
    opacity (100, 0, 300, popupName);
    Element.hide(popupName);
    
    $('infolayer').style.border = "none";

    // Show the HS Dots
    $('hslayer').style.visibility = "hidden";

    // Brighten the product image
    opacity (30, 100, 400, 'imgload');
    opacity (20, 100, 400, 'navarea');
    brightAllHotspots ();

    // Set cursor depending on the current mode
    setCursor ();

    soundManager.stopAll();
}


function initHotspots (x, y)
{
    if (gHsInitialized === false)
    {
        var animTop = parseInt ($('animarea').getStyle ('top'), 10);
        var animLeft = parseInt ($('animarea').getStyle ('left'), 10);
        var imgTop = parseInt ($('imgload').getStyle ('top'), 10);
        var imgLeft = parseInt ($('imgload').getStyle ('left'), 10);
        var imgPaddingTop = parseInt ($('imgload').getStyle ('padding-top'), 10);
        var imgPaddingLeft = parseInt ($('imgload').getStyle ('padding-left'), 10);
        var hsLeft = parseInt ($('hslayer').getStyle ('left'), 10);
        var hsTop = parseInt ($('hslayer').getStyle ('top'), 10);
        var hsMarginLeft = parseInt ($('hslayer').getStyle ('margin-left'), 10);
        var hsMarginTop = parseInt ($('hslayer').getStyle ('margin-top'), 10);
        var hsPaddingLeft = parseInt ($('hslayer').getStyle ('padding-left'), 10);
        var hsPaddingTop = parseInt ($('hslayer').getStyle ('padding-top'), 10);

        dX = imgLeft - animLeft + hsLeft - hsMarginLeft - hsPaddingLeft - imgPaddingLeft;
        dY = imgTop - animTop - hsTop - hsMarginTop - hsPaddingTop - imgPaddingTop;

        for (var count = 0; count < spots_size; count++)
        {
            var hsId = 'hsmark' + count;
            var hsdotName = document.getElementById(hsId);

            var tmpx = spots[count][2] + dX;
            var tmpy = spots[count][3] + dY;
            hsdotName.style.left = tmpx + "px";  // posX
            hsdotName.style.top = tmpy + "px";   // poxY
            hsdotName.style.visibility = "hidden";           // starting out as hidden images
        }
        gHsInitialized = true;
    }
}
  
function hideAllHotspots ()
{
    for (var count = 0; count < spots_size; count++)
    {
        var hsId = 'hsmark' + count;
        var hsdotName = document.getElementById(hsId);
        hsdotName.style.visibility = "hidden";
        spots[count][6] = 0;
    }
}

function checkHotSpots (zoomLevel, view)
{
    if ((gAutoSpin === 0) && (gShowHotspots === true))
    {
        for (var count = 0; count < spots_size; count++)
        {
            var hsId = 'hsmark' + count;
            var hsdotName = document.getElementById(hsId);
            if ((spots[count][0] == zoomLevel) && (spots[count][1] == view)) // mp: spots[i][0] = zoomLevel, spots[i][1]=viewType
            {
                spots[count][6] = 4;

                if (gStopOnceAtHotSpot)
                {
                    gStopOnceAtHotSpot = false;
                    if (timer)
                    {
                        animationStop();
                    }
                    else
                    {
                        gStopAnimAfterThisFrame = true;
                    }
                }
            }
            else
            {
                spots[count][6]--;
            }

            if (spots[count][6] > 0)
            {
                hsdotName.style.visibility = "visible";
            }
            else
            {
                hsdotName.style.visibility = "hidden";
            }
        }
    }
 }
function isAnyHotSpotOn ()
{
    var retval = false;
    for (var count = 0; count < spots_size; count++)
    {
        var hsId = 'hsmark' + count;
        var hsdotName = document.getElementById(hsId);
        if (hsdotName.style.visibility == "visible")
        {
            retval = true;
            break;
        }
    }
    return (retval);
} // isAnyHotSpotOn
 
function hotspotsToggleHandler()
{
    if (gHsOption > 0)
    {
        if (gControlKeyDown)
        {
            if (gShowHotspots)
            {
                gStopOnceAtHotSpot = true;
                animationStart(1, fps);
            }
        }
        else
        {
            gShowHotspots = !gShowHotspots;
            if (gShowHotspots)
            {
                var angle = frameNumber * step;
                $('hsToggleButton').setStyle ({opacity: 1.0});
                checkHotSpots (zoomFactor + '', elev + '-' + angle);
                //$('hsToggleButton').title = "Product Info OFF";
                $('hsToggleButton').title = "Click Info OFF";

                if (!isAnyHotSpotOn ())
                {
                    gStopOnceAtHotSpot = true;
                    animationStart(1, fps);
                }

                // Google Analytics
                trackGA("NAVIGATION", "iCallout.On", "NA", 0);
            }
            else
            {
                //$('hsToggleButton').setStyle ({opacity: 0.25});
                // $('hsToggleButton').setStyle ({opacity: 0.50});
                $('hsToggleButton').setStyle ({opacity: 1.0});  // temp fix
                hideAllHotspots ();
                //$('hsToggleButton').title = "Product Info ON";
                $('hsToggleButton').title = "Click Info ON";

                // Google Analytics
                trackGA("NAVIGATION", "iCallout.Off", "NA", 0);
            }
        }
    }
} // hotspotsToggleHandler

function hsButtonInit ()
{
    if (!gAutoSpin)
    {
        if (gHsOption == 1)
        {
            $('hsToggleButton').setStyle ({opacity: 1.0});
            gShowHotspots = true;
            //$('hsToggleButton').title = "Hide HotSpot";
            //$('hsToggleButton').title = "Product Info OFF";
            $('hsToggleButton').title = "Click Info OFF";
        }
        else if (gHsOption == 2)
        {
            //$('hsToggleButton').setStyle ({opacity: 0.25});
            //$('hsToggleButton').setStyle ({opacity: 0.50});
            $('hsToggleButton').setStyle ({opacity: 1.00});  // Temp fix
            gShowHotspots = false;
            //$('hsToggleButton').title = "Show HotSpot";
            //$('hsToggleButton').title = "Product Info ON";
            $('hsToggleButton').title = "Click Info ON";
        }
        else
        {
            gShowHotspots = false;
        }
    }
} // hsButtonInit

function showHelpTip (showHotspotsFlag)
{
    if (!gShowHelpTipOnce)
    {
        return;
    }

    gShowHelpTipOnce = false;

    if (showHotspotsFlag)
    {
        checkHotSpots (zoomFactor + '', '0-0');
    }

    var posX = $('animarea').getWidth ()/2 - $('helpTipId').getWidth()/2;
    var posY = $('animarea').getHeight ()/2 - $('helpTipId').getHeight()/2;
    
    $('helpTipId').style.left = posX + "px";
    $('helpTipId').style.top = posY + "px";

    // Dim the product image
    opacity (100, 20, 400, 'imgload');
    opacity (100, 20, 400, 'navarea');
    dimAllHotspots ();
    
    // Show the helpTip slowly
    opacity (0, 100, 1000, 'helpTipId');

    // Show the popup
    Element.show('helpTipId');

} // showHelpTip

function helpTipClickHandler ()
{
    opacity (100, 0, 500, 'helpTipId');
    Element.hide('helpTipId');
    opacity (30, 100, 400, 'imgload');
    opacity (30, 100, 400, 'navarea');
    brightAllHotspots ();
} // helpTipClickHandler

function hideHelpTip ()
{
    opacity (100, 0, 500, 'helpTipId');
    Element.hide('helpTipId');
    opacity (30, 100, 400, 'imgload');
    opacity (30, 100, 400, 'navarea');
    brightAllHotspots ();
} // helpTipClickHandler

function zoomImgLoadHandler ()
{
    if (gShowZoom == 2)
    {
        gZoomImagesLoaded++;
        if (gZoomImagesLoaded == frame_count)
        {
            document.getElementById('zoomToggleId').src = gZoomOnImg.src;
            zoomModeControl ("off");

            gZoomFunctionLevel = (gZoomImages[0].width / (firstimage.width * 100/zoomFactor)) * 100;
            // alert ('gZoomFunctionLevel: ' + gZoomFunctionLevel);
        }
    }
}

function getZoomImages ()
{
    if (!gAutoSpin)
    {
        if (gShowZoom == 2)
        {
            var imgUrl;
            var angle;
            for (var i = 0; i < frame_count; i++)
            {
                angle = i * step;
                imgUrl = baseURL + prodID + "/pzoom/" + elev + "-" + angle + ".jpg";
                gZoomImages[i] = new Image();
                gZoomImages [i].src = imgUrl;

                if ((gZoomImages [i].complete === true) && (gZoomImages [i].width > 0))
                {
                    zoomImgLoadHandler();
                }
                else
                {
                    gZoomImages [i].onload = zoomImgLoadHandler;
                }
            }
            var imgPaddingTop = parseInt ($('imgload').getStyle ('padding-top'), 10);
            var imgPaddingLeft = parseInt ($('imgload').getStyle ('padding-left'), 10);
            var hsMarginLeft = parseInt ($('hslayer').getStyle ('margin-left'), 10);
            var hsMarginTop = parseInt ($('hslayer').getStyle ('margin-top'), 10);
            var hsPaddingLeft = parseInt ($('hslayer').getStyle ('padding-left'), 10);
            var hsPaddingTop = parseInt ($('hslayer').getStyle ('padding-top'), 10);
            gZoomOffsetX = hsMarginLeft + hsPaddingLeft + imgPaddingLeft;
            gZoomOffsetY = hsMarginTop + hsPaddingTop + imgPaddingTop;
        }
    }

} // getZoomImages

function InitSoundManager ()
{
    // These params must be set prior to going to calling soundManagerInit
    soundManager.debugMode = false;          // disable debug mode
    soundManager.defaultOptions.volume = 100;
    soundManager.url = 'swf/soundmanager2.swf';
    soundManager.consoleOnly = true;
    soundManager.onready(function(oStatus)
    {
        if (oStatus.success)
        {
            //alert('Yay, SM2 loaded OK!');	
            LoadIntroAudio ();
        }
        else
        {
            //alert('Oh @#$^%*&!, SM2 could not start.');
        }
    });
    //soundManagerInit();  // Old style
    //soundManager.init(); // No need for some reason. Maybe the instantiation takes place with the file include
    
    soundManager.onerror = function()
    {
        // SM2 could not start, no sound support, something broke etc. Handle gracefully.
        gSoundManagerError = true;
        // alert ("SoundManager encountered errror. No audio will be played");
    }
} // InitSoundManager

function LoadIntroAudio ()
{
    if (gIntroAudioExists == true)
    {
        var sURL = baseURL + prodID + "/audio/intro.mp3";
        //alert ("sound URL: " + sURL);
        if (soundManager.canPlayURL(sURL))
        {
            gIntroAudioClip = soundManager.createSound({
                id: gIntroAudioId,  // Required param: ID of the audio clip
                url: sURL,          // Required param: URL to the audio file
                // optional sound parameters here, see Sound Properties for full list
                volume: 100,
                autoLoad: true,
                autoPlay: false,
                // autoPlay: true,
                whileloading: soundIsLoading
            });
        }
        else
        {
            // alert ("Cannot create sound");
            gIntroAudioClip = 0;
            gIntroAudioExists = false;
        }
    }

} // LoadSounds

function LoadHsAudio (hsId)
{
    var retId = "audioId" + hsId; // must be a string to work

    var audioFileName = spots [hsId][7].toLowerCase();
    if (audioFileName != "none")
    {
        var sURL = baseURL + prodID + "/audio/" + spots [hsId][7]; // 7 is the name of the audio file, mp3
        //alert ("HS audio URL: " + sURL);
        if (soundManager.canPlayURL(sURL))
        {
            soundManager.createSound({
                id: retId,
                url: sURL,
                // optional sound parameters here, see Sound Properties for full list
                volume: 100,
                autoLoad: true,
                autoPlay: true
                // whileloading: soundIsLoading
            });
            //document.getElementById('hsaudioicon').visibility = "visible";
            $('hsaudioicon').style.visibility = "visible";
        }
        else
        {
            // alert ("Cannot create sound");
            retId = "invalid";
            $('hsaudioicon').style.visibility = "hidden";
        }
    }
    else
    {
        retId = "invalid";
        //document.getElementById('hsaudioicon').visibility = "hidden";
        $('hsaudioicon').style.visibility = "hidden";
    }
    return (retId);
} // LoadSounds

function soundIsLoading (bytesLoaded)
{
    // TBD: Can be used to update progress bar (maybe)
} // soundIsLoading

function AudioToggleHandler (idNum)
{
    // Toggle the sound
    //alert ("AudtioToggleHandler: " + idNum);

    if (gHsAudioMuted == true)
    {
        document.getElementById('hsaudioicon').src = gAudioOnImg.src;
        $('hsaudioicon').title = "Audio ON";

        // Play the sound
        gHsAudioMuted = false;

        var audioId = LoadHsAudio (idNum);
        if (audioId != "invalid")
            soundManager.play(audioId);
    }
    else
    {
        document.getElementById('hsaudioicon').src = gAudioOffImg.src;
        $('hsaudioicon').title = "Audio OFF";
        soundManager.stopAll();
        gHsAudioMuted = true;
        //var audioId = LoadHsAudio (idNum);
        //if (audioId != "invalid")
        //    soundManager.play(audioId);
    }

    /*
    if (gIE6Flag === true)
    {
        $('hsaudioicon').setStyle({
               padding: '0px',
               margin: '0px 30px 6px 0px'
               // height: '20px',
               // width: '20px',
               // top: '0px',
               // left: '30px'
            });
    } */
} // AudioToggleHandler

function WaitIntroAudio ()
{
    var startupComplete = false;

    // If the audio clip exists and it has been loaded, then play it. Else retry until is is completely
    // loaded. Retry only 5 times before giving up.
    if (gIntroAudioExists == true)
    {
        if ((gIntroAudioClip != null) && (gIntroAudioClip.loaded))
        {
            gIntroAudioClip.play();
            startupComplete = true;
        }
        else
        {
            if (gMaxAudioLoadRetries <= 0)
            {
                startupComplete = true;
            }
            else
            {
                setTimeout("WaitIntroAudio()", 1000);
                gMaxAudioLoadRetries--;
            }
        }
    }
    else
    {
        // The audio doesn't even exist so just don't even retry to wait for it to load
        startupComplete = true;
    }

    // Once the audio has played, remove the loading scene and let user interact.
    if (startupComplete == true)
    {
        var wid = firstimage.width;
        var ht = firstimage.height;
        var xoffset = anim_area.center_x - Math.round(wid / 2);
            var yoffset = anim_area.center_y - Math.round(ht / 2);
            initHotspots(xoffset, yoffset);

            // Set timer to kill the spinning 360 loading scene
            setTimeout("helpTipClickHandler()", 1000);
            getZoomImages ();

            // Alert user if they're using IE6 or lower: No transparency
            if (gIE6Flag === true)
            {
                document.getElementById('messageTextId').innerHTML = "You are currently viewing this page using Microsoft Internet Explorer version 6 or earlier. For best viewing experience, please update your browser or use one of these alternatives:<br><br>" +
                        "&#8226; Apple Safari version 4 or later<br>" +
                        "&#8226; Firefox version 3 or later<br>" +
                        "&#8226; Google Chrome version 3 or later<br>";
                DisplayMessage ();
            }
            // Alert user if they don't have flash installed
            if(!FlashDetect.installed)
            {
                document.getElementById('messageTextId').innerHTML = "Flash is required for best viewing experience of this product. You will not be able to:<br><br>" +
                        "&#8226; View instructional videos<br>" +
                        "&#8226; Listen to audio streams<br>" +
                        "Please install the latest Flash player from Adobe";
                // DisplayMessage (); // commented out as requested by Chris
            }
            else
            {
                //document.getElementById('messageTextId').innerHTML = "Flash is installed on this browser. You will be able to:<br><br>" +
                //        "&#8226; View instructional videos<br>" +
                //        "&#8226; Listen to attached audio streams<br>";
                //DisplayMessage ();
            }
    }
} // WaitIntroAudio

function documentOnloadHandler (loadingStage)
{
    if (loadingStage == "documentLoaded")
    {
        gDocumentLoaded = true;
        FindOrigHsSizes();
    }
    if ((frames_loaded) && (gDocumentLoaded))
    {
        WaitIntroAudio ();
        PulseAllHotspots();
    }
} // documentOnloadHandler

function documentOnUnloadHandler ()
{
    hideAllHotspots ();
} // documentOnUnloadHandler
 
function getButtonImages ()
{
    if (!gAutoSpin)
    {
        var buttonImg;
        var origSrc;
        var nameLen;
        var imgExt;
        var lastSlash;
        var imgBaseUrl;
        if (gShowMouseFn)
        {
            buttonImg = document.getElementById('mouseFunctionButton');
            origSrc = buttonImg.src;
            nameLen = buttonImg.src.length;
            imgExt = buttonImg.src.substring (nameLen-3, nameLen);
            lastSlash = buttonImg.src.lastIndexOf ("/");
            imgBaseUrl = buttonImg.src.substring (0, lastSlash+1);
            gRotateButtonImg.src = imgBaseUrl + "rotate." + imgExt;
            gMoveButtonImg.src = imgBaseUrl + "move." + imgExt;
        }

        if (gShowZoom == 2)
        {
            buttonImg = document.getElementById('zoomToggleId');
            origSrc = buttonImg.src;
            nameLen = buttonImg.src.length;
            imgExt = buttonImg.src.substring (nameLen-3, nameLen);
            lastSlash = buttonImg.src.lastIndexOf ("/");
            imgBaseUrl = buttonImg.src.substring (0, lastSlash+1);

            // Zoom buttons
            gZoomOnImg.src = imgBaseUrl + "zoomon." + imgExt;
            gZoomOffImg.src = imgBaseUrl + "zoomoff." + imgExt;
            //gZoomDisabledImg.src = imgBaseUrl + "zoomdisabled." + imgExt;
        }
        // The audio mute/unmute button
        if (spots_size > 0)
        {
            gAudioOnImg.src = "images/audio_on.gif";
            gAudioOffImg.src = "images/audio_off.gif";
        }
    }
}

function printImgHandler (printOption)
{
    //alert ("PrintOption: " + printOption);
    //alert (location.href.substring(0,location.href.lastIndexOf('/')+1));
    var printZoom = 40;  // hard coded right now at 40%
    var angle = frameNumber * step;
    var winWidth = (firstimage.width * printZoom)/zoomFactor + 100; // 250px is the minimum for the old template
    var winHeight = (firstimage.height * printZoom)/zoomFactor + 460; // 160;
    var url = location.href.substring(0,location.href.lastIndexOf('/')) + "/templates/print" + printOption + ".php?pid=" + 
                                prodID + "&upc=" + gUpc12 + "&zoom=" + printZoom + "&angle=" + angle;
    var printWin = window.open (url, "Beyond_360_LiveView_Print", "location=1,status=1,scrollbars=1,width=" +
                                winWidth + ",height=" + winHeight);
    // Google Analytics
    trackGA("NAVIGATION", "Print", "NA", 0);
} // printImgHandler

function hideme(divname) {
  $(divname).style.width = "0px";
  $(divname).style.height = "0px";
  Element.hide(divname);
  //  document.getElementById(divname).style.display='none';
  $('hslayer').style.visibility = "visible";
  $('imgload').style.visibility = "visible";
  $('navarea').style.visibility = "visible";
  opacity(30,100,400,'allcontent');
  brightAllHotspots ();
}

function mouseFunctionHandler()
{
    anim_area.drag_on = false;
    gDragRotateOn = false;
    var buttonImg = document.getElementById('mouseFunctionButton');

    if (gMouseFunction == "mf_rotate")
    {
        // Move to the mf_move state
        gMouseFunction = "mf_move";
        drag = 1;
        $('animarea').style.cursor = "move";
        //buttonImg.src = imgBaseUrl + "rotate." + imgExt;
        buttonImg.src = gRotateButtonImg.src;
        buttonImg.title = "Rotate Image Using Mouse";
    }
    else if (gMouseFunction == "mf_move")
    {
        // Move to the mf_rotate state
        gMouseFunction = "mf_rotate";
        drag = 0;
        $('animarea').style.cursor = "e-resize";
        //buttonImg.src = imgBaseUrl + "move." + imgExt;
        buttonImg.src = gMoveButtonImg.src;
        buttonImg.title = "Move Image Using Mouse";
    }
} // functionButtonHandler

function changeZoomImage ()
{
    if ((gZoomImagesLoaded == frame_count) && (gShowZoom == 2))
    {
        var newSrc = "url(" + gZoomImages [frameNumber].src + ")";
        $('zoomDiv').setStyle({background: newSrc, 
                               backgroundRepeat: 'no-repeat', 
                               backgroundColor: 'white',
                               backgroundPosition: '600px 250px'});
    }
}

function zoomToggleAction ()
{
    // soundManager.play(gIntroAudioId);
    if ((gZoomImagesLoaded == frame_count) && (gShowZoom == 2))
    {
        // For Zoom
        if (!gZoomActive)
        {
            zoomModeControl ("on");

            // Do this to load individual zoom image as needed
            // Do this to load the pre-loaded images
            changeZoomImage ();
            //$('zoomToggleId').setStyle ({opacity: 1.0});
            
            // Google Analytics
            trackGA("NAVIGATION", "Magnify.On", "NA", 0);
        }
        else
        {
            zoomModeControl ("off");
            //$('zoomToggleId').setStyle ({opacity: 0.25});

            // Google Analytics
            trackGA("NAVIGATION", "Magnify.Off", "NA", 0);
        }
    }
} // zoomToggleAction


function mouseFunctionInit()
{
    anim_area.drag_on = false;
    gDragRotateOn = false;
    gMouseFunction = "mf_rotate";
    drag = 0;
    $('animarea').style.cursor = "e-resize";

} // functionButtonHandler

function checkPopupBlocker ()
{
    var mine = window.open('','','width=1,height=1,left=0,top=0,scrollbars=no');
    if(mine)
    {
        gPopUpsBlocked = false;
    }
    else
    {
        gPopUpsBlocked = true;
    }
    mine.close();
}

function repositionB360 ()
{
    if (gShowB360)
    {
        var navTop = parseInt ($('navarea').getStyle ('top'), 10);
        var paddingTop = parseInt ($('b360linkarea').getStyle ('padding-top'), 10);
        var paddingBottom = parseInt ($('b360linkarea').getStyle ('padding-bottom'), 10);
        var paddingLeft = parseInt ($('b360linkarea').getStyle ('padding-left'), 10);
        var paddingRight = parseInt ($('b360linkarea').getStyle ('padding-right'), 10);
        var marginTop = parseInt ($('b360linkarea').getStyle ('margin-top'), 10);
        var marginBottom = parseInt ($('b360linkarea').getStyle ('margin-bottom'), 10);
        var marginLeft = parseInt ($('b360linkarea').getStyle ('margin-left'), 10);
        //var topPos = $('navarea').getHeight() + anim_area.dimensions.height + paddingTop + marginTop;
        var topPos = $('navarea').getHeight() + $('animarea').getHeight(); // + paddingTop + marginTop;
        //var topPos = $('navarea').getHeight() + $('animarea').getHeight() + paddingTop + marginTop - marginBottom - paddingBottom;
        //var topPos = navTop + $('navarea').getHeight();

        $('b360linkarea').setStyle({
               height: '15px', //  anim_area.dimensions.height + 'px',
               //height: $('b360linkarea').getHeight() + 'px',
               width: (anim_area.dimensions.width - paddingRight) + 'px',
               top:  topPos + 'px',
               left: '0px'
            });
    }
} // repositionB360

function keyDownHandler (key)
{
    //alert ("keyDownHandler");
    if (key.keyCode == 17)
    {
        // alert('ctrl');
        gControlKeyDown = true;
    }
    return;

} // keyDownHandler

function keyUpHandler (key)
{
    //alert ("keyUpHandler");
    //if (key.keyCode == 17)
    //{
        gControlKeyDown = false;
    //}
    return;

} // keyUpHandler

function DisplayMessage ()
{
    var tmpWidth = anim_area.dimensions.width - 20;
    var tmpHeight = anim_area.dimensions.height - 20;
    if (tmpWidth > 400)
        tmpWidth = 400;
    if (tmpHeight > 200)
        tmpHeight = 200;
    //$('messageDiv').setStyle ({width: tmpWidth, height: tmpHeight});
    $('messageDiv').setStyle ({width: tmpWidth});
    $('messageDiv').setStyle ({height: tmpHeight});
    //changeWidth (tmpWidth, 'messageDiv');

    var posX = anim_area.dimensions.width/2 - $('messageDiv').getWidth()/2;
    var posY = anim_area.dimensions.height/2 - $('messageDiv').getHeight()/2;
    
    if (posX < 0)
        posX = 0;
    if (posY < 0)
        posY = 0;
    $('messageDiv').style.left = posX + "px";
    $('messageDiv').style.top = posY + "px";

    opacity (30, 100, 400, 'messageDiv');
    Element.show('messageDiv');
} // DisplayMessage

function messageCloseHandler ()
{
    opacity (100, 0, 300, 'messageDiv');
    Element.hide('messageDiv');
    // opacity (30, 100, 400, 'container');
} // messageCloseHandler

function FindOrigHsSizes ()
{
    for (var i = 0; i < spots_size; i++)
    {
        gHsOrigWidth[i] = parseInt(document.getElementById("hsmark" + i).width);
        gHsOrigHeight[i] = parseInt(document.getElementById("hsmark" + i).height);
    }
}

function PulseAllHotspots ()
{
    if ((spots_size > 0) && (gHsAnimation > 0))
    {
        switch (gHsAnimation)
        {
            default:
            case 1: // Size pulse
                var imgId;
                if (gCurHsPercent > 70)
                {
                    for (var i = 0; i < spots_size; i++)
                    {
                        imgId = document.getElementById("hsmark" + i);
                        var tmpHeight = (gHsOrigHeight[i] * gCurHsPercent) / 100;
                        var tmpWidth = (gHsOrigWidth[i] * gCurHsPercent) / 100;

                        gCurHsPercent = gCurHsPercent - gPercentIncrement;
                        imgId.height = "" + tmpHeight;
                        imgId.width = "" + tmpWidth;

                        var tmpPaddingY = (gHsOrigHeight[i]-tmpHeight)/2;
                        var tmpPaddingX = (gHsOrigWidth[i]-tmpWidth)/2;
                        imgId.style.padding = tmpPaddingY + "px 0px 0px " + tmpPaddingX + "px";
                    }
                    setTimeout("PulseAllHotspots()", 50);
                }
                else
                {
                    for (var i = 0; i < spots_size; i++)
                    {
                        imgId = document.getElementById("hsmark" + i);
                        gCurHsPercent = 100;
                        imgId.height = "" + gHsOrigHeight[i];
                        imgId.width = "" + gHsOrigWidth[i];
                        imgId.style.padding = "0px 0px 0px 0px";
                    }
                    setTimeout("PulseAllHotspots()", 2000);
                }
                break;

            case 2: // Opacity pulse
                var hsId;
                if (gCurHsOpacity > gHsMinOpacity)
                {
                    for (var i = 0; i < spots_size; i++)
                    {
                        hsId = 'hsmark' + i;
                        gCurHsOpacity = gCurHsOpacity - gOpacityIncrement;
                        //var tmpOpacity = gCurHsOpacity/100.0;
                        $(hsId).setOpacity (gCurHsOpacity/100.0);
                        //$(hsId).setOpacity (tmpOpacity);
                        //document.getElementById(hsId).style.filter="alpha(opacity=" + gCurHsOpacity + ")";
                        //var tmpStr = "alpha(opacity=" + gCurHsOpacity + ")";
                        //document.getElementById(hsId).style.filter="alpha(opacity=50)";
                        //document.getElementById(hsId).style.filter=tmpStr;
                    }
                    setTimeout("PulseAllHotspots()", 90);
                }
                else
                {
                    for (var i = 0; i < spots_size; i++)
                    {
                        hsId = 'hsmark' + i;
                        gCurHsOpacity = 100.0;
                        $(hsId).setOpacity (gCurHsOpacity/100.0);
                    }
                    setTimeout("PulseAllHotspots()", 2000);
                }
                break;
        } // EndSwitch
    }
}

function createXMLDoc(divname)
{
  if (window.XMLHttpRequest)
    {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
    }
  else
    {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
  xmlhttp.onreadystatechange=function()
    {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
      {
	document.getElementById(divname).innerHTML=xmlhttp.responseText;
      }
    }
  return (xmlhttp);
}