/*
function setOpacities() {
    for (var i = 1; i < 5; i++) {
        //$get('content' + i).style.display = "block";
        var el = $get('content' + i);
        el.setAttribute("style", "filter:alpha(opacity=0);opacity: 0;");
        el.style.visibility = "visible";
    }
}
*/
var assetWidth = 320;
var assetHeight = 180;
var wrapperWidth = 600;
var leftEdge = 150;
var oldPanelId = 0;  // used for deferred display tweaks on content panels

var PanelVisualPositions = new Array();
var PanelSizes = new Array();

var wiggleRoom = wrapperWidth-leftEdge-assetWidth;
//var xOffset = (wiggleRoom/numPanels);
var xOffset = 105;
var yOffset = 115;
var r = 100;
var angleStart = 6;
var theta = .35;

var xStart = 20;
var xFinal = 265;
var yStart = 10;
var yFinal = 80;
var yAdjust = 3;
var xFinalAdjust = xFinal - xStart;
var yFinalAdjust = yFinal - yStart;

var numPanels;
var scaleFactor;
var curPanelId;

var isPlaying = 2;  //treating 2 as init, 1 as autoplay and 0 as stop
var delay = 3000;

var videoIsPlaying = false;
var videoParent = null;
var videoPlayer = null;

var timer = null;

function getPanelCount() {
    // get panel count
    var inputs = document.getElementsByTagName('input');
    for (var i = 0; i < inputs.length; i++) {
        var input = inputs[i];
        if (input.id.match("PanelCount")) {
            return parseInt(input.value);
        }
    }
    return 0;
}

function initializeSize() {

    // get panel count
    numPanels = getPanelCount();
    
    // calculate scale factor
    scaleFactor = 1 / numPanels;

    for (var n = 0; n <= numPanels + 2; n++) {
        
        // calculate panel size
        PanelSizes[n] = CalculatePanelSize(n);
        
        // assign panel size
        if (n >= 1 && n <= numPanels) {
            // get panel and image objects
            var divObj = $get("Carousel_Panel" + n);
            var imgObj = $get("Carousel_Image" + n);

            // create and play scale animations for panel and image
            AjaxControlToolkit.Animation.ResizeAnimation.play(divObj, .1, 30, PanelSizes[n].Width, PanelSizes[n].Height, "px");
            AjaxControlToolkit.Animation.ResizeAnimation.play(imgObj, .1, 30, PanelSizes[n].Width, PanelSizes[n].Height, "px");
        }
    }

    return true;
}

function initializePosition() {

    for (var n = 0; n <= numPanels + 2; n++) {

        // calculate panel positions
        PanelVisualPositions[n] = CalculatePanelPosition(n);
        
        if (n >= 1 && n <= numPanels) {
            // get panel and image objects
            var divObj = $get("Carousel_Panel" + n);
            var imgObj = $get("Carousel_Image" + n);

            // position panels
            divObj.style.left = PanelVisualPositions[n].X + 'px';
            divObj.style.top = PanelVisualPositions[n].Y + 'px';
        }
    }
    
    // display first CTA
    document.getElementById("content" + numPanels).style.display = "block";

    return true;
}

function Position(x, y) {
    this.X = x;
    this.Y = y;
}

function Size(width, height) {
    this.Width = width;
    this.Height = height;
}

//function setPosition(obj, index) {
//    var itemAngle = angleStart - (theta * (numPanels - index));
//    var yAdjust = index != 1 ? 0 : -10;
//    yAdjust = index == 0 ? -40 : yAdjust;
//    obj.style.left = xOffset + r * Math.cos(itemAngle) + 'px';
//    obj.style.top = yOffset + r * Math.sin(itemAngle) + yAdjust + 'px';
//}

//function CalculatePanelPosition(index) {
//    // calculate item angle
//    var itemAngle = angleStart - (theta * (numPanels - index));

//    // adjust y
//    var yAdjust = index != 1 ? 0 : -10;
//    yAdjust = index == 0 ? -40 : yAdjust;

//    // create position object
//    var pos = new Position(xOffset + r * Math.cos(itemAngle), (yOffset + r * Math.sin(itemAngle)) + yAdjust);

//    // return new position
//    return pos;
//}

function CalculatePanelPosition(index) {
    // calculate offset multiplier
    var multiplier = index / numPanels;
    
    // create position
    var x = multiplier * xFinalAdjust;
    if (index < 4 && numPanels > 4) { x = multiplier * xFinalAdjust + ((4 - index) * 10); }
    var y = yStart + multiplier * yFinalAdjust;
    var pos = new Position(x, y);

    // return new position
    return pos;
}

function CalculatePanelSize(index) {
    // calculate scale
    var scale = (index * scaleFactor);
    
    // create size
    var size = new Size(scale * assetWidth, scale * assetHeight);
    if (index == 1 && numPanels > 4) { size = new Size((5 / (numPanels * 3)) * assetWidth, (5 / (numPanels * 3)) * assetHeight); }
    
    // return size
    return size;
}

function advanceCarousel() {
    switch (isPlaying) {
        case 2:
            timer = setTimeout("startCarousel();", delay); //needs to be deferred, otherwise script tries to run before animation is ready
            break;
        case 1:
            moveForward(numPanels - 1);
            timer = setTimeout("advanceCarousel();", delay);
            break;
        case 0:
            break;
    }
}

function startCarousel() {
    // exit if already playing otherwise multiple timers are instantiated
    if (isPlaying == 1) return;

    // stop video and remove player
    if (videoIsPlaying) {
        stopVideo();
    }

    // otherwise set flag and start playing
    isPlaying = 1;
    advanceCarousel();
}

function stopCarousel() {
    clearTimeout(timer);
    isPlaying = 0;
    stopVideo();
}

function stopVideo() {
    // stop video and remove player
    if (videoIsPlaying) {
        if ($get('VideoPanel') != null) {
            var videoPanel = $get('VideoPanel');
            videoPanel.style.display = 'none';
        }
        videoPlayer.url = "";
        videoIsPlaying = false;
    }
}

function focusPanel(panelId)
{
    $get("Carousel_Panel" + panelId).style.zIndex = 50;
    clearTimeout(timer);
    isPlaying = 0;
}

function blurPanel(panelId)
{
    $get("Carousel_Panel" + panelId).style.zIndex = panelId;
}

// parallel const       new AjaxControlToolkit.Animation.ParallelAnimation(target, duration, fps, animations);
// move constructor  	new AjaxControlToolkit.Animation.MoveAnimation(target, duration, fps, horizontal, vertical, relative, unit);
// fadein const         new AjaxControlToolkit.Animation.FadeInAnimation(target, duration, fps, minimumOpacity, maximumOpacity, forceLayoutInIE)
// fadeout const        new AjaxControlToolkit.Animation.FadeOutAnimation(target, duration, fps, minimumOpacity, maximumOpacity, forceLayoutInIE)
// script const         new AjaxControlToolkit.Animation.ScriptAction(target, duration, fps, script);
// enable const         new AjaxControlToolkit.Animation.EnableAction(target, duration, fps, enabled);
// scale const          new AjaxControlToolkit.Animation.ScaleAnimation(target, duration, fps, scaleFactor, unit, center, scaleFont, fontUnit)
// sequence const       new AjaxControlToolkit.Animation.SequenceAnimation(target, duration, fps, animations, iterations);
// resize const         new AjaxControlToolkit.Animation.ResizeAnimation(target, duration, fps, width, height, unit);
// opacity const        new AjaxControlToolkit.Animation.OpacityAction(target, duration, fps, opacity);

function buildAnimation()
{
    var animation = $find("aeBringForward").get_OnClickBehavior().get_animation();
    animation.clear();
    animation.add(new AjaxControlToolkit.Animation.EnableAction(null, .001, null, false));
    animation.add(new AjaxControlToolkit.Animation.ScriptAction(null, .001, null, "$get('Carousel_Panel" + curPanelId + "').style.zIndex=" + curPanelId));
    var hiddenPanels = new Array();
    
    for (var i = numPanels; i > curPanelId; i--) {
        hiddenPanels[hiddenPanels.length] = i;
        
        // create parallel animation handler
        var parallel = new AjaxControlToolkit.Animation.ParallelAnimation(null, .2, 30, null);
        
        // slide one forward + hide
        // get position
        var newxOffset = PanelVisualPositions[numPanels + 1].X;
        var newyOffset = PanelVisualPositions[numPanels + 1].Y;

        // create move animation
        var moveout = new AjaxControlToolkit.Animation.MoveAnimation($get("Carousel_Panel" + i), .1, 30, newxOffset, newyOffset, false, "px");
        parallel.add(moveout);
        
        // create fade out animation
        var fadeout = new AjaxControlToolkit.Animation.FadeOutAnimation($get("Carousel_Panel"+i), null, null, 0, 1, null);
        parallel.add(fadeout);
        
        // slide everything behind it forward
        for (var j = i-1; j >= 1; j--) {
            // get position
            var newxOffset = PanelVisualPositions[(j + Math.abs(numPanels - i) + 1)].X;
            var newyOffset = PanelVisualPositions[(j + Math.abs(numPanels - i) + 1)].Y;

            // create move animation
            var move = new AjaxControlToolkit.Animation.MoveAnimation($get("Carousel_Panel"+j), .1, 30, newxOffset, newyOffset, false, "px");
            parallel.add(move);

            // create panel scale animation
            var pnlScale = new AjaxControlToolkit.Animation.ResizeAnimation($get("Carousel_Panel" + j), .1, 30, PanelSizes[j + Math.abs(numPanels - i) + 1].Width, PanelSizes[j + Math.abs(numPanels - i) + 1].Height, "px");
            parallel.add(pnlScale);

            // create image scale animation
            var imgScale = new AjaxControlToolkit.Animation.ResizeAnimation($get("Carousel_Image" + j), .1, 30, PanelSizes[j + Math.abs(numPanels - i) + 1].Width, PanelSizes[j + Math.abs(numPanels - i) + 1].Height, "px");
            parallel.add(imgScale);
        }

        for (var k = 0; k < hiddenPanels.length - 1; k++) {
            // get position
            var newxOffset = PanelVisualPositions[(numPanels - i - k + 1)].X;
            var newyOffset = PanelVisualPositions[(numPanels - i - k + 1)].Y;

            // create move animation
            var move = new AjaxControlToolkit.Animation.MoveAnimation($get("Carousel_Panel" + hiddenPanels[k]), .1, 30, newxOffset, newyOffset, false, "px");
            parallel.add(move);

            // create panel scale animation
            var pnlScale = new AjaxControlToolkit.Animation.ResizeAnimation($get("Carousel_Panel" + hiddenPanels[k]), .1, 30, PanelSizes[numPanels - i - k + 1].Width, PanelSizes[numPanels - i - k + 1].Height, "px");
            parallel.add(pnlScale);

            // create image scale animation
            var imgScale = new AjaxControlToolkit.Animation.ResizeAnimation($get("Carousel_Image" + hiddenPanels[k]), .1, 30, PanelSizes[numPanels - i - k + 1].Width, PanelSizes[numPanels - i - k + 1].Height, "px");
            parallel.add(imgScale);
        }
        
        // add parallel animation to main animation handler
        animation.add(parallel);


        //***************** move hidden panel to the back and resize
        // create new parallel animation handler
        parallel = new AjaxControlToolkit.Animation.ParallelAnimation(null, .2, 30, null);
        
        // adjust the z-index of the currenty hidden one
        parallel.add(new AjaxControlToolkit.Animation.ScriptAction(null, .001, null, "$get('Carousel_Panel" + i + "').style.zIndex = " + 0));
        parallel.add(new AjaxControlToolkit.Animation.ScriptAction(null, .001, null, "$get('Carousel_Panel" + i + "').style.left = " + PanelVisualPositions[0].X));
        parallel.add(new AjaxControlToolkit.Animation.ScriptAction(null, .001, null, "$get('Carousel_Panel" + i + "').style.top = " + PanelVisualPositions[0].Y));
        parallel.add(new AjaxControlToolkit.Animation.ScriptAction(null, .001, null, "$get('Carousel_Panel" + i + "').style.width = " + PanelSizes[0].Width));
        parallel.add(new AjaxControlToolkit.Animation.ScriptAction(null, .001, null, "$get('Carousel_Panel" + i + "').style.height = " + PanelSizes[0].Height));
        parallel.add(new AjaxControlToolkit.Animation.ScriptAction(null, .001, null, "$get('Carousel_Image" + i + "').style.width = " + PanelSizes[0].Width));
        parallel.add(new AjaxControlToolkit.Animation.ScriptAction(null, .001, null, "$get('Carousel_Image" + i + "').style.height = " + PanelSizes[0].Height));
        
        // add parallel animtion to main animation handler
        animation.add(parallel);

        
        // ************************* fade in and move into place *****************************     
        // create new parallel animation handler
        parallel = new AjaxControlToolkit.Animation.ParallelAnimation(null, .2, 30, null);
        
        // create fade in animation
        var fadein = new AjaxControlToolkit.Animation.FadeInAnimation($get("Carousel_Panel"+i), .1, 30, 0, 1, null);
        parallel.add(fadein); 
        
        // create move animation
        var move = new AjaxControlToolkit.Animation.MoveAnimation($get("Carousel_Panel" + i), null, null, PanelVisualPositions[1].X, PanelVisualPositions[1].Y, false, "px");
        parallel.add(move);
        
        // create panel scale animation
        var pnlScale = new AjaxControlToolkit.Animation.ResizeAnimation($get("Carousel_Panel" + i), .1, 30, PanelSizes[1].Width, PanelSizes[1].Height, "px");
        parallel.add(pnlScale);

        // create image scale animation
        var imgScale = new AjaxControlToolkit.Animation.ResizeAnimation($get("Carousel_Image" + i), .1, 30, PanelSizes[1].Width, PanelSizes[1].Height, "px");
        parallel.add(imgScale);
        
        // add parallel animtion to main animation handler
        animation.add(parallel);
    }
    
    // add scripts to run along side visual animations
    animation.add(new AjaxControlToolkit.Animation.ScriptAction(null, .001, null, "updatePanels()"));
    animation.add(new AjaxControlToolkit.Animation.ScriptAction(null, .001, null, "resetAttributes()"));
    
    // enable target
    animation.add(new AjaxControlToolkit.Animation.EnableAction(null, .001, null, true));
}

function moveForward(panelId) {

    // stop video and remove player
    if (videoIsPlaying) {
        var videoPanel = $get('VideoPanel');
        videoPanel.style.display= 'none';
        videoPlayer.url = "";
    }

    curPanelId = panelId;
    removeAttributes();
    buildAnimation();
    var animation = $find("aeBringForward").get_OnClickBehavior();
    animation.play();

    // hide content panels
    for (var i = 1; i <= numPanels; i++) {
        $get("content" + i).style.display = "none";
    }

    // show current content panel
    document.getElementById("content" + panelId).style.display = "block";
}

function checkHide(panelId)
{
    return curPanelId < panelId;
}

function removeAttributes()
{
    // kill all click/mouseover on all panels
    for (var i = 1; i <= numPanels; i++)
    {
        var elem = $get("Carousel_Panel" + i);
        elem.onclick = "";
        elem.onmouseover = "";
        elem.onmouseout = "";   
    }
}

function setZs()
{
    for (var i = 1; i <= numPanels; i++)
    {
        if (curPanelId < i)
        {
            $get("Carousel_Panel" + i).style.zIndex = i - numPanels;
        }
    }
}

function resetAttributes()
{
    for (var i = 1; i < numPanels; i++)
    {
        var obj = $get("Carousel_Panel" + i);
        // for every panel behind the one in front
        obj.panelNum = i;
        obj.onclick = function() { stopCarousel(); moveForward(this.panelNum); };
        obj.onmouseover = function(){focusPanel(this.panelNum)};
        obj.onmouseout = function(){blurPanel(this.panelNum)};
        obj.style.zIndex = i;
    }
    
    // the one in front
    var obj = $get("Carousel_Panel" + numPanels);
    obj.onclick = "stopCarousel();";
    obj.onmouseover = "";
    obj.onmouseout = "";
    obj.style.zIndex = numPanels;
}

function updatePanels()
{
    var panels = new Array();
    var images = new Array();
    var ctas = new Array();
    for (var i = 1; i <= numPanels; i++)
    {
        panels[i-1] = $get("Carousel_Panel" + i);
        images[i - 1] = $get("Carousel_Image" + i);
        ctas[i - 1] = $get("content" + i);
    }
    for (var i = 1; i <= numPanels; i++)
    {
        var newPanelId = parseInt(((numPanels - curPanelId + i) % numPanels), 10);
        newPanelId = newPanelId == 0 ? numPanels : newPanelId;
        panels[i-1].id = "Carousel_Panel" + newPanelId;
        images[i - 1].id = "Carousel_Image" + newPanelId;
        ctas[i - 1].id = "content" + +newPanelId;
    }
}

function CreateVideoPlayer(video, obj, browser) {
    if (obj.parentNode.style.zIndex != numPanels) { return; }

    stopCarousel();

    var videoPanel = $get('VideoPanel');    
    videoPanel.style.top = parseInt(obj.parentNode.style.top) - 10 + "px";
    videoPanel.style.left = parseInt(obj.parentNode.style.left) - 13 + "px";
    videoPanel.style.display = "block";
    videoPanel.style.width = obj.parentNode.style.width;
    videoPanel.style.height = obj.parentNode.style.height;

    videoIsPlaying = true;

    videoPlayer = $get('VideoPlayer');
    videoPlayer.attachEvent("playStateChange",VideoPlayStateChange);
    videoPlayer.url = video;
    videoPlayer.controls.play();
}

function HandleHyperlinkClick(hyperlink, obj) {

    // do nothing if panel is not in front
    if (obj.parentNode.style.zIndex != numPanels) { return; }
    
    // stop the carousel
    stopCarousel();

    // navigate to url
    if (hyperlink.toLowerCase().indexOf('http') > -1) {
        window.open(hyperlink);
    }
    else {
        window.location.href = hyperlink;
    }
}

//function OnDSPlayStateChangeEvt(NewState) {
//    alert(NewState);
//}


function VideoPlayStateChange() {

    if (videoIsPlaying) {
        window.status = window.status + videoPlayer.playstate + " - ";
        if (videoPlayer.playstate == 8) {
            stopVideo();
        }
        if (videoPlayer.playstate == 10) {
            if (videoPlayer.url != "") {
                window.status = videoPlayer.url;
                setTimeout(DelayVideoPlay, 150);
            }
        }
    }
}

function DelayVideoPlay() {
    videoPlayer.controls.play();
}