Add README, fix input handling bug, and tweak the frontend.

This commit is contained in:
ckegel 2023-12-14 22:10:03 -05:00
parent b14b4624fc
commit 1c96d71a69
3 changed files with 16 additions and 5 deletions

View File

@ -0,0 +1,7 @@
# Web SSTV
## Summary
Web SSTV aims to both encode and decode SSTV using plain JavaScript and Web Audio API. Web SSTV can be run entirely offline (without styling), and on any platform from Chromebooks to phones, so long as they support JavaScript and Web Audio. By making SSTV readily available on many platforms, we aim to create educational opportunities and introduce more people to STEM and amateur radio. Web SSTV is currently hosted at https://ckegel.github.io/Web-SSTV/.
## Current State
Currently Web SSTV only supports encoding images using the Martin or Scottie formats. Support for more formats and recieving SSTV signals is actively being developed. We welcome any pull requests.
## Sources
Both the [SSTV Handbook](https://www.sstv-handbook.com/) and [JL Barber (N7CXI) paper](http://www.barberdsp.com/downloads/Dayton%20Paper.pdf) were heavily referenced when implementing support for the Martin and Scottie formats.

View File

@ -10,7 +10,8 @@
<body> <body>
<main class="container"> <main class="container">
<h1>Web SSTV</h1> <h1>Web SSTV</h1>
<h3>Send SSTV signals from your browser</h3> <h3>Send SSTV signals from your browser:</h3>
<label id="modeLabel" for="modeSelect">Select a mode:</label>
<select id="modeSelect"> <select id="modeSelect">
<option value="none" selected disabled hidden>Select a mode</option> <option value="none" selected disabled hidden>Select a mode</option>
<option value="M1">Martin M1</option> <option value="M1">Martin M1</option>
@ -20,7 +21,7 @@
<option value="SDX">Scottie DX</option> <option value="SDX">Scottie DX</option>
</select> </select>
<label id="imgLabel" for="imgPicker">Select an Image</label> <label id="imgLabel" for="imgPicker">Upload an image:</label>
<input type="file" name="imgPicker" id="imgPicker"/> <input type="file" name="imgPicker" id="imgPicker"/>
<center id="imgArea" class="container"> <center id="imgArea" class="container">
<canvas id="imgCanvas" width="320" height="256"></canvas> <canvas id="imgCanvas" width="320" height="256"></canvas>
@ -31,8 +32,11 @@
</main> </main>
<footer class="container"> <footer class="container">
<p>Currently supports encoding (sending) in Martin and Scottie formats. SSTV signal decoding and more encoding modes coming soon.</p> <small>Currently supports encoding (sending) in Martin and Scottie formats. SSTV signal decoding and more encoding modes coming soon.</small>
<p>&copy 2023 Christian Kegel - Available under the MIT License</p> <br>
<small><a href="https://ckegel.github.io/Web-SSTV/">Check out the project on Github</a></small>
<br>
<small>&copy 2023 Christian Kegel - Available under the MIT License</small>
</footer> </footer>
</body> </body>
<script src="./script.js"></script> <script src="./script.js"></script>

View File

@ -451,10 +451,10 @@ imgPicker.addEventListener("change", (e) => {
canvasCtx.drawImage(img,0,0, canvas.width, canvas.height); canvasCtx.drawImage(img,0,0, canvas.width, canvas.height);
} }
img.src = event.target.result; img.src = event.target.result;
imageLoaded = true;
if(modeSelect.value != "none"){ if(modeSelect.value != "none"){
warningText.textContent = ""; warningText.textContent = "";
startButton.disabled = false; startButton.disabled = false;
imageLoaded = true;
} }
} }
reader.readAsDataURL(e.target.files[0]); reader.readAsDataURL(e.target.files[0]);