mirror of https://github.com/nealey/vail.git
iOS kludge, re-enable maximize button, shuffle knobs down
This commit is contained in:
parent
1448f0c041
commit
29cf0461a5
|
@ -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,9 +120,87 @@
|
||||||
</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">
|
||||||
<h2 class="mdl-card__title-text">Knobs</h2>
|
<h2 class="mdl-card__title-text">Knobs</h2>
|
||||||
|
@ -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>
|
||||||
|
|
|
@ -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%;
|
||||||
}
|
}
|
||||||
|
|
|
@ -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() {
|
||||||
window.app = new Vail()
|
try {
|
||||||
|
window.app = new Vail()
|
||||||
|
} catch (err) {
|
||||||
|
console.log(err)
|
||||||
|
toast(err)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue