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 -->
|
||||
<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-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-adapter">USB Adapter</a>
|
||||
<a class="mdl-navigation__link" href="https://morse.withgoogle.com/learn/">Learn Morse</a>
|
||||
</nav>
|
||||
</div>
|
||||
|
@ -120,8 +120,86 @@
|
|||
</tr>
|
||||
</table>
|
||||
</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 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__title">
|
||||
|
@ -193,81 +271,6 @@
|
|||
</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__title">
|
||||
<h2 class="mdl-card__title-text">Vail</h2>
|
||||
|
|
|
@ -18,6 +18,18 @@
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
.maximize {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
}
|
||||
.maximized .key {
|
||||
height: 90vh;
|
||||
}
|
||||
.maximized {
|
||||
width: 90vw;
|
||||
}
|
||||
|
||||
.wide {
|
||||
width: 100%;
|
||||
}
|
||||
|
|
|
@ -7,6 +7,19 @@ const errorFreq = 30
|
|||
const DIT = 1
|
||||
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 {
|
||||
constructor(beginTxFunc, endTxFunc) {
|
||||
this.beginTxFunc = beginTxFunc
|
||||
|
@ -534,7 +547,12 @@ class Vail {
|
|||
}
|
||||
|
||||
function vailInit() {
|
||||
try {
|
||||
window.app = new Vail()
|
||||
} catch (err) {
|
||||
console.log(err)
|
||||
toast(err)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
Loading…
Reference in New Issue