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

This commit is contained in:
2021-09-16 21:06:05 +10:00
parent 85dd7d7bd1
commit 67b1c0dd49
3 changed files with 52 additions and 46 deletions

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

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()

View File

@@ -117,24 +117,25 @@
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>