forked from cory/tildefriends
Add some tooltips.
git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@3816 ed5197a5-7fde-0310-b194-c3ffbd925b24
This commit is contained in:
parent
7733cb2604
commit
91339dc8a7
@ -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);
|
||||
});
|
||||
|
@ -13,7 +13,7 @@
|
||||
<span id="title">Tilde Friends</span>
|
||||
<a href="/">home</a>
|
||||
<a href="/~core/apps/">apps</a>
|
||||
<a href="#" onclick="event.preventDefault(); edit()">edit</a>
|
||||
<a accesskey="e" data-tip="Toggle the app editor." href="#" onclick="event.preventDefault(); toggleEdit()">edit</a>
|
||||
<a href="#" onclick="event.preventDefault(); trace()">trace</a>
|
||||
<a href="#" onclick="event.preventDefault(); stats()">stats</a>
|
||||
<span id="status"></span>
|
||||
|
@ -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;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user