$(document).ready(function() {
    


    $("#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);
        }
    });
}