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

Better dichotomous tree

This commit is contained in:
Neale Pickett 2020-05-17 12:52:25 -06:00
parent 083474c10d
commit 1448f0c041
5 changed files with 133 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
static/code-tree.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 72 KiB

132
static/index.html
View File

@ -15,11 +15,6 @@
<link rel="stylesheet" href="vail.css">
</head>
<body>
<div id="snackbar" class="mdl-js-snackbar mdl-snackbar">
<div class="mdl-snackbar__text"></div>
<button class="mdl-snackbar__action" type="button"></button>
</div>
<div class="mdl-layout mdl-js-layout">
<header class="mdl-layout__header mdl-layout__header--scroll">
<div class="mdl-layout__header-row">
@ -30,6 +25,7 @@
<!-- 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://morse.withgoogle.com/learn/">Learn Morse</a>
</nav>
@ -40,19 +36,25 @@
<span class="mdl-layout-title">Repeaters</span>
<nav class="mdl-navigation">
<a class="mdl-navigation__link" href="?repeater=">General Chaos</a>
<a class="mdl-navigation__link" href="?repeater=1-15+WPM">1-15 WPM</a>
<a class="mdl-navigation__link" href="?repeater=16-20+WPM">16-20 WPM</a>
<a class="mdl-navigation__link" href="?repeater=21-99+WPM">21-99 WPM</a>
<a class="mdl-navigation__link" href="?repeater=beg">1-15 WPM</a>
<a class="mdl-navigation__link" href="?repeater=int">16-20 WPM</a>
<a class="mdl-navigation__link" href="?repeater=adv">21-99 WPM</a>
</nav>
<hr>
<nav class="mdl-navigation">
<a class="mdl-navigation__link" href="https://morse.withgoogle.com/learn/">Learn Morse Code</a>
<a class="mdl-navigation__link" href="https://github.com/nealey/vail-adapter">Use a physical key</a>
</nav>
</div>
<div id="snackbar" class="mdl-js-snackbar mdl-snackbar">
<div class="mdl-snackbar__text"></div>
<button class="mdl-snackbar__action" type="button"></button>
</div>
<main class="mdl-layout__content">
<div class="flex">
<div class="input mdl-card mdl-shadow--4dp">
<div class="mdl-card mdl-shadow--4dp">
<div class="mdl-card__title">
<h2 class="mdl-card__title-text">Input</h2>
</div>
@ -95,16 +97,13 @@
<tr>
<td>
<kbd>.</kbd> or <kbd>z</kbd>
<br>
right-click for Dah
</td>
<td>
<kbd>/</kbd> or <kbd>x</kbd>
</td>
</tr>
<tr>
<td colspan="2">
Right-click on Dit = Dah
</td>
</tr>
</table>
</div>
<div class="mdl-tabs__panel" id="tools">
@ -122,9 +121,6 @@
</table>
</div>
</div>
<div class="mdl-card__actions right">
<button class="maximize" title="maximize">↕</button>
</div>
</div>
<div class="mdl-card mdl-shadow--4dp">
@ -191,15 +187,84 @@
</tr>
</tbody>
</table>
<hr>
<p>Errors</p>
<div id="errors"></div>
</div>
</div>
<div class="mdl-card mdl-shadow--4dp">
<div class="mdl-card__title">
<h2 class="mdl-card__title-text">Code Tree</h2>
<h2 class="mdl-card__title-text">Dichotomous Key</h2>
</div>
<div class="mdl-card__supporting-text">
<img src="code-tree.png">
<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>
@ -324,6 +389,33 @@
</p>
</div>
</div>
<div class="mdl-card mdl-shadow--4dp">
<div class="mdl-card__title">
<h2 class="mdl-card__title-text">Future plans</h2>
</div>
<div class="mdl-card__supporting-text">
<ul>
<li>Move to a more permanent URL</li>
<li>Make this page less ugly</li>
<li>Arduino program to let you hook up an iambic paddle over USB</li>
<li>Document the protocol</li>
</ul>
<h3 class="mdl-card__title-text">How can I help?</h3>
<ul>
<li>Improve the <a href="https://github.com/nealey/vail/">source code</a></li>
<li>Email me and let me know you're using it</li>
</ul>
<p>
<a href="mailto:neale@woozle.org">Neale Pickett</a> kd7oqi
</p>
</div>
</div>
</div>
</main>
</div>

27
static/vail.css
View File

@ -18,13 +18,6 @@
text-align: center;
}
.right {
text-align: right;
}
.maximized .key {
height: 90vh;
}
.wide {
width: 100%;
}
@ -66,3 +59,23 @@ img {
max-height: 20em;
overflow-y: scroll;
}
.mdl-card__supporting-text.long {
max-height: inherit;
}
.morsetree {
width: 100%;
}
.morsetree tr {
height: 1.4em;
text-align: center;
font-family: monospace;
}
.morsetree tr,
.morsetree td:nth-child(n+2) {
background: #eee;
}
.morsetree tr:nth-child(n+2) {
background: #ddd;
}

2
static/vail.js
View File

@ -355,8 +355,6 @@ class Vail {
error(msg) {
let now = new Date()
let el = document.querySelector("#snackbar")
let data = {
}
el.MaterialSnackbar.showSnackbar({
message: msg,
timeout: 2000