$(document).ready(function() {
    $("#hotitems").animate({ opacity: 0 }, 0);

    $("#hotwpm").click(function() {
        $("#hotitemsBorder").uncorner();
        $("#hotitems").removeClass($("#hotitems").attr("class"));
        $("#hotitems").addClass("hotitems_wpm");
        $("#hotitemsBorder").animate({ width: 250, height: 440 }, 500);
        $("#hotitemsBorder").corner("round 8px").parent().corner("round 10px");

        $("#hp_header1").removeClass($("#hp_header1").attr("class"));
        $("#hp_header1").addClass("hp_header hp_header_wpm");
        $("#hp_header1").animate({ opacity: 100 }, 0);
        $("#hp_header1").attr("style", "background-image: url(/images/common/hotproducts/hp_coway.gif);");
        $("#ld_items1").animate({ opacity: 100 }, 0);
        $("#hp_items1").removeClass($("#hp_items1").attr("class"));
        $("#hp_items1").addClass("hp_items hp_items_wpm");
        $("#hp_items1").animate({ opacity: 0 }, 0);
        $("#hp_more1").unbind("click");
        GetHotProducts("COWAY", "WATER_PRF", 16, "#ld_items1", "#hp_items1");
        $("#hp_more1").click(function() {
            navigateto("coway");
        });

        $("#hp_header2").removeClass($("#hp_header2").attr("class"));
        $("#hp_header2").addClass("hp_header hp_header_wpm");
        $("#hp_header2").animate({ opacity: 100 }, 0);
        $("#hp_header2").attr("style", "background-image: url(/images/common/hotproducts/hp_saehan.gif);");
        $("#ld_items2").animate({ opacity: 100 }, 0);
        $("#hp_items2").removeClass($("#hp_items2").attr("class"));
        $("#hp_items2").addClass("hp_items hp_items_wpm")
        $("#hp_items2").animate({ opacity: 0 }, 0);
        $("#hp_more2").unbind("click");
        GetHotProducts("SAEHAN", "WATER_PRF", 16, "#ld_items2", "#hp_items2");
        $("#hp_more2").click(function() {
            navigateto("saehan");
        });

        $("#linkwpm").addClass("actived");
        $("#hotwpm").animate({ left: 0 }, 500);
        $("#hotapm").animate({ left: 0 }, 500);
        $("#hotbtp").animate({ left: 0 }, 500);
        $("#hotitems").animate({ width: 260, height: 442, opacity: 100 }, 500);
    });
    $("#hotapm").click(function() {
        $("#hotitemsBorder").uncorner();
        $("#hotitems").removeClass($("#hotitems").attr("class"));
        $("#hotitems").addClass("hotitems_apm");
        $("#hotitemsBorder").animate({ width: 250, height: 228 }, 0);
        $("#hotitemsBorder").corner("round 8px").parent().corner("round 10px");

        $("#hp_header1").removeClass($("#hp_header1").attr("class"));
        $("#hp_header1").addClass("hp_header hp_header_apm");
        $("#hp_header1").animate({ opacity: 100 }, 0);
        $("#hp_header1").attr("style", "background-image: url(/images/common/hotproducts/hp_air_prf.gif);");
        $("#ld_items1").animate({ opacity: 100 }, 0);
        $("#hp_items1").removeClass($("#hp_items1").attr("class"));
        $("#hp_items1").addClass("hp_items hp_items_apm")
        $("#hp_items1").animate({ opacity: 0 }, 0);
        GetHotProducts("COWAY", "AIR_PRF", 16, "#ld_items1", "#hp_items1");
        $("#hp_more1").unbind("click");
        $("#hp_more1").click(function() {
            navigateto("air_prf");
        });

        $("#hp_header2").removeClass($("#hp_header2").attr("class"));
        $("#hp_header2").animate({ opacity: 0 }, 0);
        $("#ld_items2").animate({ opacity: 0 }, 0);
        $("#hp_items2").removeClass($("#hp_items2").attr("class"));
        $("#ph_items2").animate({ opacity: 0 }, 0);
        $("#hp_more2").unbind("click");

        $("#linkapm").addClass("actived");
        $("#hotwpm").animate({ left: 120 }, 500);
        $("#hotapm").animate({ left: -120 }, 500);
        $("#hotbtp").animate({ left: 0 }, 500);
        $("#hotitems").animate({ width: 260, height: 230, opacity: 100 }, 500);
    });
    $("#hotbtp").click(function() {
        $("#hotitemsBorder").uncorner();
        $("#hotitems").removeClass($("#hotitems").attr("class"));
        $("#hotitems").addClass("hotitems_btp");
        $("#hotitemsBorder").animate({ width: 250, height: 228 }, 0);
        $("#hotitemsBorder").corner("round 8px").parent().corner("round 10px");

        $("#hp_header1").removeClass($("#hp_header1").attr("class"));
        $("#hp_header1").addClass("hp_header hp_header_btp");
        $("#hp_header1").animate({ opacity: 100 }, 0);
        $("#hp_header1").attr("style", "background-image: url(/images/common/hotproducts/hp_bathroom.gif);");
        $("#ld_items1").animate({ opacity: 100 }, 0);
        $("#hp_items1").removeClass($("#hp_items1").attr("class"));
        $("#hp_items1").addClass("hp_items hp_items_btp")
        $("#hp_items1").animate({ opacity: 0 }, 0);
        GetHotProducts("", "BATHROOM", 16, "#ld_items1", "#hp_items1");
        $("#hp_more1").unbind("click");
        $("#hp_more1").click(function() {
            navigateto("bathroom");
        });

        $("#hp_header2").removeClass($("#hp_header2").attr("class"));
        $("#hp_header2").animate({ opacity: 0 }, 0);
        $("#ld_items2").animate({ opacity: 0 }, 0);
        $("#hp_items2").removeClass($("#hp_items2").attr("class"));
        $("#hp_items2").animate({ opacity: 0 }, 0);
        $("#hp_more2").unbind("click");

        $("#linkbtp").addClass("actived");
        $("#hotwpm").animate({ left: 240 }, 500);
        $("#hotapm").animate({ left: 0 }, 500);
        $("#hotbtp").animate({ left: -240 }, 500);
        $("#hotitems").animate({ width: 260, height: 230, opacity: 100 }, 500);
    });
    $("#itemsClose").click(function() {
        $("#hotitems").animate({ width: 0, height: 0, opacity: 0 }, 500);
        $("#ld_items1").animate({ opacity: 0 }, 0);
        $("#hp_items1").html("");
        $("#ld_items2").animate({ opacity: 0 }, 0);
        $("#hp_items2").html("");
        $("#linkwpm").removeClass("actived");
        $("#linkapm").removeClass("actived");
        $("#linkbtp").removeClass("actived");
    });

    $("#loader").animate({ opacity: 100 }, 0);
    $("#tabDataList").animate({ opacity: 0 }, 0);
    GetNewsAndNotices("NOTICES");

    $("#tabButton1").click(function() {
        $("#tabButton1").addClass("actived");
        $("#tabButton2").removeClass("actived");
        $("#loader").animate({ opacity: 100 }, 0);
        $("#tabDataList").animate({ opacity: 0 }, 500);
        GetNewsAndNotices("NOTICES");
    });
    $("#tabButton2").click(function() {
        $("#tabButton1").removeClass("actived");
        $("#tabButton2").addClass("actived");
        $("#loader").animate({ opacity: 100 }, 0);
        $("#tabDataList").animate({ opacity: 0 }, 500);
        GetNewsAndNotices("NEWS");
    });


    $("#otherbox").animate({ width: 30 }, 0);
    $("#othertitles").animate({ width: 30, opacity: 100 }, 0);
    $("#otherknowns").animate({ width: 0, opacity: 0 }, 0);

    $("#airbox").animate({ width: 30 }, 0);
    $("#airtitles").animate({ width: 30, opacity: 100 }, 0);
    $("#airknowns").animate({ width: 0, opacity: 0 }, 0);

    $("#waterbox").animate({ width: 280 }, 0);
    $("#watertitles").animate({ width: 30, opacity: 0 }, 0);
    $("#waterknowns").animate({ width: 280, opacity: 100 }, 0);

    $("#othertitles").click(function() {
        $("#airbox").animate({ width: 30 }, 500);
        $("#airtitles").animate({ width: 30, opacity: 100 }, 500);
        $("#airknowns").animate({ width: 0, opacity: 0 }, 500);

        $("#waterbox").animate({ width: 30 }, 500);
        $("#watertitles").animate({ width: 30, opacity: 100 }, 500);
        $("#waterknowns").animate({ width: 0, opacity: 0 }, 500);

        $("#otherbox").animate({ width: 280 }, 500);
        $("#othertitles").animate({ width: 30, opacity: 0 }, 500);
        $("#otherknowns").animate({ width: 280, opacity: 100 }, 500);
    });

    $("#airtitles").click(function() {
        $("#otherbox").animate({ width: 30 }, 500);
        $("#othertitles").animate({ width: 30, opacity: 100 }, 500);
        $("#otherknowns").animate({ width: 0, opacity: 0 }, 500);

        $("#waterbox").animate({ width: 30 }, 500);
        $("#watertitles").animate({ width: 30, opacity: 100 }, 500);
        $("#waterknowns").animate({ width: 0, opacity: 0 }, 500);

        $("#airbox").animate({ width: 280 }, 500);
        $("#airtitles").animate({ width: 30, opacity: 0 }, 500);
        $("#airknowns").animate({ width: 280, opacity: 100 }, 500);
    });

    $("#watertitles").click(function() {
        $("#otherbox").animate({ width: 30 }, 500);
        $("#othertitles").animate({ width: 30, opacity: 100 }, 500);
        $("#otherknowns").animate({ width: 0, opacity: 0 }, 0);

        $("#airbox").animate({ width: 30 }, 500);
        $("#airtitles").animate({ width: 30, opacity: 100 }, 500);
        $("#airknowns").animate({ width: 0, opacity: 0 }, 500);

        $("#waterbox").animate({ width: 280 }, 500);
        $("#watertitles").animate({ width: 30, opacity: 0 }, 500);
        $("#waterknowns").animate({ width: 280, opacity: 100 }, 500);
    });
});
function GetNewsAndNotices(type) {
    $.ajax({
        type: "POST",
        url: "/default.aspx/GetNewsAndNotices",
        data: "{'type':'" + type + "'}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(data) {
            $("#loader").animate({ opacity: 0 }, 500);
            $("#tabDataList").html(data.d);
            $("#tabDataList").animate({ opacity: 100 }, 500);
        },
        error: function(xhr, msg, e) {
            alert(msg);
        }
    });
}
function GetHotProducts(brand, group, rows, loader, datalist) {
    $.ajax({
        type: "POST",
        url: "/default.aspx/GetHotProducts",
        data: "{ \"brand\":\"" + brand + "\",\"group\":\"" + group + "\",\"rows\":\"" + rows.toString() + "\"}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(data) {
            $(loader).animate({ opacity: 0 }, 500);
            $(datalist).html(data.d);
            $(datalist).animate({ opacity: 100 }, 500);
        },
        error: function(xhr, msg, e) {
            alert(msg);
        }
    });
}