neale/vail
neale
/
vail
mirror of https://github.com/nealey/vail.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

iOS kludge, re-enable maximize button, shuffle knobs down

This commit is contained in:
Neale Pickett 2020-05-17 15:34:09 -06:00
parent 1448f0c041
commit 29cf0461a5
3 changed files with 110 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

155
static/index.html
View File

@ -25,8 +25,8 @@
<!-- Navigation --> <!-- Navigation -->
<nav class="mdl-navigation"> <nav class="mdl-navigation">
<a class="mdl-navigation__link" href="https://github.com/nealey/vail">Source Code</a> <a class="mdl-navigation__link" href="https://github.com/nealey/vail">Source Code</a>
<a class="mdl-navigation__link" href="https://github.com/nealey/vail-adapter">USB Adapter</a>
<a class="mdl-navigation__link" href="https://github.com/nealey/vail/issues/new">Bug Report</a> <a class="mdl-navigation__link" href="https://github.com/nealey/vail/issues/new">Bug Report</a>
<a class="mdl-navigation__link" href="https://github.com/nealey/vail-adapter">USB Adapter</a>
<a class="mdl-navigation__link" href="https://morse.withgoogle.com/learn/">Learn Morse</a> <a class="mdl-navigation__link" href="https://morse.withgoogle.com/learn/">Learn Morse</a>
</nav> </nav>
</div> </div>
@ -120,8 +120,86 @@
</tr> </tr>
</table> </table>
</div> </div>
<div class="mdl-card__actions">
<button class="mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab mdl-button--colored maximize" title="maximize">
<i class="material-icons mdl-color-text--white" role="presentation">aspect_ratio</i>
</button>
</div> </div>
</div> </div>
</div>
<div class="mdl-card mdl-shadow--4dp">
<div class="mdl-card__title">
<h2 class="mdl-card__title-text">Dichotomous Key</h2>
</div>
<table class="mdl-card__supporting-text long morsetree">
<tbody>
<tr>
<td rowspan="8">e ·</td>
<td rowspan="4">i ··</td>
<td rowspan="2">s ···</td>
<td rowspan="1">h ····</td>
</tr>
<tr>
<td rowspan="1">v ···–</td>
</tr>
<tr>
<td rowspan="2">u ··–</td>
<td rowspan="1">f ··–·</td>
</tr>
<tr>
<td rowspan="1"></td>
</tr>
<tr>
<td rowspan="4">a ·–</td>
<td rowspan="2">r ·–·</td>
<td rowspan="1">l ·–··</td>
</tr>
<tr>
<td rowspan="1">j ·–––</td>
</tr>
<tr>
<td rowspan="2">w ·––</td>
<td rowspan="1">p ·––·</td>
</tr>
<tr>
<td rowspan="1"></td>
</tr>
<tr>
<td rowspan="8">t –</td>
<td rowspan="4">n –·</td>
<td rowspan="2">d –··</td>
<td rowspan="1">b –···</td>
</tr>
<tr>
<td rowspan="1">x –··–</td>
</tr>
<tr>
<td rowspan="2">k –·–</td>
<td rowspan="1">c –·–·</td>
</tr>
<tr>
<td rowspan="1">y –·––</td>
</tr>
<tr>
<td rowspan="4">m ––</td>
<td rowspan="2">g ––·</td>
<td rowspan="1">z ––··</td>
</tr>
<tr>
<td rowspan="1">q ––·–</td>
</tr>
<tr>
<td rowspan="2">o –––</td>
<td rowspan="1"></td>
</tr>
<tr>
<td rowspan="1"></td>
</tr>
</tbody>
</table>
</div>
<div class="mdl-card mdl-shadow--4dp"> <div class="mdl-card mdl-shadow--4dp">
<div class="mdl-card__title"> <div class="mdl-card__title">
@ -193,81 +271,6 @@
</div> </div>
</div> </div>
<div class="mdl-card mdl-shadow--4dp">
<div class="mdl-card__title">
<h2 class="mdl-card__title-text">Dichotomous Key</h2>
</div>
<div class="mdl-card__supporting-text long">
<table class="morsetree">
<tbody>
<tr>
<td rowspan="8">e ·</td>
<td rowspan="4">i ··</td>
<td rowspan="2">s ···</td>
<td rowspan="1">h ····</td>
</tr>
<tr>
<td rowspan="1">v ···–</td>
</tr>
<tr>
<td rowspan="2">u ··–</td>
<td rowspan="1">f ··–·</td>
</tr>
<tr>
<td rowspan="1"></td>
</tr>
<tr>
<td rowspan="4">a ·–</td>
<td rowspan="2">r ·–·</td>
<td rowspan="1">l ·–··</td>
</tr>
<tr>
<td rowspan="1">j ·–––</td>
</tr>
<tr>
<td rowspan="2">w ·––</td>
<td rowspan="1">p ·––·</td>
</tr>
<tr>
<td rowspan="1"></td>
</tr>
<tr>
<td rowspan="8">t –</td>
<td rowspan="4">n –·</td>
<td rowspan="2">d –··</td>
<td rowspan="1">b –···</td>
</tr>
<tr>
<td rowspan="1">x –··–</td>
</tr>
<tr>
<td rowspan="2">k –·–</td>
<td rowspan="1">c –·–·</td>
</tr>
<tr>
<td rowspan="1">y –·––</td>
</tr>
<tr>
<td rowspan="4">m ––</td>
<td rowspan="2">g ––·</td>
<td rowspan="1">z ––··</td>
</tr>
<tr>
<td rowspan="1">q ––·–</td>
</tr>
<tr>
<td rowspan="2">o –––</td>
<td rowspan="1"></td>
</tr>
<tr>
<td rowspan="1"></td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="mdl-card mdl-shadow--4dp"> <div class="mdl-card mdl-shadow--4dp">
<div class="mdl-card__title"> <div class="mdl-card__title">
<h2 class="mdl-card__title-text">Vail</h2> <h2 class="mdl-card__title-text">Vail</h2>

12
static/vail.css
View File

@ -18,6 +18,18 @@
text-align: center; text-align: center;
} }
.maximize {
position: absolute;
bottom: 0;
right: 0;
}
.maximized .key {
height: 90vh;
}
.maximized {
width: 90vw;
}
.wide { .wide {
width: 100%; width: 100%;
} }

18
static/vail.js
View File

@ -7,6 +7,19 @@ const errorFreq = 30
const DIT = 1 const DIT = 1
const DAH = 3 const DAH = 3
// iOS kludge
if (! window.AudioContext) {
window.AudioContext = window.webkitAudioContext
}
function toast(msg) {
let el = document.querySelector("#snackbar")
el.MaterialSnackbar.showSnackbar({
message: msg,
timeout: 2000
})
}
class Iambic { class Iambic {
constructor(beginTxFunc, endTxFunc) { constructor(beginTxFunc, endTxFunc) {
this.beginTxFunc = beginTxFunc this.beginTxFunc = beginTxFunc
@ -534,7 +547,12 @@ class Vail {
} }
function vailInit() { function vailInit() {
try {
window.app = new Vail() window.app = new Vail()
} catch (err) {
console.log(err)
toast(err)
}
} }