diff options
| author | Jake Mannens <jake@asger.xyz> | 2026-04-16 02:22:56 +1000 |
|---|---|---|
| committer | Jake Mannens <jake@asger.xyz> | 2026-04-16 02:22:56 +1000 |
| commit | ba86ba12732b3290eaa74936950a370966b41ac5 (patch) | |
| tree | fcb1fb3df3a0edc1d0a27a5336c8cadaef593507 /Pages/ViewMedia.razor | |
| parent | d59e751c5b7c23f0dce2a146b6b8ced80231a0cb (diff) | |
v0.10av0.10a
Diffstat (limited to 'Pages/ViewMedia.razor')
| -rw-r--r-- | Pages/ViewMedia.razor | 27 |
1 files changed, 19 insertions, 8 deletions
diff --git a/Pages/ViewMedia.razor b/Pages/ViewMedia.razor index 27a366c..46cbc45 100644 --- a/Pages/ViewMedia.razor +++ b/Pages/ViewMedia.razor @@ -14,23 +14,34 @@ document.getElementById("hcontainer").classList.toggle("hide-metadata"); } - function showSidebar(visible) { - document.getElementById("hcontainer").classList.toggle("hide-metadata", !visible) + function setMobilePane(pane) { + var panes = Array.from(document.querySelectorAll('[class^="mobile-pane-"]')); + + panes.forEach(e => e.classList.remove('visible')); + panes + .filter(e => e.classList.contains(`mobile-pane-${pane}`)) + .forEach(e => e.classList.add('visible')); + } + + function pageKeyDownHandler(e) { + if(!e.ctrlKey && !e.metaKey && !e.altKey && !e.shiftKey && !e.isComposing) + if(e.key == 's') + toggleSidebar(); } </script> <div id="vcontainer"> - <div id="hcontainer" class="hide-metadata"> - <div id="image-container"> + <div id="hcontainer"> + <div id="image-container" class="mobile-pane-image visible"> <img src="/media/@(media.Guid)" width=@media.CurrentUploadedFile.Width height=@media.CurrentUploadedFile.Height/> </div> <div id="metadata-show-button"> - <a href="javascript:toggleSidebar();"></a> + <a href="javascript:toggleSidebar();" title="Toggle sidebar (S)"></a> </div> - <div id="metadata"> + <div id="metadata" class="mobile-pane-metadata"> <div id="metadata-container"> <div id="metadata-fileinfo"> @if(infoEditMode) { @@ -143,8 +154,8 @@ </div> </div> <div id="bottom-bar"> - <img onclick="showSidebar(false);" src="/images/photo.svg" width="25" height="25"/> - <img onclick="showSidebar(true);" src="/images/info.svg" width="25" height="25"/> + <img onclick="setMobilePane('image');" src="/images/photo.svg" width="25" height="25"/> + <img onclick="setMobilePane('metadata');" src="/images/info.svg" width="25" height="25"/> </div> </div> |