diff --git a/examples/lib/intermediateHtmlStepUi.js b/examples/lib/intermediateHtmlStepUi.js
index e3feab25..65795c79 100644
--- a/examples/lib/intermediateHtmlStepUi.js
+++ b/examples/lib/intermediateHtmlStepUi.js
@@ -66,20 +66,28 @@ function IntermediateHtmlStepUi(_sequencer, step, options) {
function selectNewStepUi() {
- var insertSelect = $step('.insert-step-select');
+ //var insertSelect = $step('.insert-step-select');
+ var insertSelect = $(step.ui.querySelector('.insert-step-select'));
var m = insertSelect.val();
- $step('.insertDiv .info').html(_sequencer.modulesInfo(m).description);
- $step('.insertDiv .add-step-btn').prop('disabled', false);
+ // $step('.insertDiv .info').html(_sequencer.modulesInfo(m).description);
+ // $step('.insertDiv .add-step-btn').prop('disabled', false);
+ $(step.ui.querySelector('.insertDiv .info').html(_sequencer.modulesInfo(m).description));
+ $(step.ui.querySelector('.insertDiv .add-step-btn').prop('disabled', false));
}
var toggleDiv = function(callback = function(){}){
- $step('.insertDiv').collapse('toggle');
+ /*$step('.insertDiv').collapse('toggle');
if ($step('.insert-text').css('display') != 'none'){
- $step('.insert-text').fadeToggle(200, function(){$step('.no-insert-text').fadeToggle(200, callback)});
+ $step('.insert-text').fadeToggle(200, function(){$step('.no-insert-text').fadeToggle(200, callback)});*/
+
+ $(step.ui.querySelector('.insertDiv')).collapse('toggle');
+ if ($(step.ui.querySelector('.insert-text')).css('display') != 'none'){
+ $(step.ui.querySelector('.insert-text')).fadeToggle(200, function(){$(step.ui.querySelector('.no-insert-text')).fadeToggle(200, callback);});
}
else {
- $step('.no-insert-text').fadeToggle(200, function(){$step('.insert-text').fadeToggle(200, callback)});
+ //$step('.no-insert-text').fadeToggle(200, function(){$step('.insert-text').fadeToggle(200, callback)});
+ $(step.ui.querySelector('.no-insert-text')).fadeToggle(200, function(){$(step.ui.querySelector('.insert-text')).fadeToggle(200, callback);});
}
};
@@ -89,7 +97,8 @@ function IntermediateHtmlStepUi(_sequencer, step, options) {
var addStepUI = stepUI();
addStepUI = parser.parseFromString(addStepUI, 'text/html').querySelector('div');
- if ($step('.insertDiv').length > 0){
+ //if ($step('.insertDiv').length > 0){
+ if ($(step.ui.querySelector('.insertDiv')).length > 0){
toggleDiv();
}
else {
@@ -103,9 +112,14 @@ function IntermediateHtmlStepUi(_sequencer, step, options) {
});
}
- $step('.insertDiv .close-insert-box').off('click').on('click', function(){toggleDiv(function(){})});
+ /*$step('.insertDiv .close-insert-box').off('click').on('click', function(){toggleDiv(function(){})});
- var insertStepSelect = $step('.insert-step-select');
+ var insertStepSelect = $step('.insert-step-select');*/
+
+ $(step.ui.querySelector('.insertDiv .close-insert-box')).off('click').on('click', function(){toggleDiv(function(){});});
+
+ //var insertStepSelect = $step('.insert-step-select');
+ var insertStepSelect = $(step.ui.querySelector('.insert-step-select'));
insertStepSelect.html('');
// Add modules to the insertStep dropdown
for (var m in modulesInfo) {
@@ -117,26 +131,31 @@ function IntermediateHtmlStepUi(_sequencer, step, options) {
insertStepSelect.selectize({
sortField: 'text'
});
- $step('.inserDiv .add-step-btn').prop('disabled', true);
+ //$step('.inserDiv .add-step-btn').prop('disabled', true);
+ $(step.ui.querySelector('.inserDiv .add-step-btn')).prop('disabled', true);
insertStepSelect.append('');
- $step('.insertDiv .radio-group .radio').on('click', function () {
+ //$step('.insertDiv .radio-group .radio').on('click', function () {
+ $(step.ui.querySelector('.insertDiv .radio-group .radio')).on('click', function () {
$(this).parent().find('.radio').removeClass('selected');
$(this).addClass('selected');
newStep = $(this).attr('data-value');
- $step('.insert-step-select').val(newStep);
+ //$step('.insert-step-select').val(newStep);
+ $(step.ui.querySelector('.insert-step-select')).val(newStep);
selectNewStepUi();
insert(id);
$(this).removeClass('selected');
});
insertStepSelect.on('change', selectNewStepUi);
- $step('.insertDiv .add-step-btn').on('click', function () { insert(id) });
- }
+ //$step('.insertDiv .add-step-btn').on('click', function () { insert(id) });
+ $(step.ui.querySelector('.insertDiv .add-step-btn')).on('click', function () { insert(id); });
+ };
function insert(id) {
options = options || {};
- var insertStepSelect = $step('.insert-step-select');
+ //var insertStepSelect = $step('.insert-step-select');
+ var insertStepSelect = $(step.ui.querySelector('.insert-step-select'));
if (insertStepSelect.val() == 'none') return;
var newStepName = insertStepSelect.val();
diff --git a/package.json b/package.json
index 694f0d2a..cd4bd9b0 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "image-sequencer",
- "version": "3.5.0",
+ "version": "3.5.1",
"description": "A modular JavaScript image manipulation library modeled on a storyboard.",
"main": "src/ImageSequencer.js",
"scripts": {