Merge branch 'main' into face-detection

examples/lib/defaultHtmlSequencerUi.js

@@ -1,4 +1,5 @@
 var urlHash = require('./urlHash.js');
+   insertPreview = require('./insertPreview.js');
 function DefaultHtmlSequencerUi(_sequencer, options) {
 
   options = options || {};
@@ -33,6 +34,11 @@ function DefaultHtmlSequencerUi(_sequencer, options) {
 
   function removeStepUi() {
     var index = $(removeStepSel).index(this) + 1;
+    // If last step is removed.
+    if(sequencer.steps.length==index+1){
+      console.log("inside")
+      insertPreview.updatePreviews(sequencer.steps[index-1].output.src, document.querySelector('#addStep'));
+    }
     sequencer.removeSteps(index).run({ index: index - 1 });
     // remove from URL hash too
     urlHash.setUrlHashParameter('steps', sequencer.toString());

examples/lib/defaultHtmlStepUi.js

@@ -11,6 +11,7 @@
 const intermediateHtmlStepUi = require('./intermediateHtmlStepUi.js'),
   urlHash = require('./urlHash.js'),
   _ = require('lodash'),
+  insertPreview = require('./insertPreview.js');
   mapHtmlTypes = require('./mapHtmltypes'),
   scopeQuery = require('./scopeQuery'),
   isGIF = require('../../src/util/isGif');
@@ -365,6 +366,9 @@ function DefaultHtmlStepUi(_sequencer, options) {
       updateDimensions(step);
     });
 
+    if (step.name === 'load-image') insertPreview.updatePreviews(step.output.src, document.querySelector('#addStep'));
+    else insertPreview.updatePreviews(step.output, document.querySelector('#addStep'));  
+
     // Handle the wasm bolt display
 
     if (step.useWasm) {

examples/lib/insertPreview.js

@@ -10,6 +10,7 @@ function generatePreview(previewStepName, customValues, path, DomNode) {
     $(img).css('transform', 'translateX(-20%)');
     $(DomNode.querySelector('.radio-group')).find('.radio').each(function() {
       if ($(this).attr('data-value') === previewStepName) {
+        $(this).find('img').remove();
         $(this).append(img);
       }
     });