From fdb6d652202beb8c5deea828936939786c04f2c5 Mon Sep 17 00:00:00 2001
From: iou1name <iou1name@national.shitposting.agency>
Date: Wed, 18 Mar 2020 13:07:07 -0400
Subject: [PATCH] add time_offset control

---
 events.py            |  3 +++
 models.py            |  4 ++++
 static/juice.js      | 10 +++++++++-
 templates/index.html |  4 ++++
 4 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/events.py b/events.py
index 89b4b39..3a780a4 100644
--- a/events.py
+++ b/events.py
@@ -262,6 +262,9 @@ async def lixie_clock(request, ws, data):
 		mqtt_msg.append('color')
 		payload = tools.from_html_color(data.get('color'))
 		payload = str(payload)[1:-1].replace(' ', '')
+	elif data.get('change_mode') == 'time_offset':
+		mqtt_msg.append('time_offset')
+		payload = data.get('time_offset')
 	mqtt_msg = '/'.join(mqtt_msg)
 
 	request.app['mqtt'].publish(mqtt_msg, payload)
diff --git a/models.py b/models.py
index c0b8e79..8fc14f0 100644
--- a/models.py
+++ b/models.py
@@ -284,6 +284,10 @@ class LixieClock(Device):
 			data['change_mode'] = 'color'
 			data['color'] = tools.to_html_color(payload)
 			self.color = payload
+		elif topic[1] == 'time_offset':
+			data['change_mode'] = 'time_offset'
+			data['time_offset'] = int(payload)
+			self.time_offset = int(payload)
 		save_network(network)
 
 		res = {'event': 'lixie_clock', 'data': data}
diff --git a/static/juice.js b/static/juice.js
index ce293dc..3dfbd05 100644
--- a/static/juice.js
+++ b/static/juice.js
@@ -243,6 +243,8 @@ function lixie_clock_recv(data) {
 		device.querySelector('#lixie_number_' + device.id).value = data.display_number;
 	} else if (data.change_mode === 'color') {
 		device.querySelector('#display_color_' + device.id).value = data.color;
+	} else if (data.change_mode === 'time_offset') {
+		device.querySelector('#lixie_time_offset_' + device.id).value = data.time_offset;
 	}
 }
 
@@ -275,7 +277,8 @@ function save_field(field) {
 	socket.send('edit_field', data);
 }
 
-function new_device() { let data = {
+function new_device() {
+	let data = {
 		device_type: 'RelayDevice',
 	};
 	socket.send('new_device', data);
@@ -393,6 +396,9 @@ function lixie_clock(input) {
 	} else if (input.className === 'color') {
 		data['change_mode'] = 'color';
 		data['color'] = input.value
+	} else if (input.className === 'time_offset') {
+		data['change_mode'] = 'time_offset';
+		data['time_offset'] = device.querySelector('#lixie_time_offset_' + device.id).value;
 	}
 	socket.send('lixie_clock', data);
 }
@@ -472,8 +478,10 @@ function lixie_display_mode(radio, send_socket_event = true) {
 	let device = radio.closest('.device');
 	if (radio.value === 'time') {
 		device.querySelector('.lixie_number').style.display = 'none';
+		device.querySelector('.lixie_time_offset').style.display = 'block';
 	} else if (radio.value === 'number') {
 		device.querySelector('.lixie_number').style.display = 'block';
+		device.querySelector('.lixie_time_offset').style.display = 'none';
 	}
 	if (send_socket_event) {
 		lixie_clock(radio);
diff --git a/templates/index.html b/templates/index.html
index 78a22c1..e3d755a 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -136,6 +136,10 @@
 					<div class="lixie_controls">
 						<input type="radio" id="display_mode_time_{{ device.id }}" class="time" name="display_mode_{{ device.id }}" value="time" onchange="lixie_display_mode(this)"{% if device.display_mode == 'time' %} checked{% endif %}>
 						<label for="display_mode_time_{{ device.id }}">Time</label><br>
+						<div class='lixie_time_offset' style="display: {% if device.display_mode == 'time' %}block{% else %}none{% endif %}">
+							<label for="lixie_time_offset_{{ device.id }}">Time Zone Offset:</label>
+							<input type="number" id="lixie_time_offset_{{ device.id }}" class="time_offset" min="-12" max="12" value="{{ device.time_offset }}" onchange="lixie_clock(this)">
+						</div>
 						<input type="radio" id="display_mode_number_{{ device.id }}" class="number" name="display_mode_{{ device.id }}" value="number" onchange="lixie_display_mode(this)"{% if device.display_mode == 'number' %} checked{% endif %}>
 						<label for="display_mode_number_{{ device.id }}">Number</label><br>
 						<div class='lixie_number' style="display: {% if device.display_mode == 'number' %}block{% else %}none{% endif %}">