$(document).ready(function () {

    var redLinkBg = $("#red-link").css("background-color");
    var blueLinkBg = $("#blue-link").css("background-color");
    var yellowLinkBg = $("#yellow-link").css("background-color");
    var orangeLinkBg = $("#orange-link").css("background-color");

    $('#red-link').click(function () {
        ToggleBack(redLinkBg);

        //wait till all anims are done...
        $("div").promise().done(function () {
            $("#screen-one").slideToggle();

            //switch color of link's bgColor
            if ($("#red-link").css("background-color") === redLinkBg) {
                $("#red-link").css("background-color", "#55B047");
                ActiveDiv("#screen-one");
            }
            else {
                $("#red-link").css("background-color", redLinkBg);
                ActiveDiv(".screen-list");
            }
        });
    });

    $('#blue-link').click(function () {
        ToggleBack(blueLinkBg);

        //wait till all anims are done...
        $("div").promise().done(function () {
            $('#screen-two').animate({ width: 'toggle' });

            //switch color of link's bgColor
            if ($("#blue-link").css("background-color") === blueLinkBg) {
                $("#blue-link").css("background-color", "#55B047");
                ActiveDiv("#screen-two");
            }
            else {
                $("#blue-link").css("background-color", blueLinkBg);
                ActiveDiv(".screen-list");
            }
        });
    });

    $('#yellow-link').click(function () {
        ToggleBack(yellowLinkBg);

        //wait till all anims are done...
        $("div").promise().done(function () {
            $('#screen-three').slideToggle();

            //switch color of link's bgColor
            if ($("#yellow-link").css("background-color") === yellowLinkBg) {
                $("#yellow-link").css("background-color", "#55B047");
                ActiveDiv("#screen-three");
            }
            else {
                $("#yellow-link").css("background-color", yellowLinkBg);
                ActiveDiv(".screen-list");
            }
        });
    });

    $('#orange-link').click(function () {
        ToggleBack(orangeLinkBg);

        //wait till all anims are done...
        $("div").promise().done(function () {
            $('#screen-four').animate({ width: 'toggle' });

            //switch color of link's bgColor
            if ($("#orange-link").css("background-color") === orangeLinkBg) {
                $("#orange-link").css("background-color", "#55B047");
                ActiveDiv("#screen-four");
            }
            else {
                $("#orange-link").css("background-color", orangeLinkBg);
                ActiveDiv(".screen-list");
            }
        });
    });


    function ToggleBack(thatColor) {
        var thisColor = $("div[screen=active]").css("background-color");

        if (thatColor !== thisColor) {

            switch (thisColor) {
                case redLinkBg:
                    $('#red-link').click();
                    $("#red-link").css("background-color", redLinkBg);
                    ActiveDiv(".screen-list");
                    break;
                case blueLinkBg:
                    $('#blue-link').click();
                    $("#blue-link").css("background-color", blueLinkBg);
                    ActiveDiv(".screen-list");
                    break;
                case yellowLinkBg:
                    $('#yellow-link').click();
                    $("#yellow-link").css("background-color", yellowLinkBg);
                    ActiveDiv(".screen-list");

                    break;
                case orangeLinkBg:
                    $('#orange-link').click();
                    $("#orange-link").css("background-color", orangeLinkBg);
                    ActiveDiv(".screen-list");
                    break;
            }
        }
    }

    function ActiveDiv(selectElem) {
        $("div").attr("screen", "passive");
        $(selectElem).attr("screen", "active");
    }

    function ResetColors() {
        $("#red-link").css("background-color", redLinkBg);
        $("#blue-link").css("background-color", blueLinkBg);
    }

    $(".tweet").tweet({
        join_text: "auto",
        username: "onurcaglayan",
        avatar_size: 0,
        count: 6,
        auto_join_text_default: "simon said,",
        auto_join_text_ed: "simon ",
        auto_join_text_ing: "simon was",
        auto_join_text_reply: "simon replied",
        auto_join_text_url: "simon was checking out",
        loading_text: "loading tweets..."
    });

    $('#rss-reader').rssfeed('http://onurcaglayan.wordpress.com/feed/', {
        limit: 5
    });

});