journal: add keyboard navigation to browse.html
This commit is contained in:
parent
6c69cd8626
commit
6d5f2f5803
|
@ -76,13 +76,22 @@
|
||||||
td.data {
|
td.data {
|
||||||
padding-left: 5px;
|
padding-left: 5px;
|
||||||
}
|
}
|
||||||
|
div#keynav {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 7pt;
|
||||||
|
color: #818789;
|
||||||
|
padding-top: 50px;
|
||||||
|
}
|
||||||
|
.key {
|
||||||
|
font-weight: bold;
|
||||||
|
color: #313739;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<!-- TODO:
|
<!-- TODO:
|
||||||
- live display
|
- live display
|
||||||
- keyboard navigation
|
|
||||||
- localstorage
|
- localstorage
|
||||||
- show red lines for reboots -->
|
- show red lines for reboots -->
|
||||||
|
|
||||||
|
@ -109,6 +118,15 @@
|
||||||
<input id="less" type="button" value="Less" onclick="entriesLess();"/>
|
<input id="less" type="button" value="Less" onclick="entriesLess();"/>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
|
<div id="keynav">
|
||||||
|
<span class="key">→, j, SPACE</span>: Next Page
|
||||||
|
<span class="key">←, k, BACKSPACE</span>: Previous Page
|
||||||
|
<span class="key">g</span>: First Page
|
||||||
|
<span class="key">G</span>: Last Page
|
||||||
|
<span class="key">+</span>: More entries
|
||||||
|
<span class="key">-</span>: Fewer entries
|
||||||
|
</div>
|
||||||
|
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var first_cursor = null;
|
var first_cursor = null;
|
||||||
var last_cursor = null;
|
var last_cursor = null;
|
||||||
|
@ -373,9 +391,38 @@
|
||||||
request.send(null);
|
request.send(null);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function onKeyUp(event) {
|
||||||
|
switch (event.keyCode) {
|
||||||
|
case 8:
|
||||||
|
case 37:
|
||||||
|
case 75:
|
||||||
|
entriesLoadPrevious();
|
||||||
|
break;
|
||||||
|
case 32:
|
||||||
|
case 39:
|
||||||
|
case 74:
|
||||||
|
entriesLoadNext();
|
||||||
|
break;
|
||||||
|
|
||||||
|
case 71:
|
||||||
|
if (event.shiftKey)
|
||||||
|
entriesLoadTail();
|
||||||
|
else
|
||||||
|
entriesLoadHead();
|
||||||
|
break;
|
||||||
|
case 171:
|
||||||
|
entriesMore();
|
||||||
|
break;
|
||||||
|
case 173:
|
||||||
|
entriesLess();
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
machineLoad();
|
machineLoad();
|
||||||
entriesLoad("");
|
entriesLoad("");
|
||||||
showNEntries(getNEntries());
|
showNEntries(getNEntries());
|
||||||
|
document.onkeyup = onKeyUp;
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
Loading…
Reference in a new issue