"use strict";

function toggle_extend_retract_menu(win_id) {
    var menu_status = null;
    var menu_state = null;

    menu_status = is_menu_ready(win_id);
    if (menu_status === true) {
        menu_state = get_menu_state(win_id);
        if (menu_state === "retracted") {
            show_entire_web_window_menu(win_id);
        }
        else if (menu_state === "extended") {
            retract_win_menu(win_id);
        }
        else {
            //menu state is something else..
            //  alert("menu status is unavailable");
            show_entire_web_window_menu(win_id); //Update: make it this by default. fixes a tiny bug
        }
    }
    else {
    }
}




function make_web_window_menu(win_id) {
    var bg = "#222222";
    var w = "105px";
    var id = null;
    var outer_div = null;
    var tbl = null;
    var win_menu = null;

    document.createElement("div");

    set_menu_status(win_id, "closed");

    win_menu = document.getElementById("id", win_id + "_outer_div_box");
    if (win_menu !== null) {
        win_menu.parentNode.removeChild(win_menu);
    }

    outer_div = document.createElement("div");
    outer_div.setAttribute("id", win_id + "_outer_div_box");
    outer_div.style.background = "none";
    outer_div.style.position = "absolute";
    outer_div.style.width = w;
    outer_div.style.height = "100%";
    outer_div.style.left = "0";
    outer_div.style.top = "0";
    outer_div.style.borderStyle = "none";
    outer_div.style.borderWidth = "1px";
    outer_div.style.borderColor = "#55555";
    outer_div.style.overflow = "hidden";

    outer_div.style.padding = "0";
    outer_div.style.margin = "0";
    //outer_div.style.marginBottom = "1px";

    tbl = make_menu_controls(win_id);
    outer_div.appendChild(tbl);

    set_menu_status(win_id, "ready");

    prevent_drag_select(outer_div);


    //outer_div.style.opacity = 0.0;
    return outer_div;
}




function make_menu_controls(win_id) {
    var tbl = null;
    var tr1 = null;
    var tr2 = null;
    var tr3 = null;
    var td1 = null;
    var td2 = null;
    var td3 = null;
    var td4 = null;
    var flexBox = null;
    var td_shadow = null;



    tbl = document.createElement("table");
    tbl.setAttribute("id", win_id + "_side_bar_menu_tbl");
    tbl.style.position = "absolute";
    tbl.style.top = "0";
    tbl.style.left = "0";
    tbl.style.width = "105px";
    tbl.style.height = "100%";
    tbl.style.padding = "0";
    tbl.style.margin = "0";
    tbl.setAttribute("border", "0");
    tbl.setAttribute("cellspacing", "0");
    tbl.setAttribute("cellpadding", "0");

    tr1 = document.createElement("tr");
    tr1.setAttribute("id", win_id + "_row_0000_side_bar_menu_tbl");
    tr1.style.padding = "0";
    tr1.style.margin = "0";

    td1 = document.createElement("td");
    td1.setAttribute("id", win_id + "_td_0000_side_bar_menu_tbl");
    td1.style.width = "84px";
    td1.style.height = "32px";
    td1.style.backgroundColor = "#3e3e3e";
    td1.style.margin = "0";
    td1.style.padding = "0";
    td1.style.borderStyle = "solid";
    td1.style.borderWidth = "1px";
    td1.style.borderColor = "#222222";
    td1.style.textAlign = "left";
    td1.setAttribute("data-title", "Side Menu");
    td1.setAttribute("data-desc", "window options menu");
    set_caption(td1);


    //td1.setAttribute("colspan", "2");

    //td1.addEventListener("mouseover", function () {
    //    td1.style.backgroundColor = "#cccccc";

    //});
    //td1.addEventListener("mouseout", function () {
    //    td1.style.backgroundColor = "#3e3e3e";

    //});
    td1.innerHTML = "<img src=\"/chromosphere/images/ui/icons/menu_icon.png\" style=\"width:76px;height:29px;\" />";


    td_shadow = document.createElement("td");
    td_shadow.setAttribute("id", win_id + "_shadow_td_0001_side_bar_menu_tbl");
    td_shadow.style.width = "21px";
    td_shadow.style.height = "780px";
    //td_shadow.style.borderLeftStyle = "solid";
    //td_shadow.style.borderLeftWidth = "1px";
    //td_shadow.style.borderLeftColor = "#222";
    td_shadow.setAttribute("rowspan", "3");
    td_shadow.style.backgroundColor = "none";
    //td_shadow.style.textAlign = "left";
    td_shadow.style.verticalAlign = "top";
    //td_shadow.style.borderLeft = "1px solid #222";
    td_shadow.style.borderCollapse = "collapse";
    td_shadow.style.whiteSpace = "nowrap";
    //td_shadow.style.
    td_shadow.innerHTML = "<img src=\"/chromosphere/images/ui/icons/menu_bar_shadow.png\" style=\"border-left-style:none;border-left_width:1px;border-left-color:#000;\" width=\"21\" height=\"900\"  />";

    tr2 = document.createElement("tr");
    tr2.setAttribute("id", win_id + "_row_0001_side_bar_menu_tbl");
    tr2.style.padding = "0";
    tr2.style.margin = "0";

    /*
    td2 = document.createElement("td");
    td2.setAttribute("id", win_id + "_td_0001_side_bar_menu_tbl");
    td2.style.backgroundColor = "#3e3e3e";
    td2.style.width = "41px";
    td2.style.height = "32px";
    td2.style.margin = "0";
    td2.style.padding = "0";
    td2.style.borderStyle = "solid";
    td2.style.borderWidth = "1px";
    td2.style.borderColor = "#222222";
    td2.style.textAlign = "left";
    td2.addEventListener("mouseover", function () {
    this.style.backgroundColor = "#0000ff";

    });
    td2.addEventListener("mouseout", function () {
    this.style.backgroundColor = "#3e3e3e";

    });
    td2.addEventListener("mousedown", function () {
        //retract_win_menu(win_id);
        toggle_extend_retract_menu(win_id);
    });
    td2.innerHTML = "<img src=\"/chromosphere/images/ui/icons/lt_arrow.png\" style=\"width:37px;height:29px;\" />";
    */

    td3 = document.createElement("td");
    td3.setAttribute("id", win_id + "_td_0002_side_bar_menu_tbl");
    td3.style.backgroundColor = "#3e3e3e";
    td3.style.width = "82px";
    td3.style.height = "32px";
    td3.style.margin = "0";
    td3.style.padding = "0";
    td3.style.borderStyle = "solid";
    td3.style.borderWidth = "1px";
    td3.style.borderColor = "#222222";
    td3.style.textAlign = "right";
    td3.setAttribute("data-title", "Expand or Retract Menu");
    td3.setAttribute("data-desc", "click to view menu details");
    set_caption(td3);

    td3.addEventListener("mouseover", function () {
        this.style.backgroundColor = "#0000ff";

    });
    td3.addEventListener("mouseout", function () {
        this.style.backgroundColor = "#3e3e3e";

    });
    td3.addEventListener("mousedown", function () {
        toggle_extend_retract_menu(win_id);
        //show_entire_web_window_menu(win_id);
    });

    td3.innerHTML = "<img src=\"/chromosphere/images/ui/icons/gt_arrow.png\"  id=\"" + win_id + "_menu_extend_retract_button\" style=\"width:37px;height:29px;\" />";

    tr3 = document.createElement("tr");
    tr3.setAttribute("id", win_id + "_row_0002_side_bar_menu_tbl");
    tr3.style.padding = "0";
    tr3.style.margin = "0";

    td4 = document.createElement("td");
    td4.setAttribute("id", win_id + "_td_0003_side_bar_menu_tbl");
    td4.style.width = "auto";
    td4.style.height = "100%";
    td4.style.margin = "0";
    td4.style.padding = "0";
    td4.style.borderStyle = "none";
    td4.style.borderWidth = "1px";
    td4.style.borderColor = "#000000";

    td4.style.backgroundColor = "#6a6a6a";
    //td4.setAttribute("colspan", "2");
    td4.style.verticalAlign = "top";
    td4.style.textAlign = "left";
    flexBox = get_menu_icons(win_id);
    //td4.innerHTML = "<img src=\"/chromosphere/images/blank.gif\" style=\"width:auto;height:auto;\" />";

    tbl.appendChild(tr1);
    tr1.appendChild(td1);
    tr1.appendChild(td_shadow);

    tbl.appendChild(tr2);
    //tr2.appendChild(td2);
    tr2.appendChild(td3);

    tbl.appendChild(tr3);
    tr3.appendChild(td4);

    td4.appendChild(flexBox);

    return tbl;
}


function get_menu_icons(win_id) {
    var flexBox = null;
    var img_1 = null;
    var img_2 = null;
    var img_3 = null;
    var img_1_div = null;
    var img_2_div = null;
    var img_3_div = null;

    var tbl = null;
    var tr_1 = null;
    var td_1 = null;

    var tr_2 = null;
    var td_2 = null;

    var tr_3 = null;
    var td_3 = null;

    var img_cache_1 = null;
    var img_cache_2 = null;
    var img_cache_3 = null;

    var btn_code = null;
    var btn_edit_all = null;

    var win = null;

    img_cache_1 = document.createElement("img");
    img_cache_1.setAttribute("src", "/chromosphere/images/ui/icons/save_mouseover.png");

    img_cache_2 = document.createElement("img");
    img_cache_2.setAttribute("src", "/chromosphere/images/ui/icons/refresh_mouseover.png");

    img_cache_3 = document.createElement("img");
    img_cache_3.setAttribute("src", "/chromosphere/images/ui/icons/settings_mouseover.png");


    //flexBox = document.createElement("div");

    //flexBox.style.display = "flex";
    //flexBox.style.width = "76px";
    //flexBox.style.height = "100%";

    img_1 = document.createElement("img");
    img_1.setAttribute("id", win_id + "_win_menu_icon_0000");
    img_1.setAttribute("data-title", "Save");
    img_1.setAttribute("data-desc", "save this window and its contents");
    img_1.style.height = "48px";
    img_1.style.width = "76px";
    img_1.setAttribute("src", "/chromosphere/images/ui/icons/win_menu_mouseout.png");
    img_1_div = document.createElement("div");
    img_1_div.setAttribute("id", win_id + "_win_menu_icon_div_0000");
    img_1_div.style.height = "48px";
    img_1_div.style.width = "76px";
    img_1_div.appendChild(img_1);
    img_1_div.setAttribute("data-title", "Save");
    img_1_div.setAttribute("data-desc", "save window and contents");
    set_caption(img_1_div);


    img_2 = document.createElement("img");
    img_2.setAttribute("id", win_id + "_win_menu_icon_0001");
    img_2.setAttribute("data-title", "Refresh");
    img_2.setAttribute("data-desc", "reloads the window with info from the database");
    img_2.style.height = "48px";
    img_2.style.width = "76px";
    img_2.setAttribute("src", "/chromosphere/images/ui/icons/win_menu_mouseout.png");
    img_2_div = document.createElement("div");
    img_2_div.setAttribute("id", win_id + "_win_menu_icon_div_0001");
    img_2_div.style.height = "48px";
    img_2_div.style.width = "76px";
    img_2_div.appendChild(img_2);
    img_2_div.setAttribute("data-title", "Refresh");
    img_2_div.setAttribute("data-desc", "refresh window contents");
    set_caption(img_2_div);

    img_3 = document.createElement("img");
    img_3.setAttribute("id", win_id + "_win_menu_icon_0002");
    img_3.setAttribute("data-title", "Settings");
    img_3.setAttribute("data-desc", "adjust window settings");
    img_3.style.height = "48px";
    img_3.style.width = "76px";
    img_3.setAttribute("src", "/chromosphere/images/ui/icons/win_menu_mouseout.png");
    img_3_div = document.createElement("div");
    img_3_div.setAttribute("id", win_id + "_win_menu_icon_div_0002");
    img_3_div.style.height = "48px";
    img_3_div.style.width = "76px";
    img_3_div.appendChild(img_3);
    img_3_div.setAttribute("data-title", "Settings");
    img_3_div.setAttribute("data-desc", "adjust settings for this window");
    set_caption(img_3_div);

    img_1.setAttribute("src", "/chromosphere/images/ui/icons/save_mouseout.png");
    img_2.setAttribute("src", "/chromosphere/images/ui/icons/refresh_mouseout.png");
    img_3.setAttribute("src", "/chromosphere/images/ui/icons/settings_mouseout.png");

    img_1.addEventListener("mouseover", function () {
        //img_1.setAttribute("src", "/chromosphere/images/ui/icons/save_mouseover.png");
        img_1.setAttribute("src", img_cache_1.getAttribute("src"));
    });
    img_1.addEventListener("mouseout", function () {
        img_1.setAttribute("src", "/chromosphere/images/ui/icons/save_mouseout.png");
    });

    /* img_1.addEventListener("mousedown", function () {
         win = document.getElementById(win_id);
         if (win !== null) {
             set_do_reload_window_true(win_id);
             remove_code_editor(win_id);
             remove_details_menu(win_id);
         }
 
         //img_1.setAttribute("src", "/chromosphere/images/ui/icons/save_mouseover.png");
         //img_1.setAttribute("src", img_cache_1.getAttribute("src"));
 
     });
     */

    img_2.addEventListener("mouseover", function () {
        //img_2.setAttribute("src", "/chromosphere/images/ui/icons/refresh_mouseover.png");
        img_2.setAttribute("src", img_cache_2.getAttribute("src"));
    });
    img_2.addEventListener("mouseout", function () {
        img_2.setAttribute("src", "/chromosphere/images/ui/icons/refresh_mouseout.png");
    });

    img_3.addEventListener("mouseover", function () {
        //img_3.setAttribute("src", "/chromosphere/images/ui/icons/settings_mouseover.png");
        img_3.setAttribute("src", img_cache_3.getAttribute("src"));
    });
    img_3.addEventListener("mouseout", function () {
        img_3.setAttribute("src", "/chromosphere/images/ui/icons/settings_mouseout.png");
    });

    // flexBox.appendChild(img_1_div);
    // flexBox.appendChild(img_2_div);
    // flexBox.appendChild(img_3_div);

    //td_4.appendChild(flexBox);

    tbl = document.createElement("table");
    tr_1 = document.createElement("tr");
    td_1 = document.createElement("td");
    tr_2 = document.createElement("tr");
    td_2 = document.createElement("td");
    tr_3 = document.createElement("tr");
    td_3 = document.createElement("td");

    tbl.appendChild(tr_1);
    tr_1.appendChild(td_1);
    td_1.appendChild(img_1_div);

    tbl.appendChild(tr_2);
    tr_2.appendChild(td_2);
    td_2.appendChild(img_2_div);

    tbl.appendChild(tr_3);
    tr_3.appendChild(td_3);
    td_3.appendChild(img_3_div);

    btn_code = make_edit_code_button(win_id);
    //btn_edit_all = make_edit_all_button(win_id);

    tbl.appendChild(btn_code);
    //tbl.appendChild(btn_edit_all);

    //------ SET THE MENU BUTTONS' FUNCTIONALITY
    //This function saves the entire window. See 'save_entire_window.js'
    //2023-10-19:
    //removed the 'remove_details_menu('" + win_id + "');' function call from the onclick event
    img_1_div.setAttribute("onclick", "set_active_window('" + win_id + "');set_do_reload_window_true('" + win_id + "');set_window_unsaved_flag('" + win_id + "');start_save_all('" + win_id + "');");
    //This function reloads the window's content by content_ID (second argument)
    img_2_div.setAttribute("onclick", "set_active_window('" + win_id + "');set_do_reload_window_true('" + win_id + "');refresh_window_content_data('" + win_id + "');");
    //-------

    return tbl;
}


function make_edit_code_button(win_id) {
    var btn_code = null;
    btn_code = document.createElement("button");
    ////btn_code.setAttribute("onmousedown", "start_iframe_code_editor('" + win_id + "');//start_code_editor('" + win_id + "');");
    ////btn_code.setAttribute("onclick", "start_dev_panel('" + win_id + "');");
    //start_text_code_editor(win_id)

    //btn_code.addEventListener("mouseup", function () { 
    //see file: 'functions.js'
    //this function places a
    //transparent, or opaque
    //image over the element
    ////disable_element(win_id + "_tbl_0000_tr_0001_td_0000_div_0000", "rgba(255,255,255,0.25)");
    //disable_element(win_id + "_tbl_0000", "rgba(255,255,255,0.25)");
    //setTimeout(function () {
    //    enable_element(win_id + "_tbl_0000");
    //}, 1300);
    //});



    btn_code.setAttribute("onclick", "start_text_code_editor('" + win_id + "');");

    btn_code.innerText = "edit code";
    btn_code.style.margin = "4px";
    btn_code.setAttribute("data-title", "Edit JavaScript, HTML, & CSS");
    btn_code.setAttribute("data-desc", "add and update the code behind this window");
    set_caption(btn_code);
    return btn_code;
}



function make_edit_all_button(win_id) {
    var btn_code = null;
    btn_code = document.createElement("button");
    btn_code.setAttribute("onclick", "start_dev_panel('" + win_id + "');");
    btn_code.innerText = "edit all";
    btn_code.style.margin = "4px";
    return btn_code;
}


function show_entire_web_window_menu(win_id) {
    var tbl_obj = null;
    var left_arrow_td = null;
    var right_arrow_td = null;
    var menu_icon_td = null;
    var icon_panel_td = null;
    var tr_0 = null;
    var tr_1 = null;
    var tr_2 = null;
    var outer_div = null;
    var win_menu_status = null;
    var win = null;
    var verify_menu_STATE = null;
    var verify_menu_STATUS = null;


    verify_menu_STATE = verify_menu_expand(win_id);
    verify_menu_STATUS = is_ready_to_show_menu(win_id);
    if (verify_menu_STATE === true && verify_menu_STATUS === true) {
        //conditions are met for the menu to continue. Go forward with function. 
    }
    else {
        return; //menu contitions do not allow this function to be continued
    }

    win = document.getElementById(win_id);

    outer_div = document.getElementById(win_id + "_outer_div_box");

    tbl_obj = document.getElementById(win_id + "_side_bar_menu_tbl");

    menu_icon_td = document.getElementById(win_id + "_td_0000_side_bar_menu_tbl"); //gets the menu box td cell
    left_arrow_td = document.getElementById(win_id + "_td_0001_side_bar_menu_tbl"); //gets the td cell for the left arrow
    right_arrow_td = document.getElementById(win_id + "_td_0002_side_bar_menu_tbl"); //gets the td cell for the right arrow
    icon_panel_td = document.getElementById(win_id + "_td_0003_side_bar_menu_tbl"); //gets the vertical panel td cell of the menu

    tr_0 = document.getElementById(win_id + "_row_0000_side_bar_menu_tbl");
    tr_1 = document.getElementById(win_id + "_row_0001_side_bar_menu_tbl");
    tr_2 = document.getElementById(win_id + "_row_0002_side_bar_menu_tbl");

    expand_menu_full(win_id, outer_div, tbl_obj, menu_icon_td, left_arrow_td, right_arrow_td, icon_panel_td, tr_0, tr_1, tr_2);

}



function expand_menu_full(win_id, outer_div, tbl_obj, menu_icon_td, left_arrow_td, right_arrow_td, icon_panel_td, tr_0, tr_1, tr_2) {
    var obj_array = [];
    var obj_array_length = null;
    var obj = null;
    var obj_px_width = null;
    var i = null;
    var stop_width = null;

    stop_width = 340;

    global_expand_win_menu_timer = setInterval(function () {
        expand_obj(win_id, outer_div, tbl_obj, menu_icon_td, left_arrow_td, right_arrow_td, icon_panel_td, tr_0, tr_1, tr_2, stop_width);
    }, 10);
}



function expand_obj(win_id, outer_div, tbl_obj, menu_icon_td, left_arrow_td, right_arrow_td, icon_panel_td, tr_0, tr_1, tr_2, stop_width) {
    var obj_width = null;
    var increment = null;
    var obj = null;
    var td_container = null;
    //alert("");
    obj = document.getElementById(outer_div.id);

    increment = 10;
    if (obj !== null) {
        //alert(obj);
        obj_width = parseFloat(obj.offsetWidth);
        if (obj_width < stop_width) {
            obj.style.width = (obj_width + increment) + "px";
            tbl_obj.style.width = parseFloat(parseFloat(tbl_obj.offsetWidth) + increment) + "px";
            menu_icon_td.style.width = parseFloat(parseFloat(menu_icon_td.offsetWidth) + increment) + "px";
            //left_arrow_td.style.width = parseFloat(parseFloat(left_arrow_td.offsetWidth) + increment) + "px";
            right_arrow_td.style.width = parseFloat(parseFloat(right_arrow_td.offsetWidth) + increment) + "px";
            icon_panel_td.style.width = parseFloat(parseFloat(icon_panel_td.offsetWidth) + increment) + "px";
            tr_0.style.width = parseFloat(parseFloat(tr_0.offsetWidth) + increment) + "px";
            tr_1.style.width = parseFloat(parseFloat(tr_1.offsetWidth) + increment) + "px";
            tr_2.style.width = parseFloat(parseFloat(tr_2.offsetWidth) + increment) + "px";
        }
        else {
            set_menu_status(win_id, "ready");
            set_menu_state(win_id, "extended");
            toggle_extend_retract_arrow(win_id);
            obj.style.height = obj.parentNode.scrollHeight + "px";

            clearInterval(global_expand_win_menu_timer);
            global_expand_win_menu_timer = null;
        }
    } else {
        set_menu_status(win_id, "closed");
        clearInterval(global_expand_win_menu_timer);
        global_expand_win_menu_timer = null;
    }
}


function retract_win_menu(win_id) {
    var tbl_obj = null;
    var left_arrow_td = null;
    var right_arrow_td = null;
    var menu_icon_td = null;
    var icon_panel_td = null;
    var tr_0 = null;
    var tr_1 = null;
    var tr_2 = null;
    var outer_div = null;
    var verify_menu_STATE = null;
    var verify_menu_STATUS = null;

    verify_menu_STATE = verify_menu_retract(win_id);
    verify_menu_STATUS = is_ready_to_retract_menu(win_id);

    if (verify_menu_STATE === true && verify_menu_STATUS === true) {
        //conditions are met, continue function
    }
    else {
        return; //menu contitions do not allow this function to be continued
    }



    outer_div = document.getElementById(win_id + "_outer_div_box");

    tbl_obj = document.getElementById(win_id + "_side_bar_menu_tbl");

    menu_icon_td = document.getElementById(win_id + "_td_0000_side_bar_menu_tbl"); //gets the menu box td cell
    left_arrow_td = document.getElementById(win_id + "_td_0001_side_bar_menu_tbl"); //gets the td cell for the left arrow
    right_arrow_td = document.getElementById(win_id + "_td_0002_side_bar_menu_tbl"); //gets the td cell for the right arrow
    icon_panel_td = document.getElementById(win_id + "_td_0003_side_bar_menu_tbl"); //gets the vertical panel td cell of the menu

    tr_0 = document.getElementById(win_id + "_row_0000_side_bar_menu_tbl");
    tr_1 = document.getElementById(win_id + "_row_0001_side_bar_menu_tbl");
    tr_2 = document.getElementById(win_id + "_row_0002_side_bar_menu_tbl");

    retract_menu_backwards(win_id, outer_div, tbl_obj, menu_icon_td, left_arrow_td, right_arrow_td, icon_panel_td, tr_0, tr_1, tr_2);
}


function retract_menu_backwards(win_id, outer_div, tbl_obj, menu_icon_td, left_arrow_td, right_arrow_td, icon_panel_td, tr_0, tr_1, tr_2) {
    var stop_width = null;

    stop_width = 105;

    global_retract_win_menu_timer = setInterval(function () {
        retract_obj(win_id, outer_div, tbl_obj, menu_icon_td, left_arrow_td, right_arrow_td, icon_panel_td, tr_0, tr_1, tr_2, stop_width);
    }, 10);
}



function retract_obj(win_id, outer_div, tbl_obj, menu_icon_td, left_arrow_td, right_arrow_td, icon_panel_td, tr_0, tr_1, tr_2, stop_width) {
    var obj_width = null;
    var increment = null;
    var obj = null;
    var td_container = null;

    obj = document.getElementById(outer_div.id);

    increment = -10;
    if (obj !== null) {
        obj_width = parseFloat(obj.offsetWidth);
        if (obj_width > stop_width) {
            obj.style.width = (obj_width + increment) + "px";
            tbl_obj.style.width = parseFloat(parseFloat(tbl_obj.offsetWidth) + increment) + "px";
            menu_icon_td.style.width = parseFloat(parseFloat(menu_icon_td.offsetWidth) + increment) + "px";
            //left_arrow_td.style.width = parseFloat(parseFloat(left_arrow_td.offsetWidth) + increment) + "px";
            right_arrow_td.style.width = parseFloat(parseFloat(right_arrow_td.offsetWidth) + increment) + "px";
            icon_panel_td.style.width = parseFloat(parseFloat(icon_panel_td.offsetWidth) + increment) + "px";
            tr_0.style.width = parseFloat(parseFloat(tr_0.offsetWidth) + increment) + "px";
            tr_1.style.width = parseFloat(parseFloat(tr_1.offsetWidth) + increment) + "px";
            tr_2.style.width = parseFloat(parseFloat(tr_2.offsetWidth) + increment) + "px";
        }
        else {
            clearInterval(global_retract_win_menu_timer);
            global_retract_win_menu_timer = null;

            set_menu_state(win_id, "retracted");
            toggle_extend_retract_arrow(win_id);
            set_menu_status(win_id, "ready");
            obj.style.height = obj.parentNode.scrollHeight + "px";
        }
    }
    else {
        clearInterval(global_retract_win_menu_timer);
        global_retract_win_menu_timer = null;

        set_menu_status(win_id, "closed");
    }
}

/*
function hide_menu_shadow(win_id) {
    var shadow_td = null;
    shadow_td = document.getElementById(win_id + "_shadow_td_0001_side_bar_menu_tbl");
    shadow_td.style.opacity = 0.0;
}

function show_menu_shadow(win_id) {
    var shadow_td = null;
    shadow_td = document.getElementById(win_id + "_shadow_td_0001_side_bar_menu_tbl");
    shadow_td.style.opacity = 1.0;
}


function add_border(obj) {
    obj.style.borderStyle = "solid";
    obj.style.borderWidth = "1px";
    obj.style.borderColor = "#0f0";
}



function delete_border(obj) {
    obj.style.borderStyle = "none";
}
*/

function hide_entire_web_window_menu() {


}

// the menu will show up along the left-hand side of the web window
function expand_all_web_icons() {

}


// the menu will show up along the left-hand side of the web window
function hide_all_web_icons() {

}


function remove_web_window_menu(win_id) {
    var outer_div = null;
    outer_div = document.getElementById("id", win_id + "_outer_div_box");
    if (outer_div !== null) {
        set_menu_status(win_id, "closed");
        clearInterval(global_expand_win_menu_timer);
        clearInterval(global_retract_win_menu_timer);
        outer_div.parentNode.removeChild(outer_div);
    }
}



function set_menu_status(win_id, status_txt) {
    var td_container = null;

    td_container = document.getElementById(win_id + "_tbl_0000_tr_0001_td_0000");
    if (td_container !== null) {
        td_container.setAttribute("data-global_win_menu_status", status_txt);
    }
    return status_txt;
}



function get_menu_status(win_id) {
    var td_container = null;
    var status_txt = null;

    td_container = document.getElementById(win_id + "_tbl_0000_tr_0001_td_0000");
    if (td_container !== null) {
        status_txt = td_container.getAttribute("data-global_win_menu_status");
    }
    return status_txt;
}



function is_menu_ready(win_id) {
    var td_container = null;
    var menu_status = null;
    var is_ready = null;

    td_container = document.getElementById(win_id + "_tbl_0000_tr_0001_td_0000");
    if (td_container !== null) {
        menu_status = td_container.getAttribute("data-global_win_menu_status");
        if (menu_status === null) {
            td_container.setAttribute("data-global_win_menu_status", "ready");
            is_ready = true;
        }
        else if (menu_status !== "ready") {
            is_ready = false;
        }
        else if (menu_status === "ready") {
            is_ready = true;
        }
        else if (menu_status === "") {
            td_container.setAttribute("data-global_win_menu_status", "ready");
            is_ready = true;
        }
    }
    else {
        is_ready = false;
    }
    return is_ready;
}


function get_menu_state(win_id) {
    var td_container = null;
    var menu_state = null;

    td_container = document.getElementById(win_id + "_tbl_0000_tr_0001_td_0000");
    if (td_container !== null) {
        menu_state = td_container.getAttribute("data-menu_extened");
        if (menu_state === null || menu_state === "" || menu_state === undefined) {
            init_menu_state(win_id);
            menu_state = get_menu_state(win_id);
        }
        else {
            menu_state = td_container.getAttribute("data-menu_extened");
        }
    }
    return menu_state;
}



function set_menu_state(win_id, menu_state) {
    var td_container = null;
    td_container = document.getElementById(win_id + "_tbl_0000_tr_0001_td_0000");
    if (td_container !== null) {
        td_container.setAttribute("data-menu_extened", menu_state);
    }
}



function init_menu_state(win_id) {
    var td_container = null;
    td_container = document.getElementById(win_id + "_tbl_0000_tr_0001_td_0000");
    if (td_container !== null) {
        td_container.setAttribute("data-menu_extened", "retracted");
    }
}


//check menu STATE, continue if correct
function verify_menu_expand(win_id) {
    var menu_state = null;

    menu_state = get_menu_state(win_id);

    if (menu_state !== null && menu_state !== "" && menu_state !== undefined) {
        if (menu_state === "retracted") {
            //continue with function
            return true;
        }
        else {
            //stop the function here
            return false;
        }
    }
    else {
        //initialize the menu state, set it by default to retracted
        init_menu_state(win_id);
        menu_state = get_menu_state(win_id);
        if (menu_state === "retracted") {
            return true;
        }
        else {
            return false
        }
    }
}



function is_ready_to_show_menu(win_id) { //check window menu STATUS. if ready, returns true.
    var is_ready = false;

    is_ready = is_menu_ready(win_id);
    if (is_ready) {
        set_menu_status(win_id, "extending");
        return true;
    }
    else {
        //alert("not ready");
        return false;
    }
}




function verify_menu_retract(win_id) {
    var menu_state = null;

    menu_state = get_menu_state(win_id);
    //alert("menu state: " + menu_state);
    if (menu_state !== null && menu_state !== "" && menu_state !== undefined) {
        if (menu_state === "extended") {
            //continue with function
            return true;
        }
        else {
            //stop the function here
            init_menu_state(win_id);
            menu_state = get_menu_state(win_id);
            if (menu_state !== "extended") {
                return false;
            }
        }
    }
    else {
        //initialize the menu state, set it by default to retracted
        init_menu_state(win_id);
        menu_state = get_menu_state(win_id);
        if (menu_state !== null && menu_state !== "" && menu_state !== undefined) {
            if (menu_state === "extended") {
                return true;
            }
            else {
                return false;
            }
        }
        else {
            return false;
        }

    }
}





function is_ready_to_retract_menu(win_id) {
    var is_ready = false;

    is_ready = is_menu_ready(win_id);

    if (is_ready) {
        set_menu_status(win_id, "extending");
        return true;
    }
    else {
        return false;
    }
}




function toggle_extend_retract_arrow(win_id) {
    var var_id = null;
    var b = null;
    var img_1 = null;
    var img_2 = null;

    img_1 = new Image();
    img_2 = new Image();

    img_1.src = "/chromosphere/images/ui/icons/gt_arrow.png";
    img_2.src = "/chromosphere/images/ui/icons/lt_arrow.png";

    var_id = win_id + "_menu_extend_retract_button";
    b = document.getElementById(var_id);

    if (b !== null) {
        if (b.src === img_1.src) {
            b.src = img_2.src;
        }
        else if (b.src === img_2.src) {
            b.src = img_1.src;
        }
        else {
            b.src = img_1.src;
        }
    }
}