added readme
This commit is contained in:
grey
7
README.MD
Normal file
7
README.MD
Normal file
@ -0,0 +1,7 @@
|
||||
# Signalman
|
||||
Signalman is a simple and small web application for controlling Werma 640.840.00 USB modules.
|
||||
It connects the the module via WebSerial (meaning you need to use a Chromiumbased browser) and then sends commands.
|
||||
It offers a visual configuration to setup your tower. Please beware, this is a small and incomplete testing tool. Some functionality might be broken or not implemented.
|
||||
|
||||
# Screenshot
|
||||
|
||||
BIN
imgs/mainPage.png
Normal file
BIN
imgs/mainPage.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 MiB |
137
index.html
137
index.html
@ -3,45 +3,110 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Werma Signal Controler</title>
|
||||
<style>
|
||||
html {
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
</style>
|
||||
<title>Werma Signal Controller</title>
|
||||
<link rel="stylesheet" href="res/style.css">
|
||||
</head>
|
||||
<body>
|
||||
<h1>Werma Light Control</h1>
|
||||
This is a small web interface to control the lights and buzzer of a Werma signal tower using the <a href="https://www.werma.com/de/s_c4i595/USB-Anschlusselement_RM_5VDC_BK/64084000.html">640.840.00 connection module</a>. It assumes that: Ring 1 is green, Ring 2 is yellow, Ring 3 is red, Ring 4 is buzzer. Ring 5 is assumed to be unconnected
|
||||
<section>
|
||||
<h2>Buzzer</h2>
|
||||
<p>
|
||||
<button onclick="setBuzz(0)">Off</button>
|
||||
<button onclick="setBuzz(1)">On</button><br>
|
||||
<button onclick="setBuzz(2)">Pulse</button>
|
||||
<button onclick="setBuzz(3)">Pulse (alternate)</button><br>
|
||||
</p>
|
||||
<hr>
|
||||
<h2>Lights</h2>
|
||||
<i>Auto applies changes</i>
|
||||
Ring 1 - Red: <input type="num" id="light1" value="0" max="3"><br>
|
||||
Ring 2 - Yellow: <input type="num" id="light2" value="0" max="3"><br>
|
||||
Ring 3 - Green: <input type="num" id="light3" value="0" max="3"><br>
|
||||
<hr>
|
||||
<p>
|
||||
0 - Off<br>
|
||||
1 - On<br>
|
||||
2 - Pulse<br>
|
||||
3 - Pulse (alternate)
|
||||
</p>
|
||||
<hr>
|
||||
<h2>Connection control</h2>
|
||||
<button onclick="connectToLight()">Connect to device</button><br><br>
|
||||
<button onclick="sendLightData()">Send data to device</button><br>
|
||||
This is a small web interface which allows you to controll a Werma signal tower using the <a href="https://www.werma.com/USB-Anschlusselement-RM-5VDC-BK/64084000">640.840.00 connection module</a>.
|
||||
You can configure the web interface to match your tower's configuration. The default configuration is: Ring 1 is green, Ring 2 is yellow, Ring 3 is red, Ring 4 is buzzer. Ring 5 is assumed to be unconnected.<br>
|
||||
<i>All "product photos" are the property of Werma, I did not take them myself. If you are Werma and want me to take down the images, reach out to me via the contact mail in the legal notes on my main domain.</i>
|
||||
|
||||
</section>
|
||||
|
||||
<!-- make three selector-->
|
||||
<h5>Currently unsupported features</h5>
|
||||
<ul>
|
||||
<li>Buzzers (somewhat, you cannot currently controll them)</li>
|
||||
<li>Persistant configuration ("startup settings")</li>
|
||||
<li>Any bidirectional communication (getting SW version, etc.)</li>
|
||||
</ul>
|
||||
|
||||
<!-- 1/4 of screen is a preview, rest is controll surface-->
|
||||
|
||||
<section style="display: flex; flex-direction: row;">
|
||||
<div style="width: 25%; max-width: 290px;">
|
||||
<h2>Preview</h2>
|
||||
<!-- Images are placed above each other -->
|
||||
<div id="leuchte">
|
||||
<img src="res/images/top.jpg" id="module_top">
|
||||
<div id="fill">
|
||||
|
||||
</div>
|
||||
<img src="res/images/base_2.jpg" id="base_2">
|
||||
<img src="res/images/base_1.jpg" id="base_1">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="width: 25%; max-width: 290px;">
|
||||
<h2>Control</h2>
|
||||
<div id="ctrlPane">
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<div style="width: 75%;">
|
||||
<div id="serialState">
|
||||
|
||||
</div>
|
||||
<section>
|
||||
<h2>Serial</h2>
|
||||
<!-- Serial connection -->
|
||||
<button onclick="serial_connect()">Connect</button>
|
||||
<button onclick="serial_send()">Force refresh</button>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Setup</h2>
|
||||
<!-- Load old config -->
|
||||
<details>
|
||||
<summary>Load config from string</summary>
|
||||
<textarea id="config" style="width: 100%; height: 100px;"></textarea>
|
||||
<button onclick="loadConfig()">Load</button>
|
||||
<div id="config_error">
|
||||
|
||||
</div>
|
||||
</details>
|
||||
<details>
|
||||
<summary>Export current config</summary>
|
||||
<textarea id="config_out" style="width: 100%; height: 100px;" readonly></textarea>
|
||||
</details>
|
||||
<pre id="configWarn">
|
||||
|
||||
</pre>
|
||||
<hr>
|
||||
<h3>Configure light</h3>
|
||||
<!-- Select top -->
|
||||
<label for="setup_top">Top:</label>
|
||||
<select id="setup_top" name="setup_top">
|
||||
<option value="buzzer">Buzzer</option>
|
||||
<option value="normal">Normal</option>
|
||||
</select>
|
||||
<br>
|
||||
<div class="ringConf">
|
||||
<!-- All 5 rings (setup) -->
|
||||
<h5>Ring 5</h5>
|
||||
<div id="ring5Confg">
|
||||
|
||||
</div>
|
||||
<h5>Ring 4</h5>
|
||||
<div id="ring4Confg">
|
||||
|
||||
</div>
|
||||
<h5>Ring 3</h5>
|
||||
<div id="ring3Confg">
|
||||
|
||||
</div>
|
||||
<h5>Ring 2</h5>
|
||||
<div id="ring2Confg">
|
||||
|
||||
</div>
|
||||
<h5>Ring 1</h5>
|
||||
<div id="ring1Confg">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
<script src="nxtRender.js"></script>
|
||||
</body>
|
||||
<script src="script.js"></script>
|
||||
</html>
|
||||
@ -89,7 +89,7 @@ let myConfig = {
|
||||
1: 0,
|
||||
2: 0,
|
||||
3: 0,
|
||||
4: 0
|
||||
4: 0,
|
||||
}
|
||||
}
|
||||
|
||||
@ -244,6 +244,12 @@ function writeAction(ring, state){
|
||||
"alternate1": 2,
|
||||
"alternate2": 3
|
||||
}
|
||||
// Check if the ring is empty and check if buzzer is enabled
|
||||
if(myConfig.rings[ring] === "empty" && myConfig.extras.top === "buzzer") {
|
||||
// Write to buzzer
|
||||
|
||||
return;
|
||||
}
|
||||
myConfig.states[ring] = actionToState[state];
|
||||
applyConfig();
|
||||
serial_send();
|
||||
|
||||
112
v2.html
112
v2.html
@ -1,112 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Werma Signal Controller</title>
|
||||
<link rel="stylesheet" href="res/style.css">
|
||||
</head>
|
||||
<body>
|
||||
<h1>Werma Light Control</h1>
|
||||
This is a small web interface which allows you to controll a Werma signal tower using the <a href="https://www.werma.com/USB-Anschlusselement-RM-5VDC-BK/64084000">640.840.00 connection module</a>.
|
||||
You can configure the web interface to match your tower's configuration. The default configuration is: Ring 1 is green, Ring 2 is yellow, Ring 3 is red, Ring 4 is buzzer. Ring 5 is assumed to be unconnected.<br>
|
||||
<i>All "product photos" are the property of Werma, I did not take them myself. If you are Werma and want me to take down the images, reach out to me via the contact mail in the legal notes on my main domain.</i>
|
||||
|
||||
<h5>Currently unsupported features</h5>
|
||||
<ul>
|
||||
<li>Buzzers (somewhat, you cannot currently controll them)</li>
|
||||
<li>Persistant configuration ("startup settings")</li>
|
||||
<li>Any bidirectional communication (getting SW version, etc.)</li>
|
||||
</ul>
|
||||
|
||||
<!-- 1/4 of screen is a preview, rest is controll surface-->
|
||||
|
||||
<section style="display: flex; flex-direction: row;">
|
||||
<div style="width: 25%; max-width: 290px;">
|
||||
<h2>Preview</h2>
|
||||
<!-- Images are placed above each other -->
|
||||
<div id="leuchte">
|
||||
<img src="res/images/top.jpg" id="module_top">
|
||||
<div id="fill">
|
||||
|
||||
</div>
|
||||
<img src="res/images/base_2.jpg" id="base_2">
|
||||
<img src="res/images/base_1.jpg" id="base_1">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="width: 25%; max-width: 290px;">
|
||||
<h2>Control</h2>
|
||||
<div id="ctrlPane">
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<div style="width: 75%;">
|
||||
<div id="serialState">
|
||||
|
||||
</div>
|
||||
<section>
|
||||
<h2>Serial</h2>
|
||||
<!-- Serial connection -->
|
||||
<button onclick="serial_connect()">Connect</button>
|
||||
<button onclick="serial_send()">Force refresh</button>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Setup</h2>
|
||||
<!-- Load old config -->
|
||||
<details>
|
||||
<summary>Load config from string</summary>
|
||||
<textarea id="config" style="width: 100%; height: 100px;"></textarea>
|
||||
<button onclick="loadConfig()">Load</button>
|
||||
<div id="config_error">
|
||||
|
||||
</div>
|
||||
</details>
|
||||
<details>
|
||||
<summary>Export current config</summary>
|
||||
<textarea id="config_out" style="width: 100%; height: 100px;" readonly></textarea>
|
||||
</details>
|
||||
<pre id="configWarn">
|
||||
|
||||
</pre>
|
||||
<hr>
|
||||
<h3>Configure light</h3>
|
||||
<!-- Select top -->
|
||||
<label for="setup_top">Top:</label>
|
||||
<select id="setup_top" name="setup_top">
|
||||
<option value="buzzer">Buzzer</option>
|
||||
<option value="normal">Normal</option>
|
||||
</select>
|
||||
<br>
|
||||
<div class="ringConf">
|
||||
<!-- All 5 rings (setup) -->
|
||||
<h5>Ring 5</h5>
|
||||
<div id="ring5Confg">
|
||||
|
||||
</div>
|
||||
<h5>Ring 4</h5>
|
||||
<div id="ring4Confg">
|
||||
|
||||
</div>
|
||||
<h5>Ring 3</h5>
|
||||
<div id="ring3Confg">
|
||||
|
||||
</div>
|
||||
<h5>Ring 2</h5>
|
||||
<div id="ring2Confg">
|
||||
|
||||
</div>
|
||||
<h5>Ring 1</h5>
|
||||
<div id="ring1Confg">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
<script src="nxtRender.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user