engine_radio/admin.html at master · realbogart/engine_radio · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
<html>
	<head>
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
		<script type="text/javascript" src="/simplesocket"></script>

		<script type="text/javascript">
		var webSocket = $.simpleWebSocket({ url: '<websocket_server>' });
		webSocket.connect();

		webSocket.isConnected(function(connected) {
			webSocket.send('connected');
		});

		function setSchedule(schedule)
		{
			jQuery('#schedule').html(JSON.stringify(schedule, null, 4));
		}

		webSocket.listen(function(msgString) {
			var msgJson = JSON.parse( msgString );

			if(msgJson.type == 'setSchedule') {
				setSchedule(JSON.parse( msgJson.data ));
			}
		});

		function validJSON(text) {
		    try {
		        JSON.parse(text);
		    } catch (e) {
		        return false;
		    }
		    return true;
		}

		$(function() {
			$('#update').click(function() {
				var scheduleText = $('#schedule').val();
				if(validJSON(scheduleText))
				{
					$('#info').html("Sending schedule...");
					$.post('/updateSchedule', scheduleText, function() {
						$('#info').html("Updated schedule!");
					});
				}
				else
				{
					$('#info').html("Invalid JSON");
				}
			});

			function listSchedules(schedules)
			{
				$('#sheetSchedule').html('');
				jQuery.each(schedules, function(i, val) {
					var newSchedule = $("<p />", { text: val.title });
					newSchedule.on("click", function() {
						setSchedule(val);
					});

					newSchedule.appendTo("#sheetSchedule");
				});
			}

			$('#getSchedules').click(function() {
				$.ajax({
					type: 'GET',
					url: '/getSchedules',
					dataType: 'json',
					error: function(request, status, error) {
						$('#info').html(error.message);
					},
					success: function(data) {
						listSchedules(data);
					}
				});
			});
		});
		</script>
	</head>
	<body>
		<textarea id="schedule" rows="48" cols="200"></textarea><br><br>
		<input id="update" type="submit" value="Update"/>
		<input id="getSchedules" type="submit" value="Load schedules from sheet"/>

		<div id="sheetSchedule"></div>
		<div id="info"></div>
	</body>
</html>