diff options
Diffstat (limited to 'resources/index.html')
| -rw-r--r-- | resources/index.html | 24 |
1 files changed, 16 insertions, 8 deletions
diff --git a/resources/index.html b/resources/index.html index 8fb57d2..88da34e 100644 --- a/resources/index.html +++ b/resources/index.html @@ -78,7 +78,11 @@ currentPos.value=time; } + const filesOpenAbort = new AbortController(); + async function browseTo(id) { + filesOpenAbort.abort(); + document.querySelector('#files').open=true; const fileList = document.querySelector('ul#file-list'); const pathList = document.querySelector('ul#path-list'); const itemTemplate = document.querySelector('#file-item'); @@ -129,7 +133,11 @@ await browseTo(null); } }, - { once:true, passive:true }, + { + once:true, + passive:true, + signal:filesOpenAbort.signal, + }, ); document.querySelector('#recent'). @@ -210,27 +218,27 @@ transform: scaleY(5); } - #files { + .file-list { width: 100%; overflow-x: scroll; } - #files summary { + .file-list summary { position: sticky; left: 0; } - #files a { + .file-list a { text-decoration: none; color: inherit; } - #files ul { + .file-list ul { width: min-content; margin-top: 0; font-size: 50%; list-style-type: none; } - #files li { + .file-list li { white-space: pre; } @@ -280,14 +288,14 @@ </tr> </table> </details> - <details id="files"> + <details id="files" class="file-list"> <summary>files</summary> <ul id="path-list"> </ul> <ul id="file-list"> </ul> </details> - <details id="recent"> + <details id="recent" class="file-list"> <summary>recent</summary> <ul id="recent-list"> </ul> |