fix up bug where sucess used instead of success, also if we delete/restore/move a file from inside the viewer, then adjust the files* divs, and go out of the viewer (back/up) and show updated files div

TODO

@@ -1,6 +1,3 @@
-? get rid of style and just use class -- think this should work, so change in 
-    templates/files.html for throbber, etc. and dont set style as much in view_support.js
-
 ### GENERAL
 * jobs for AI should show path name
 * rm dups job should show progress bar

internal/js/files_support.js

@@ -201,7 +201,7 @@ function DelDBox(del_or_undel)
     else
     {
         which="restore"
-        col="sucess"
+        col="success"
     }
 
     document.ents_to_del=[]
@@ -905,6 +905,9 @@ function handleCheckAmendmentJobStatus(data)
             handleTransformImageJobCompleted(data.job, data.entry)
         else if ( data.job.name == 'delete_files' || data.job.name == 'restore_files' || data.job.name == 'move_files' )
             handleMoveOrDeleteOrRestoreFileJobCompleted(data.job)
+            // if we are viewing this file, then just go up / back,b/c this file is "gone" from this view
+            if( document.viewing )
+                goOutOfViewer()
     }
     else { setTimeout( function() { checkForAmendmentJobToComplete(data.job.id) }, 1000 ); }
 }

internal/js/view_support.js

@@ -80,16 +80,19 @@ function DrawImg()
     // -50 is a straight up hack, no idea why this works, but its good enough for me
     if (!Array.isArray(am))
     {
-        const style = 'position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);';
-        $('#throbber').attr('style', style + ' height: 96px;');
-        $('#white-circle').attr('style', style + ' height: 72px;');
+        $('#throbber').show()
+        $('#white-circle').show()
         if(am.type.which == 'img' )
-            $('#inside-img').attr('style', style + ' height: 64px;').attr('src', '/internal/'+am.type.what );
+        {
+            $('#inside-img').attr('src', '/internal/'+am.type.what );
+            $('#inside-img').show()
+        }
         else
         {
-            $('#inside-icon').attr('style', `${style} color:${am.type.colour}; height: 64px;`)
+            $('#inside-icon').attr('style', `color:${am.type.colour};height:64px` )
             $('#inside-icon').attr('fill', am.type.colour )
             $('#inside-icon use').attr('xlink:href', `/internal/icons.svg#${am.type.what}`);
+            $('#inside-icon').show()
         }
     } else {
         $('#throbber').hide()

templates/files.html

@@ -140,10 +140,12 @@
                 <figure style="position: relative;" class="col col-auto border border-info rounded m-0 p-1" id="figure">
                     <canvas id="canvas"></canvas>
                     <!-- next 4 are placeholders and called on during amendments only in viewer code -->
-                    <img id="throbber" src="{{url_for('internal', filename='throbber.gif')}}?v={{js_vers[th]}}" style="display:none;">
-                    <img id="white-circle" src="{{url_for('internal', filename='white-circle.png')}}?v={{js_vers[th]}}" style="display:none;">
-                    <img id="inside-img" style="display:none;">
-                    <svg id="inside-icon" style="display:none;" fill="currentColor">
+                    <img id="throbber" src="{{url_for('internal', filename='throbber.gif')}}?v={{js_vers[th]}}" style="display:none;height:96px"
+                        class="position-absolute top-50 start-50 translate-middle">
+                    <img id="white-circle" src="{{url_for('internal', filename='white-circle.png')}}?v={{js_vers[th]}}" style="display:none;height:72px"
+                        class="position-absolute top-50 start-50 translate-middle">
+                    <img id="inside-img" style="display:none;height:64px" class="position-absolute top-50 start-50 translate-middle">
+                    <svg id="inside-icon" style="display:none;height:64px" class="position-absolute top-50 start-50 translate-middle">
                         <use xlink:href="{{url_for('internal', filename='icons.svg')}}?v={{js_vers['ic']}}#flip_v">
                         </use></svg>
                     <script>
@@ -274,10 +276,8 @@
     // force pageList to set pageList for & render the first page
     getPage(1,getPageFigures)
 
-    // FIXME: doco, but also gather all globals together, many make them all document. to be obviously global (and add fullscreen)
+    // gap is used to keep some space around video in viewer - tbh, not sure why anymore
     var gap=0.8
-    var grayscale=0
-    var throbber=0
 
     function PrettyFname(fname)
     {