eessppeelllloo/image-sequencer
1
0
Fork 0
mirror of https://github.com/publiclab/image-sequencer.git synced 2025-12-11 19:00:00 +01:00
Code Issues Packages Projects Releases Wiki Activity

Shorten UI code with new $step method (#710)

Browse Source 
* update dist

Signed-off-by: tech4GT <varun.gupta1798@gmail.com>

dist update

Revert "dist update"

This reverts commit 9ee2a987e8f978961656ae8f71f6e6702bbbd30d.

* Merge remote-tracking branch 'upstream/main' into main

* add dist

* add new func

* update itermediate

* changes

* fix gitignore

* use scopeQuery

* add mapHtmlTypes test

* scopeQuery tests added

* try something

* change

* fix stepui test

* Remove double quotes

* update new code

* refactor to spec
This commit is contained in:
Harsh Khandeparkar
2019-06-22 00:41:10 +05:30
committed by Jeffrey Warren
parent 0eb3f263f9
commit 257113a948
22 changed files with 274 additions and 313 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
examples/lib/defaultHtmlStepUi.js
View File

@@ -8,10 +8,13 @@
// output values, step information.
// See documetation for more details.
var intermediateHtmlStepUi = require('./intermediateHtmlStepUi.js');
var urlHash = require('./urlHash.js');
var _ = require('lodash');
var mapHtmlTypes = require('./mapHtmltypes');
var intermediateHtmlStepUi = require('./intermediateHtmlStepUi.js'),
urlHash = require('./urlHash.js'),
_ = require('lodash'),
mapHtmlTypes = require('./mapHtmltypes'),
scopeQuery = require('./scopeQuery'),
$stepAll,
$step;
function DefaultHtmlStepUi(_sequencer, options) {
@@ -20,6 +23,7 @@ function DefaultHtmlStepUi(_sequencer, options) {
var selectStepSel = options.selectStepSel = options.selectStepSel || '#selectStep';
function onSetup(step, stepOptions) {
if (step.options && step.options.description)
step.description = step.options.description;
@@ -67,8 +71,12 @@ function DefaultHtmlStepUi(_sequencer, options) {
var parser = new DOMParser();
step.ui = parser.parseFromString(step.ui, 'text/html');
step.ui = step.ui.querySelector('div.container-fluid');
step.linkElements = step.ui.querySelectorAll('a');
step.imgElement = step.ui.querySelector('a img.img-thumbnail');
$step = scopeQuery.scopeSelector(step.ui);
$stepAll = scopeQuery.scopeSelectorAll(step.ui);
step.linkElements = $stepAll('a');
step.imgElement = $step('a img.img-thumbnail')[0];
if (_sequencer.modulesInfo().hasOwnProperty(step.name)) {
var inputs = _sequencer.modulesInfo(step.name).inputs;
@@ -144,12 +152,12 @@ function DefaultHtmlStepUi(_sequencer, options) {
html +
'\
</div>';
step.ui.querySelector('div.details').appendChild(div);
$step('div.details').append(div);
}
$(step.ui.querySelector('div.panel-footer')).append(
$step('div.panel-footer').append(
'<div class="cal collapse in"><button type="submit" class="btn btn-sm btn-default btn-save" disabled = "true" >Apply</button> <small style="padding-top:2px;">Press apply to see changes</small></div>'
);
$(step.ui.querySelector('div.panel-footer')).prepend(
$step('div.panel-footer').prepend(
'<button class="pull-right btn btn-default btn-sm insert-step" >\
<span class="insert-text"><i class="fa fa-plus"></i> Insert Step</span><span class="no-insert-text" style="display:none">Close</span></button>\
<button class="pull-right btn btn-default btn-sm download-btn" style="margin-right:2px" >\
@@ -159,13 +167,13 @@ function DefaultHtmlStepUi(_sequencer, options) {
}
if (step.name != 'load-image') {
step.ui
.querySelector('div.trash-container')
$step('div.trash-container')
.prepend(
parser.parseFromString(tools, 'text/html').querySelector('div')
);
$(step.ui.querySelectorAll('.remove')).on('click', function() {notify('Step Removed', 'remove-notification');});
$(step.ui.querySelectorAll('.insert-step')).on('click', function() { util.insertStep(step.ID); });
$stepAll('.remove').on('click', function() {notify('Step Removed', 'remove-notification');});
$stepAll('.insert-step').on('click', function() { util.insertStep(step.ID); });
// Insert the step's UI in the right place
if (stepOptions.index == _sequencer.steps.length) {
stepsEl.appendChild(step.ui);
@@ -179,19 +187,19 @@ function DefaultHtmlStepUi(_sequencer, options) {
else {
$('#load-image').append(step.ui);
}
$(step.ui.querySelector('.toggle')).on('click', () => {
$(step.ui.querySelector('.toggleIcon')).toggleClass('rotated');
$(step.ui.querySelectorAll('.cal')).collapse('toggle');
$step('.toggle').on('click', () => {
$step('.toggleIcon').toggleClass('rotated');
$stepAll('.cal').collapse('toggle');
});
$(step.imgElement).on('mousemove', _.debounce(() => imageHover(step), 150));
$(step.imgElement).on('click', (e) => {e.preventDefault(); });
$(step.ui.querySelectorAll('#color-picker')).colorpicker();
$stepAll('#color-picker').colorpicker();
function saveOptions(e) {
e.preventDefault();
if (optionsChanged){
$(step.ui.querySelector('div.details'))
$step('div.details')
.find('input,select')
.each(function(i, input) {
$(input)
@@ -204,7 +212,7 @@ function DefaultHtmlStepUi(_sequencer, options) {
// modify the url hash
urlHash.setUrlHashParameter('steps', _sequencer.toString());
// disable the save button
$(step.ui.querySelector('.btn-save')).prop('disabled', true);
$step('.btn-save').prop('disabled', true);
optionsChanged = false;
changedInputs = 0;
}
@@ -215,15 +223,15 @@ function DefaultHtmlStepUi(_sequencer, options) {
changedInputs += hasChangedBefore ? inputChanged ? 0 : -1 : inputChanged ? 1 : 0;
optionsChanged = changedInputs > 0;
$(step.ui.querySelector('.btn-save')).prop('disabled', !optionsChanged);
$step('.btn-save').prop('disabled', !optionsChanged);
return inputChanged;
}
var
changedInputs = 0,
optionsChanged = false;
$(step.ui.querySelector('.input-form')).on('submit', saveOptions);
$(step.ui.querySelectorAll('.target')).each(function(i, input) {
$step('.input-form').on('submit', saveOptions);
$stepAll('.target').each(function(i, input) {
$(input)
.data('initValue', $(input).val())
.data('hasChangedBefore', false)
@@ -248,19 +256,19 @@ function DefaultHtmlStepUi(_sequencer, options) {
}
function onDraw(step) {
$(step.ui.querySelector('.load')).show();
$(step.ui.querySelector('img')).hide();
$(step.ui.querySelectorAll('.load-spin')).show();
function onDraw() {
$step('.load').show();
$step('img').hide();
$stepAll('.load-spin').show();
}
function onComplete(step) {
$(step.ui.querySelector('img')).show();
$(step.ui.querySelectorAll('.load-spin')).hide();
$(step.ui.querySelector('.load')).hide();
$step('img').show();
$stepAll('.load-spin').hide();
$step('.load').hide();
step.imgElement.src = (step.name == 'load-image') ? step.output.src : step.output;
var imgthumbnail = step.ui.querySelector('.img-thumbnail');
var imgthumbnail = $step('.img-thumbnail');
for (let index = 0; index < step.linkElements.length; index++) {
if (step.linkElements[index].contains(imgthumbnail))
step.linkElements[index].href = step.imgElement.src;
@@ -271,7 +279,7 @@ function DefaultHtmlStepUi(_sequencer, options) {
return output.split('/')[1].split(';')[0];
}
$(step.ui.querySelectorAll('.download-btn')).on('click', () => {
$stepAll('.download-btn').on('click', () => {
for (let index = 0; index < step.linkElements.length; index++){
@@ -294,18 +302,18 @@ function DefaultHtmlStepUi(_sequencer, options) {
for (var i in inputs) {
if (step.options[i] !== undefined) {
if (inputs[i].type.toLowerCase() === 'input')
$(step.ui.querySelector('div[name="' + i + '"] input'))
$step('div[name="' + i + '"] input')
.val(step.options[i])
.data('initValue', step.options[i]);
if (inputs[i].type.toLowerCase() === 'select')
$(step.ui.querySelector('div[name="' + i + '"] select'))
$step('div[name="' + i + '"] select')
.val(step.options[i])
.data('initValue', step.options[i]);
}
}
for (var i in outputs) {
if (step[i] !== undefined)
$(step.ui.querySelector('div[name="' + i + '"] input'))
$step('div[name="' + i + '"] input')
.val(step[i]);
}
}

32
examples/lib/intermediateHtmlStepUi.js
View File

@@ -66,20 +66,20 @@ function IntermediateHtmlStepUi(_sequencer, step, options) {
function selectNewStepUi() {
var insertSelect = $(step.ui.querySelector('.insert-step-select'));
var insertSelect = $step('.insert-step-select');
var m = insertSelect.val();
$(step.ui.querySelector('.insertDiv .info')).html(_sequencer.modulesInfo(m).description);
$(step.ui.querySelector('.insertDiv .add-step-btn')).prop('disabled', false);
$step('.insertDiv .info').html(_sequencer.modulesInfo(m).description);
$step('.insertDiv .add-step-btn').prop('disabled', false);
}
var toggleDiv = function(callback = function(){}){
$(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);});
$step('.insertDiv').collapse('toggle');
if ($step('.insert-text').css('display') != 'none'){
$step('.insert-text').fadeToggle(200, function(){$step('.no-insert-text').fadeToggle(200, callback)});
}
else {
$(step.ui.querySelector('.no-insert-text')).fadeToggle(200, function(){$(step.ui.querySelector('.insert-text')).fadeToggle(200, callback);});
$step('.no-insert-text').fadeToggle(200, function(){$step('.insert-text').fadeToggle(200, callback)});
}
};
@@ -89,7 +89,7 @@ function IntermediateHtmlStepUi(_sequencer, step, options) {
var addStepUI = stepUI();
addStepUI = parser.parseFromString(addStepUI, 'text/html').querySelector('div');
if ($(step.ui.querySelector('.insertDiv')).length > 0){
if ($step('.insertDiv').length > 0){
toggleDiv();
}
else {
@@ -103,9 +103,9 @@ function IntermediateHtmlStepUi(_sequencer, step, options) {
});
}
$(step.ui.querySelector('.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.ui.querySelector('.insert-step-select'));
var insertStepSelect = $step('.insert-step-select');
insertStepSelect.html('');
// Add modules to the insertStep dropdown
for (var m in modulesInfo) {
@@ -117,26 +117,26 @@ function IntermediateHtmlStepUi(_sequencer, step, options) {
insertStepSelect.selectize({
sortField: 'text'
});
$(step.ui.querySelector('.inserDiv .add-step-btn')).prop('disabled', true);
$step('.inserDiv .add-step-btn').prop('disabled', true);
insertStepSelect.append('<option value="" disabled selected>Select a Module</option>');
$(step.ui.querySelector('.insertDiv .radio-group .radio')).on('click', function () {
$step('.insertDiv .radio-group .radio').on('click', function () {
$(this).parent().find('.radio').removeClass('selected');
$(this).addClass('selected');
newStep = $(this).attr('data-value');
$(step.ui.querySelector('.insert-step-select')).val(newStep);
$step('.insert-step-select').val(newStep);
selectNewStepUi();
insert(id);
$(this).removeClass('selected');
});
insertStepSelect.on('change', selectNewStepUi);
$(step.ui.querySelector('.insertDiv .add-step-btn')).on('click', function () { insert(id); });
};
$step('.insertDiv .add-step-btn').on('click', function () { insert(id) });
}
function insert(id) {
options = options || {};
var insertStepSelect = $(step.ui.querySelector('.insert-step-select'));
var insertStepSelect = $step('.insert-step-select');
if (insertStepSelect.val() == 'none') return;
var newStepName = insertStepSelect.val();

60
examples/lib/scopeQuery.js Normal file
View File

@@ -0,0 +1,60 @@
/**
* @method $scope
* @param {"DOMNode"} scope A DOM Node as the scope
*/
function $scope(scope) {
return function(queryString){
var element = $(scope.querySelector(queryString));
element.elem = function(queryString){
return new $scope(scope)(queryString);
}
element.elemAll = function(queryString){
return new $scopeAll(scope)(queryString);
}
return element;
}
}
/**
* @method $scopeAll
* @param {"DOMNode"} scope A DOM Node as the scope
*/
function $scopeAll(scope){
return function(queryString){
var element = $(scope.querySelectorAll(queryString));
element.elem = function(queryString){
return new $scope(scope)(queryString);
}
element.elemAll = function(queryString){
return new $scopeAll(scope)(queryString);
}
return element;
}
}
/**
* @method scopeSelector
* @description A scoped jQuery selector
* @param {"DOMNode"} scope DOM Node as the scope
*/
function scopeSelector(scope){
return $scope(scope);
}
/**
* @method scopeSelectorAll
* @description A scoped jQuery multiple selector
* @param {"DOMNode} scope DOM Node as the scope
*/
function scopeSelectorAll(scope){
return $scopeAll(scope);
}
module.exports = {
scopeSelector,
scopeSelectorAll
}

33
package-lock.json generated
View File

@@ -3581,8 +3581,7 @@
"ansi-regex": {
"version": "2.1.1",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"aproba": {
"version": "1.2.0",
@@ -3625,8 +3624,7 @@
"code-point-at": {
"version": "1.1.0",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"concat-map": {
"version": "0.0.1",
@@ -3637,8 +3635,7 @@
"console-control-strings": {
"version": "1.1.0",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"core-util-is": {
"version": "1.0.2",
@@ -3755,8 +3752,7 @@
"inherits": {
"version": "2.0.3",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"ini": {
"version": "1.3.5",
@@ -3768,7 +3764,6 @@
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"number-is-nan": "^1.0.0"
}
@@ -3791,14 +3786,12 @@
"minimist": {
"version": "0.0.8",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"minipass": {
"version": "2.3.5",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"safe-buffer": "^5.1.2",
"yallist": "^3.0.0"
@@ -3817,7 +3810,6 @@
"version": "0.5.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"minimist": "0.0.8"
}
@@ -3898,8 +3890,7 @@
"number-is-nan": {
"version": "1.0.1",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"object-assign": {
"version": "4.1.1",
@@ -3911,7 +3902,6 @@
"version": "1.4.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"wrappy": "1"
}
@@ -3997,8 +3987,7 @@
"safe-buffer": {
"version": "5.1.2",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"safer-buffer": {
"version": "2.1.2",
@@ -4034,7 +4023,6 @@
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
@@ -4054,7 +4042,6 @@
"version": "3.0.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"ansi-regex": "^2.0.0"
}
@@ -4098,14 +4085,12 @@
"wrappy": {
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"yallist": {
"version": "3.0.3",
"bundled": true,
"dev": true,
"optional": true
"dev": true
}
}
},

2
package.json
View File

@@ -6,7 +6,7 @@
"scripts": {
"debug": "TEST=true node ./index.js -i ./examples/images/monarch.png -s invert",
"test": "TEST=true istanbul cover tape test/core/*.js test/core/ui/user-interface.js test/core/modules/*.js | tap-spec; node test/core/sequencer/benchmark.js; browserify test/core/sequencer/meta-modules.js test/core/sequencer/image-sequencer.js test/core/sequencer/chain.js test/core/sequencer/replace.js test/core/sequencer/import-export.js test/core/sequencer/run.js test/core/sequencer/dynamic-imports.js test/core/util/*.js | tape-run --render=\"tap-spec\"",
"test-ui": "node node_modules/jasmine/bin/jasmine test/spec/*.js",
"test-ui": "node node_modules/jasmine/bin/jasmine test/ui/spec/*.js",
"setup": "npm i && npm i -g grunt grunt-cli && grunt build",
"start": "grunt serve"
},

26
spec/insertPreview.spec.js
View File

@@ -1,26 +0,0 @@
describe('Preview UI HTML', function() {
var InsertPreview = require('../examples/lib/insertPreview');
var sequencer = require('../src/ImageSequencer')();
var insertPreview;
var options = { brightness: 50 };
beforeEach(()=>{
insertPreview = InsertPreview;
spyOn(insertPreview, 'generatePreview');
spyOn(insertPreview, 'updatePreviews');
insertPreview.generatePreview('brightness', options, 'src', 'selector');
insertPreview.updatePreviews('src', 'selector');
});
it('generate preview ui', function() {
expect(insertPreview.generatePreview).toHaveBeenCalledWith('brightness', options, 'src', 'selector');
});
it('update preview ui', function() {
expect(insertPreview.updatePreviews).toHaveBeenCalledWith('src', 'selector');
});
});

19
spec/intermediateHtmlStepUi.spec.js
View File

@@ -1,19 +0,0 @@
describe('Intermediate step HTML', function() {
var IntermediateHtmlStepUi = require('../examples/lib/intermediateHtmlStepUi');
var sequencer = require('../src/ImageSequencer')();
var intermediateHtmlStepUi;
beforeEach(()=>{
intermediateHtmlStepUi = new IntermediateHtmlStepUi(sequencer);
spyOn(intermediateHtmlStepUi, 'insertStep');
intermediateHtmlStepUi.insertStep();
});
it('insert step ui', function() {
expect(intermediateHtmlStepUi.insertStep).toHaveBeenCalled();
});
});

11
spec/support/jasmine.json
View File

@@ -1,11 +0,0 @@
{
"spec_dir": "spec",
"spec_files": [
"**/*[sS]pec.js"
],
"helpers": [
"helpers/**/*.js"
],
"stopSpecOnExpectationFailure": false,
"random": true
}

40
spec/urlHash.spec.js
View File

@@ -1,40 +0,0 @@
describe('URL manipulation methods', function() {
var UrlHash = require('../examples/lib/urlHash');
var urlHash;
var params = {
module: 'brightness',
brightness: 50
};
beforeEach(()=>{
urlHash = UrlHash;
spyOn(urlHash, 'getUrlHashParameters');
spyOn(urlHash, 'getUrlHashParameter');
spyOn(urlHash, 'setUrlHashParameters');
spyOn(urlHash, 'setUrlHashParameter');
urlHash.getUrlHashParameters();
urlHash.getUrlHashParameter('module');
urlHash.setUrlHashParameters(params);
urlHash.setUrlHashParameter('module', 'brightness');
});
it('gets url hash params from window hash', function() {
expect(urlHash.getUrlHashParameters).toHaveBeenCalled();
});
it('gets url hash param from params object', function() {
expect(urlHash.getUrlHashParameter).toHaveBeenCalledWith('module');
});
it('accepts param object and sets url hash params', function() {
expect(urlHash.setUrlHashParameters).toHaveBeenCalledWith(params);
});
it('accepts param key-value pair and sets url hash params', function() {
expect(urlHash.setUrlHashParameter).toHaveBeenCalledWith('module', 'brightness');
});
});

42
test/spec/defaultHtmlSequencerUi.spec.js
View File

@@ -1,42 +0,0 @@
describe('Default sequencer HTML', function() {
var DefaultHtmlSequencerUi = require('../../examples/lib/defaultHtmlSequencerUi');
var sequencer = require('../../src/ImageSequencer')();
var defaultHtmlSequencerUi;
beforeEach(()=>{
defaultHtmlSequencerUi = new DefaultHtmlSequencerUi(sequencer);
spyOn(defaultHtmlSequencerUi, 'onLoad');
spyOn(defaultHtmlSequencerUi, 'selectNewStepUi');
spyOn(defaultHtmlSequencerUi, 'removeStepUi');
spyOn(defaultHtmlSequencerUi, 'addStepUi');
spyOn(defaultHtmlSequencerUi, 'importStepsFromUrlHash');
defaultHtmlSequencerUi.onLoad();
defaultHtmlSequencerUi.selectNewStepUi();
defaultHtmlSequencerUi.addStepUi();
defaultHtmlSequencerUi.removeStepUi();
defaultHtmlSequencerUi.importStepsFromUrlHash();
});
it('load default ui', function() {
expect(defaultHtmlSequencerUi.onLoad).toHaveBeenCalled();
});
it('select step ui', function() {
expect(defaultHtmlSequencerUi.selectNewStepUi).toHaveBeenCalled();
});
it('add step ui', function() {
expect(defaultHtmlSequencerUi.addStepUi).toHaveBeenCalled();
});
it('remove step ui', function() {
expect(defaultHtmlSequencerUi.removeStepUi).toHaveBeenCalled();
});
it('import options from url', function() {
expect(defaultHtmlSequencerUi.importStepsFromUrlHash).toHaveBeenCalled();
});
});

61
test/spec/defaultHtmlStepUi.spec.js
View File

@@ -1,61 +0,0 @@
var { JSDOM } = require('jsdom');
var DOM = new JSDOM('<body></body>');
global.document = DOM.window.document;
describe('Sequencer step HTML', function() {
var DefaultHtmlStepUi = require('../../examples/lib/defaultHtmlStepUi');
var sequencer = require('../../src/ImageSequencer')();
var defaultHtmlStepUi;
var step = 'brightness';
var options = {
name: 'Brightness',
description: 'Change the brightness of the image by given percent value'
};
// options = JSON.parse(options)
beforeEach(()=>{
defaultHtmlStepUi = new DefaultHtmlStepUi(sequencer);
spyOn(defaultHtmlStepUi, 'getPreview');
spyOn(defaultHtmlStepUi, 'onSetup');
spyOn(defaultHtmlStepUi, 'onComplete');
spyOn(defaultHtmlStepUi, 'onDraw');
spyOn(defaultHtmlStepUi, 'onRemove');
spyOn(defaultHtmlStepUi, 'notify');
defaultHtmlStepUi.getPreview();
defaultHtmlStepUi.onSetup(step, options);
defaultHtmlStepUi.onComplete(step);
defaultHtmlStepUi.onDraw(step);
defaultHtmlStepUi.onRemove(step);
defaultHtmlStepUi.notify('Step removed', 'remove-notification');
});
it('result preview ui', function() {
expect(defaultHtmlStepUi.getPreview).toHaveBeenCalled();
});
it('load initial setup ui', function() {
expect(defaultHtmlStepUi.onSetup).toHaveBeenCalledWith(step, options);
});
it('load completion ui', function() {
expect(defaultHtmlStepUi.onComplete).toHaveBeenCalledWith(step);
});
it('draw step ui', function() {
expect(defaultHtmlStepUi.onDraw).toHaveBeenCalledWith(step);
});
it('remove step ui', function() {
expect(defaultHtmlStepUi.onRemove).toHaveBeenCalledWith(step);
});
it('notification ui', function() {
expect(defaultHtmlStepUi.notify).toHaveBeenCalledWith('Step removed', 'remove-notification');
});
});

8
test/spec/helpers/reporter.js
View File

@@ -1,8 +0,0 @@
var SpecReporter = require('jasmine-spec-reporter').SpecReporter;
jasmine.getEnv().clearReporters(); // remove default reporter logs
jasmine.getEnv().addReporter(new SpecReporter({ // add jasmine-spec-reporter
spec: {
displayPending: true
}
}));

4
spec/defaultHtmlSequencerUi.spec.js → test/ui/spec/defaultHtmlSequencerUi.spec.js
View File

@@ -1,7 +1,7 @@
describe('Default sequencer HTML', function() {
var DefaultHtmlSequencerUi = require('../examples/lib/defaultHtmlSequencerUi');
var sequencer = require('../src/ImageSequencer')();
var DefaultHtmlSequencerUi = require('../../../examples/lib/defaultHtmlSequencerUi');
var sequencer = require('../../../src/ImageSequencer')();
var defaultHtmlSequencerUi;
beforeEach(()=>{

14
spec/defaultHtmlStepUi.spec.js → test/ui/spec/defaultHtmlStepUi.spec.js
View File

@@ -5,8 +5,8 @@ global.document = DOM.window.document;
describe('Sequencer step HTML', function() {
var DefaultHtmlStepUi = require('../examples/lib/defaultHtmlStepUi');
var sequencer = require('../src/ImageSequencer')();
var DefaultHtmlStepUi = require('../../../examples/lib/defaultHtmlStepUi');
var sequencer = require('../../../src/ImageSequencer')();
var defaultHtmlStepUi;
var step = 'brightness';
var options = {
@@ -15,6 +15,16 @@ describe('Sequencer step HTML', function() {
};
// options = JSON.parse(options)
beforeAll(() => {
const { JSDOM } = require('jsdom');
var { window } = new JSDOM();
const { document } = window;
global.window = window;
global.document = document;
const $ = global.jQuery = global.$ = require('jquery');
});
beforeEach(()=>{
defaultHtmlStepUi = new DefaultHtmlStepUi(sequencer);

0
spec/helpers/reporter.js → test/ui/spec/helpers/reporter.js
View File

4
test/spec/insertPreview.spec.js → test/ui/spec/insertPreview.spec.js
View File

@@ -1,7 +1,7 @@
describe('Preview UI HTML', function() {
var InsertPreview = require('../../examples/lib/insertPreview');
var sequencer = require('../../src/ImageSequencer')();
var InsertPreview = require('../../../examples/lib/insertPreview');
var sequencer = require('../../../src/ImageSequencer')();
var insertPreview;
var options = { brightness: 50 };

4
test/spec/intermediateHtmlStepUi.spec.js → test/ui/spec/intermediateHtmlStepUi.spec.js
View File

@@ -1,7 +1,7 @@
describe('Intermediate step HTML', function() {
var IntermediateHtmlStepUi = require('../../examples/lib/intermediateHtmlStepUi');
var sequencer = require('../../src/ImageSequencer')();
var IntermediateHtmlStepUi = require('../../../examples/lib/intermediateHtmlStepUi');
var sequencer = require('../../../src/ImageSequencer')();
var intermediateHtmlStepUi;
beforeEach(()=>{

24
test/ui/spec/mapHtmlTypes.spec.js Normal file
View File

@@ -0,0 +1,24 @@
describe('HTML Types Mapping Function', function() {
var mapHtmlTypes = require('../../../examples/lib/mapHtmltypes');
it('maps range and number types', function() {
expect(mapHtmlTypes({type: 'percentage'})).toEqual({type: 'number'});
expect(mapHtmlTypes({type: 'integer'})).toEqual({type: 'number'});
expect(mapHtmlTypes({type: 'integer', min: 20, max: 100})).toEqual({type: 'range', min: 20, max: 100});
expect(mapHtmlTypes({type: 'float'})).toEqual({type: 'text'});
expect(mapHtmlTypes({type: 'float', min: 20, max: 100})).toEqual({type: 'range', min: 20, max: 100});
});
it('maps text type', function() {
expect(mapHtmlTypes({type: 'string'})).toEqual({type: 'text'});
expect(mapHtmlTypes({type: 'anything'})).toEqual({type: 'text'});
});
it('maps select type', function() {
expect(mapHtmlTypes({type: 'select'})).toEqual({type: 'select'});
});
});

81
test/ui/spec/scopeQuery.spec.js Normal file
View File

@@ -0,0 +1,81 @@
const scopeQuery = require('../../../examples/lib/scopeQuery');
describe('scopeQuery Method', function() {
beforeAll(() => {
const { JSDOM } = require('jsdom');
var { window } = new JSDOM(`
<body>
<div id="scope1">
<div class="child" id="child1">Child1</div>
<div class="child" id="child2">Child2</div>
<div class="child" id="child3">Child3</div>
<div class="child" id="child4">Child4</div>
<div class="child" id="child5">Child5</div>
<div class="child" id="child6">Child6</div>
</div>
<div id="scope2">
<div class="child" id="child1">Child1Scope2</div>
<div class="child" id="child2">Child2Scope2</div>
<div class="child" id="child3">Child3Scope2</div>
<div class="child" id="child4">Child4Scope2</div>
<div class="child" id="child5">Child5Scope2</div>
</div>
</body>`);
const { document } = window;
global.window = window;
global.document = document;
const $ = global.jQuery = global.$ = require('jquery');
});
it('scope 1 querySelector', function() {
const $scope1 = scopeQuery.scopeSelector(document.querySelector('#scope1'));
const $scope1All = scopeQuery.scopeSelectorAll(document.querySelector('#scope1'));
expect($scope1('.child').length).toBe(1);
expect($scope1All('.child').length).toBe(6);
expect($scope1('#child1').text()).toBe('Child1');
expect($scope1('#child2').text()).toBe('Child2');
expect($scope1All('#child1').text()).toBe('Child1');
expect($scope1All('#child2').text()).toBe('Child2');
expect($scope1().elem('.child').length).toBe(1);
expect($scope1().elemAll('.child').length).toBe(6);
expect($scope1All().elem('.child').length).toBe(1);
expect($scope1All().elemAll('.child').length).toBe(6);
});
it('scope 2 querySelector', function() {
const $scope2 = scopeQuery.scopeSelector(document.querySelector('#scope2'));
const $scope2All = scopeQuery.scopeSelectorAll(document.querySelector('#scope2'));
expect($scope2('.child').length).toBe(1);
expect($scope2All('.child').length).toBe(5);
expect($scope2('#child1').text()).toBe('Child1Scope2');
expect($scope2('#child2').text()).toBe('Child2Scope2');
expect($scope2All('#child1').text()).toBe('Child1Scope2');
expect($scope2All('#child2').text()).toBe('Child2Scope2');
expect($scope2().elem('.child').length).toBe(1);
expect($scope2().elemAll('.child').length).toBe(5);
expect($scope2All().elem('.child').length).toBe(1);
expect($scope2All().elemAll('.child').length).toBe(5);
});
});
global.document = null;
global.$ = null;
DOM = null;

0
test/spec/support/jasmine.json → test/ui/spec/support/jasmine.json
View File

2
test/spec/urlHash.spec.js → test/ui/spec/urlHash.spec.js
View File

@@ -1,6 +1,6 @@
describe('URL manipulation methods', function() {
var UrlHash = require('../../examples/lib/urlHash');
var UrlHash = require('../../../examples/lib/urlHash');
var urlHash;
var params = {
module: 'brightness',