tempgopher/html/js/thermostat.js

function celsiusToFahrenheit(degree) {
    return degree * 1.8 + 32;
}

function renderThermostats() {
    $.ajax({
        url: jsconfig.baseurl + "/api/status/"
    }).then(function(data) {
        $("#thermostats").empty();
        for (var key in data) {
            // Title of thermostat
            var titleh = $("<h4></h4>").text(data[key].alias);
            var titlediv = $("<div></div>").addClass("row").append(titleh);

            // Thermostat status
            var rowdiv = $("<div></div>");
            rowdiv.addClass("row");

            // Display temperature
            if (jsconfig.fahrenheit) {
                var temp = celsiusToFahrenheit(parseFloat(data[key].temp)).toFixed(1) + "°F";
            } else {
                var temp = parseFloat(data[key].temp).toFixed(1) + "°C";
            }
            var temph = $("<h2></h2>").text(temp);
            var tempdiv = $("<div></div>").addClass("two columns").append(temph);
            rowdiv.append(tempdiv);

            // Display status
            if (data[key].cooling) {
                var statustext = "Cooling"
            } else if (data[key].heating) {
                var statustext = "Heating"
            } else {
                var statustext = "Idle"
            }
            var statusp = $("<p></p>").html(statustext);
            var statusdiv = $("<div></div>").addClass("two columns").append(statusp);
            rowdiv.append(statusdiv);

            // Display sensor config
            $.ajax({
                url: jsconfig.baseurl + "/api/config/sensors/" + data[key].alias
            }).then(function(configData){
                if (jsconfig.fahrenheit) {
                    var degUnit = "°F";
                    var hightemp = celsiusToFahrenheit(parseFloat(configData.hightemp)).toFixed(1);
                    var lowtemp = celsiusToFahrenheit(parseFloat(configData.lowtemp)).toFixed(1);
                } else {
                    var hightemp = parseFloat(configData.hightemp).toFixed(1);
                    var lowtemp = parseFloat(configData.lowtemp).toFixed(1);
                }

                rp = '[0-9]+(\.[0-9]+)?'

                var cmIn = $("<input>").attr("id", "cm" + configData.alias).val(configData.coolminutes).attr("size", "2").attr("pattern", rp).on('input', function(){window.clearInterval(rtHandle)});
                var htIn = $("<input>").attr("id", "ht" + configData.alias).val(hightemp).attr("size", "4").attr("pattern", rp).on('input', function(){window.clearInterval(rtHandle)});
                var hmIn = $("<input>").attr("id", "hm" + configData.alias).val(configData.heatminutes).attr("size", "2").attr("pattern", rp).on('input', function(){window.clearInterval(rtHandle)});
                var ltIn = $("<input>").attr("id", "lt" + configData.alias).val(lowtemp).attr("size", "4").attr("pattern", rp).on('input', function(){window.clearInterval(rtHandle)});

                var configp = $("<p></p>").text("Chills for ").append(cmIn).append(" minutes when &gt; ").append(htIn).append(degUnit).append($("<br>"));
                configp.append("Heats for ").append(hmIn).append(" minutes when &lt; ").append(ltIn).append(degUnit);

                var configdiv = $("<div></div>").addClass("five columns").append(configp);
                rowdiv.append(configdiv);

                var yesButton = $("<button></button>").attr("type", "submit").addClass("button button-primary").text("✔").css("margin-right", "5px");
                var noButton = $("<button></button>").attr("id", "no" + configData.alias).addClass("button").text("✘");
                var buttonDiv = $("<div></div>").addClass("three columns").append(yesButton).append(noButton);
                rowdiv.append(buttonDiv);

                // Add things back to the thermostat list
                $("#thermostats").append(titlediv);
                $("#thermostats").append($("<form></form>").append(rowdiv));

                // Re-engage reload, and re-render the thermostat on clear
                $("#no" + configData.alias).click(function() {
                    window.setInterval(renderThermostats, 60000);
                    renderThermostats();
                });
            });
        };
    });
};

function renderVersion() {
    $.ajax({
        url: jsconfig.baseurl + "/api/version"
    }).then(function(data) {
        var versionText = "TempGopher © 2018 Mike Shoup | Version: " + data.version;
        $("#version").text(versionText);
    });
};
$(document).ready(renderVersion);

$(document).ready(renderThermostats);
var rtHandle = window.setInterval(renderThermostats, 60000);