"use strict";

//This Javascript file sets the web window's icons (3 icons, at top right of web window) according to
//the web window's "state" of display.

//The web windows can display their appearance in 3 different ways (as "window states").
//As of this current date: 2023-01-12, The web windows have 3 window states: "cascade", "minimize", or "maximize".
//This file contains a set of functions that determine the current web window display state.
//Depending on the state the web window, the 2 of 3 icons in the web window (top right of each web window) need to all
//have their images and functionality changed accordingly.

//PLEASE NOTE: These function calls need to be placed as inline attributes into the HTML (e.g. onmousedown="example();"), 
//not added via the assignment of an event listener. The reason for this is because an event listener
//previously added appears to conflict.

//This function starts the processs
function set_window_state_icons(win_id) {
    var win = null;
    var is_minimized = null;
    var is_maximized = null;
    var win_state = null;
    var minimized_win_count = null;
    var desktop = null;

    win = document.getElementById(win_id); //get the web window object by ID
    is_minimized = win.getAttribute("data-is_minimized"); //is the web window in a MINimized state? "true", or "false".
    is_maximized = win.getAttribute("data-is_maximized"); //is the web window in a MAXimized state? "true", or "false".

    if (win !== null) {
        //By process of eleminiation, we can assume that if a web window is not
        //maximized and not minimized then it must be in a cascaded state
        //If web window is cascaded
        if (is_minimized !== "true" && is_maximized !== "true") {
            desktop = document.getElementById("desktop");
            desktop.style.overflow = "initial";
            ////desktop.style.overflow = "auto";
            ////desktop.className = "show_scroll_bars";
            document.getElementById(win_id).style.position = "absolute";

            //hide the top menu bar which allows the maximized window
            //to take up the full browser window.
            if (document.getElementById("div_wrapper_0") !== null) {
                ////document.getElementById("div_wrapper_0").style.display = "block";
                document.getElementById("div_wrapper_0").style.zIndex = 10000000;
                document.getElementById("div_wrapper_0").style.opacity = 1.0;
            }

            if (is_window_tabbed(win_id) === true || is_window_tabbed(win_id) === "true") {
                win_state = "cascaded";
                set_icons_add_functions_for_tabbed(win_id);
                minimized_win_count = minimized_window_count();
                ////alert(minimized_win_count);
                if (minimized_win_count > 0) {
                    //2024-04-18:
                    //If there are minimized windows, there is a box/button made to "stow", or hide/show
                    //minimized windows. If the window is not maximized and not minimized, then display the box.
                    //see file: 'stow_minimized_windows.js'
                    show_stow_minimized_window_box();

                    
                    //left_offset_all_tabbed_windows();
                }
                else {
                    hide_stow_minimized_window_box();
                    hide_tuck_stowed_minimized_window_icon();
                }
                //move all minimized windows over the top
                //of other windows. 
                move_all_minimized_windows_to_front();

            //the window state is cascaded, but the window is tabbed, take no action, and continue.
            }
            else {
                //window apparently must be cascaded
                win_state = "cascaded"; //The state of the window in text as function's output
                set_icons_add_functions_for_cascaded(win_id); //set the top right control icons/controls of the web window to a cascaded window state

                //2024-04-18:
                //If there are minimized windows, there is a box/button made to "stow", or hide/show
                //minimized windows. If the window is not maximized and not minimized, then display the box.
                //see file: 'stow_minimized_windows.js'
                show_stow_minimized_window_box();
                

                //move all minimized windows over the top
                //of other windows. 
                move_all_minimized_windows_to_front();

            }
            document.getElementById(win_id).style.position = "absolute";
        }
        //If web window is in a minimized state
        else if (is_minimized === "true" && is_maximized === "false") {
            //window apparently must be minimized

            desktop = document.getElementById("desktop");
            ////desktop.style.overflow = "auto";
            desktop.style.overflow = "initial";
            ////desktop.className = "hide_scroll_bars";
            document.getElementById(win_id).style.position = "fixed";

            //hide the top menu bar which allows the maximized window
            //to take up the full browser window.
            if (document.getElementById("div_wrapper_0") !== null) {
                ////document.getElementById("div_wrapper_0").style.display = "block";
                document.getElementById("div_wrapper_0").style.zIndex = 10000000;
                document.getElementById("div_wrapper_0").style.opacity = 1.0;
            }

            win_state = "minimized"; //The state of the window in text as function's output

            set_icons_add_functions_for_minimized(win_id); //set the top right control icons/controls of the web window to a MINimized window state

            //2024-04-18:
            //If there are minimized windows, there is a box/button made to "stow", or hide/show
            //minimized windows. If the window is minimized then display the box.
            //see file: 'stow_minimized_windows.js'
            show_stow_minimized_window_box();

            //move all minimized windows over the top
            //of other windows. 
            move_all_minimized_windows_to_front();
        }
        //If the web window is in a maximized state
        else if (is_minimized === "false" && is_maximized === "true") {
            //window apparently must be maximized
            win_state = "maximized"; //The state of the window in text as function's output
            set_icons_add_functions_for_maximized(win_id); //set the top right control icons/controls of the web window to a MAXimized window state

            //clips the desktop element, and turns scrolling
            //off. this is done so that the scrollbars disapppear.
            desktop = document.getElementById("desktop");
            ////desktop.className = "div.hide_scroll_bars";
            desktop.style.overflow = "hidden";

            document.getElementById(win_id).style.position = "fixed";

            //hide the top menu bar which allows the maximized window
            //to take up the full browser window.
            if (document.getElementById("div_wrapper_0") !== null) {
                ////document.getElementById("div_wrapper_0").style.display = "none";
                document.getElementById("div_wrapper_0").style.zIndex = -200;
                document.getElementById("div_wrapper_0").style.opacity = 0.0;
            }


            //2024-04-18:
            //If there are minimized windows, there is a box/button made to "stow", or hide/show
            //minimized windows. Since the window is maximized, we don't want it visible, as the
            //maximized window needs to fill the browser window (minus the main menu bar at the top)
            //without any other interface components visible.
            //see file: 'stow_minimized_windows.js'
            setTimeout(function () {
                hide_stow_minimized_window_box();
            }, 200);

            setTimeout(function () {
                move_to_front(win_id);
            }, 200);
        }
    }

    //2024-05-20:
    //call the functions that need to run
    //every time a window's state changes
    on_window_state_change_call_functions(win_id);

    return win_state; //returns the web window state as 1/3 possible outputs. They are, "cascaded", "minimized", or "maximized"
}




//set the web window control state icons appropriate for a minimized web window
function set_icons_add_functions_for_minimized(win_id) {
    var td_cell_1 = null;
    var icon_img_1 = null;
    var td_cell_2 = null;
    var icon_img_2 = null;
    var td_cell_3 = null;
    var icon_img_3 = null;
    var td_cell_4 = null;
    var icon_img_4 = null;
    var win = null;
    var td_cell_0 = null;
    var icon_img_0 = null;

    //grab both the table cell, and its icon image (which is the child object of the table cell)

    //2023-09-19:
    //Disable this function if it is a thumbnail window object.
    //The win_id won't exist and will be null;
    /*
    win = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0000");
    if (win === null) {
        return;
    }
    */

    //2023-06-22: adding the "show details" icon box
    td_cell_0 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0000"); //parent table cell for the icon
    icon_img_0 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0000").childNodes[0]; //left icon 

    td_cell_2 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0002"); //parent table cell for the icon
    icon_img_2 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0002").childNodes[0]; //left icon 
    td_cell_3 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0003"); //parent table cell for the icon
    icon_img_3 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0003").childNodes[0]; //middle icon 
    td_cell_4 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0004"); //parent table cell for the icon
    icon_img_4 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0004").childNodes[0]; //right icon

    //2023-06-22: set the icon image to the 'eye' icon; not the burger icon.
    //if the icon image exists, set its src attribute to the 'eye' icon
    if (icon_img_0 !== null) {
        icon_img_0.setAttribute("src", "/chromosphere/images/ui/icons/eye_2.png");
    }

    if (td_cell_0 !== null) {
        //if the table cell exists, set its event listeners via inline attributes.
        //Don't add event listeners for this functionality, as it conflicts with a previously set event listener
        td_cell_0.setAttribute("onmousedown", "hide_single_thumbnail('" + win_id + "');void(0);"); //when the user clicks mouse down, set the icon's functionality to cascade
        td_cell_0.setAttribute("onmouseup", "void(0);"); //I may use the onmouseup event listener in the future, so just placing it in advance
        td_cell_0.setAttribute("onmouseenter", "start_thumbnails('" + win_id + "');//show_single_thumbnail('" + win_id + "');");
        td_cell_0.setAttribute("onmouseover", "show_single_thumbnail('" + win_id + "');stylize_for_display_of_thumbnail('"+ win_id +"');//void(0);");
        //td_cell_0.setAttribute("onmouseover", "start_thumbnails('" + win_id + "');show_single_thumbnail('" + win_id + "');show_cached_thumbnail('" + win_id + "');");
        td_cell_0.setAttribute("onmouseout", "stylize_for_display_of_default('" + win_id +"');");
        //td_cell_0.setAttribute("onmouseover", "start_thumbnails('" + win_id + "');");

        td_cell_0.setAttribute("onmouseout", "hide_single_thumbnail('" + win_id + "');");


        td_cell_0.setAttribute("onclick", "cascade_window('" + win_id + "');");


        //2023-06-22: since we want the window thumbnails to show, comment out the helper caption attributes
        td_cell_0.removeAttribute("data-title");
        td_cell_0.removeAttribute("data-desc");
        //td_cell_0.setAttribute("data-title", "Details"); //This is for the helper captions function. See helper_captions.js
        //td_cell_0.setAttribute("data-desc", "view the details of this window"); //helper captions attribute
    }


    //if the icon image exists, set its src attribute to the cascade icon
    if (icon_img_2 !== null) {
        icon_img_2.setAttribute("src", "/chromosphere/images/ui/icons/cascade_19x19.png");
    }

    if (td_cell_2 !== null) {
       //if the table cell exists, set its event listeners via inline attributes.
        //Don't add event listeners for this functionality, as it conflicts with a previously set event listener
        td_cell_2.setAttribute("onmousedown", "cascade_window('" + win_id + "');"); //when the user clicks mouse down, set the icon's functionality to cascade
        td_cell_2.setAttribute("onmouseup", "void(0);"); //I may use the onmouseup event listener in the future, so just placing it in advance
        td_cell_2.setAttribute("onmouseover", "void(0);");
        td_cell_2.setAttribute("onmouseenter", "void(0);");
        td_cell_2.setAttribute("onmouseout", "void(0);");

        td_cell_2.setAttribute("data-title", "Cascade"); //This is for the helper captions function. See helper_captions.js
        td_cell_2.setAttribute("data-desc", "view this window"); //helper captions attribute
    }

    if (icon_img_3 !== null) {
        //Set the middle icon to a MAXimize icon
        icon_img_3.setAttribute("src", "/chromosphere/images/ui/icons/maximize_19x19.png");  
    }

    if (td_cell_3 !== null) {
        //
        td_cell_3.setAttribute("onmousedown", "maximize_window('" + win_id + "');"); //when the user clicks mouse down, set the icon's functionality to MAXimize
        td_cell_3.setAttribute("onmouseup", "void(0);"); //I may use the onmouseup event listener in the future, so just placing it in advance

        td_cell_3.setAttribute("data-title", "Maximize"); //This is for the helper captions function. See helper_captions.js
        td_cell_3.setAttribute("data-desc", "view this window in full screen"); //helper captions attribute
    }

    //The close button doesn't need any changes as of now, but possibly in the future.
    if (icon_img_4 !== null) {
        //icon_img_4.setAttribute("src", "/chromosphere/images/ui/icons/close_19x19.png");
    }

    //The close button doesn't change its function as of right now
    if (td_cell_4 !== null) {
        //td_cell_4.setAttribute("onmousedown", "void(0);");
        //td_cell_4.setAttribute("onmouseup", "void(0);");
        //td_cell_4.setAttribute("data-title", "Close"); //This is for the helper captions function. See helper_captions.js
        //td_cell_4.setAttribute("data-desc", "close this window"); //helper captions attribute
    }

    //2024-03-19:
    //each window now contains a "down arrow" icon. When the window is not cascaded,
    //set its display to none so that it cannot have unwanted interaction.
    //see file: 'more_window_actions.js'
    hide_more_window_actions_icon(win_id);

    //2024-03-19:
    //when the window is not in a cascaded state, then automatically remove
    //the "view more window actions" table that lists various window actions
    //that can be performed.
    remove_more_window_actions_box(win_id);

    //2024-05-18:
    //make the "more window actions" icon visible.
    //see file: 'more_window_actions.js'
    ////show_more_window_actions_icon(win_id);

    //if the code editor happens to be showing
    //then hide it when the window is minimized.
    //hide_code_editor_on_minimize(win_id);
}




//set the web window control state icons appropriate for a maximized web window
function set_icons_add_functions_for_maximized(win_id) {
    var td_cell_2 = null;
    var icon_img_2 = null;
    var td_cell_3 = null;
    var icon_img_3 = null;
    var td_cell_4 = null;
    var icon_img_4 = null;
    var win = null;
    var td_cell_0 = null;
    var icon_img_0 = null;

    //grab both the table cell, and its icon image (which is the child object of the table cell)

    //2023-09-19:
    //Disable this function if it is a thumbnail window object.
    //The win_id won't exist and will be null;
    /* win = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0000");
    if (win === null) {
        return;
    }
    */

    //2023-06-22: adding the "show details" icon box
    td_cell_0 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0000"); //parent table cell for the icon
    icon_img_0 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0000").childNodes[0]; //left icon 

    td_cell_2 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0002"); //parent table cell for the icon
    icon_img_2 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0002").childNodes[0]; //left icon 
    td_cell_3 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0003"); //parent table cell for the icon
    icon_img_3 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0003").childNodes[0]; //middle icon 
    td_cell_4 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0004"); //parent table cell for the icon
    icon_img_4 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0004").childNodes[0]; //right icon


    //if the icon image exists, set its src attribute to the burger icon
    if (icon_img_0 !== null) {
        icon_img_0.setAttribute("src", "/chromosphere/images/ui/icons/burger_19x19.png");
    }

    if (td_cell_0 !== null) {
        //if the table cell exists, set its event listeners via inline attributes.
        //Don't add event listeners for this functionality, as it conflicts with a previously set event listener
        td_cell_0.setAttribute("onmousedown", "create_details_menu('" + win_id + "');"); //when the user clicks mouse down, set the icon's functionality to cascade
        td_cell_0.setAttribute("onmouseup", "void(0);"); //I may use the onmouseup event listener in the future, so just placing it in advance
        td_cell_0.setAttribute("onmouseenter", "void(0);");
        td_cell_0.setAttribute("onmouseover", "void(0);");
        td_cell_0.setAttribute("onmouseout", "void(0);");
        td_cell_0.setAttribute("onclick", "void(0);");

        td_cell_0.setAttribute("data-title", "Details"); //This is for the helper captions function. See helper_captions.js
        td_cell_0.setAttribute("data-desc", "view the details of this window"); //helper captions attribute
    }

    //if the icon image exists, set its src attribute to the MINimize icon image's source.
    if (icon_img_2 !== null) {
        icon_img_2.setAttribute("src", "/chromosphere/images/ui/icons/minimize_19x19.png");
    }


    if (td_cell_2 !== null) {
        //add minimize functionality to the table cell

        //2024-04-12:
        //creating a feature that allows you to stow/hide all minimized windows.
        //see file: 'stow_minimized_windows.js'.
        td_cell_2.setAttribute("onmousedown", "minimize_window('" + win_id + "');"); //when the user clicks mouse down, set the icon's functionality to MINimize
        td_cell_2.setAttribute("onmouseup", "void(0);"); //I may use the onmouseup event listener in the future, so just placing it in advance
        td_cell_2.setAttribute("onmouseenter", "void(0);");

        //2024-04-12:
        //call a function that allows you to 
        //stow / hide all minimized windows.
        //see file: 'stow_minimized_windows.js'. 
        td_cell_2.setAttribute("onmouseover", "init_stow_minimized_windows();"); 

        td_cell_2.setAttribute("onmouseout", "void(0);");

        td_cell_2.setAttribute("data-title", "Minimize"); //This is for the helper captions function. See helper_captions.js
        td_cell_2.setAttribute("data-desc", "get this window out of the way"); //helper captions attribute
    }



    if (icon_img_3 !== null) {
        //set the middle icon (2 of 3) to a cascade icon
        icon_img_3.setAttribute("src", "/chromosphere/images/ui/icons/cascade_19x19.png");
    }

    if (td_cell_3 !== null) {
        
        td_cell_3.setAttribute("onmousedown", "cascade_window('" + win_id + "');"); //when the user clicks mouse down, set the icon's functionality to cascade
        td_cell_3.setAttribute("onmouseup", "void(0);"); //I may use the onmouseup event listener in the future, so just placing it in advance
        td_cell_3.setAttribute("data-title", "Cascade"); //This is for the helper captions function. See helper_captions.js
        td_cell_3.setAttribute("data-desc", "view this window"); //helper captions attribute
    }

    //The close icon (3 of 3) does not change its image src
    if (icon_img_4 !== null) {
        icon_img_4.setAttribute("src", "/chromosphere/images/ui/icons/close_19x19.png");
    }

    //The close functionality needs no change as of now
    if (td_cell_4 !== null) {
        td_cell_4.setAttribute("onmousedown", "void(0);"); // "void(0);");
        td_cell_4.setAttribute("onmouseup", "cascade_window('" + win_id + "');close_window('" + win_id + "');");
        td_cell_4.setAttribute("onclick", "void(0);");
        td_cell_4.setAttribute("data-title", "Close"); //This is for the helper captions function. See helper_captions.js
        td_cell_4.setAttribute("data-desc", "close this window"); //helper captions attribute
    }

    
    //2024-03-19:
    //each window now contains a "down arrow" icon. When the window is not cascaded,
    //set its display to none so that it cannot have unwanted interaction.
    //see file: 'more_window_actions.js'
    ////hide_more_window_actions_icon(win_id);

    //2024-03-19:
    //when the window is not in a cascaded state, then automatically remove
    //the "view more window actions" table that lists various window actions
    //that can be performed.
    ////remove_more_window_actions_box(win_id);

    //create a new "more window actions" icon, and associated functions.
    //start_more_window_actions(win_id);

    //2024-05-18:
    //make the "more window actions" icon visible.
    //see file: 'more_window_actions.js'
    show_more_window_actions_icon(win_id);
    
}



//set the web window control state icons appropriate for a cascaded web window
function set_icons_add_functions_for_cascaded(win_id) {
    var td_cell_2 = null;
    var icon_img_2 = null;
    var td_cell_3 = null;
    var icon_img_3 = null;
    var td_cell_4 = null;
    var icon_img_4 = null;
    var win = null;
    var td_cell_0 = null;
    var icon_img_0 = null;

    //grab both the table cell, and its icon image (which is the child object of the table cell)

    //2023-09-19:
    //Disable this function if it is a thumbnail window object.
    //The win_id won't exist and will be null;
    /*
    win = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0000");
    if (win === null) {
        return;
    }
    */

    //2023-06-22: adding the "show details" icon box
    td_cell_0 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0000"); //parent table cell for the icon
    icon_img_0 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0000").childNodes[0]; //left icon 

    td_cell_2 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0002"); //parent table cell for the icon
    icon_img_2 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0002").childNodes[0]; //left icon 
    td_cell_3 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0003"); //parent table cell for the icon
    icon_img_3 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0003").childNodes[0]; //middle icon 
    td_cell_4 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0004"); //parent table cell for the icon
    icon_img_4 = document.getElementById(win_id + "_tbl_0000_tr_0000_td_0004").childNodes[0]; //right icon

    //if the icon image exists, set its src attribute to the burger icon
    if (icon_img_0 !== null) {
        icon_img_0.setAttribute("src", "/chromosphere/images/ui/icons/burger_19x19.png");
    }

    if (td_cell_0 !== null) {



        //if the table cell exists, set its event listeners via inline attributes.
        //Don't add event listeners for this functionality, as it conflicts with a previously set event listener
        td_cell_0.setAttribute("onmousedown", "create_details_menu('" + win_id + "');"); //when the user clicks mouse down, set the icon's functionality to cascade
        td_cell_0.setAttribute("onmouseup", "void(0);"); //I may use the onmouseup event listener in the future, so just placing it in advance
        td_cell_0.setAttribute("onmouseenter", "void(0);");
        td_cell_0.setAttribute("onmouseover", "void(0);");
        td_cell_0.setAttribute("onmouseout", "void(0);");
        td_cell_0.setAttribute("onclick", "void(0);");

        td_cell_0.setAttribute("data-title", "Details"); //This is for the helper captions function. See helper_captions.js
        td_cell_0.setAttribute("data-desc", "view the details of this window"); //helper captions attribute
    }

    //if the icon image exists, set its src attribute to the MINimize icon image's source.
    if (icon_img_2 !== null) {
        icon_img_2.setAttribute("src", "/chromosphere/images/ui/icons/minimize_19x19.png");
    }

    //if the icon image's table cell exists, set its inline attribute to MINimize functionality
    if (td_cell_2 !== null) {
        //2024-04-12:
        //creating a feature that allows you to stow/hide all minimized windows.
        //see file: 'stow_minimized_windows.js'.
        td_cell_2.setAttribute("onmousedown", "minimize_window('" + win_id + "');"); //when the user clicks mouse down, set the icon's functionality to MINimize
        td_cell_2.setAttribute("onmouseup", "void(0);"); //I may use the onmouseup event listener in the future, so just placing it in advance

        //2024-04-12:
        //call a function that allows you to 
        //stow / hide all minimized windows.
        //see file: 'stow_minimized_windows.js'. 
        td_cell_2.setAttribute("onmouseover", "init_stow_minimized_windows();"); 

        td_cell_2.setAttribute("onmouseenter", "void(0);");
        td_cell_2.setAttribute("onmouseout", "void(0);");

        td_cell_2.setAttribute("data-title", "Minimize"); //This is for the helper captions function. See helper_captions.js
        td_cell_2.setAttribute("data-desc", "get this window out of the way"); //helper captions attribute
    }

    //Set the middle icon (2 of 3) to have its src attribute set to MAXimize
    if (icon_img_3 !== null) {
        icon_img_3.setAttribute("src", "/chromosphere/images/ui/icons/maximize_19x19.png");
    }

    if (td_cell_3 !== null) {
        td_cell_3.setAttribute("onmousedown", "maximize_window('" + win_id + "');"); //when the user clicks mouse down, set the icon's functionality is set to MAXimize
        td_cell_3.setAttribute("onmouseup", "void(0);"); //I may use the onmouseup event listener in the future, so just placing it in advance
        td_cell_3.setAttribute("data-title", "Maximize"); //This is for the helper captions function. See helper_captions.js
        td_cell_3.setAttribute("data-desc", "view this window in full screen"); //helper captions attribute
    }

    //The close icon image's src attribute does not change at this point
    if (icon_img_4 !== null) {
        //icon_img_4.setAttribute("src", "/chromosphere/images/ui/icons/close_19x19.png");
    }

    //The closing function doesn't change as of now
    if (td_cell_4 !== null) {
        //td_cell_4.setAttribute("onmousedown", "void(0);");
        //td_cell_4.setAttribute("onmouseup", "void(0);");
        //td_cell_4.setAttribute("data-title", "Close"); //This is for the helper captions function. See helper_captions.js
        //td_cell_4.setAttribute("data-desc", "close this window"); //helper captions attribute
    }

    //2024-03-19:
    //each window now contains a "down arrow" icon. When the window is not cascaded,
    //set its display to none so that it cannot have unwanted interaction.
    //Since the window is in a cascaded state, make the icon display as a table cell.
    //see file: 'more_window_actions.js'
    show_more_window_actions_icon(win_id);

}



function set_icons_add_functions_for_tabbed(win_id) {
    var win = null;
    var title_box_id = null;
    var title_box = null;
    var title_box_wrapper = null;
    var title_box_wrapper_id = null;

    //get the window object by its id
    win = document.getElementById(win_id);
    if (win !== null) {
        //get the id attribute of the window's title object
        title_box_id = win_id + "_window_title";
        title_box = document.getElementById(title_box_id);
        if (title_box !== null) {
            title_box_wrapper_id = title_box_id + "_div_wrapper";
            title_box_wrapper = document.getElementById(title_box_wrapper_id);
            if (title_box_wrapper !== null) {
                title_box_wrapper = insert_window_state_controls_for_tabbed(win_id, title_box_wrapper);
            }
            else {
                //create a new HTML div object.
                title_box_wrapper = document.createElement("div");

                //get the title box object of the window
                //that is to be tabbed. The function returns an HTML object, not text
                title_box_wrapper = get_window_title_HTML(win_id, title_box_wrapper);

                //insert the icons that are to be in place
                title_box_wrapper = insert_window_state_controls_for_tabbed(win_id, title_box_wrapper);
            }

        }

        //2024-05-18:
        //If there are minimized windows, there is a box/button made to "stow", or hide/show
        //minimized windows. If the window is not maximized and not minimized, then display the box.
        //see file: 'stow_minimized_windows.js'
        show_stow_minimized_window_box();
    }
    return title_box_wrapper;
}



function insert_window_state_controls_for_tabbed(win_id, title_box_wrapper) {
    var prepend_icon_td = null;
    var append_icon_td = null;
    var tab_box_table_row = null;
    var prepend_icon_image = null;
    var append_icon_image = null;

    tab_box_table_row = document.getElementById(win_id + "_tab_box_table_row_window_tab");
    if (tab_box_table_row !== null) {
        if (title_box_wrapper !== null) {
            prepend_icon_td = document.getElementById(win_id + "_tab_box_td_0000");
            append_icon_td =  document.getElementById(win_id + "_tab_box_td_0005");

            if (prepend_icon_td !== null) {
            //the table cell already exists. continue.
            }
            else {
                //create the new table cell and insert it into the
                //table row as the first child node.
                prepend_icon_td = document.createElement("td");
                prepend_icon_td.setAttribute("id", win_id + "_tab_box_td_0000");
                prepend_icon_td.style.width = "19px";
                prepend_icon_td.style.height = "19px";
                prepend_icon_td.style.paddingTop = "4px";
                prepend_icon_td.style.paddingLeft = "1px";

                prepend_icon_image = new Image();
                prepend_icon_image.style.width = "19px";
                prepend_icon_image.style.height = "19px";
                prepend_icon_image.src = "/chromosphere/images/blank.gif";
                prepend_icon_td.appendChild(prepend_icon_image);

                tab_box_table_row.insertBefore(prepend_icon_td, tab_box_table_row.childNodes[0]);
            }

            if (append_icon_td !== null) {
                //the table cell already exists. continue.
            }
            else {
                //create the new table cell and insert it into the
                //table row as the last child node.
                append_icon_td = document.createElement("td");
                append_icon_td.setAttribute("id", win_id + "_tab_box_td_0005");
                append_icon_td.style.width = "19px";
                append_icon_td.style.height = "19px";
                append_icon_td.style.paddingTop = "4px";
                append_icon_td.style.paddingLeft = "1px";

                append_icon_image = new Image();
                append_icon_image.style.width = "19px";
                append_icon_image.style.height = "19px";
                append_icon_image.src = "/chromosphere/images/ui/icons/close_19x19.png";
                append_icon_image.setAttribute("onmouseover", "this.parentNode.style.backgroundColor='rgba(0,0,255,1.0)';");
                append_icon_image.setAttribute("onmouseout", "this.parentNode.style.background='none';");

                append_icon_td.appendChild(append_icon_image);
                tab_box_table_row.appendChild(append_icon_td);

                //append_icon_td.setAttribute("onmousedown", "on_tab_close_select_show_adjacent_tabbed_window(\"" + win_id + "\");");
                append_icon_td.setAttribute("onmousedown", "pause_remove_stow_minimized_windows_box_if_no_minimized_exist();");

                ////append_icon_td.setAttribute("onmouseup", "title_box_wrapper_mousedown(\"" + win_id + "\");");

                append_icon_td.setAttribute("onmouseup", "restore_tabbed_window_to_cascade(\"" + win_id + "\");window_close(\"" + win_id + "\");window_resize_event_function(\"" + win_id + "\");");
                ////append_icon_td.setAttribute("onclick", "web_browser_window_mouseup_tabbed_windows(\"" + win_id + "\");");

            }
        }
    }
}


//2024-05-20:
//call the functions that need to run
//every time a window's state changes
function on_window_state_change_call_functions(win_id) {
    ////alert(win_id);

    //2024-05-20:
    //hide/show the tabbed windows tab box container
    //depending on if maximized windows exist, or not.
    //for this function, see file: 'tab_windows.js'
    on_window_state_change_set_tab_box_container_display();

    //2024-05-20:
    //this function will select and show the tabbed window
    //that is the previous/next sibling of the tabbed window
    //to remove. if no previous or next sibling of the 
    //tabbed window exist, then it will select the first 
    //available. if neither sibling exists, then we know 
    //that it is the last tabbed window remaining. 
    //see file: 'tab_windows.js'
    on_tab_close_select_show_adjacent_tabbed_window(win_id);

    //2024-05-20:
    //for redundancy purposes, this function is called. check
    //if there are any existing minimized windows. if no
    //minimized windows exist, then make sure that the
    //"hide stow minimized window box/button" element has
    //its display set to hidden. 
    //see file: 'stow_minimized_windows.js'
    hide_stow_minimized_windows_box_if_no_minimized_exist();


    //2024-05-21:
    //instead of just hiding it, maybe remove the elements of the stow
    //minimized windows from the DOM altogether. this function counts
    //the minimized windows.if no minimized windows exist (count < 1),
    //then remove the stow minimized windows box/button. in this case
    //there is a pause in time before calling the function that counts
    //the minimized windows, and if none exist, remove the stow minimized
    //windows components.
    // see file: 'stow_minimized_windows.js'
    setTimeout(function () {
        remove_stow_minimized_windows_box_if_no_minimized_exist();
    }, 1000);


    //2024-07-16:
    //this function updates the window's details
    //menu values (if it is currently displayed),
    //such as window state (Cascade, Maximize, etc.).
    //see file: 'show_window_details.js'
    update_details(win_id);
}