﻿
var flag = 0;

$(document).ready(function() {
    $(".tocTitle").click(function() {
        $(".tocPanel").toggle();

        if ($("#tocFoldUp").hasClass("ui-icon-circle-triangle-s")) {
            $("#tocFoldUp").removeClass("ui-icon-circle-triangle-s");
            $("#tocFoldUp").addClass("ui-icon-circle-triangle-n");
        } else {
            $("#tocFoldUp").removeClass("ui-icon-circle-triangle-n");
            $("#tocFoldUp").addClass("ui-icon-circle-triangle-s");
        }
    });

    $("#divOverviewMap").click(function() {
        $("#divOverviewMap").toggle();
        $("#imgOverviewMap").toggle();
    });

    $("#imgOverviewMap").click(function() {
        $("#divOverviewMap").toggle();
        $("#imgOverviewMap").toggle();
    });


    $('#tabs').tabs();
    $("#tab_data").tabs();
    $("#accordion-1").accordion({ header: "h3", autoheight: false, animated: false });
    $("#accordion-2").accordion({ header: "h3", autoheight: false, animated: false });
    $("#accordion-3").accordion({ header: "h3", autoheight: false, animated: false });

    $("#accordion-2").hide();
    $("#accordion-3").hide();
    $("#queryData").hide();
    $("#tab01").click(function() {
        $(".mytab").hide();
        $("#accordion-1").show();
        $("#minitabs-div").css({ 'width': '250px' });
        flag = 0;
    });
    $("#tab02").click(function() {
        $(".mytab").hide();
        $("#accordion-2").show();
        $("#queryData").show();
        $("#minitabs-div").css({ 'width': '250px' });
        flag = 1;
    });
    $("#tab03").click(function() {
        $(".mytab").hide();
        $("#accordion-3").show();
        $("#accordion-3").css({ 'width': '400px' });
        $("#minitabs-div").css({ 'width': '400px' });
        flag = 0;
    });

    $("#btnPanelToggle").click(function() {
        var windowWidth = $(window).width();
        var leftPanelWidth = $(".leftPanel").width();
        var leftPanelLeft = $(".leftPanel").css("left");

        if (leftPanelLeft == "0px") {
            $(".leftPanel").animate({ left: -leftPanelWidth }, 500);
            $("#map1").css({ 'width': windowWidth });
            $("#map1").css({ 'left': "0px" });
        } else {
            $(".leftPanel").animate({ left: "0px" }, 500);
            $("#map1").css({ 'width': windowWidth - leftPanelWidth });
            $("#map1").css({ 'left': leftPanelWidth });
        }

        // 依照ESRI論壇來做的,還是有問題.
        //var map = Maps['<%=map1.ClientID %>'];
        //map.redraw();
        var map = $find('map1');
        map.refresh();

        if ($(this).hasClass("ui-icon-circle-triangle-w")) {
            $(this).removeClass("ui-icon-circle-triangle-w");
            $(this).addClass(" ui-icon-circle-triangle-e");
            $("#queryData").hide();
        } else {
            $(this).removeClass("ui-icon-circle-triangle-e");
            $(this).addClass(" ui-icon-circle-triangle-w");
            if (flag == 1) {
                $("#queryData").show();
            }
        }
    });


    resize_window();

    $(window).resize(function() {
        resize_window();
    });
});

function resize_window() {
    var windowHeight = $(window).height();
    var windowWidth = $(window).width();
    var headerHeight = $(".header").height();
    var toolbarHeight = $(".toolbar").height();
    var footerHeight = $(".footer").height();
    var leftPanelWidth = $(".leftPanel").width();

    $("#map1").css({ 'height': windowHeight - headerHeight - footerHeight - toolbarHeight });
    $(".leftPanel").css({ 'height': windowHeight - headerHeight - footerHeight });
    $("#queryData").css({ 'height': windowHeight - headerHeight - footerHeight - toolbarHeight });
    $(".header").css({ 'width': windowWidth });
    $(".toolbar").css({ 'width': windowWidth });
    $(".footer").css({ 'width': windowWidth });
    $("#map1").css({ 'width': windowWidth });

    if ($(".leftPanel").css('left') == "0px") {
        $("#map1").css({ 'width': windowWidth - leftPanelWidth });
        $("#map1").css({ 'left': leftPanelWidth });
    } else {
        $("#map1").css({ 'width': windowWidth });
        $("#map1").css({ 'left': "0px" });
    }
};

function close_map_alert() {
    $("#PanelAlert").hide("slow");
}