diff --git a/copyparty/web/baguettebox.js b/copyparty/web/baguettebox.js index 4ef9ce09..492ff34f 100644 --- a/copyparty/web/baguettebox.js +++ b/copyparty/web/baguettebox.js @@ -181,7 +181,7 @@ window.baguetteBox = (function () { ); overlay = ctr.firstChild; QS('body').appendChild(overlay); - tt.init(); + tt.att(overlay); } slider = ebi('bbox-slider'); btnPrev = ebi('bbox-prev'); @@ -275,21 +275,23 @@ window.baguetteBox = (function () { if (!v) return; - var msg = 'When video ends, ', lbl; + var msg = 'When video ends, ', tts = '', lbl; if (vloop) { lbl = 'Loop'; msg += 'repeat it'; + tts = '$NHotkey: R'; } else if (vnext) { lbl = 'Cont'; msg += 'continue to next'; + tts = '$NHotkey: C'; } else { lbl = 'Stop'; msg += 'just stop' } btnVmode.setAttribute('aria-label', msg); - btnVmode.setAttribute('tt', msg); + btnVmode.setAttribute('tt', msg + tts); btnVmode.textContent = lbl; v.loop = vloop diff --git a/copyparty/web/browser.css b/copyparty/web/browser.css index 9494a0fc..ee859e6c 100644 --- a/copyparty/web/browser.css +++ b/copyparty/web/browser.css @@ -792,7 +792,9 @@ input.eq_gain { display: block; width: 1em; border-radius: .2em; - margin: -1.3em auto 0 auto; + margin: -1.2em auto 0 auto; + top: 2em; + position: relative; background: #444; } #files>thead>tr>th.min, diff --git a/copyparty/web/browser.js b/copyparty/web/browser.js index d2946618..e4b31c35 100644 --- a/copyparty/web/browser.js +++ b/copyparty/web/browser.js @@ -2618,14 +2618,36 @@ function mk_files_header(taglist) { var filecols = (function () { - var hidden = jread('filecols', []); + var hidden = jread('filecols', []), + tts = { + "c": "action buttons", + "dur": "duration", + "q": "quality / bitrate", + "Ac": "audio codec", + "Vc": "video codec", + "Res": "resolution", + "T": "filetype", + "aq": "audio quality / bitrate", + "vq": "video quality / bitrate", + "pixfmt": "subsampling / pixel structure", + "resw": "horizontal resolution", + "resh": "veritcal resolution", + "acs": "audio channels", + "hz": "sample rate" + }; var add_btns = function () { var ths = QSA('#files th>span'); for (var a = 0, aa = ths.length; a < aa; a++) { - var th = ths[a].parentElement; + var th = ths[a].parentElement, + ttv = tts[ths[a].textContent]; + th.innerHTML = '
' + ths[a].outerHTML; th.getElementsByTagName('a')[0].onclick = ev_row_tgl; + if (ttv) { + th.setAttribute("tt", ttv); + th.setAttribute("ttd", "u"); + } } }; @@ -2648,7 +2670,10 @@ var filecols = (function () { hcols = ebi('hcols'); for (var a = 0; a < hidden.length; a++) { - html.push('' + esc(hidden[a]) + ''); + var ttv = tts[hidden[a]], + tta = ttv ? ' tt="' + ttv + '">' : '>'; + + html.push(''); } hcols.previousSibling.style.display = html.length ? 'block' : 'none'; hcols.innerHTML = html.join('\n'); diff --git a/copyparty/web/up2k.js b/copyparty/web/up2k.js index 22b17645..614e162b 100644 --- a/copyparty/web/up2k.js +++ b/copyparty/web/up2k.js @@ -1570,7 +1570,7 @@ function up2k_init(subtle) { for (var a = o.length - 1; a >= 0; a--) { o[a].parentNode.getElementsByTagName('input')[0].setAttribute('tt', o[a].getAttribute('tt')); } - tt.init(); + tt.att(QS('#u2conf')); function bumpthread2(e) { if (e.ctrlKey || e.altKey || e.metaKey || e.isComposing) diff --git a/copyparty/web/util.js b/copyparty/web/util.js index 8cead1fc..7b491833 100644 --- a/copyparty/web/util.js +++ b/copyparty/web/util.js @@ -518,10 +518,16 @@ var tt = (function () { return; var pos = this.getBoundingClientRect(), + dir = this.getAttribute('ttd') || '', left = pos.left < window.innerWidth / 2, top = pos.top < window.innerHeight / 2, big = this.className.indexOf(' ttb') !== -1; + if (dir.indexOf('u') + 1) top = false; + if (dir.indexOf('d') + 1) top = true; + if (dir.indexOf('l') + 1) left = false; + if (dir.indexOf('r') + 1) left = true; + clmod(r.tt, 'b', big); r.tt.style.top = top ? pos.bottom + 'px' : 'auto'; r.tt.style.bottom = top ? 'auto' : (window.innerHeight - pos.top) + 'px'; @@ -536,6 +542,20 @@ var tt = (function () { clmod(r.tt, 'show'); }; + r.att = function (ctr) { + var _show = r.en ? r.show : null, + _hide = r.en ? r.hide : null, + o = ctr.querySelectorAll('*[tt]'); + + for (var a = o.length - 1; a >= 0; a--) { + o[a].onfocus = _show; + o[a].onblur = _hide; + o[a].onmouseenter = _show; + o[a].onmouseleave = _hide; + } + r.hide(); + } + r.init = function () { var ttb = ebi('tooltips'); if (ttb) { @@ -547,18 +567,7 @@ var tt = (function () { }; r.en = bcfg_get('tooltips', true) } - - var _show = r.en ? r.show : null, - _hide = r.en ? r.hide : null; - - var o = QSA('*[tt]'); - for (var a = o.length - 1; a >= 0; a--) { - o[a].onfocus = _show; - o[a].onblur = _hide; - o[a].onmouseenter = _show; - o[a].onmouseleave = _hide; - } - r.hide(); + r.att(document); }; return r;