made more of the javascript hopefulyl honour versions, sort of works, not fully deployed consistently but works well enough for home use in dev. Also tweaked how the layout looks on a phone so that la / ra buttons on beside the image. Still oddly needs me to shrink that page, but it is now visually right - odd

This commit is contained in:
2025-10-11 15:02:58 +11:00
parent 16d28bc02e
commit 517b5c6167
6 changed files with 38 additions and 17 deletions

4
TODO
View File

@@ -1,4 +1,8 @@
###
#
# consider how to better version jscript - across all html files, consistently
# mtime, didnt work anyway, my phone still wont pick up the change, it was adding any ?v= changed this (once)
#
# 4 TEST everything (don't forget keybindings,e.g. delete)
# going up from folder view shows different order?
#

View File

@@ -461,7 +461,8 @@ def change_file_opts():
def file_list_ip():
OPT=States( request )
query_data = GetQueryData( OPT )
return render_template("file_list.html", page_title='View File Details (Import Path)', query_data=query_data, OPT=OPT )
js_vers = getVersions()
return render_template("file_list.html", page_title='View File Details (Import Path)', query_data=query_data, OPT=OPT, js_vers=js_vers )
################################################################################
# /files -> show thumbnail view of files from import_path(s)
@@ -482,7 +483,8 @@ def files_ip():
def files_sp():
OPT=States( request )
query_data = GetQueryData( OPT )
return render_template("files.html", page_title=f"View Files ({OPT.path_type} Path)", OPT=OPT, query_data=query_data )
js_vers = getVersions()
return render_template("files.html", page_title=f"View Files ({OPT.path_type} Path)", OPT=OPT, query_data=query_data, js_vers=js_vers )
################################################################################
@@ -493,7 +495,8 @@ def files_sp():
def files_rbp():
OPT=States( request )
query_data = GetQueryData( OPT )
return render_template("files.html", page_title=f"View Files ({OPT.path_type} Path)", OPT=OPT, query_data=query_data )
js_vers = getVersions()
return render_template("files.html", page_title=f"View Files ({OPT.path_type} Path)", OPT=OPT, query_data=query_data, js_vers=js_vers )
################################################################################
# search -> GET version -> has search_term in the URL and is therefore able to

View File

@@ -506,7 +506,7 @@ function drawPageOfFigures()
else if( OPT.root_eid == 0 )
$('#figures').append( `<span class="alert alert-danger p-2 col-auto d-flex align-items-center">No files in Path!</span>` )
$('.figure').click( function(e) { DoSel(e, this ); SetButtonState(); return false; });
$('.figure').dblclick( function(e) { dblClickToViewEntry( $(this).attr('id') ); setDisabledForViewingNextPrevBttons(); addViewerKeyHandler() } )
$('.figure').dblclick( function(e) { startViewing( $(this).attr('id') ) } )
// for dir, getDirEntries 2nd param is back (or "up" a dir)
$(".dir").click( function(e) { document.back_id=this.id; getDirEntries(this.id,false) } )
$(".back").click( function(e) { getDirEntries(this.id,true) } )
@@ -779,7 +779,7 @@ $.contextMenu({
return {
callback: function( key, options) {
if( key == "details" ) { DetailsDBox() }
if( key == "view" ) { dblClickToViewEntry( $(this).attr('id') ) }
if( key == "view" ) { startViewing( $(this).attr('id') ) }
if( key == "move" ) { MoveDBox(move_paths) }
if( key == "del" ) { DelDBox('Delete') }
if( key == "undel") { DelDBox('Restore') }

View File

@@ -726,3 +726,12 @@ function nextImageInViewer()
ViewImageOrVideo()
}
// wrapper func to start the viewer - needed as we have a dbl-click & View file
// to start the viewer
function startViewing(eid)
{
dblClickToViewEntry( eid );
setDisabledForViewingNextPrevBttons();
addViewerKeyHandler()
}

View File

@@ -1,5 +1,5 @@
{% extends "base.html" %} {% block main_content %}
<script src="{{ url_for( 'internal', filename='js/files_support.js')}}"></script>
<script src="{{ url_for( 'internal', filename='js/files_support.js')}}?v={{js_vers['fs']}}"></script>
<div class="container-fluid">
<h3 class="offset-2">{{page_title}}</h3>
@@ -9,11 +9,11 @@
{{CreateSelect( "how_many", OPT.how_many|string, ["10", "25", "50", "75", "100", "150", "200", "500"], "changeOPT(getPageFileList); return false", "rounded-end py-1 my-1" )|safe }}
<div class="mb-1 col my-auto d-flex justify-content-center">
<button id="prev" name="prev" class="prev sm-txt btn btn-outline-secondary" onClick="prevPage(getPageFileList)">
<svg width="16" height="16" fill="currentColor"><use xlink:href="{{url_for('internal', filename='icons.svg')}}#prev"/></svg>
<svg width="16" height="16" fill="currentColor"><use xlink:href="{{url_for('internal', filename='icons.svg')}}?v={{js_vers['ic']}}#prev"/></svg>
</button>
<span class="how_many_text sm-txt my-auto">&nbsp;{{OPT.how_many}} files&nbsp;</span>
<button id="next" name="next" class="next sm-txt btn btn-outline-secondary" onClick="nextPage(getPageFileList)">
<svg width="16" height="16" fill="currentColor"><use xlink:href="{{url_for('internal', filename='icons.svg')}}#next"/></svg>
<svg width="16" height="16" fill="currentColor"><use xlink:href="{{url_for('internal', filename='icons.svg')}}?v={{js_vers['ic']}}#next"/></svg>
</button>
</div class="col...">
</div class="input-group...">
@@ -26,11 +26,11 @@
<div class="row">
<div class="col my-auto d-flex justify-content-center">
<button aria-label="prev" id="prev" name="prev" class="prev sm-txt btn btn-outline-secondary disabled" onClick="prevPage(getPageFileList)" disabled>
<svg width="16" height="16" fill="currentColor"><use xlink:href="{{url_for('internal', filename='icons.svg')}}#prev"/></svg>
<svg width="16" height="16" fill="currentColor"><use xlink:href="{{url_for('internal', filename='icons.svg')}}?v={{js_vers['ic']}}#prev"/></svg>
</button>
<span class="how_many_text sm-txt my-auto">&nbsp;{{OPT.how_many}} files&nbsp;</span>
<button aria-label="next" id="next" name="next" class="next sm-txt btn btn-outline-secondary" onClick="nextPage(getPageFileList)">
<svg width="16" height="16" fill="currentColor"><use xlink:href="{{url_for('internal', filename='icons.svg')}}#next"/></svg>
<svg width="16" height="16" fill="currentColor"><use xlink:href="{{url_for('internal', filename='icons.svg')}}?v={{js_vers['ic']}}#next"/></svg>
</button>
</div class="col my-auto"> </div class="row">
</div class="container-fluid">

View File

@@ -2,6 +2,11 @@
{% block main_content %}
<style>
@media (max-width: 576px) {
#la, #ra {
padding: 5% !important;
}
}
.norm-txt { font-size: 1.0rem }
.form-check-input:checked {
background-color: #39C0ED;
@@ -116,17 +121,17 @@
</div id="files_div">
<div id="viewer_div" class="d-none">
<div id="viewer" class="container-fluid">
<div class="row">
<div class="row flex-nowrap">
<!-- Left Buttons Column -->
<div class="col-auto d-flex flex-column">
<div class="col-auto d-flex flex-column min-width-0">
<!-- Up Button (Small) -->
<button title="Back to list" class="btn btn-outline-info btn-sm p-1 mb-1" onclick="goOutOfViewer()">
<svg width="16" height="16" fill="currentColor">
<use xlink:href="/internal/icons.svg#back"></use>
<use xlink:href="{{url_for('internal', filename='icons.svg')}}?v={{js_vers['ic']}}#back"></use>
</svg>
</button>
<!-- Left Button (large/flex-grow-1) -->
<button title="Show previous image" class="btn btn-outline-info px-2 flex-grow-1"
<button title="Show previous image" class="btn btn-outline-info px-2 flex-grow-1 overflow-hidden"
style="padding: 10%" id="la" onClick="prevImageInViewer()">
<svg width="16" height="16" fill="currentColor">
<use xlink:href="{{url_for('internal', filename='icons.svg')}}?v={{js_vers['ic']}}#prev"/></svg>
@@ -152,15 +157,15 @@
<span id="fname_v"></span></figcaption>
</div>
<!-- Right-hand Buttons Column -->
<div class="col-auto d-flex flex-column">
<div class="col-auto d-flex flex-column min-width-0">
<!-- Up Button (Small) -->
<button title="Back to list" class="btn btn-outline-info btn-sm p-1 mb-1" onclick="goOutOfViewer()">
<svg width="16" height="16" fill="currentColor">
<use xlink:href="/internal/icons.svg#back"></use>
<use xlink:href="{{url_for('internal', filename='icons.svg')}}?v={{js_vers['ic']}}#back"></use>
</svg>
</button>
<!-- Right Button (large/flex-grow-1) -->
<button title="Show next image" class="btn btn-outline-info px-2 flex-grow-1"
<button title="Show next image" class="btn btn-outline-info px-2 flex-grow-1 overflow-hidden"
style="padding: 10%" id="ra" onClick="nextImageInViewer()">
<svg width="16" height="16" fill="currentColor">
<use xlink:href="{{url_for('internal', filename='icons.svg')}}?v={{js_vers['ic']}}#next"/></svg>