passing tests and displaying titles in web UI

dist/image-sequencer.js

@@ -184103,7 +184103,7 @@ ImageSequencer = function ImageSequencer(options) {
       modules = require('./Modules');
 
   // if in browser, prompt for an image
-  if (options.imageSelect || options.inBrowser) addStep('image-select', { selector: "#drop" });
+  if (options.imageSelect || options.inBrowser) addStep('image-select');
   else if (options.imageUrl) loadImage(imageUrl);
 
   // soon, detect local or URL?
@@ -184119,17 +184119,23 @@ ImageSequencer = function ImageSequencer(options) {
 
     steps.push(module);
 
-    if (module.name !== "image-select") {
+    function defaultSetupModule() {
+      if (options.ui) module.options.ui = options.ui({
+        selector: o.selector,
+        title: module.options.title
+      });
+    }
+
+    if (name === "image-select") {
+
+      module.setup(); // just set up initial ImageSelect; it has own UI
+
+    } else {
 
       // add a default UI, unless the module has one specified
       if (module.hasOwnProperty('setup')) module.setup();
       else {
-        setup.apply(module); // run default setup() in scope of module (is this right?)
-        function setup() {
-          if (module.options.ui) module.options.ui = options.ui({
-            selector: o.selector
-          });
-        }
+        defaultSetupModule.apply(module); // run default setup() in scope of module (is this right?)
       }
 
       var previousStep = steps[steps.length - 2];
@@ -184144,10 +184150,6 @@ ImageSequencer = function ImageSequencer(options) {
         }
       }
 
-    } else {
-
-      module.setup(); // just set up initial ImageSelect
-
     }
 
     // Pre-set the initial output behavior of the final step, 
@@ -184184,6 +184186,7 @@ ImageSequencer = function ImageSequencer(options) {
   }
 
   return {
+    options: options,
     loadImage: loadImage,
     addStep: addStep,
     run: run,
@@ -184221,13 +184224,13 @@ module.exports = function UserInterface(options) {
 
   options.random = options.random || parseInt(Math.random() * (new Date()).getTime() / 1000000);
   options.uniqueSelector = options.uniqueSelector || options.selector + '-' + options.random; 
-  $(options.container).append('<div class="panel ' + options.selector + ' ' + options.uniqueSelector + '"></div>');
+  $(options.container).append('<div class="panel ' + options.selector + ' ' + options.uniqueSelector + '"><div class="image"></div></div>');
   options.el = options.el || $('.' + options.uniqueSelector);
   createLabel(options.el);
 
   // method to remove the UI for a given method, and remove the step
   function display(image) {
-    options.el.html(image);
+    options.el.find('.image').html(image);
   }
 
   // method to remove the UI for a given method, and remove the step
@@ -184237,8 +184240,7 @@ module.exports = function UserInterface(options) {
   //function move() {}
 
   function createLabel(el) {
-console.log("createLabel", module.title)
-    el.append('<h3 class="title">' + module.title + '</h3>');
+    if (options.title) el.prepend('<h3 class="title">' + options.title + '</h3>');
   }
 
   return {
@@ -184258,6 +184260,8 @@ console.log("createLabel", module.title)
 module.exports = function GreenChannel(options) {
 
   options = options || {};
+  options.title = "Green channel only";
+  options.description = "Displays only the green channel of an image";
 
   //function setup() {} // optional
 
@@ -184272,8 +184276,6 @@ module.exports = function GreenChannel(options) {
   }
 
   return {
-    title: "Green channel only",
-    description: "Displays only the green channel of an image",
     options: options,
     //setup: setup, // optional
     draw:  draw
@@ -184290,15 +184292,11 @@ module.exports = function ImageSelect(options) {
   if (!window.hasOwnProperty('$')) window.$ = window.jQuery = require('jquery');
 
   options = options || {};
-  options.selector = options.selector || "#drop";
+  options.title = "Select image";
   options.inputSelector = options.inputSelector || "#file-select";
-  options.ui = options.ui || {};
-  options.ui.el = options.ui.el || $(options.selector);
-
-  if (options.ui.el.length === 0) console.log('No UI element found with given selector: ', options.selector);
 
   var image,
-      el = options.ui.el;
+      el = $('.' + options.selector + ' .mod-drop');
 
   function setup() {
 
@@ -184354,20 +184352,14 @@ module.exports = function ImageSelect(options) {
 
   // this module is unique because it creates the image
   function draw(image) {
-    options.ui.display(image);
+    options.el.html(image);
     if (options.output) options.output(image);
   }
 
-  function get() {
-    return image;
-  }
-
   return {
-    title: "Select image",
     options: options,
     draw: draw,
-    setup: setup,
-    get: get
+    setup: setup
   }
 
 }
@@ -184379,6 +184371,7 @@ module.exports = function ImageSelect(options) {
 module.exports = function ImageThreshold(options) {
 
   options = options || {};
+  options.title = "Threshold image";
   options.threshold = options.threshold || 30;
 
   var image;
@@ -184411,7 +184404,6 @@ module.exports = function ImageThreshold(options) {
   }
 
   return {
-    title: "Threshold image",
     options: options,
     draw: draw,
     get: get
@@ -184425,6 +184417,7 @@ module.exports = function ImageThreshold(options) {
 module.exports = function NdviRed(options) {
 
   options = options || {};
+  options.title = "NDVI for red-filtered cameras (blue is infrared)";
 
   //function setup() {} // optional
 
@@ -184440,7 +184433,6 @@ module.exports = function NdviRed(options) {
   }
 
   return {
-    title: "NDVI for red-filtered cameras (blue is infrared)",
     options: options,
     //setup: setup, // optional
     draw: draw
@@ -184517,6 +184509,7 @@ module.exports = function PixelManipulation(image, options) {
 module.exports = function Plot(options) {
 
   options = options || {};
+  options.title = "Plot with colorbar";
   options.colorscale = options.colorscale || 'Jet',//'RdBu';
   options.type = options.type || 'contour'; // or 'heatmap'
 
@@ -184579,7 +184572,6 @@ module.exports = function Plot(options) {
   }
 
   return {
-    title: "Plot with colorbar",
     options: options,
     draw: draw
   }