ddp/photoassistant
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix BUG-53 video/image viewer switching had spacing and name wrong

Browse Source
This commit is contained in:
Damien De Paoli
2021-09-16 21:06:05 +10:00
parent 85dd7d7bd1
commit 67b1c0dd49
3 changed files with 52 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
BUGs
View File

@@ -1,4 +1,3 @@
### Next: 59 ### Next: 59
BUG-52: updated tag on person, and it said successful, but the colour was red/danger BUG-52: updated tag on person, and it said successful, but the colour was red/danger
BUG-53: when viewing list, moving to a video and the name of the file is not updated (are there 2 in the dom?)
BUG-56: when making a viewing list of AI:mich, (any search?) and going past the page_size, it gets the wrong data from the DB for the 'next' entry BUG-56: when making a viewing list of AI:mich, (any search?) and going past the page_size, it gets the wrong data from the DB for the 'next' entry

18
internal/js/view_support.js
View File

@@ -51,12 +51,12 @@ function DrawImg()
// show (or not) the whole figcaption with fname in it - based on state of fname_toggle // show (or not) the whole figcaption with fname in it - based on state of fname_toggle
if( $('#fname_toggle').prop('checked' ) ) if( $('#fname_toggle').prop('checked' ) )
{ {
$('.figcaption').attr('style', 'display:show' )
// reset fname for new image (if navigated left/right to get here) // reset fname for new image (if navigated left/right to get here)
$('#fname').html(objs[current].name) $('#fname').html(objs[current].name)
$('.figcaption').show()
} }
else else
$('.figcaption').attr('style', 'display:none' ) $('.figcaption').hide()
// if we have faces, the enable the toggles, otherwise disable them // if we have faces, the enable the toggles, otherwise disable them
// and reset model select too // and reset model select too
@@ -154,8 +154,11 @@ function ViewImageOrVideo()
if( objs[current].type == 'Image' ) if( objs[current].type == 'Image' )
{ {
im.src='../' + objs[current].url im.src='../' + objs[current].url
$('#video').hide() $('#video_div').hide()
$('#vid-caption').hide() //$('#vid-cap').hide()
if( $('#fname_toggle').prop('checked' ) )
$('#img-cap').show()
$('#fname_i').html(objs[current].name)
$('#figure').show() $('#figure').show()
if( fullscreen ) if( fullscreen )
$('#canvas').get(0).requestFullscreen() $('#canvas').get(0).requestFullscreen()
@@ -164,8 +167,11 @@ function ViewImageOrVideo()
{ {
$('#video').prop('src', '../' + objs[current].url ) $('#video').prop('src', '../' + objs[current].url )
$('#figure').hide() $('#figure').hide()
$('#video').show() $('#fname_v').html(objs[current].name)
$('#vid-caption').show() if( $('#fname_toggle').prop('checked' ) )
$('#img-cap').hide()
$('#video_div').show()
//$('#vid-cap').show()
ResizeVideo() ResizeVideo()
if( fullscreen ) if( fullscreen )
$('#video').get(0).requestFullscreen() $('#video').get(0).requestFullscreen()

79
templates/viewer.html
View File

@@ -117,52 +117,53 @@
var context = canvas.getContext('2d') var context = canvas.getContext('2d')
window.addEventListener('resize', DrawImg, false); window.addEventListener('resize', DrawImg, false);
</script> </script>
<figcaption class="figure-caption text-center text-wrap text-break"><span id="fname">{{objs[current].name}}</span></figcaption> <figcaption id="img-cap" class="figure-caption text-center text-wrap text-break"><span id="fname_i">{{objs[current].name}}</span></figcaption>
</figure> </figure>
{% if objs[current].type.name != "Image" %} {% if objs[current].type.name != "Image" %}
<script>$('#figure').attr('style', 'display:none')</script> <script>$('#figure').hide()</script>
{% endif %} {% endif %}
<div class="col col-auto"> <div id="video_div" class="col col-auto">
<video id="video" class="col col-auto" controls> <video id="video" class="col col-auto" controls>
<source src="../{{objs[current].FullPathOnFS()}}" type="video/mp4"> <source src="../{{objs[current].FullPathOnFS()}}" type="video/mp4">
Your browser does not support the video tag. Your browser does not support the video tag.
</video> </video>
<figcaption id="vid-caption" class="figure-caption text-center text-wrap text-break"><span id="fname">{{objs[current].name}}</span></figcaption> <figcaption id="vid-cap" class="figure-caption text-center text-wrap text-break">
<span id="fname_v">{{objs[current].name}}</span>
</figcaption>
</div> </div>
<script> <script>
window.addEventListener('resize', ResizeVideo, false); window.addEventListener('resize', ResizeVideo, false);
ResizeVideo() ResizeVideo()
{% if objs[current].type.name != "Video" %} {% if objs[current].type.name != "Video" %}
$('#video').attr('style', 'display:none') $('#video_div').hide()
$('#vid-caption').attr('style', 'display:none') {% endif %}
{% endif %}
</script> </script>
<button title="Show next image" class="col-auto btn btn-outline-info px-2" style="padding: 10%" id="ra" <button title="Show next image" class="col-auto btn btn-outline-info px-2" style="padding: 10%" id="ra"
onClick=" onClick="
{% if OPT.last_entry_in_db is defined %} {% if OPT.last_entry_in_db is defined %}
if( current == {{OPT.last_entry_in_db}} ) if( current == {{OPT.last_entry_in_db}} )
{
$('#ra').attr('disabled', true )
return
}
{% endif %}
if( document.fullscreen == false )
fullscreen = false
cidx = eid_lst.indexOf(current.toString())
if( cidx < eid_lst.length-1 )
{ {
current=eid_lst[cidx+1] $('#ra').attr('disabled', true )
ViewImageOrVideo() return
$('#la').attr('disabled', false )
} }
else {% endif %}
{ if( document.fullscreen == false )
{# only go next route if list contains as many elements as we asked to display... can be more than how_many on any page in reality, as its really how_many per dir? #} fullscreen = false
if( eid_lst.length >= {{OPT.how_many}} ) cidx = eid_lst.indexOf(current.toString())
CallViewListRoute('next') if( cidx < eid_lst.length-1 )
} {
"> current=eid_lst[cidx+1]
ViewImageOrVideo()
$('#la').attr('disabled', false )
}
else
{
{# only go next route if list contains as many elements as we asked to display... can be more than how_many on any page in reality, as its really how_many per dir? #}
if( eid_lst.length >= {{OPT.how_many}} )
CallViewListRoute('next')
}
">
<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')}}#next"/></svg>
</button> </button>
</div id="/form-row"> </div id="/form-row">