Make progress bars on UI true (#1112)

* Make progress bars on UI true

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

* update docs

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

* fix typo

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

CONTRIBUTING.md

@@ -280,6 +280,8 @@ module.exports = function ModuleName(options,UI) {
 
 The `progressObj` parameter of `draw()` is not consumed unless a custom progress bar needs to be drawn, for which this default spinner should be stopped with `progressObj.stop()` and image-sequencer is informed about the custom progress bar with `progressObj.overrideFlag = true;` following which this object can be overriden with custom progress object.
 
+The pixelManipulation API can draw progress bars internally using the `pace` npm package. The option is disabled by default but can be enabled by passing `ui: true` in the options for pixelManipulation. The recommended way is to use `ui: options.step.ui`. This will only show the progress if the ui is set to true by the user, while creating the sequencer object.
+
 ### Module example
 
 See existing module `channel` for an example: https://github.com/publiclab/image-sequencer/blob/main/src/modules/Channel/Module.js

index.js

@@ -1,7 +1,7 @@
 #!/usr/bin/env node
 
 require('./src/ImageSequencer');
-sequencer = ImageSequencer({ ui: false });
+sequencer = ImageSequencer({ ui: true });
 var fs = require('fs');
 var program = require('commander');
 var utils = require('./src/CliUtils');

src/modules/AddQR/Module.js

@@ -13,11 +13,11 @@ module.exports = function AddQR(options, UI) {
 
     var step = this;
 
-    return getPixels(input.src, function (err, oldPixels) {
+    return getPixels(input.src, function(err, oldPixels) {
       function changePixel(r, g, b, a) {
         return [r, g, b, a];
       }
-           
+
       function extraManipulation(pixels, generateOutput) {
         if (err) {
           console.log(err);
@@ -31,6 +31,7 @@ module.exports = function AddQR(options, UI) {
 
       return require('../_nomodule/PixelManipulation.js')(input, {
         output: output,
+        ui: options.step.ui,
         changePixel: changePixel,
         extraManipulation: extraManipulation,
         format: input.format,

src/modules/Average/Module.js

@@ -58,6 +58,7 @@ module.exports = function Average(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       extraManipulation: extraManipulation,
       format: input.format,
       image: options.image,

src/modules/Blend/Module.js

@@ -57,6 +57,7 @@ module.exports = function Dynamic(options, UI, util) {
       // run PixelManipulatin on second image's pixels
       return require('../_nomodule/PixelManipulation.js')(input, {
         output: output,
+        ui: options.step.ui,
         changePixel: changePixel,
         format: input.format,
         image: options.image,

src/modules/Blur/Module.js

@@ -29,6 +29,7 @@ module.exports = function Blur(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       extraManipulation: extraManipulation,
       format: input.format,
       image: options.image,

src/modules/Brightness/Module.js

@@ -40,6 +40,7 @@ module.exports = function Brightness(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui, //don't pass this in if you don't want your module to support progress bars
       changePixel: changePixel,
       format: input.format,
       image: options.image,

src/modules/CanvasResize/Module.js

@@ -45,6 +45,7 @@ module.exports = function canvasResize(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       extraManipulation: extraManipulation,
       format: input.format,
       image: options.image,

src/modules/Channel/Module.js

@@ -31,6 +31,7 @@ module.exports = function Channel(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       changePixel: changePixel,
       format: input.format,
       image: options.image,

src/modules/ColorTemperature/Module.js

@@ -63,6 +63,7 @@ module.exports = function ColorTemperature(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       extraManipulation: extraManipulation,
       format: input.format,
       image: options.image,

src/modules/Colormap/Module.js

@@ -24,6 +24,7 @@ module.exports = function Colormap(options, UI) {
     }
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       changePixel: changePixel,
       format: input.format,
       image: options.image,

src/modules/Contrast/Module.js

@@ -29,6 +29,7 @@ module.exports = function Contrast(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       extraManipulation: extraManipulation,
       format: input.format,
       image: options.image,

src/modules/Convolution/Module.js

@@ -27,6 +27,7 @@ module.exports = function Convolution(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       extraManipulation: extraManipulation,
       format: input.format,
       image: options.image,

src/modules/DecodeQr/Module.js

@@ -15,9 +15,9 @@ module.exports = function DoNothing(options, UI) {
 
     var step = this;
 
-    getPixels(input.src, function(err, pixels){
+    getPixels(input.src, function(err, pixels) {
 
-      if(err) throw err;
+      if (err) throw err;
 
       var w = pixels.shape[0];
       var h = pixels.shape[1];
@@ -28,7 +28,7 @@ module.exports = function DoNothing(options, UI) {
       options.step.qrval = (decoded) ? decoded.data : 'undefined';
     });
 
-    function output(image, datauri, mimetype){
+    function output(image, datauri, mimetype) {
       // This output is accessible by Image Sequencer
       step.output = {
         src: datauri,
@@ -37,6 +37,7 @@ module.exports = function DoNothing(options, UI) {
     }
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       format: input.format,
       image: options.image,
       callback: callback

src/modules/Dither/Module.js

@@ -1,8 +1,8 @@
-module.exports = function Dither(options, UI){
+module.exports = function Dither(options, UI) {
   var defaults = require('./../../util/getDefaults.js')(require('./info.json'));
   var output;
 
-  function draw(input, callback, progressObj){
+  function draw(input, callback, progressObj) {
 
     progressObj.stop(true);
     progressObj.overrideFlag = true;
@@ -15,7 +15,7 @@ module.exports = function Dither(options, UI){
       return pixels;
     }
 
-    function output(image,  datauri, mimetype){
+    function output(image, datauri, mimetype) {
       // This output is accessible by Image Sequencer
       step.output = { src: datauri, format: mimetype };
 
@@ -23,6 +23,7 @@ module.exports = function Dither(options, UI){
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       extraManipulation: extraManipulation,
       format: input.format,
       image: options.image,

src/modules/DrawRectangle/Module.js

@@ -1,6 +1,6 @@
 module.exports = function DrawRectangle(options, UI) {
 
-    
+
   var output;
 
   function draw(input, callback, progressObj) {
@@ -27,6 +27,7 @@ module.exports = function DrawRectangle(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       changePixel: changePixel,
       extraManipulation: extraManipulation,
       format: input.format,

src/modules/Dynamic/Module.js

@@ -26,8 +26,8 @@ module.exports = function Dynamic(options, UI) {
 
     channels.forEach(function(channel) {
       if (options.hasOwnProperty(channel)) options[channel + '_function'] = generator(options[channel]);
-      else if (channel === 'alpha')        options['alpha_function'] = function() { return 255; };
-      else                                 options[channel + '_function'] = generator(options.monochrome);
+      else if (channel === 'alpha') options['alpha_function'] = function() { return 255; };
+      else options[channel + '_function'] = generator(options.monochrome);
     });
 
     function changePixel(r, g, b, a) {
@@ -45,7 +45,7 @@ module.exports = function Dynamic(options, UI) {
     }
 
     /* Functions to get the neighbouring pixel by position (x,y) */
-    function getNeighbourPixel(pixels, curX, curY, distX, distY){
+    function getNeighbourPixel(pixels, curX, curY, distX, distY) {
       return [
         pixels.get(curX + distX, curY + distY, 0),
         pixels.get(curX + distX, curY + distY, 1),
@@ -71,7 +71,7 @@ module.exports = function Dynamic(options, UI) {
       }
     }
 
-    function output(image, datauri, mimetype){
+    function output(image, datauri, mimetype) {
 
       // This output is accessible by Image Sequencer
       step.output = { src: datauri, format: mimetype };
@@ -79,6 +79,7 @@ module.exports = function Dynamic(options, UI) {
     }
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       changePixel: changePixel,
       getNeighbourPixel: getNeighbourPixel,
       getNeighborPixel: getNeighbourPixel,

src/modules/EdgeDetect/Module.js

@@ -21,11 +21,11 @@ module.exports = function edgeDetect(options, UI) {
 
     // Blur the image
     const internalSequencer = ImageSequencer({ inBrowser: false, ui: false });
-    return internalSequencer.loadImage(input.src, function () {
-      internalSequencer.importJSON([{ 'name': 'blur', 'options': {blur: options.blur} }]);
+    return internalSequencer.loadImage(input.src, function() {
+      internalSequencer.importJSON([{ 'name': 'blur', 'options': { blur: options.blur } }]);
       return internalSequencer.run(function onCallback(internalOutput) {
-        require('get-pixels')(internalOutput, function(err, blurPixels){
-          if (err){
+        require('get-pixels')(internalOutput, function(err, blurPixels) {
+          if (err) {
             return;
           }
 
@@ -34,16 +34,17 @@ module.exports = function edgeDetect(options, UI) {
             return [(r + g + b) / 3, (r + g + b) / 3, (r + g + b) / 3, a];
           }
 
-          function extraManipulation(){
+          function extraManipulation() {
             return require('./EdgeUtils')(blurPixels, options.highThresholdRatio, options.lowThresholdRatio, options.hysteresis);
           }
 
           function output(image, datauri, mimetype) {
             step.output = { src: datauri, format: mimetype };
           }
-      
+
           return require('../_nomodule/PixelManipulation.js')(input, {
             output: output,
+            ui: options.step.ui,
             changePixel: changePixel,
             extraManipulation: extraManipulation,
             format: input.format,

src/modules/Exposure/Module.js

@@ -2,12 +2,12 @@
 * Changes the Image Exposure
 */
 
-module.exports = function Exposure(options, UI){
+module.exports = function Exposure(options, UI) {
 
   var defaults = require('./../../util/getDefaults.js')(require('./info.json'));
   var output;
 
-  function draw(input, callback, progressObj){
+  function draw(input, callback, progressObj) {
 
     options.exposure = options.exposure || defaults.exposure;
     var exposure = Math.pow(2, options.exposure);
@@ -16,7 +16,7 @@ module.exports = function Exposure(options, UI){
 
     var step = this;
 
-    function changePixel(r, g, b, a){
+    function changePixel(r, g, b, a) {
 
       r = Math.min(255, r * exposure);
       g = Math.min(255, g * exposure);
@@ -24,15 +24,16 @@ module.exports = function Exposure(options, UI){
       return [r, g, b, a];
     }
 
-    function output(image, datauri, mimetype){
+    function output(image, datauri, mimetype) {
 
       // This output is accessible by Image Sequencer
-      step.output = {src:datauri, format:mimetype};
+      step.output = { src: datauri, format: mimetype };
 
     }
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       changePixel: changePixel,
       format: input.format,
       image: options.image,
@@ -43,7 +44,7 @@ module.exports = function Exposure(options, UI){
   }
   return {
     options: options,
-    draw:  draw,
+    draw: draw,
     output: output,
     UI: UI
   };

src/modules/FlipImage/Module.js

@@ -14,12 +14,12 @@ module.exports = function FlipImage(options, UI) {
 
     var step = this;
 
-    return getPixels(input.src, function(err, oldPixels){
+    return getPixels(input.src, function(err, oldPixels) {
       function changePixel(r, g, b, a) {
         return [r, g, b, a];
       }
       function extraManipulation(pixels) {
-        if (err){
+        if (err) {
           console.log(err);
           return;
         }
@@ -28,9 +28,10 @@ module.exports = function FlipImage(options, UI) {
       function output(image, datauri, mimetype) {
         step.output = { src: datauri, format: mimetype };
       }
-      
+
       return require('../_nomodule/PixelManipulation.js')(input, {
         output: output,
+        ui: options.step.ui,
         changePixel: changePixel,
         extraManipulation: extraManipulation,
         format: input.format,

src/modules/GammaCorrection/Module.js

@@ -30,6 +30,7 @@ module.exports = function Gamma(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       changePixel: changePixel,
       format: input.format,
       image: options.image,

src/modules/GridOverlay/Module.js

@@ -1,6 +1,6 @@
 
 module.exports = function GridOverlay(options, UI) {
-  
+
   var output;
 
   function draw(input, callback, progressObj) {
@@ -9,7 +9,7 @@ module.exports = function GridOverlay(options, UI) {
     progressObj.overrideFlag = true;
 
     var step = this;
-    
+
     function extraManipulation(pixels) {
       pixels = require('./GridOverlay')(pixels, options);
       return pixels;
@@ -24,6 +24,7 @@ module.exports = function GridOverlay(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       extraManipulation: extraManipulation,
       format: input.format,
       image: options.image,
@@ -31,7 +32,7 @@ module.exports = function GridOverlay(options, UI) {
       callback: callback
     });
 
-  
+
   }
 
   return {

src/modules/Histogram/Module.js

@@ -74,6 +74,7 @@ module.exports = function Channel(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       changePixel: changePixel,
       extraManipulation: extraManipulation,
       format: input.format,

src/modules/Ndvi/Module.js

@@ -41,6 +41,7 @@ module.exports = function Ndvi(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       changePixel: changePixel,
       format: input.format,
       image: options.image,

src/modules/NoiseReduction/Module.js

@@ -1,28 +1,29 @@
-module.exports = function NoiseReduction(options, UI){
+module.exports = function NoiseReduction(options, UI) {
   var defaults = require('./../../util/getDefaults.js')(require('./info.json'));
   var output;
-  
-  function draw(input,callback,progressObj){
-  
+
+  function draw(input, callback, progressObj) {
+
     progressObj.stop(true);
     progressObj.overrideFlag = true;
-  
+
     var step = this;
     options.method = options.method || defaults.method;
-  
+
     function extraManipulation(pixels) {
       pixels = require('./NoiseReduction.js')(pixels, options.method);
       return pixels;
     }
-  
-    function output(image,  datauri, mimetype){
+
+    function output(image, datauri, mimetype) {
       // This output is accessible by Image Sequencer
       step.output = { src: datauri, format: mimetype };
-  
+
     }
-  
+
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       extraManipulation: extraManipulation,
       format: input.format,
       image: options.image,

src/modules/Overlay/Module.js

@@ -65,6 +65,7 @@ module.exports = function Dynamic(options, UI, util) {
       // run PixelManipulation on first Image pixels
       return require('../_nomodule/PixelManipulation.js')(baseStepOutput, {
         output: output,
+        ui: options.step.ui,
         changePixel: changePixel,
         format: baseStepOutput.format,
         image: baseStepImage,

src/modules/PaintBucket/Module.js

@@ -23,6 +23,7 @@ module.exports = function PaintBucket(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       extraManipulation: extraManipulation,
       format: input.format,
       image: options.image,

src/modules/ReplaceColor/Module.js

@@ -27,6 +27,7 @@ module.exports = function ReplaceColor(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       changePixel: changePixel,
       extraManipulation: extraManipulation,
       format: input.format,

src/modules/Resize/Module.js

@@ -31,7 +31,7 @@ module.exports = function Resize(options, UI) {
       new_width = Math.round(pixels.shape[0] * (resize_value / 100));
       new_height = Math.round(pixels.shape[1] * (resize_value / 100));
 
-      var bitmap = new imagejs.Bitmap({width: pixels.shape[0], height: pixels.shape[1]});
+      var bitmap = new imagejs.Bitmap({ width: pixels.shape[0], height: pixels.shape[1] });
       bitmap._data.data = pixels.data;
 
 
@@ -54,6 +54,7 @@ module.exports = function Resize(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       changePixel: changePixel,
       extraManipulation: extraManipulation,
       format: input.format,

src/modules/Rotate/Module.js

@@ -24,17 +24,17 @@ module.exports = function Rotate(options, UI) {
     function extraManipulation(pixels) {
       var rotate_value = (options.rotate) % 360;
 
-      if(rotate_value % 360 == 0)
+      if (rotate_value % 360 == 0)
         return pixels;
 
-      var bitmap = new imagejs.Bitmap({width: pixels.shape[0], height: pixels.shape[1]});
+      var bitmap = new imagejs.Bitmap({ width: pixels.shape[0], height: pixels.shape[1] });
       bitmap._data.data = pixels.data;
 
       var rotated = bitmap.rotate({
         degrees: rotate_value,
       });
       pixels.data = rotated._data.data;
-            
+
       return pixels;
     }
 
@@ -45,6 +45,7 @@ module.exports = function Rotate(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       changePixel: changePixel,
       extraManipulation: extraManipulation,
       format: input.format,

src/modules/Saturation/Module.js

@@ -2,7 +2,7 @@
  * Saturate an image with a value from 0 to 1
  */
 module.exports = function Saturation(options, UI) {
-  
+
   var defaults = require('./../../util/getDefaults.js')(require('./info.json'));
   var output;
 
@@ -40,6 +40,7 @@ module.exports = function Saturation(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       changePixel: changePixel,
       format: input.format,
       image: options.image,

src/modules/TextOverlay/Module.js

@@ -1,19 +1,19 @@
 
 module.exports = function TextOverlay(options, UI) {
-  
+
   var output;
-   
+
   function draw(input, callback, progressObj) {
-   
+
     progressObj.stop(true);
     progressObj.overrideFlag = true;
-   
+
     var step = this;
     if (!options.step.inBrowser) { // This module is only for browser
       this.output = input;
       callback();
     }
-    else{
+    else {
       var priorStep = this.getStep(-1); // get the previous step to add text onto it.
 
       function extraManipulation(pixels) {
@@ -23,24 +23,25 @@ module.exports = function TextOverlay(options, UI) {
       }
 
       function output(image, datauri, mimetype) {
-   
+
         // This output is accesible by Image Sequencer
         step.output = { src: datauri, format: mimetype };
-   
+
       }
-   
+
       return require('../_nomodule/PixelManipulation.js')(input, {
         output: output,
+        ui: options.step.ui,
         extraManipulation: extraManipulation,
         format: input.format,
         image: options.image,
         inBrowser: options.inBrowser,
         callback: callback
       });
-   
+
     }
   }
-   
+
   return {
     options: options,
     draw: draw,
@@ -48,4 +49,3 @@ module.exports = function TextOverlay(options, UI) {
     UI: UI
   };
 };
-   

src/modules/Threshold/Module.js

@@ -28,6 +28,7 @@ module.exports = function ImageThreshold(options, UI) {
     }
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       changePixel: changePixel,
       extraManipulation: extraManipulation,
       format: input.format,

src/modules/Tint/Module.js

@@ -32,6 +32,7 @@ module.exports = function Tint(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       changePixel: changePixel,
       format: input.format,
       image: options.image,

src/modules/WhiteBalance/Module.js

@@ -40,6 +40,7 @@ module.exports = function Balance(options, UI) {
 
     return require('../_nomodule/PixelManipulation.js')(input, {
       output: output,
+      ui: options.step.ui,
       extraManipulation: extraManipulation,
       format: input.format,
       image: options.image,

src/modules/_nomodule/PixelManipulation.js

@@ -32,7 +32,7 @@ module.exports = function PixelManipulation(image, options) {
     // TODO: this could possibly be more efficient; see
     // https://github.com/p-v-o-s/infragram-js/blob/master/public/infragram.js#L173-L181
 
-    if (!options.inBrowser && !process.env.TEST) {
+    if (!options.inBrowser && !process.env.TEST && options.ui) {
       try {
         var pace = require('pace')(pixels.shape[0] * pixels.shape[1]);
       } catch (e) {
@@ -63,7 +63,7 @@ module.exports = function PixelManipulation(image, options) {
           pixels.set(x, y, 2, pixel[2]);
           pixels.set(x, y, 3, pixel[3]);
 
-          if (!options.inBrowser && !process.env.TEST) pace.op();
+          if (!options.inBrowser && !process.env.TEST && options.ui) pace.op();
         }
       }
     }