From 33bea1b663a6dbe93d521c4dd36c828efe54c116 Mon Sep 17 00:00:00 2001 From: ed Date: Thu, 4 Nov 2021 22:04:32 +0100 Subject: [PATCH] navpane mode-toggle button and hotkey --- copyparty/web/browser.css | 8 +++- copyparty/web/browser.js | 85 +++++++++++++++++++++++++-------------- 2 files changed, 62 insertions(+), 31 deletions(-) diff --git a/copyparty/web/browser.css b/copyparty/web/browser.css index 6c53f9d8..ad3ca723 100644 --- a/copyparty/web/browser.css +++ b/copyparty/web/browser.css @@ -205,6 +205,9 @@ a, #files tbody div a:last-child { padding: .33em; } #files a.doc { + color: #666; +} +#files a.doc.bri { color: #f5a; } #files tbody a.play { @@ -1004,7 +1007,7 @@ html.light #rui { } #docul li.bn { text-align: center; - padding: .5em 0; + padding: .5em; } #doc.prism { padding-left: 3em; @@ -1266,6 +1269,9 @@ html.light #files tbody a.play.act { color: #90c; } html.light #files a.doc { + color: #bbb; +} +html.light #files a.doc.bri { color: #d38; } html.light #files tr.play td { diff --git a/copyparty/web/browser.js b/copyparty/web/browser.js index a44c0129..f997199e 100644 --- a/copyparty/web/browser.js +++ b/copyparty/web/browser.js @@ -194,10 +194,12 @@ ebi('tree').innerHTML = ( ' +\n' + ' \n' + ' 🎯\n' + + ' 📜\n' + ' a\n' + ' ↵\n' + ' 👀\n' + '\n' + + '\n' + '\n' + '
 
' ); @@ -2370,12 +2372,14 @@ var showfile = (function () { r.files.push({ 'id': link.id, 'name': fn }); - if (lang == 'md') + var td = ebi(link.id).closest('tr').getElementsByTagName('td')[0]; + + if (lang == 'md' && td.textContent != '-') continue; - ebi(link.id).closest('tr').getElementsByTagName('td')[0].innerHTML = - '-txt-'; + td.innerHTML = '-txt-'; } + r.mktree(); if (em) { render(em); em = null; @@ -2417,11 +2421,9 @@ var showfile = (function () { ebi('dldoc').setAttribute('href', url); var wr = ebi('bdoc'), - nav = ebi('treeul'), defer = !Prism.highlightElement; var fun = function (el) { - console.log('fun fun fun fun'); try { if (lnh.slice(0, 5) == '#doc.') sethash(lnh.slice(1)); @@ -2456,47 +2458,50 @@ var showfile = (function () { document.documentElement.scrollTop = 0; var hfun = no_push ? hist_replace : hist_push; hfun(get_evpath() + '?doc=' + url.split('/').pop()); - tree_scrollto(); - qsr('#docul'); qsr('#docname'); el = mknod('span'); el.textContent = name; el.setAttribute('id', 'docname'); ebi('path').appendChild(el); - if (!nav) - return; + r.updtree(); + treectl.textmode(true); + tree_scrollto(); + } + r.mktree = function () { var html = ['
  • list of textfiles in
    ' + esc(get_vpath()) + '
  • ']; for (var a = 0; a < r.files.length; a++) { var file = r.files[a]; html.push('
  • ' + esc(uricom_dec(file.name)[0]) + ''); } + ebi('docul').innerHTML = html.join('\n'); + }; - el = mknod('ul'); - el.innerHTML = html.join('\n'); - el.setAttribute('id', 'docul'); - nav.style.display = 'none'; - nav.parentNode.insertBefore(el, nav); - el.onclick = ebi('files').onclick; - } + r.updtree = function () { + var fn = QS('#path span:last-child'), + lis = QSA('#docul li a'); + + fn = fn ? fn.textContent : ''; + for (var a = 0, aa = lis.length; a < aa; a++) + clmod(lis[a], 'hl', lis[a].textContent == fn); + }; var bdoc = ebi('bdoc'); bdoc.setAttribute('class', 'line-numbers'); bdoc.innerHTML = ( '
    \n' + - 'close\n' + - 'download\n' + - 'prev\n' + - 'next\n' + + 'close\n' + + 'download\n' + + 'prev\n' + + 'next\n' + '
    ' ); ebi('xdoc').onclick = function () { thegrid.setvis(true); - } + }; ebi('dldoc').setAttribute('download', ''); ebi('prevdoc').onclick = function () { tree_neigh(-1); }; ebi('nextdoc').onclick = function () { tree_neigh(1); }; @@ -2575,7 +2580,7 @@ var thegrid = (function () { ebi('bdoc').style.display = 'none'; clmod(ebi('wrap'), 'doc'); qsr('#docname'); - qsr('#docul'); + treectl.textmode(false); }; r.setdirty = function () { @@ -2984,6 +2989,9 @@ document.onkeydown = function (e) { if (k == 'KeyT') return ebi('thumbs').click(); + if (k == 'KeyV') + return ebi('filetree').click(); + if (k == 'F2') return fileman.rename(); @@ -3352,6 +3360,18 @@ var treectl = (function () { } } + treectl.textmode = function (ya) { + treectl.texts = ya; + ebi('docul').style.display = ya ? '' : 'none'; + ebi('treeul').style.display = ya ? 'none' : ''; + clmod(ebi('filetree'), 'on', ya); + }; + ebi('filetree').onclick = function (e) { + ev(e); + treectl.textmode(!treectl.texts); + }; + treectl.textmode(false); + function onscroll() { unmenter(); onscroll2(); @@ -3528,7 +3548,6 @@ var treectl = (function () { links[a].onclick = treegrow; } ebi('tree').onscroll = nowrap ? unmenter : null; - tree_scrollto(); } function menter(e) { @@ -3558,6 +3577,8 @@ var treectl = (function () { return; } reqls(this.getAttribute('href'), true); + treectl.dir_cb = tree_scrollto; + thegrid.setvis(true); } function reqls(url, hpush, no_tree) { @@ -3628,13 +3649,15 @@ var treectl = (function () { fname = uricom_dec(bhref)[0], hname = esc(fname), sortv = (bhref.slice(-1) == '/' ? '\t' : '') + hname, - id = 'f-' + ('00000000' + crc32(fname)).slice(-8); + id = 'f-' + ('00000000' + crc32(fname)).slice(-8), + lang = showfile.getlang(fname); - if (showfile.getlang(fname)) { + if (lang) showfile.files.push({ 'id': id, 'name': fname }); - if (r.lead == '-') - r.lead = '-txt-'; - } + + if (r.lead == '-') + r.lead = '-txt-'; var ln = ['' + r.lead + '' + hname + '', r.sz]; @@ -3675,9 +3698,11 @@ var treectl = (function () { document.title = '⇆🎉 ' + uricom_dec(document.location.pathname.slice(1, -1))[0]; filecols.set_style(); + showfile.mktree(); mukey.render(); reload_tree(); reload_browser(); + tree_scrollto(); var fun = treectl.ls_cb; if (fun) { @@ -4702,7 +4727,7 @@ function goto_unpost(e) { } -ebi('files').onclick = function (e) { +ebi('files').onclick = ebi('docul').onclick = function (e) { var tgt = e.target.closest('a[id]'); if (tgt && tgt.getAttribute('id').indexOf('f-') === 0 && tgt.textContent.endsWith('/')) { var el = treectl.find(tgt.textContent.slice(0, -1));