//
// Main Page period status update
//
//	@todo Draw the 'drum' as an arc instead of trying to rotate a picture of an arc.
//			which will work better to reflect the opening.
//
//
// var mySite = 'http://192.168.1.23'; // from myip.js
var url = mySite + '/state';
setInterval(RefreshStatus, 1000);		// @todo speed this up to 500 msec or even 250

getIt = function (aUrl, callback) {
	var xhr = new XMLHttpRequest();
	xhr.open('GET', aUrl, true);
	xhr.responseType = 'text';
	xhr.onload = function (e) {
		if (this.status === 200) {
			callback(this.response);
		}
	};
	xhr.send();
};

function ConvertTempToString(tempC, showF) {
	var tempF = tempC * 9 / 5 + 32;
	if (showF == 0)
		return tempF.toFixed(0) + "°F";
	else
		return tempC.toFixed(0) + "°C";
}

function ConvertSecToMMSS(sec) {
	mm = parseInt(sec/60).toString().padStart(4,'0');
	ss = (sec%60).toString().padStart(2,'0');
	return mm + ":" + ss;
}

function RefreshStatus() {
	getIt(url,
		function(data) {
			obj = JSON.parse(data);
			document.getElementById('version').innerHTML = obj.version;
			document.getElementById('name').innerHTML = obj.name;
            document.getElementById('uptime').innerHTML = 'Uptime: ' + obj.uptime;
			document.getElementById('wifimode').innerHTML = 'WiFi Mode: ' + obj.wifimode;
			// IP Address
			var elms = document.querySelectorAll('.' + 'ip'), i;
			for (i = 0; i < elms.length; ++i) {
				elms[i].textContent = obj.ip;
			}
			// Plant status
			document.getElementById('TimeOfDay').innerHTML = obj.TimeOfDay;
			var userF = obj.Fahrenheit;

			if (typeof obj.AmbientTemp_C != "undefined") {
				document.getElementById('AmbientTemp_C').innerHTML = ConvertTempToString(obj.AmbientTemp_C, userF);
			} else {
				document.getElementById('AmbientTemp_C').innerHTML = "--";
			}

			if (typeof obj.ChamberTemp_C != "undefined") {
				document.getElementById('ChamberTemp_C').innerHTML = ConvertTempToString(obj.ChamberTemp_C, userF);
				document.getElementById('ChamberHumi').innerHTML = parseInt(obj.ChamberHumi) + "%";
			} else {
				document.getElementById('ChamberTemp_C').innerHTML = "--";
				document.getElementById('ChamberHumi').innerHTML = "--"
			}				

			if (typeof obj.SoilHeater != "undefined") {
				document.getElementById('SoilHeater').innerHTML = (obj.SoilHeater) ? "Heat On" : "Heat Off";
			} else {
				document.getElementById('SoilHeater').innerHTML = "--";
			}
			
			if (typeof obj.SoilTemp_C != "undefined") {
				document.getElementById('SoilTemp_C').innerHTML = ConvertTempToString(obj.SoilTemp_C, userF);
			} else {
				document.getElementById('SoilTemp_C').innerHTML = "--";
			}
			if (typeof obj.SoilTemp_C != "undefined") {
				document.getElementById('SoilMoisture_X').innerHTML = obj.SoilMoisture_X;
			} else {
				document.getElementById('SoilMoisture_X').innerHTML = "--";
			}
			
			if (obj.DrumState == 1) {	// closed, hide the "open" image
				document.getElementById('DrumState').style.display === "none";
			} else {
				document.getElementById('DrumState').style.display === "block";
			}
			document.getElementById('DrumOpenSensor').innerHTML = (obj.DrumOpenSensor) ? "O" : "!O";
			document.getElementById('DrumClosedSensor').innerHTML = (obj.DrumClosedSensor) ? "C" : "!C";
			document.getElementById('DrumMotorStatus').innerHTML = (obj.DrumMotorStatus == 0) ? "stopped" : (obj.DrumMotorStatus == 1) ? "CW" : "CCW";
			document.getElementById('DrumMotorOn_sec').innerHTML = obj.DrumMotorOn_sec + "s";
			document.getElementById('DrumMotor_V').innerHTML = parseFloat(obj.DrumMotor_V).toFixed(1) + " V";
			document.getElementById('DrumMotor_I').innerHTML = parseFloat(obj.DrumMotor_I).toFixed(1) + " A";
			
			document.getElementById('WaterInTank').innerHTML = obj.WaterInTank;
			document.getElementById('WaterPumpStatus').innerHTML = (obj.WaterPumpStatus) ? "On" : "Off";
			document.getElementById('WaterMotor_V').innerHTML = parseFloat(obj.WaterMotor_V).toFixed(1) + " V";
			document.getElementById('WaterCyclePeriod_sec').innerHTML = ConvertSecToMMSS(obj.WaterCyclePeriod_sec);
			document.getElementById('WaterCycleOn_sec').innerHTML = ConvertSecToMMSS(obj.WaterCycleOn_sec);
			document.getElementById('WaterCycle_sec').innerHTML = ConvertSecToMMSS(obj.WaterCycle_sec);
			
			// The full-scale pump timer box ranges from 22 to 234px
			// The WaterCycleOnBox.width is proportional to the WaterCyclePeriod_sec and the (234 - 22)px width
			var boxW = (234 - 22);
			// The WaterCyclePointer_sec.width (24) is positioned from 22 to 234 - 1/2 width.
			var onW = (obj.WaterCycleOn_sec/obj.WaterCyclePeriod_sec) * boxW;
			var ptrX = 22 + (obj.WaterCycle_sec/obj.WaterCyclePeriod_sec) * boxW - 12;
			console.log("onW: " + onW + ", ptrX: " + ptrX);
			document.getElementById('WaterCycleOnBox').width = onW;
			document.getElementById('WaterCyclePointer_sec').left = ptrX;
		}
	);
}