Skip to content

Commit 7f34b56

Browse files
twpoltwpol
authored
Merge pull request #753 from cjakeman/api-cabcontrols4
Extends CabControls for user input
2 parents 3047d0a + ab8fe32 commit 7f34b56

File tree

3 files changed

+100
-24
lines changed

3 files changed

+100
-24
lines changed

‎Source/RunActivity/Viewer3D/WebServices/Web/CabControls/index.css

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,4 +5,21 @@ div#menu { text-align: left; }
55
tr td { text-align: right;}
66
td { padding: 2px; }
77
.scale { width: 100px; background-color: lightgray; }
8-
.gauge { margin: 0px; background-color: gold; }
8+
.gauge { margin: 0px; background-color: gold; }
9+
10+
.row {
11+
display: flex;
12+
}
13+
14+
.column {
15+
flex: 50%;
16+
}
17+
18+
div.control {
19+
text-align: left;
20+
padding: 20px;
21+
}
22+
23+
label {
24+
padding: 0 0 20px 0;
25+
}

‎Source/RunActivity/Viewer3D/WebServices/Web/CabControls/index.html

Lines changed: 53 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
<html lang="en">
2121
<head>
2222
<title>OR: Cab Controls</title>
23-
<meta charset="utf-8"/>
23+
<meta charset="utf-8" />
2424
<meta name="viewport" content="width=device-width, initial-scale=1"><!-- adds zooming for mobiles -->
2525
<link rel="shortcut icon" type="image/png" href="/or_logo.png"><!-- This icon appears in the page's tab and its bookmark. -->
2626
<link rel="stylesheet" type="text/css" href="/index.css"><!-- share styles with home page -->
@@ -30,19 +30,57 @@
3030

3131
<body onload="setInterval (ApiCabControls, 500)">
3232
<div id="menu"><a href="/">Back to Menu</a></div>
33-
<br><h2>Cab Controls, Instruments, Dials, Meters and Gauges</h2>
34-
<table>
35-
<thead>
36-
<tr>
37-
<th>Control</th>
38-
<th>Min</th>
39-
<th>Value</th>
40-
<th>Max</th>
41-
<th>Scale</th>
42-
</tr>
43-
</thead>
44-
<tbody id="markup">
45-
</tbody>
46-
</table>
33+
<br />
34+
<div class="row">
35+
<div class="column">
36+
<h2>Cab Instruments, Dials, Meters and Gauges</h2>
37+
<table>
38+
<thead>
39+
<tr>
40+
<th>Control</th>
41+
<th>Min</th>
42+
<th>Value</th>
43+
<th>Max</th>
44+
<th>Scale</th>
45+
</tr>
46+
</thead>
47+
<tbody id="markup">
48+
</tbody>
49+
</table>
50+
</div>
51+
<div class="column">
52+
<h2>Basic Controls</h2>
53+
<br />
54+
<br />
55+
<div class="control">
56+
<input id="train_brake" type="range" step="any" value="0" min="0" max="100" onchange="sendValue(this.value/100, 'TRAIN_BRAKE')" />
57+
<label for="train_brake">Train Brake (0 - 100)</label>
58+
</div>
59+
<div class="control">
60+
<input id="direction" type="range" value="0" min="-1" max="1" onchange="sendValue(this.value, 'DIRECTION')" />
61+
<label for="direction">Direction/Reverser (-1 - +1)</label>
62+
</div>
63+
<div class="control">
64+
<input id="train_brake" type="range" step="10" value="0" min="0" max="100" onchange="sendValue(this.value/100, 'THROTTLE')" />
65+
<label for="train_brake">Throttle/Regulator (0 - 100)</label>
66+
</div>
67+
<div class="control">
68+
<input id="train_brake" type="range" step="1" value="0" min="0" max="1" onchange="sendValue(this.value, 'HORN')" />
69+
<label for="train_brake">Horn (0 - 1)</label>
70+
</div>
71+
<div class="control">
72+
<input id="train_brake" type="range" step="1" value="0" min="0" max="1" onchange="sendValue(this.value, 'BELL')" />
73+
<label for="train_brake">Bell (0 - 1)</label>
74+
</div>
75+
<div class="control">
76+
<input id="train_brake" type="range" step="1" value="0" min="0" max="3" onchange="sendValue(this.value, 'FRONT_HLIGHT')" />
77+
<label for="train_brake">Front Headlight (0 - 3)</label>
78+
</div>
79+
<div class="control">
80+
<input id="train_brake" type="range" step="1" value="0" min="0" max="1" onchange="sendValue(this.value, 'PANTOGRAPH')" />
81+
<label for="train_brake">Pantograph (0 - 1)</label>
82+
</div>
83+
</div>
84+
</div>
4785
</body>
4886
</html>

‎Source/RunActivity/Viewer3D/WebServices/Web/CabControls/index.js

Lines changed: 29 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -31,13 +31,16 @@ function ApiCabControls() {
3131
hr.open("GET", "/API/CABCONTROLS/", true);
3232
hr.send();
3333
hr.onreadystatechange = function () {
34-
if (this.readyState == xmlHttpRequestCodeDone && this.status == httpCodeSuccess) {
35-
var jso = JSON.parse(hr.responseText);
36-
if (jso != null) // Can happen using IEv11
37-
{
38-
// Replaces any content (innerHTML) of the element with id=markup with the data from the jso JavaScript Object
39-
markup.innerHTML = prepareData(jso);
40-
}
34+
if (this.readyState == xmlHttpRequestCodeDone && this.status == httpCodeSuccess) {
35+
if (hr.responseText != "") {
36+
console.log(hr.responseText);
37+
var jso = JSON.parse(hr.responseText);
38+
if (jso != null) // Can happen using IEv11
39+
{
40+
// Replaces any content (innerHTML) of the element with id=markup with the data from the jso JavaScript Object
41+
markup.innerHTML = prepareData(jso);
42+
}
43+
}
4144
}
4245
}
4346
}
@@ -95,4 +98,22 @@ function prepareData(jso)
9598
data += "</tr>";
9699
}
97100
return data;
98-
}
101+
}
102+
103+
// Sends the setting for a control.
104+
function sendValue(value, typeName)
105+
{
106+
// GET to fetch data, POST to send it
107+
// "/API/APISAMPLE" /API is a prefix hard-coded into the WebServer class
108+
hr.open("POST", "/API/CABCONTROLS", true); // true to send asynchronously (without waiting)
109+
hr.setRequestHeader("Content-Type", "application/json"); // Default is ;charset=UTF-8
110+
hr.send
111+
( JSON.stringify
112+
( [ { "TypeName": typeName
113+
// , "ControlIndex": intData.value // If provided, used in rendering cab view
114+
, "Value": value
115+
}
116+
]
117+
)
118+
);
119+
}

0 commit comments

Comments
 (0)