﻿/*
* This functions returns an array containing 36 points to draw an
* ellipse.
*
* @param x {double} X coordinate
* @param y {double} Y coordinate
* @param a {double} Semimajor axis
* @param b {double} Semiminor axis
* @param angle {double} Angle of the ellipse
*/
var _arrXs = new Array(144);
var _arrYs = new Array(144);

function calculateEllipse(x, y, a, b, angle, steps) {

    var cnt;
    var el;
    cnt = 0;

    if (steps == null)
        steps = 144;

    // Angle is given by Degree Value
    var beta = -angle * (Math.PI / 180); //(Math.PI/180) converts Degree Value into Radians
    var sinbeta = Math.sin(beta);
    var cosbeta = Math.cos(beta);

    for (var i = 0; i < 360; i += 360 / steps) {
        var alpha = i * (Math.PI / 180);
        var sinalpha = Math.sin(alpha);
        var cosalpha = Math.cos(alpha);

        var X = x + (a * cosalpha * cosbeta - b * sinalpha * sinbeta);
        var Y = y + (a * cosalpha * sinbeta + b * sinalpha * cosbeta);

        _arrXs[cnt] = X;
        _arrYs[cnt] = Y;
        cnt = cnt + 1;
        
    }


}

var _bluePos = 0;
var _yellowPos = 0;
var _ltbluePos = 0;
var _redPos = 0;
var _greenPos = 0;
var _zHold = 0;
var _HaveDelayed = false;
var _tmrDelay;

function InitCarousel() {

    var sX;
    var xY;
    var iX;
    var iY;
    var html = '';
    var t;
    var left;
    var top;

    // apparently onload is a bit too fast, so lets delay a bit
    if (_HaveDelayed == false) {
        _HaveDelayed = true;
        setTimeout('InitCarousel()', 300);
        return;
    }
    else {
        clearTimeout(_tmrDelay);
    }

    // find the position of our nav start, its our reference point
    el = document.getElementById('imgNav_Start');
    if (el != null) {
        t = findPos(el);
        left = parseInt(t[0]);
        top = parseInt(t[1]);
    }
    else {
        left = 100;
        top = 100;
    }

    left = left + 485;
    top = top + 255;
    
    // calc track
    calculateEllipse(left, top, 260, 60, 1, 144);
    
    // set initial panel pos
    for (var i = 0; i < 144; i += 1) {
        sX = parseInt(_arrXs[i]);
        sY = parseInt(_arrYs[i]);
        html = html + '<div style="z-index: 71; position: absolute; top: ' + sY + 'px; left: ' + sX + 'px;"><img src="images/RedDot.gif" width="4" height="4" /></div>';
        
        // Set blue panel
        if ( i == 38) {
            el = document.getElementById('divCpanel_Blue');
            iX = parseInt(_arrXs[i]);
            iY = parseInt(_arrYs[i]);
            iX = iX - 210;
            iY = iY - 140;
            el.style.left = String(iX) + 'px';
            el.style.top = String(iY) + 'px';
            _bluePos = 38;
        }
        // Set yellow panel
        if (i == 66) {
            el = document.getElementById('divCpanel_Yellow');
            iX = parseInt(_arrXs[i]);
            iY = parseInt(_arrYs[i]);
            iX = iX - 210;
            iY = iY - 140;
            el.style.left = String(iX) + 'px';
            el.style.top = String(iY) + 'px';
            _yellowPos = 66;
          
        }
        // Set light blue panel
        if (i == 95) {
            el = document.getElementById('divCpanel_LtBlue');
            iX = parseInt(_arrXs[i]);
            iY = parseInt(_arrYs[i]);
            iX = iX - 210;
            iY = iY - 140;
            el.style.left = String(iX) + 'px';
            el.style.top = String(iY) + 'px';
            _ltbluePos = 95;
          
        }
        // Set red panel
        if (i == 123) {
            el = document.getElementById('divCpanel_Red');
            iX = parseInt(_arrXs[i]);
            iY = parseInt(_arrYs[i]);
            iX = iX - 210;
            iY = iY - 140;
            el.style.left = String(iX) + 'px';
            el.style.top = String(iY) + 'px';
            _redPos = 123;
        }
        // Set green panel
        if (i == 143) {
            el = document.getElementById('divCpanel_Green');
            iX = parseInt(_arrXs[i]);
            iY = parseInt(_arrYs[i]);
            iX = iX - 210;
            iY = iY - 140;
            el.style.left = String(iX) + 'px';
            el.style.top = String(iY) + 'px';
            _greenPos = 143;            
        }                  
        
    }

    //el = document.getElementById('divScript');  // testing - shows track
    //el.innerHTML = html;
   
}

var _tmr;
var _FrontPanel;

function MoveCpanelToFront(FrontPanel) {

    var arrPos;
    var MyContinue = true;

    clearTimeout(_tmrOver);
    
    if ( FrontPanel != null ) { _FrontPanel = FrontPanel }

    // move blue
    for (var i = 0; i < 144; i += 1) {
        if (_bluePos == i) {
            el = document.getElementById('divCpanel_Blue');
            arrPos = i + 1;
            if (arrPos > 143) { arrPos = 0 };
            iX = parseInt(_arrXs[arrPos]);
            iY = parseInt(_arrYs[arrPos]);
            iX = iX - 210;
            iY = iY - 140;
            el.style.left = String(iX) + 'px';
            el.style.top = String(iY) + 'px';
            _bluePos = arrPos;
            i = 1000; // to leave loop...
            
            // set z-index change
            if (_FrontPanel == 'Blue' && _bluePos == 5) { el.style.zIndex = 70; }
            if (_FrontPanel != 'Blue' && _bluePos > 38) { el.style.zIndex = 64; }

            // set stop point
            if (_FrontPanel == 'Blue' && _bluePos == 38) { MyContinue = false }                            
        }
    }

    // move Yellow
    for (var i = 0; i < 144; i += 1) {
        if ( _yellowPos == i ) {
            el = document.getElementById('divCpanel_Yellow');
            arrPos = i + 1;
            if (arrPos > 143) { arrPos = 0 };
            iX = parseInt(_arrXs[arrPos]);
            iY = parseInt(_arrYs[arrPos]);
            iX = iX - 210;
            iY = iY - 140;
            el.style.left = String(iX) + 'px';
            el.style.top = String(iY) + 'px';
            _yellowPos = arrPos;
            i = 1000; // to leave loop...

            // set z-index change
            if (_FrontPanel == 'Yellow' && _yellowPos == 5) { el.style.zIndex = 70; }
            if (_FrontPanel != 'Yellow' && _yellowPos > 38 ) { el.style.zIndex = 61;  }
            
            // set stop point
            if ( _FrontPanel == 'Yellow' && _yellowPos == 38) { MyContinue = false }                
        }
    }

    // move Lt Blue
    for (var i = 0; i < 144; i += 1) {
        if ( _ltbluePos == i) {
            el = document.getElementById('divCpanel_LtBlue');
            arrPos = i + 1;
            if (arrPos > 143) { arrPos = 0 };
            iX = parseInt(_arrXs[arrPos]);
            iY = parseInt(_arrYs[arrPos]);
            iX = iX - 210;
            iY = iY - 140;
            el.style.left = String(iX) + 'px';
            el.style.top = String(iY) + 'px';
            _ltbluePos = arrPos;
            i = 1000; // to leave loop...

            // set z-index change
            if (_FrontPanel == 'LtBlue' && _ltbluePos == 5) { el.style.zIndex = 70; }
            if (_FrontPanel != 'LtBlue' && _ltbluePos > 38) { el.style.zIndex = 60; }

            // set stop point            

            if (_FrontPanel == 'LtBlue' && _ltbluePos == 38) { MyContinue = false }            
        }
    }

    // move Red
    for (var i = 0; i < 144; i += 1) {
        if (_redPos == i) {
            el = document.getElementById('divCpanel_Red');
            arrPos = i + 1;
            if (arrPos > 143) { arrPos = 0 };
            iX = parseInt(_arrXs[arrPos]);
            iY = parseInt(_arrYs[arrPos]);
            iX = iX - 210;
            iY = iY - 140;
            el.style.left = String(iX) + 'px';
            el.style.top = String(iY) + 'px';
            _redPos = arrPos;
            i = 1000; // to leave loop...

            // set z-index change
            if (_FrontPanel == 'Red' && (_redPos > 1 && _redPos < 28)) { el.style.zIndex = 70; }
            if (_FrontPanel != 'Red' && _redPos >= 38) { el.style.zIndex = 62; }

            // set stop point
            if ( _FrontPanel == 'Red' && _redPos == 38) { MyContinue = false }
        }
    }

    // move Green
    for (var i = 0; i < 144; i += 1) {
        if (_greenPos == i) {
            el = document.getElementById('divCpanel_Green');
            arrPos = i + 1;
            if (arrPos > 143) { arrPos = 0 };
            iX = parseInt(_arrXs[arrPos]);
            iY = parseInt(_arrYs[arrPos]);
            iX = iX - 210;
            iY = iY - 140;
            el.style.left = String(iX) + 'px';
            el.style.top = String(iY) + 'px';
            _greenPos = arrPos;
            i = 1000; // to leave loop...

            // set z-index change
            if (_FrontPanel == 'Green' && _greenPos == 5) { el.style.zIndex = 70; }
            if (_FrontPanel != 'Green' && _greenPos > 38) { el.style.zIndex = 63; }

            // set stop point
            if (_FrontPanel == 'Green' && _greenPos == 38) { MyContinue = false }
        }
    }

    if (MyContinue == true)
        { _tmrOver = setTimeout('MoveCpanelToFront()', 10); }
    else
        { clearTimeout( _tmrOver); }
    
    
}