"use strict";

function start_chromosphere_objects_container() {
    var container_exists = null;
    var objects_container = null;

    container_exists = DOM_container_exists();
    if (container_exists === true) {
        objects_container = document.getElementById("chromosphere_objects_container");
    }
    else if (container_exists === false) {
        objects_container = create_chromosphere_objects_DOM_container();
    }
    else {
        return null;
    }
    return objects_container;
}


//This function name is easy to remember. 
function save_in_DOM(elem) {
    insert_element_into_DOM_container(elem);
}

//2023-09-20:
//This function inserts an empty div element into
//the DOM at the beginning of the body element. The element
//is serving as a place to store DOM objects related to
//Chromosphere
function create_chromosphere_objects_DOM_container() {
    // < !--CONTAINER TO HOLD VARIOUS CHROMOSPHERE DOM OBJECTS //-->
    // <div id="chromosphere_objects_container" style="display:none;"></div>
    var div_container = null;

    if (DOM_container_exists() !== true) {
        div_container = document.createElement("div");
        div_container.setAttribute("id", "chromosphere_objects_container");
        div_container.style.display = "none";
        div_container.style.opacity = 0;

        document.body.insertBefore(div_container, document.body.children[0]);
        //2023-09-20:
        //Instead of inserting the object into the body as a first child,
        //use the new default DOM container objects. It's just a div element
        //inside the body element.
        ////save_in_DOM(div_container);

        return div_container;
    }
    else {
        div_container = document.getElementById("chromosphere_objects_container");
        if (div_container !== null) {
            return div_container;
        }
    }
}


function insert_element_into_DOM_container(elem) {
    var container = null;

    container = document.getElementById("chromosphere_objects_container");
    if (container !== null) {
        if (element_exists_inside_container(elem) !== true) {
            if (container.hasChildNodes() === true) {
                document.insertBefore(elem, container.children[0]);
            }
            else {
                container.appendChild(elem);
            }
        }
    }
    else {
        create_chromosphere_objects_DOM_container();
        //if (DOM_container_exists() === true) {
        //    if (element_exists_inside_container(elem) !== true) {
        //        insert_element_into_DOM_container(elem);
        //    }
        //}
    }
   /* else {
        create_chromosphere_objects_DOM_container();
        insert_element_into_DOM_container(elem);
    }
    */
}



function element_exists_inside_container(elem) {
    var div = null;
    var existing_objects_array = [];
    var object_exists = null;
    var i = null;
    var existing_objects_array_length = null;
    var object_item = null;

    object_exists = false;

    div = document.getElementById("chromosphere_objects_container");
    if (div !== null) {
        existing_objects_array = div.children;
        existing_objects_array_length = existing_objects_array.length;
        for (i = 0; i < existing_objects_array_length; i++) {
            object_item = existing_objects_array[i];
            if (object_item.id.toLowerCase() === elem.id.toLowerCase()) {
                object_exists = true;
            }
        }


        //if (existing_objects === true) {
        //    object_exists = true;
        //}
        //else {
        //    object_exists = false;
        //}

    }

    return object_exists;
}

function DOM_container_exists() {
    var container = null;

    container = document.getElementById("chromosphere_objects_container");
    if (container !== null) {
        return true;
    }
    else {
        return false;
    }
}



/* 
2023-09-20:
KEEP THIS FOR REFERENCE
*/
/*
//2023-09-20:
//This function inserts an empty div element into
//the DOM at the beginning of the body element. The element
//is serving as a place to store DOM objects related to
//Chromosphere
function place_chromosphere_objects_container() {
    // < !--CONTAINER TO HOLD VARIOUS CHROMOSPHERE DOM OBJECTS //-->
    // <div id="chromosphere_objects_container" style="display:none;"></div>
    var div = null;

    div = document.createElement("div");
    div.setAttribute("id", "chromosphere_objects_container");
    div.style.display = "none";

    document.body.insertBefore(div, document.body.children[0]);
}
*/