
$(function () {


    var smallbox = {

        timeInterval: 6000,

        css: {
            collapsed: { "margin-left": "-320px" },
            expanded: { "margin-left": "0px" },
            show: { "opacity": 1 },
            hide: { "opacity": 0 },
            bottom: { "z-index": 20 },
            middle: { "z-index": 21 },
            top: { "z-index": 22 }
        },

        initAnimation: function () {

            var fn = this;

            $(".smallboxContainer").delegate(".rtIcon.open, .contentbox.static", "click", function () {
                var parent = $(this).parents(".smallbox:first");
                if (parent.hasClass("animating")) return (false);
                parent.addClass("animating");
                //			parent.find(".expandbox").addClass("expanded").css(fn.css.hide).animate(fn.css.show, 400);
                parent.find(".expandbox").addClass("expanded");
                parent.find(".TypeMenu, .propImages img").stop(true).css(fn.css.hide).animate(fn.css.show, 400, function () { parent.removeClass("animating"); });
                parent.find(".shiftbox").stop(true).css(fn.css.collapsed).animate(fn.css.expanded, 400, function () { parent.removeClass("animating"); });
            });


            $(".smallboxContainer").delegate(".rtIcon.close", "click", function () {
                var parent = $(this).parents(".smallbox:first");
                if (parent.hasClass("animating")) return (false);
                parent.addClass("animating");
                parent.find(".shiftbox").stop(true).css(fn.css.expanded).animate(fn.css.collapsed, 400, function () {
                    parent.removeClass("animating").find(".expandbox").removeClass("expanded");
                });
                parent.find(".TypeMenu, .propImages img").stop(true).css(fn.css.show).animate(fn.css.hide, 400, function () {
                    parent.removeClass("animating").find(".expandbox").removeClass("expanded");
                });
            });

            /*
            $(".smallboxContainer").delegate(".contentbox.expandbox", "mouseout", function(){
            console.log($(this));
            var parent=$(this).parents(".smallbox:first");
            if (parent.hasClass("animating")) return(false);
            if (!$(this).hasClass("contentbox")) return(false);
            parent.addClass("animating");
            parent.find(".shiftbox").stop(true).css(fn.css.expanded).animate(fn.css.collapsed, 400, function(){
            parent.removeClass("animating").find(".expandbox").removeClass("expanded");
            });
            parent.find(".TypeMenu, .propImages img").stop(true).css(fn.css.show).animate(fn.css.hide, 400, function(){
            parent.removeClass("animating").find(".expandbox").removeClass("expanded");
            });
            });
            */

            $(".smallboxContainer").delegate(".TypeMenuitem", "click", function () {
                var types = ["Residential", "Shopping-Malls", "Office", "Industial-Buildings", "Mainland"];
                for (var type in types) {
                    if ($(this).hasClass(types[type])) break;
                }
                var me = $(this);
                me.addClass("active").siblings(".TypeMenuitem").removeClass("active");
                setTimeout(function () {
                    me.parents(".smallbox:first").find(".propContent." + types[type]).addClass("active").siblings(".propContent").removeClass("active");
                }, 1);
            });


            $(".smallboxContainer .TypeMenuitem").hover(function () {
                $(this).addClass("hover").siblings(".TypeMenuitem").removeClass("hover");
            }, function () {
                $(this).removeClass("hover");
            });


            $(".propContent .propNames").delegate(".list>div", "mouseover", fn.switchTo);


            /*
            $(".propContent.active .propNames .list").each(function(){
            var list=$(this);
            setInterval(function(){
            var total=list.children("div").not(".more").length;
            var oldindex=list.children("div").index(list.find(".active"));
            var index=(oldindex+1)%total;
            fn.switchTo.call(list.children("div")[index]);
            }, fn.timeInterval);
            fn.switchTo.call(list.children("div")[0]);
            });
            */

            $("#CSR").hover(function () {
                $(this).addClass("hover");
            }, function () {
                $(this).removeClass("hover");
            });


            $(".propImages").each(function () {
                $(this).find("div:first").css(fn.css.top).siblings().css(fn.css.bottom);
            });

        },

        switchTo: function (e) {
            if ($(this).hasClass("active")) return (false);
            var fn = smallbox;
            var list = $(this).parents(".propContent.active .propNames .list");
            var oldindex = list.children("div").index(list.find(".active"));
            $(this).addClass("active").siblings().removeClass("active");
            var index = $(this).parent().children().index(this);

            $(this).parents(".propContent:first").find(".propImages").find("div:eq(" + oldindex + ")").css(fn.css.middle).siblings("div").css(fn.css.bottom);
            $(this).parents(".propContent:first").find(".propImages").find("div:eq(" + index + ")").css(fn.css.hide).css(fn.css.top).animate(fn.css.show, 200);
        }

    }


    var slidebar = {

        init: function () {


            $(".liSlidebar .item .button .plus").click(function () {
                toggleItem($(this).parents(".item:first"));
            });

            var toggleItem = function (item) {

                if (!item.hasClass("animating")) {
                    var content = item.find(".content:first");
                    var widthSet = { "width": parseInt($(".liSlidebar").width()) + "px" };
                    if (item.hasClass("opened")) {
                        /*close it!*/
                        content.css(widthSet).animate({ "width": "1px" }, 400, function () { item.removeClass("animating").removeClass("opened") });
                    } else {
                        /*open it!*/
                        item.addClass("opened").addClass("animating");
                        content.css({ "width": "1px" }).animate(widthSet, 400, function () { item.removeClass("animating") });
                    }
                }
            };
        }

    }



    var bigbanner = {
        timeInterval: 5000,
        timer: null,
        fadeInterval: 2000,
        css: {
            show: { "opacity": 1 },
            hide: { "opacity": 0 },
            bottom: { "z-index": 20 },
            middle: { "z-index": 21 },
            top: { "z-index": 22 }
        },
        init: function () {

            var fn = this;

            $("#bigbanner .images div:first").show();

            /*
            var clone=$("#bigbanner .text .bullets").html();
            for (var i=1;i<$("#bigbanner .images div").length;i++){
            $(clone).appendTo($("#bigbanner .text .bullets"));
            }
            */
            $("#bigbanner .text .bullets").delegate("span", "click", function () {
                var list = $("#bigbanner .text .bullets span");
                var oldindex = list.index($("#bigbanner .text .bullets span.active"));
                var index = list.index(this);
                var interval = $(this).hasClass("init") ? 0 : fn.fadeInterval;
                $(this).addClass("active").siblings().removeClass("active");

                $("#bigbanner .text .alttext a, #bigbanner .text .alttext span").filter(":eq(" + index + ")").show().siblings().hide();

                $("#bigbanner .images").find("div:eq(" + oldindex + ")").css(fn.css.middle).siblings("div").css(fn.css.bottom);
                $("#bigbanner .images").find("div:eq(" + index + ")").show().css(fn.css.hide).css(fn.css.top).animate(fn.css.show, interval, function () {
                    if (oldindex >= 0)
                        $("#bigbanner .images").find("div:eq(" + oldindex + ")").hide();
                });

                fn.setTimer();
            });

            $("#bigbanner .text .bullets").find("span:first").addClass("init").click().removeClass("init");


            fn.setTimer();

        },

        setTimer: function () {
            var fn = this;
            clearInterval(fn.timer);
            fn.timer = setInterval(function () {
                var list = $("#bigbanner .text .bullets span");
                var total = list.length;
                var oldindex = list.index(list.filter(".active"));
                var index = (oldindex + 1) % total;

                list.parent().children("span:eq(" + index + ")").click();
            }, fn.timeInterval);
        }
    }





    smallbox.initAnimation();
    slidebar.init();
    bigbanner.init();





});

