diff --git a/examples/lib/defaultHtmlSequencerUi.js b/examples/lib/defaultHtmlSequencerUi.js
index 8cdc8162..40066b01 100644
--- a/examples/lib/defaultHtmlSequencerUi.js
+++ b/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());
diff --git a/examples/lib/defaultHtmlStepUi.js b/examples/lib/defaultHtmlStepUi.js
index 30bac3e1..8928aa4e 100644
--- a/examples/lib/defaultHtmlStepUi.js
+++ b/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) {
diff --git a/examples/lib/insertPreview.js b/examples/lib/insertPreview.js
index ab22c037..e14936c5 100644
--- a/examples/lib/insertPreview.js
+++ b/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);
}
});