class Signals {
    constructor(indicators) {
        this.indicators = indicators;
    }
    // Call to display Create new signal dialog.
    open_signal_Form() { document.getElementById("new_sig_form").style.display = "grid"; }
    // Call to hide Create new signal dialog.
    close_signal_Form() { document.getElementById("new_sig_form").style.display = "none"; }

    fill_prop(target_id, indctr){
        // arg1: Id of of a selection element.
        // arg2: Name of an indicator
        // Replace the options of an HTML select elements
        // with the properties an indicator object.

        // Fetch the objects using name and id received.
        var target = document.getElementById(target_id);
        var properties = window.UI.data.indicators[indctr];

        // Remove any previous options in the select tag.
        removeOptions(target);
        // Loop through each property in the object.
        // Create an option element for each one.
        // Append it to the selection element.
        for(let prop in properties)
            {
                if (prop =='type'|| prop == 'visible' || prop == 'period'){continue;}
                if (prop.substring(0,5) == 'color'){continue;}
                var opt = document.createElement("option");
                opt.innerHTML = prop;
                target.appendChild(opt);
            }
        return;
        function removeOptions(selectElement) {
            var i, L = selectElement.options.length - 1;
            for(i = L; i >= 0; i--) {
                selectElement.remove(i);
            }
        }
    }
    switch_panel(p1,p2){
        // Panel switcher for multi page forms
        // arg1 = target from id
        // arg2 = next target id
        // This function is used in the New Signal dialog in signals
        document.getElementById(p1).style.display='none';
        document.getElementById(p2).style.display='grid';
    }

    hideIfTrue(firstValue, scndValue, id){
        // Compare first two args and hides an element if they are equal.
        // This function is used in the New Signal dialog in signals
        if( firstValue == scndValue){
            document.getElementById(id).style.display='none';
        }else{
            document.getElementById(id).style.display='block'
        }
    }
    ns_next(n){
        // This function is used in the New Signal dialog in signals
        if (n==1){
            // Check input fields.
            let sigName = document.getElementById('signal_name').value;
            let sigSource = document.getElementById('sig_source').value;
            let sigProp = document.getElementById('sig_prop').value;
            if (sigName == '' ) { alert('Please give the signal a name.'); return; }
            // Populate sig_display
            document.getElementById('sig_display').innerHTML = (sigName + ': {' + sigSource + ':' + sigProp +'}');
            // Popilate Value input
            let indctrVal =  document.getElementById(sigSource + '_' + sigProp).value;
            document.getElementById('value').value = indctrVal;

            this.switch_panel('panel_1','panel_2');
        }
        if (n==2){

            // Collect all the input fields.

            let sigName = document.getElementById('signal_name').value;                     // The name of the New Signal.
            let sigSource = document.getElementById('sig_source').value;                    // The source(indicator) of the signal.
            let sigProp = document.getElementById('sig_prop').value;                        // The property to evaluate.
            let sig2Source = document.getElementById('sig2_source').value;                  // The second source if selected.
            let sig2Prop = document.getElementById('sig2_prop').value;                      // The second property to evaluate.
            let operator = document.querySelector('input[name="Operator"]:checked').value;  // The operator this evaluation will use.
            let range = document.getElementById('rangeVal').value;                          // The value of any range being evaluated.
            let sigType = document.getElementById('select_s_type').value;                   // The type of signal value or indicator comparison.
            let value = document.getElementById('value').value;                             // The input value if it is a value comparison.

            // Create a string to define the signal.

            // Include the first indicator source.
            var sig1 = `${sigSource} : ${sigProp}`;
            // If it is a comparison signal include the second indicator source.
            if (sigType == 'Comparison') {
                var sig2 = `${sig2Source} : ${sig2Prop}`;
            }
            // If it is a value signal include the value.
            if (sigType == 'Value') {var sig2 =  value;}

            // If the operator is set to range, include the range value in the string.
            if (operator == '+/-') {
                var operatorStr = `${operator} ${range}`;
            } else{
                var operatorStr = operator;
            }

            let sigDisplayStr = `(${sigName}) (${sig1}) (${operatorStr}) (${sig2})`;

            // Get the current realtime values of the sources.
            let sig1_realtime = document.getElementById(sigSource + '_' + sigProp).value;

            if (sigType == 'Comparison') {
                // If its a comparison get the second value from the second source.
                var sig2_realtime = document.getElementById(sig2Source + '_' + sig2Prop).value;
            }else {
                // If not the second realtime value is literally the value.
                var sig2_realtime = sig2;
            }
            // Populate the signal display field with the string.
            document.getElementById('sig_display2').innerHTML = sigDisplayStr;

            // Populate the realtime values display.
            let realtime_Str = `(${sigProp} : ${sig1_realtime}) (${operatorStr}) (${sig2_realtime})`;
            document.getElementById('sig_realtime').innerHTML = realtime_Str;
            // Evaluate the signal
            var evalStr;
            if (operator == '=') {evalStr = (sig1_realtime == sig2_realtime);console.log([sig1_realtime, sig2_realtime, operator,evalStr]);}
            if (operator == '>') {evalStr = (sig1_realtime > sig2_realtime);}
            if (operator == '<') {evalStr = (sig1_realtime < sig2_realtime);}
            if (operator == '+/-') {
                evalStr = (Math.abs(sig1_realtime - sig2_realtime) <= range);
            }

            // Populate the signal eval field with the string.
            document.getElementById('sig_eval').innerHTML = evalStr;

            // Show the panel
            this.switch_panel('panel_2','panel_3');
        }
    }

    submitNewSignal(){

            // Collect all the input fields.

        var sigName = document.getElementById('signal_name').value;                     // The name of the New Signal.
        var sigSource = document.getElementById('sig_source').value;                    // The source(indicator) of the signal.
        var sigProp = document.getElementById('sig_prop').value;                        // The property to evaluate.
        var sig2Source = document.getElementById('sig2_source').value;                  // The second source if selected.
        var sig2Prop = document.getElementById('sig2_prop').value;                      // The second property to evaluate.
        var operator = document.querySelector('input[name="Operator"]:checked').value;  // The operator this evaluation will use.
        var range = document.getElementById('rangeVal').value;                          // The value of any range being evaluated.
        var sigType = document.getElementById('select_s_type').value;                   // The type of signal value or indicator comparison.
        var value = document.getElementById('value').value;                             // The input value if it is a value comparison.

        if (sigType == 'Comparison'){
            var sig2Source = sig2Source;
            var sig2Prop = sig2Prop;
        }else{
            var sig2Source = 'value';
            var sig2Prop = value;
        }
        if (operator == "+/-" ){
            var range = {range : range};
            var data = {sigName, sigSource, sigProp, operator, sig2Source, sig2Prop, range};
        }else{
            var data = {sigName, sigSource, sigProp, operator, sig2Source, sig2Prop};
        }
        /* It may be more maintainable to configure the connection inside the different classes
           than passing functions, references and callbacks around. */

       	window.UI.data.comms.send_to_app( "new_signal", data);
    }
}