"use strict";

function record_event(ev) {

}


function store_event(ev) {
    var div_wrap = null;
    var event_timestamp = null;
    var event_object = null;
    var event_container = null;
    var new_event = null;

    var value = null;
    var name = null;
    
    event_object = ev;
    event_timestamp = event_object.timeStamp.toString();
    event_object = stringify_object(event_object, 0, 2);
    for (let key in event_object) {
        name = event_object[key].toString();
        value = event_object[key];
    }
    ////new_event = create_new_event(event_object, "customevent");
    //event_object = JSON.stringify(event_object);
    div_wrap = document.createElement("div");

    if (typeof event_timestamp === "string" && event_timestamp.length > 0) {
        //event time stamp exists and has a length longer than a null string.
    }
    else {
        //the time stamp is invalid, or does not exist. Create a new time stamp.
        event_timestamp = get_time_milliseconds(); //this function gets the current date in milliseconds. See file 'functions_2.js'
    }

    //set a unique ID attribute to the event object we intend to
    //store in the DOM.
    div_wrap.setAttribute("id", "stored_event_object_" + event_timestamp);

    //if the event container already exists, take no action.
    //if it does not exist in the DOM, create it, and append it
    //to the DOM.
    make_DOM_events_container();

    //Not sure if this will work, but attempt to add the event object
    //to its div wrapper. 
    div_wrap.innerHTML = event_object;

    event_container = document.getElementById("chromosphere_events");
    if (event_container !== null) {
        //if the event container exists, append the div_wrap containing
        //the object as a new child node.
        event_container.appendChild(div_wrap);
        return div_wrap.id;
    }
    else {

    }
}

//if the container to store event objects exists within the DOM, then
//take no further action. Otherwise, create the event, and add the 
//new event container to the DOM.
function make_DOM_events_container() {
    var container = null;

    container = document.getElementById("chromosphere_events");
    if (container !== null) {
        //the event container already exists in the DOM.
        //No further action is needed.
    }
    else {
        //Make a new chromosphere event container, and
        //call the function that appends it to the DOM.
        container = document.createElement("div");
        container.setAttribute("id", "chromosphere_events");
        container.style.display = "none";
        container.style.opacity = 0;
        place_events_container_into_DOM(container);
    }
}


//This function checks for Chromosphere's DOM container. If it exists,
//insert the event container into Chromosphere's DOM container.
//If Chromosphere's DOM container does not currently exist,
//then append the event container to the DOM as a child object
//of the body node.
function place_events_container_into_DOM(events_container) {
    var container = null;
    var ev_container = null;

    //get the event container if it exists in the DOM
    ev_container = document.getElementById(events_container.id);

    if (ev_container !== null) {
        //event container already exists in the DOM.
        //There's no reason to add duplicate event containers
    }
    else {
        //the event container is not present in the DOM. Add it.
        container = document.getElementById("chromosphere_objects_container");
        if (container !== null) {
            //if the preferred DOM container to store Chromosphere objects exists, then
            //append the event container to it.
            container.appendChild(events_container);
        }
        else {
            //the DOM container we prefer to store the event container within 
            //does not exist. So, append the event container to the 
            //body object instead.
            document.body.appendChild(events_container);
        }
    }   
}


function display_event_details(ev) {
    var e = null;
    var bubbles = null;

    e = ev;
    //bubbles = ;
    
    
}

//2023-09-23:
//I wasn't sure how to convert an event into a string representation.
//I found something that could possibly work, and I've modified it.
//It looks good, but it would be of no surprise if it breaks something.
//USE CAUTION. FYI: I tested it and it does seem to work! Nice.
//See URL: https://stackoverflow.com/questions/11547672/how-to-stringify-event-object
function stringify_object(object, depth, max_depth) {
    //for reference - the original function declaration w/ default arguments: "function stringify_object(object, depth = 0, max_depth = 2)"
    var obj = null;
    var value = null;

    //change max_depth to see more levels, for a touch event, 2 is good
    if (depth > max_depth) {
        return 'Object';
    }

    //create an empty object
    obj = {};
    //for each key contained in the object
    for (let key in object) {
        //set the object key's value to a variable
        value = object[key];
        //if the value is of type Node
        if (value instanceof Node) {
            // specify which properties you want to see from the node
            value = { id: value.id };
        }
        else if (value instanceof Window) {
            //if the value is of type Window
            value = 'Window';
        }
        else if (value instanceof Object) {
            //if value is a type of object, stringify it. 
            value = stringify_object(value, depth + 1, max_depth);
        }
        //insert the key and value into the new object.
        obj[key] = value;
    }

    //output the obj variable, or a stringified representation of an object.
    return depth ? obj : JSON.stringify(obj);
}


//2023-09-23:
//I don't know what I'm doing.
//But, its working. See file 'start.js', and note the event listener added
//to the Window object for "click". It calls this function, and evokes
//the same event type, right in the middle (centered X, Y, of the Body object in this case)
//Check the console to see the result logged twice, that proves it works.
function set_duplicate_event(ev, new_target) {
    var e = null;
    var elem = null;
    var key_name = null;
    var key_value = null;
    var new_event = null;

    e = ev;
    elem = new_target;
    new_event = new Event(e.type);
    new_event.clientX = parseFloat(elem.offsetLeft) + parseFloat(elem.offsetWidth / 2);
    new_event.clientY = parseFloat(elem.offsetTop) + parseFloat(elem.offsetHeight / 2);
    new_event.target = elem;

    /*
    for (let key in e) {
        if (key_value instanceof Object) {
            key_value = stringify_object(e[key], 0, 2);
            key_name = e[key].toString();

            alert(key_value);
            if (key_name === "target") {
                new_event[key] = elem;
            }
            else if (key_name === "clientX") {
                new_event[key] = parseFloat(elem.offsetLeft) + parseFloat(elem.offsetWidth / 2);
            }
            else if (key_name === "clientY") {
                new_event[key] = parseFloat(elem.offsetTop) + parseFloat(elem.offsetHeight / 2);
            }
            else {
                new_event[key] = key_value;
            }
        }
    }
    */

    elem.dispatchEvent(new_event);
}



function create_new_event(object, event_type) {
    var new_event = null;

    new_event = new CustomEvent("customevent", object);


    //new_event.initCustomEvent(object);

    //new_event = document.createEvent(event_type);

    //return new_event;
}