diff --git a/core/client.js b/core/client.js index a7fc3cf3..88f62b01 100644 --- a/core/client.js +++ b/core/client.js @@ -15,12 +15,7 @@ var kErrorColor = "#dc322f"; var kStatusColor = "#fff"; window.addEventListener("keydown", function(event) { - if (event.keyCode == 69 && event.altKey) { - if (!editing()) { - edit(); - event.preventDefault(); - } - } else if (event.keyCode == 83 && (event.altKey || event.ctrlKey)) { + if (event.keyCode == 83 && (event.altKey || event.ctrlKey)) { if (editing()) { save(); event.preventDefault(); @@ -74,11 +69,23 @@ function editing() { return document.getElementById("editPane").style.display != 'none'; } +function toggleEdit() { + if (editing()) { + closeEditor(); + } else { + edit(); + } +} + function edit() { if (editing()) { return; } + if (gSplit) { + gSplit.destroy(); + gSplit = undefined; + } gSplit = Split(['#editPane', '#viewPane'], {minSize: 0}); ensureLoaded([ @@ -277,10 +284,6 @@ function load(path) { function closeStats() { document.getElementById("statsPane").style.display = 'none'; - if (gSplit) { - gSplit.destroy(); - gSplit = undefined; - } } function closeEditor() { @@ -822,6 +825,30 @@ window.addEventListener("load", function() { window.addEventListener("message", message, false); window.addEventListener("online", connectSocket); document.getElementById("name").value = window.location.pathname; + for (let tag of document.getElementsByTagName('a')) { + if (tag.accessKey) { + tag.classList.add('tooltip_parent'); + var tooltip = document.createElement('div'); + tooltip.classList.add('tooltip'); + if (tag.dataset.tip) { + var description = document.createElement('div'); + description.innerText = tag.dataset.tip; + tooltip.appendChild(description); + } + var parts = tag.accessKeyLabel.split('+'); + for (var i = 0; i < parts.length; i++) + { + var key = parts[i]; + var kbd = document.createElement('kbd'); + kbd.innerText = key; + tooltip.appendChild(kbd); + if (i < parts.length - 1) { + tooltip.appendChild(document.createTextNode('+')); + } + } + tag.appendChild(tooltip); + } + } enableDragDrop(); connectSocket(window.location.pathname); }); diff --git a/core/index.html b/core/index.html index eb30e9d5..93aa113d 100644 --- a/core/index.html +++ b/core/index.html @@ -13,7 +13,7 @@ Tilde Friends home apps - edit + edit trace stats diff --git a/core/style.css b/core/style.css index c88b00dd..77026886 100644 --- a/core/style.css +++ b/core/style.css @@ -180,3 +180,31 @@ a:active { #files > li.dirty::after { content: '*'; } + +.tooltip { + position: absolute; + z-index: 1; + display: none; + border: 1px solid black; + padding: 4px; + color: black; + background: white; +} + +.tooltip_parent:hover .tooltip { + display: inline-block; +} + +kbd { + background-color: #eee; + border-radius: 3px; + border: 1px solid #b4b4b4; + box-shadow: 0 1px 1px rgba(0, 0, 0, .2), 0 2px 0 0 rgba(255, 255, 255, .7) inset; + color: #333; + display: inline-block; + font-size: .85em; + font-weight: 700; + line-height: 1; + padding: 2px 4px; + white-space: nowrap; +}