var lettersLoaded = false;
var leftSplashLoaded = false;
var rightSplashLoaded = false;
function loadLettersVideo() {
    $('#lettersClickIndicator').hide();
    if (!lettersLoaded) {
        $('#lettersVideo').get(0).play();
        $('#lettersVideo').bind("ended", function () { hideLettersVideo(); });
        setTimeout("showLettersImage()", 3000);
        lettersLoaded = true;
    }
}

function showLettersImage() {
    $('#lettersImage').fadeIn("slow");
}

function hideLettersVideo() {
    $('#lettersBackgroundImage').fadeIn("slow");
    $('#lettersVideo').fadeOut("fast");
}

function loadLeftSplashVideo() {
    $('#leftSplashClickIndicator').hide();
    if (!leftSplashLoaded) {
        $('#leftSplashVideo').get(0).play();
        $('#leftSplashVideo').bind("ended", function () { hideLeftSplashVideo(); });
        setTimeout("showLeftSplashImage()", 3000);
        leftSplashLoaded = true;
    }
}

function showLeftSplashImage() {
    if (rightSplashLoaded) {
        $('#finalDevicesImage').fadeIn("slow");
        // $('#rightDevicesImage').fadeOut("slow");
    } else {
        $('#leftDevicesImage').fadeIn("slow");
    }
}

function hideLeftSplashVideo() {
    // $('#leftSplashBackgroundImage').show();
    // $('#leftSplashVideo').hide();
    if (rightSplashLoaded) {
        $('#devicesOutline').hide();
    }
}

function loadRightSplashVideo() {
    $('#rightSplashClickIndicator').hide();
    if (!rightSplashLoaded) {
        $('#rightSplashVideo').get(0).play();
        $('#rightSplashVideo').bind("ended", function () { hideRightSplashVideo(); });
        setTimeout("showRightSplashImage()", 3000);
        rightSplashLoaded = true;
    }
}

function showRightSplashImage() {
    if (leftSplashLoaded) {
        $('#finalDevicesImage').fadeIn("slow");
        // $('#leftDevicesImage').fadeOut("slow");
    } else {
        $('#rightDevicesImage').fadeIn("slow");
    }
}

function hideRightSplashVideo() {
    // $('#rightSplashBackgroundImage').show();
    // $('#rightSplashVideo').hide();
    if (leftSplashLoaded) {
        $('#devicesOutline').hide();
    }
}

function flashIndicators() {
    var ind1Area = Raphael("lettersClickIndicator", 300, 200);
    var ind2Area = Raphael("leftSplashClickIndicator", 300, 300);
    var ind3Area = Raphael("rightSplashClickIndicator", 200, 300);

    var ind1 = ind1Area.circle(200, 160, 20).attr({ fill: "#EFEFEF", stroke: "#303030" });
    var ind2 = ind2Area.circle(220, 240, 20).attr({ fill: "#EFEFEF", stroke: "#303030" });
    var ind3 = ind3Area.circle(100, 260, 20).attr({ fill: "#EFEFEF", stroke: "#303030" });

    function hideCircle1() {
        if ($('#lettersClickIndicator').is(":visible")) {
            ind1.animate({ opacity: "0" }, 1500, showCircle1);
        }
    }
    function showCircle1() {
        if ($('#lettersClickIndicator').is(":visible")) {
            ind1.animate({ opacity: "1" }, 1500, hideCircle1);
        }
    }
    function hideCircle2() {
        if ($('#leftSplashClickIndicator').is(":visible")) {
            ind2.animate({ opacity: "0" }, 1500, showCircle2);
        }
    }
    function showCircle2() {
        if ($('#leftSplashClickIndicator').is(":visible")) {
            ind2.animate({ opacity: "1" }, 1500, hideCircle2);
        }
    }
    function hideCircle3() {
        if ($('#rightSplashClickIndicator').is(":visible")) {
            ind3.animate({ opacity: "0" }, 1500, showCircle3);
        }
    }
    function showCircle3() {
        if ($('#rightSplashClickIndicator').is(":visible")) {
            ind3.animate({ opacity: "1" }, 1500, hideCircle3);
        }
    }

    hideCircle1();
    hideCircle2();
    hideCircle3();
}