more comments for js files

This commit is contained in:
2021-09-07 21:50:01 +10:00
parent 1b11fba0a8
commit e25cb9fd02
2 changed files with 168 additions and 150 deletions

View File

@@ -1,26 +1,36 @@
function NewWidth() // work out new width for canvas. depending on whether width > height of the
{ // image, then use the width of the image (with the specified gap) otherwise
// the height > width, so scale the new width based on height ratio of
// image to window
function NewWidth()
{
w_r=im.width/(window.innerWidth*gap) w_r=im.width/(window.innerWidth*gap)
h_r=im.height/(window.innerHeight*gap) h_r=im.height/(window.innerHeight*gap)
if( w_r > h_r ) if( w_r > h_r )
return window.innerWidth*gap return window.innerWidth*gap
else else
return im.width*gap / (im.height/window.innerHeight) return im.width*gap / (im.height/window.innerHeight)
} }
function NewHeight() // work out new height for canvas. depending on whether height > width of the
{ // image, then use the height of the image (with the specified gap) otherwise
// the width > height, so scale the new height based on width ratio of
// image to window
function NewHeight()
{
w_r=im.width/(window.innerWidth*gap) w_r=im.width/(window.innerWidth*gap)
h_r=im.height/(window.innerHeight*gap) h_r=im.height/(window.innerHeight*gap)
if( h_r > w_r ) if( h_r > w_r )
return window.innerHeight*gap return window.innerHeight*gap
else else
return im.height*gap / (im.width/window.innerWidth) return im.height*gap / (im.width/window.innerWidth)
} }
// Define this once and before it will be called, hence at the top of this file // This draws the image, it can be called on resize events, img.src finishing
function DrawImg() // loading or explicitly on page load. Will also deal with all state/toggles
{ // for items like name, grayscale, etc.
function DrawImg()
{
// another call to this func will occur on load, so skip this one // another call to this func will occur on load, so skip this one
if( im.width == 0 ) if( im.width == 0 )
return return
@@ -38,7 +48,6 @@
else else
$('#throbber').hide(); $('#throbber').hide();
// 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' ) )
{ {
@@ -121,32 +130,35 @@
context.stroke(); context.stroke();
} }
} }
} }
function ResizeVideo() // resize a video based when event calls this -- TODO: is this right for ratios
{ // where vid is different w/h ratio?
function ResizeVideo()
{
$('#video').height(window.innerHeight*gap) $('#video').height(window.innerHeight*gap)
} }
function FaceToggle() // change faces being shown or not (if not showing faces, then cant set distance on anyway)
{ // and a face or not, needs to redraw the image to add/remove green box, etc.
function FaceToggle()
{
$('#distance').prop('disabled', function(i, v) { return !v; }); $('#distance').prop('disabled', function(i, v) { return !v; });
DrawImg() DrawImg()
} }
function ViewImageOrVideo() // func to set show/hide the image or video div, and set the URL appropriately
{ // also deals with fullsecreen if needed
function ViewImageOrVideo()
{
if( objs[current].type == 'Image' ) if( objs[current].type == 'Image' )
{ {
im.src='http://mara.ddp.net:5000/' + objs[current].url im.src='http://mara.ddp.net:5000/' + objs[current].url
$('#video').hide() $('#video').hide()
$('#figure').show() $('#figure').show()
if( fullscreen ) if( fullscreen )
{
console.log('going fs on image')
$('#canvas').get(0).requestFullscreen() $('#canvas').get(0).requestFullscreen()
} }
}
if( objs[current].type == 'Video' ) if( objs[current].type == 'Video' )
{ {
$('#video').prop('src', 'http://mara.ddp.net:5000/' + objs[current].url ) $('#video').prop('src', 'http://mara.ddp.net:5000/' + objs[current].url )
@@ -154,9 +166,6 @@
$('#video').show() $('#video').show()
ResizeVideo() ResizeVideo()
if( fullscreen ) if( fullscreen )
{
console.log('going fs on video')
$('#video').get(0).requestFullscreen() $('#video').get(0).requestFullscreen()
} }
} }
}

View File

@@ -1,3 +1,7 @@
// POST to a check URL, that will tell us if the transformation has completed,
// if not, try again in 1 second... If it has finished then reset the thumbnail
// to full colour, put it back to being an entry and reset the thumbnail to the
// newly created one that was sent back in the response to the POST
function CheckTransformJob(id,job_id) function CheckTransformJob(id,job_id)
{ {
$.ajax( $.ajax(
@@ -19,6 +23,11 @@ function CheckTransformJob(id,job_id)
} ) } )
} }
// for each highlighted image, POST the transform with amt (90, 180, 270,
// fliph, flipv) which will let the job manager know what to do to this file.
// we also grayscale the thumbnail out, remove the entry class for now, show
// the spinning wheel, and finally kick of the checking for the transform job
// to finish
function Transform(amt) function Transform(amt)
{ {
id=$('#current').val() id=$('#current').val()