Merge branch 'audit' of https://github.com/publiclab/image-sequencer into audit

.github/CODEOWNERS

@@ -44,7 +44,6 @@
 /*.lock @ubliclab/is-maintainers
 /Gruntfile.js @publiclab/is-maintainers
 /.github/ @publiclab/is-maintainers
-/scripts/ @publiclab/is-maintainers
 # <-- /COMMON TO ALL MAINTAINERS -->
 
 # <-- SPECIFIC MAINTAINERS -->

.github/ISSUE_TEMPLATE.md

@@ -1,10 +1,3 @@
----
-name: Bug report 🐞
-about: Help us identify and fix a bug!
-title: ''
-labels: bug
----
-
 ### Please describe the problem (or idea)
 
 > What happened just before the problem occurred? Or what problem could this idea solve?
@@ -17,13 +10,13 @@ labels: bug
 
 ### Please show us where to look
 
-Paste in a full URL, starting with:
+https://beta.sequencer.publiclab.org
 
-> https://beta.sequencer.publiclab.org/
 
-If you can share a screenshot or a GIF that is EXTRA helpful! 💖
+### What's your PublicLab.org username?
+
+> This can help us diagnose the issue:
 
-If you can see a version number in the upper right, please note that!
 
 
 ### Browser, version, and operating system

.github/ISSUE_TEMPLATE/enhancement template.md

@@ -1,25 +0,0 @@
-# New Enhancement Request
-
-Describe your enhancement
-
-
-
-
-
-
- What does your enhancement do?
-
- Upload Screenshot of your enhancement
- 
- ### Please show us where to look
- Paste in a full URL, starting with:
- ### Problem it can solve
- 
-   what problem could this enhancement solve?
-   
-   Your help makes Public Lab better! We *deeply* appreciate your helping refine and improve this site.
-
-To learn how to write really great issues, which increases the chances they'll be resolved, see:
-
-https://publiclab.org/wiki/developers#Contributing+for+non-coders
-### Thank you :)

.github/ISSUE_TEMPLATE/feature request.md

@@ -1,22 +0,0 @@
-# New Feature Request
-
-Describe your feature
-
-
-
-
-
-
- What does your feature do?
-
- Upload Screenshot of your implementation/feature
- 
- ### Please show us where to look
- Paste in a full URL, starting with:
- ### Problem it can solve
- Your help makes Public Lab better! We *deeply* appreciate your helping refine and improve this site.
-
-To learn how to write really great issues, which increases the chances they'll be resolved, see:
-
-https://publiclab.org/wiki/developers#Contributing+for+non-coders
-### Thank you :)

.github/ISSUE_TEMPLATE/release_workflow.md

@@ -1,51 +0,0 @@
----
-name: New release checklist ✅
-about: Coordinate steps to publish a new release
-title: 'Checklist and coordination for v0.0.0 major/minor/patch release'
-labels: release
-assignees: '@publiclab/is-maintainers'
----
-
-This template guides us through the steps of creating a new release, based on conversation and testing in [#1692](https://github.com/publiclab/image-sequencer/issues/1692).
-
-Discuss with @publiclab/is-maintainers if anything is ambiguous!
-
-<!-- NOTE: Change v0.0.0 to the appropriate release version -->
-
-* [x] open an issue using the "release" template with this checklist with title `Checklist and coordination for v0.0.0 major/minor/patch release` (see [semantic versioning](https://docs.npmjs.com/about-semantic-versioning/))
-* [ ] create a release [project](https://github.com/publiclab/image-sequencer/projects) from [this template](https://github.com/publiclab/image-sequencer/projects/5). You can copy a project from its menu.
-* [ ] compile release notes below from corresponding [release project](https://github.com/publiclab/image-sequencer/projects).
-* [ ] open a pull request with updated version numbers
-    * [ ] update version number in `examples/sw.js` (ex #1734) and `package.json` (ex #1695)
-    * [ ] update version number in `package.json`
-    * [ ] run `npm install` to update `package-lock.json` (from recent node version - 16 at time of writing, in GitPod should work)
-* [ ] finalize and merge to `main` branch (freeze merges to `main` branch until next step)
-
-Now, move to `stable` branch:
-
-* [ ] force push from `main` to `stable`
-* [ ] then in `stable` branch, compile `/dist/` files with `grunt build`
-* [ ] add `/dist/` files with `git add -f /dist/*` and commit them to `stable` branch
-* [ ] run `npm publish`
-
-Draft a release:
-
-* [ ] [create a release on GitHub](https://github.com/publiclab/image-sequencer/releases) and use features description + release notes from below
-* [ ] tag version number branch (i.e. `v0.0.0`) based on `stable` or choose `stable`
-* [ ] publish tagged branch to `npm` with `npm publish` (logging in first as necessary)
-* [ ] publish to live Github pages [demo](https://sequencer.publiclab.org) (with [bash script](https://github.com/publiclab/image-sequencer/pull/1703) from `/scripts/update-demo`) (from within GitPod works well)
-* [ ] move anything necessary to next release project, i.e. <!-- Update this link -->https://github.com/publiclab/image-sequencer/projects/[insert project number]
-* [ ] close this issue!
-
-Noting we're now in this process in https://github.com/publiclab/image-sequencer/issues/1751 for `v3.7.0`.
-
-****
-
-### Release notes
-Compile and edit release notes below, to be copied into the release description.
-
-#### Added
-
-#### Fixed
-
-#### Changed

.github/PULL_REQUEST_TEMPLATE.md

@@ -6,7 +6,6 @@ Make sure these boxes are checked before your pull request (PR) is ready to be r
 * [ ] code is in uniquely-named feature branch and has no merge conflicts
 * [ ] PR is descriptively titled
 * [ ] ask `@publiclab/is-reviewers` for help, in a comment below
-* [ ] at least 2 reviews required for getting pull request merged
 * [ ] Insert-step functionality is working correct as expected.
 > We're happy to help you get this ready -- don't be afraid to ask for help, and **don't be discouraged** if your tests fail at first!
 

.github/dependabot.yml

@@ -1,25 +0,0 @@
-version: 2
-updates:
-- package-ecosystem: npm
-  directory: "/"
-  schedule:
-    interval: daily
-  open-pull-requests-limit: 10
-  ignore:
-  - dependency-name: jest-puppeteer
-    versions:
-    - 5.0.1
-    - 5.0.2
-  - dependency-name: geotiff
-    versions:
-    - 1.0.2
-  - dependency-name: "@babel/core"
-    versions:
-    - 7.13.13
-  - dependency-name: puppeteer
-    versions:
-    - 5.2.1
-    - 7.1.0
-  - dependency-name: tape
-    versions:
-    - 5.1.1

.github/workflows/rebase.yml

@@ -1,21 +0,0 @@
-name: Automatic Rebase
-# https://github.com/marketplace/actions/automatic-rebase
-
-on:
-  issue_comment:
-    types: [created]
-jobs:
-  rebase:
-    name: Rebase
-    if: github.event.issue.pull_request != '' && contains(github.event.comment.body, '/rebase')
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout the latest code
-        uses: actions/checkout@v2
-        with:
-          token: ${{ secrets.GITHUB_TOKEN }}
-          fetch-depth: 0 # otherwise, you will fail to push refs to dest repo
-      - name: Automatic Rebase
-        uses: cirrus-actions/rebase@1.4
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/tests.yml

@@ -1,209 +0,0 @@
-name: tests
-on: [pull_request]
-jobs:
-  base-tests:
-    runs-on: ubuntu-18.04
-    steps:
-    - uses: actions/checkout@v2
-    - name: Setup node
-      uses: actions/setup-node@v2
-      with:
-        node-version: '12'
-        check-latest: true
-    - name: Cache node modules
-      uses: actions/cache@v2
-      env:
-        cache-name: cache-node-modules
-      with:
-        path: ~/.npm
-        key: ${{ runner.os }}-build-${{ env.cache-name }}-${{ hashFiles('**/package-lock.json') }}
-        restore-keys: |
-          ${{ runner.os }}-build-${{ env.cache-name }}-
-          ${{ runner.os }}-build-
-          ${{ runner.os }}-
-    - name: Install Dependencies
-      run: npm install
-    - name: "Base istanbul/tape node tests"
-      run: npm test
-
-  benchmark-tests:
-    runs-on: ubuntu-18.04
-    steps:
-    - uses: actions/checkout@v2
-    - name: Setup node
-      uses: actions/setup-node@v2
-      with:
-        node-version: '12'
-        check-latest: true
-    - name: Cache node modules
-      uses: actions/cache@v2
-      env:
-        cache-name: cache-node-modules
-      with:
-        path: ~/.npm
-        key: ${{ runner.os }}-build-${{ env.cache-name }}-${{ hashFiles('**/package-lock.json') }}
-        restore-keys: |
-          ${{ runner.os }}-build-${{ env.cache-name }}-
-          ${{ runner.os }}-build-
-          ${{ runner.os }}-
-    - name: Install Dependencies
-      run: npm install
-    - name: "Benchmark tests"
-      run: npm run benchmark
-
-  gif-tests:
-    runs-on: ubuntu-18.04
-    steps:
-    - uses: actions/checkout@v2
-    - name: Setup node
-      uses: actions/setup-node@v2
-      with:
-        node-version: '12'
-        check-latest: true
-    - name: Cache node modules
-      uses: actions/cache@v2
-      env:
-        cache-name: cache-node-modules
-      with:
-        path: ~/.npm
-        key: ${{ runner.os }}-build-${{ env.cache-name }}-${{ hashFiles('**/package-lock.json') }}
-        restore-keys: |
-          ${{ runner.os }}-build-${{ env.cache-name }}-
-          ${{ runner.os }}-build-
-          ${{ runner.os }}-
-    - name: Install Dependencies
-      run: npm install
-    - name: "Gif tests"
-      run: npm run gif-test
-
-  browserify-core-tests:
-    runs-on: ubuntu-18.04
-    steps:
-    - uses: actions/checkout@v2
-    - name: Setup node
-      uses: actions/setup-node@v2
-      with:
-        node-version: '12'
-        check-latest: true
-    - name: Cache node modules
-      uses: actions/cache@v2
-      env:
-        cache-name: cache-node-modules
-      with:
-        path: ~/.npm
-        key: ${{ runner.os }}-build-${{ env.cache-name }}-${{ hashFiles('**/package-lock.json') }}
-        restore-keys: |
-          ${{ runner.os }}-build-${{ env.cache-name }}-
-          ${{ runner.os }}-build-
-          ${{ runner.os }}-
-    - name: Install Dependencies
-      run: npm install
-    - run: sudo apt-get install xvfb
-    - name: "Browserify core tests and run"
-      run: grunt tests && xvfb-run --auto-servernum npm run core-tests
-
-  jsmine-ui-tests:
-    runs-on: ubuntu-18.04
-    steps:
-    - uses: actions/checkout@v2
-    - name: Setup node
-      uses: actions/setup-node@v2
-      with:
-        node-version: '12'
-        check-latest: true
-    - name: Cache node modules
-      uses: actions/cache@v2
-      env:
-        cache-name: cache-node-modules
-      with:
-        path: ~/.npm
-        key: ${{ runner.os }}-build-${{ env.cache-name }}-${{ hashFiles('**/package-lock.json') }}
-        restore-keys: |
-          ${{ runner.os }}-build-${{ env.cache-name }}-
-          ${{ runner.os }}-build-
-          ${{ runner.os }}-
-    - name: Install Dependencies
-      run: npm install
-    - name: "Jasmine UI tests (mocked browser env)"
-      run: npm run test-ui
-
-  jest-ui-tests:
-    runs-on: ubuntu-18.04
-    steps:
-    - uses: actions/checkout@v2
-    - name: Setup node
-      uses: actions/setup-node@v2
-      with:
-        node-version: '12'
-        check-latest: true
-    - name: Cache node modules
-      uses: actions/cache@v2
-      env:
-        cache-name: cache-node-modules
-      with:
-        path: ~/.npm
-        key: ${{ runner.os }}-build-${{ env.cache-name }}-${{ hashFiles('**/package-lock.json') }}
-        restore-keys: |
-          ${{ runner.os }}-build-${{ env.cache-name }}-
-          ${{ runner.os }}-build-
-          ${{ runner.os }}-
-    - name: Install Dependencies
-      run: npm install
-    - name: "jest-puppeteer UI tests (full browser env)"
-      run: npm run test-ui-2    
-
-  cli-tests:
-    runs-on: ubuntu-18.04
-    steps:
-    - uses: actions/checkout@v2
-    - name: Setup node
-      uses: actions/setup-node@v2
-      with:
-        node-version: '12'
-        check-latest: true
-    - name: Cache node modules
-      uses: actions/cache@v2
-      env:
-        cache-name: cache-node-modules
-      with:
-        path: ~/.npm
-        key: ${{ runner.os }}-build-${{ env.cache-name }}-${{ hashFiles('**/package-lock.json') }}
-        restore-keys: |
-          ${{ runner.os }}-build-${{ env.cache-name }}-
-          ${{ runner.os }}-build-
-          ${{ runner.os }}-
-    - name: Install Dependencies
-      run: npm install
-    - name: "CLI tests"
-      run: npm run test-cli
-
-  grunt-build-test:
-    runs-on: ubuntu-18.04
-    steps:
-    - uses: actions/checkout@v2
-    - name: Setup node
-      uses: actions/setup-node@v2
-      with:
-        node-version: '12'
-        check-latest: true
-    - name: Cache node modules
-      uses: actions/cache@v2
-      env:
-        cache-name: cache-node-modules
-      with:
-        path: ~/.npm
-        key: ${{ runner.os }}-build-${{ env.cache-name }}-${{ hashFiles('**/package-lock.json') }}
-        restore-keys: |
-          ${{ runner.os }}-build-${{ env.cache-name }}-
-          ${{ runner.os }}-build-
-          ${{ runner.os }}-
-    - name: Install Dependencies
-      run: npm install
-    - name: "Grunt build test of dev environment"
-      run: grunt build
-
-## Cache NPM folder
-# cache:
-#   directories:
-#     - ~/.npm
-#     - ~/.cache

.gitpod.dockerfile

@@ -3,66 +3,5 @@ FROM gitpod/workspace-full
 USER root
 RUN sudo apt-get update && apt-get install -y apt-transport-https \
  && sudo apt-get install -y \
-    xserver-xorg-dev \
-    libxext-dev \
-    build-essential \
-    libxi-dev \
-    libglew-dev \
-    pkg-config \
-    libglu1-mesa-dev \
-    freeglut3-dev \
-    mesa-common-dev \
-    x11-apps \
-    libice6 \
-    libsm6 \
-    libxaw7 \
-    libxft2 \
-    libxmu6 \
-    libxpm4 \
-    libxt6 \
-    x11-apps \
-    xbitmaps \
-    ca-certificates \
-    fonts-liberation \
-    libappindicator3-1 \
-    libasound2 \
-    libatk-bridge2.0-0 \
-    libatk1.0-0 \
-    libc6 \
-    libcairo2 \
-    libcairo2-dev \
-    libcups2 \
-    libdbus-1-3 \
-    libexpat1 \
-    libfontconfig1 \
-    libgbm1 \
-    libgcc1 \
-    libgif-dev \
-    libglib2.0-0 \
-    libgtk-3-0 \
-    libjpeg-dev \
-    libnspr4 \
-    libnss3 \
-    libpango-1.0-0 \
-    libpango1.0-dev \
-    libpangocairo-1.0-0 \
-    libstdc++6 \
-    librsvg2-dev \
-    libx11-6 \
-    libx11-xcb1 \
-    libxcb1 \
-    libxcomposite1 \
-    libxcursor1 \
-    libxdamage1 \
-    libxext6 \
-    libxfixes3 \
-    libxi6 \
-    libxrandr2 \
-    libxrender1 \
-    libxss1 \
-    libxtst6 \
-    lsb-release \
-    wget \
-    xdg-utils \
-    xvfb \
+    xserver-xorg-dev libxext-dev libxi-dev build-essential libxi-dev libglu1-mesa-dev libglew-dev pkg-config libglu1-mesa-dev freeglut3-dev mesa-common-dev \
  && apt-get clean && rm -rf /var/lib/apt/lists/* /tmp/*

.travis.yml

@@ -24,8 +24,6 @@ jobs:
       script: npm run test-ui
     - name: "jest-puppeteer UI tests (full browser env)"
       script: npm run test-ui-2
-    - name: "CLI tests"
-      script: npm run test-cli
     - name: "Grunt build test of dev environment"
       script: grunt build
 after_success:

CONTRIBUTING.md

@@ -17,7 +17,6 @@ Most contribution (we imagine) would be in the form of API-compatible modules, w
 * [Ideas](#Contribution-ideas)
 * [Grunt Tasks](#grunt-tasks)
 * [UI Helper Methods](#ui-helper-methods)
-* [Scripts](#scripts)
 
 ****
 
@@ -459,23 +458,3 @@ The following code can be used
 $step('query').show().hide();
 $stepAll('q2').show().hide();
 ```
-
-## Scripts
-The following shell scripts are present in the `scripts/` directory.
-
-- `update-gh-pages`: This script can be used to update the `gh-pages` branch of this repo or a fork.
- This script is not meant to be used directly as it runs in the current working directory.
- If you run it on your primary local clone, it can **delete** the local changes. This script is made to be used in a github action
- or in a temporary directory via another script, such as `update-demo`.
-
-  Arguments:
-  1. Repo(to use as upstream) url in the form username/repo (default: publiclab/image-sequencer) NOTE: Github only
-  2. Branch to pull from eg: main or stable (default: stable)
-  3. CNAME URL (default: none)
-  4. Set the fourth argument to anything to bypass the warning. You will have to set this argument if you want to run this script in another script without needing
-  user interaction, such as in a github action.
-
-- `update-demo`: A safe, interactive script that can be used to update the `gh-pages` branch of any image-sequencer fork.
- This script is safe to use directly because it separately clones the repo in a temporary directory.
-
-  Arguments: None since it is a an *interactive* script, ie it asks the user for input.

docs/MODULES.md

@@ -41,12 +41,11 @@ List of Module Documentations
 36. [Rotate](#rotate-module)
 37. [Saturation](#saturation-module)
 38. [Segmented-Colormap](#segmented-colormap-module)
-39. [Sharpen](#sharpening-module)
-40. [Text-Overlay](#text-overlay)
-41. [Threshold](#threshold)
-42. [Tint](#tint)
-43. [WebGL-Distort](#webgl-distort-module)
-44. [White-Balance](#white-balance-module)
+39. [Text-Overlay](#text-overlay)
+40. [Threshold](#threshold)
+41. [Tint](#tint)
+42. [WebGL-Distort](#webgl-distort-module)
+43. [White-Balance](#white-balance-module)
 
 
 ## add-qr-module
@@ -668,20 +667,6 @@ where `options` is an object with the property `colormap`. `options.colormap` ca
 * A custom array.
 
 
-## sharpen-module
-
-This module is used to sharpen the pixels of the image using a 3x3 convolution filter.
-#### Usage
-
-```js
-  sequencer.loadImage('PATH')
-           .addSteps('sharpen',options)
-           .run()
-```
-
-where `options` is an object with the property `sharpenStrength`, which can be set to achieve the desired level of sharpening on the image.
-
-
 ## Text Overlay
 
 The modules allows to add text to image in both browser and node environment. We have the options to modify the font-size and also support few font-styles. The text color can also be modified.

examples/demo.css

@@ -1,8 +1,12 @@
 /* https://github.com/theleagueof/league-spartan */
 @font-face {
   font-family: 'League Spartan';
-  src: url('https://cdn.jsdelivr.net/npm/fontsource-league-spartan@3/files/league-spartan-latin-600-normal.woff2') format('woff2'),
-       url('https://cdn.jsdelivr.net/npm/fontsource-league-spartan@3/files/league-spartan-latin-600-normal.woff') format('woff');
+  src: url('https://raw.githubusercontent.com/theleagueof/league-spartan/master/_webfonts/leaguespartan-bold.eot');
+  src: url('https://raw.githubusercontent.com/theleagueof/league-spartan/master/_webfonts/leaguespartan-bold.eot?#iefix') format('embedded-opentype'),
+       url('https://raw.githubusercontent.com/theleagueof/league-spartan/master/_webfonts/leaguespartan-bold.woff2') format('woff2'),
+       url('https://raw.githubusercontent.com/theleagueof/league-spartan/master/_webfonts/leaguespartan-bold.woff') format('woff'),
+       url('https://raw.githubusercontent.com/theleagueof/league-spartan/master/_webfonts/leaguespartan-bold.ttf') format('truetype'),
+       url('https://raw.githubusercontent.com/theleagueof/league-spartan/master/_webfonts/leaguespartan-bold.svg#league_spartanbold') format('svg');
   font-weight: bold;
   font-style: normal;
 }
@@ -78,8 +82,7 @@ body > .container-fluid {
 }
 
 .hover {
-  border: 4px dashed #888888;
-  background: #F0F0F0;
+  background: #eee;
 }
 
 .step {
@@ -172,8 +175,8 @@ body > .container-fluid {
 
 #move-up {
   position: fixed;
-  bottom: 30px;
-  right: 20px;
+  bottom: 50px;
+  right: 40px;
   z-index: 550;
   display: none;
   background:transparent;
@@ -181,17 +184,11 @@ body > .container-fluid {
 }
 
 #move-up i {
-  font-size:50px;
+  font-size:60px;
   opacity:0.7;
   color:#BABABA;
 }
 
-@media (max-width: 768px), (max-height 700px) {
-  #move-up {
-    display: none !important; /* !important is used to override the jQuery style */
-  }
-}
-
 .btn-circle{
   min-width: 80px;
   min-height: 80px;
@@ -340,47 +337,21 @@ a.name-header{
   display: block;
 }
 
-#update-prompt-modal,.notify-box {
+#update-prompt-modal {
  visibility: hidden;
  min-width: 250px;
  margin-left: -125px;
  background-color: #333;
  color: #fff;
  text-align: center;
- border-radius: 8px;
+ border-radius: 2px;
  padding: 16px;
  position: fixed;
  z-index: 1000;
  left: 10%;
  top: 30px;
 }
-
-#update-prompt-modal {
-  width: 30vw;
-  margin: 0.2rem;
-}
-
-.notify-box {
-  width:34vw;
-  padding:18px;
-  border-radius:8px;
-  margin-left:0.8rem;
-  text-align:left;
-  color:#333;
-  background:#c3c3c3;
-}
-
-/* Bootstrap class for display none remove it after updating to version v4 */
-.d-none {
-  display:none;
-}
-
-/* Bootstrap class for display block remove it after updating to version v4 */
-.d-block {
-  display:block;
-}
-
-#update-prompt-modal.show,.notify-box {
+#update-prompt-modal.show {
  visibility: visible;
  -webkit-animation: fadein 0.5s;
  animation: fadein 0.5s;

examples/index.html

@@ -58,15 +58,6 @@
 
   <div id="update-prompt-modal">A new version of image sequencer is available. Click <a href="#" id="reload">here</a> to update.</div>
 
-  <div class="notify-box d-none">
-    <strong>Failed To Load Image</strong>
-    <button type="button" class="ml-2 mb-1 close" id="close-popup"><span>&times;</span></button>
-    <div class="notify-msg">
-      Can not Load Image Due to CORS Error Learn more about this 
-      <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS/Errors" target="_blank">here</a>
-    </div>
-  </div>
-
   <div class="container-fluid">
 
     <header class="text-center">
@@ -75,7 +66,7 @@
         A pure JavaScript sequential image processing system, inspired by storyboards. Instead of modifying the original
         image, it
         creates a new image at each step in a sequence.
-        <a href="https://publiclab.org/image-sequencer">Learn more</a>
+        <a href="https://github.com/publiclab/image-sequencer/blob/main/README.md">Learn more</a>
       </p>
       <p>
         Open Source
@@ -241,7 +232,7 @@
         </div>
       </div>
       <div class="row">
-        <p id="version-number-text">Loading Version Number</p>
+        <p id="version-number-text">Unable to load version number</p>
       </div>
     </footer>
 

examples/lib/cache.js

@@ -19,17 +19,9 @@ var setupCache = function() {
     // Register the service worker.
     navigator.serviceWorker.register('sw.js', { scope: '/examples/' })
       .then(function(registration) {
-
-          return new Promise(function(resolve,reject){
-
         registration.addEventListener('updatefound', () => {
           // When sw.js has been changed, get a reference to the new service worker.
           newWorker = registration.installing;
-
-              if(!newWorker){
-                return reject(new Error('error in installing service worker'));
-              }
-
           newWorker.addEventListener('statechange', () => {
             // Check if service worker state has changed.
             switch(newWorker.state) {
@@ -37,24 +29,24 @@ var setupCache = function() {
                 if(navigator.serviceWorker.controller) {
                   // New service worker available; prompt the user to update.
                   showUpdateModal();
-                    $('#reload').on('click',(e) => {
-                      e.preventDefault();
-                      console.log('New Service Worker Installed Successfully');
-                      location.reload();
-                      return resolve();
-                    })
                 }
                 // No updates available; do nothing.
                 break;
-
-                case 'redundant':
-                  return reject(new Error('installing new service worker now became redundant'));
             }
+          });
+        });
+
+        const installingWorker = registration.installing;
+        installingWorker.onstatechange = () => {
+          console.log(installingWorker);
+          if (installingWorker.state === 'installed') {
+            location.reload();
+          }
+        };
+        console.log('Registration successful, scope is:', registration.scope);
       })
-          })
-        })
-      }).catch(err => {
-        console.log('Failed In Registering Service Worker: ',err);
+      .catch(function(error) {
+        console.log('Service worker registration failed, error:', error);
       });
 
       /**
@@ -77,22 +69,21 @@ var setupCache = function() {
     });
   }
 
-  const clearCache = () => {
+  $('#clear-cache').click(function() {
     if ('serviceWorker' in navigator) {
-      return caches.keys()
-        .then(function(cache) {
-          return Promise.all(cache.map(function(cacheItem) {
-            return caches.delete(cacheItem);
-        }));
+      caches.keys().then(function(cacheNames) {
+        cacheNames.forEach(function(cacheName) {
+          caches.delete(cacheName);
+        });
       });
     }
-  }
-
-  $('#clear-cache').click(function() {
-    clearCache();
     location.reload();
   });
 
+
+
+
+
 };
 
 module.exports = setupCache;

examples/lib/defaultHtmlSequencerUi.js

@@ -17,6 +17,7 @@ function DefaultHtmlSequencerUi(_sequencer, options) {
   // look up needed steps from Url Hash:
   function importStepsFromUrlHash() {
     var hash = urlHash.getUrlHashParameter('steps');
+
     if (hash) {
       _sequencer.importString(hash);
       _sequencer.run({ index: 0 });
@@ -26,7 +27,8 @@ function DefaultHtmlSequencerUi(_sequencer, options) {
 
   function selectNewStepUi() {
     var m = $(addStepSel + ' select').val();
-    if(m) $(addStepSel + ' .info').html(_sequencer.modulesInfo(m).description);
+    if(!m) m = arguments[0];
+    else $(addStepSel + ' .info').html(_sequencer.modulesInfo(m).description);
     $(addStepSel + ' #add-step-btn').prop('disabled', false);
   }
 
@@ -45,12 +47,7 @@ function DefaultHtmlSequencerUi(_sequencer, options) {
   }
 
   function addStepUi() {
-    
-    if ($(addStepSel + ' select').val() == ''){
-      alert('Please Select a Step to Proceed');
-      return;
-    }
-
+    if ($(addStepSel + ' select').val() == 'none') return;
     var newStepName;
     if(typeof arguments[0] !== 'string')
       newStepName = $(addStepSel + ' select option').html().toLowerCase().split(' ').join('-');

examples/lib/defaultHtmlStepUi.js

@@ -25,9 +25,6 @@ function DefaultHtmlStepUi(_sequencer, options) {
     if (step.options && step.options.description)
       step.description = step.options.description;
 
-    let stepDocsLink = '';
-    if (step.moduleInfo) stepDocsLink = step.moduleInfo['docs-link'] || '';
-
     step.ui = // Basic UI markup for the step
       '\
       <div class="container-fluid step-container">\
@@ -51,7 +48,7 @@ function DefaultHtmlStepUi(_sequencer, options) {
               <div class="row step">\
                 <div class="col-md-4 details container-fluid">\
                   <div class="cal collapse in"><p>' +
-                    '<a href="' + stepDocsLink + '">' + (step.description || '') + '</a>' +
+                    '<a href="https://github.com/publiclab/image-sequencer/blob/main/docs/MODULES.md#' + step.name + '-module">' + (step.description || '') + '</a>' +
                  '</p></div>\
                 </div>\
                 <div class="col-md-8 cal collapse in step-column">\
@@ -121,14 +118,7 @@ function DefaultHtmlStepUi(_sequencer, options) {
               paramVal + '">' + '<span class="input-group-addon"><i></i></span>' +
               '</div>';
           }
-          else if(inputDesc.type === 'button'){
-            html = '<div><button name="' + paramName + '" type="' + inputDesc.type + '" >\
-            <i class="fa fa-crosshairs"></i></button>\
-            <span>click to select coordinates</span>\
-            </div>';
-          }
-          else { // Non color-picker input types and other than a button
-
+          else { // Non color-picker input types
             html =
               '<input class="form-control target" type="' +
               inputDesc.type +
@@ -146,7 +136,7 @@ function DefaultHtmlStepUi(_sequencer, options) {
                 '"max="' +
                 inputDesc.max +
                 '"step="' +
-                inputDesc.step + '">' + '<span>' + paramVal + '</span>';
+                (inputDesc.step ? inputDesc.step : 1) + '">' + '<span>' + paramVal + '</span>';
 
             }
             else html += '">';
@@ -339,23 +329,11 @@ function DefaultHtmlStepUi(_sequencer, options) {
 
     $stepAll('.download-btn').on('click', () => {
 
-      function dataURLtoBlob(dataurl) {
-        let arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
-          bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
-        while(n--){
-          u8arr[n] = bstr.charCodeAt(n);
-        }
-        return new Blob([u8arr], {type:mime});
-      }
-      
       var element = document.createElement('a');
-      
+      element.setAttribute('href', step.output);
       element.setAttribute('download', step.name + '.' + fileExtension(step.imgElement.src));
       element.style.display = 'none';
       document.body.appendChild(element);
-      var blob = dataURLtoBlob(step.output);
-      var objurl = URL.createObjectURL(blob);
-      element.setAttribute('href', objurl);
 
       element.click();
     });
@@ -421,19 +399,6 @@ function DefaultHtmlStepUi(_sequencer, options) {
 
     var img = $(step.imgElement);
 
-    let customXCoord = '20'; //default x coordinate
-    let customYCoord = '20'; //default y coordinate
-
-    const customButton = $('button[name="Custom-Coordinates"]');
-      img.click(function(e) {
-          customXCoord = e.offsetX;
-          customYCoord = e.offsetY;
-          customButton.click(function() {
-            $('input[name="x"]').val(customXCoord);
-            $('input[name="y"]').val(customYCoord);
-          })
-      });
-
     img.mousemove(function(e) {
       var canvas = document.createElement('canvas');
       canvas.width = img.width();

examples/lib/mapHtmltypes.js

@@ -7,7 +7,6 @@ function mapHtmlTypes(inputInfo){
   switch(inputInfo.type.toLowerCase()){
   case 'integer':
     htmlType = inputInfo.min != undefined ? 'range' : 'number';
-    if (htmlType === 'range') inputInfo.step = inputInfo.step || 1; // default range step size for integer
     break;
   case 'string':
     htmlType = 'text';
@@ -20,10 +19,6 @@ function mapHtmlTypes(inputInfo){
     break;
   case 'float':
     htmlType = inputInfo.min != undefined ? 'range' : 'text';
-    if (htmlType === 'range') inputInfo.step = inputInfo.step || 0.1; // default range step size for float
-    break;
-  case 'coordinate-input':
-    htmlType = 'button';
     break;
   default:
     htmlType = 'text';

examples/offline.html

@@ -1,34 +0,0 @@
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Error 502 | Bad Gateway</title>
-    <style>
-        body{
-            background-color:#d3d3d3;
-        }
-        p {
-            font-size:20px;
-        }
-        main {
-            display: flex;
-            flex-direction:column;
-            text-align: center;
-            justify-content: center;
-        }
-        a {
-            text-decoration: none;
-            color:blue;
-        }
-        
-    </style>
-</head>
-<body>
-    <main> 
-        <p>Error 502: something went wrong.</p>
-        <p>It seems that you are not connected to internet.<br>Please try after some time.</p>
-        <a href="/">Go To Home Page</a>
-    </main>
-</body>
-</html>

examples/sw.js

@@ -1,14 +1,6 @@
-const staticCacheName = 'image-sequencer-static-v3.7.1';
-self.addEventListener('install', function(e) {
-  e.waitUntil(
-    caches.open(staticCacheName).then(function(cache) {
+const staticCacheName = 'image-sequencer-static-v3.5.1';
+self.addEventListener('install', event => {
   console.log('Attempting to install service worker');
-      return cache.addAll([
-        '/',
-        '/examples/offline.html'
-      ]);
-    })
-  );
 });
 
 self.addEventListener('activate', function(e) {
@@ -29,25 +21,13 @@ self.addEventListener('activate', function(e) {
 
 self.addEventListener('fetch', function(event) {
   event.respondWith(
-    // Try to fetch the latest data first.
-    fetch(event.request)
-      .then(function(response) {
-        return caches.open(staticCacheName)
-          .then(function(cache) {
-            if(event.request.method == 'GET'){
-              cache.put(event.request.url, response.clone());
-            }
+    caches.open(staticCacheName).then(function(cache) {
+      return cache.match(event.request).then(function (response) {
+        return response || fetch(event.request).then(function(response) {
+          if(event.request.method == 'GET')
+            cache.put(event.request, response.clone());
           return response;
         });
-      })
-      .catch(function(err) {
-      // Now the request has been failed so show cached data.
-        return caches.match(event.request).then(function(res){
-          if (res === undefined) {
-            // Display offline page
-            return caches.match('offline.html');
-          }
-          return res;
       });
     })
   );

index.js

@@ -1,5 +1,89 @@
 #!/usr/bin/env node
 
-var cli = require('./src/cli');
+require('./src/ImageSequencer');
+sequencer = ImageSequencer({ ui: true });
+var fs = require('fs');
+var program = require('commander');
+var utils = require('./src/CliUtils');
 
-cli(process.argv);
+var saveSequence = require('./src/cli/saveSequence.js');
+var installModule = require('./src/cli/installModule.js');
+var sequencerSteps = require('./src/cli/sequencerSteps.js');
+
+function exit(message) {
+  console.error(message);
+  process.exit(1);
+}
+
+program
+  .version('0.1.0')
+  .option('-i, --image [PATH/URL]', 'Input image URL')
+  .option('-s, --step [step-name]', 'Name of the step to be added.')
+  .option('-o, --output [PATH]', 'Directory where output will be stored.')
+  .option('-b, --basic', 'Basic mode outputs only final image')
+  .option('-c, --config [Object]', 'Options for the step')
+  .option('--save-sequence [string]', 'Name space separated with Stringified sequence')
+  .option('--install-module [string]', 'Module name space seaprated npm package name')
+  .parse(process.argv);
+
+if (program.saveSequence) saveSequence(program, sequencer);
+
+else if (program.installModule) installModule(program, sequencer);
+
+else {
+  // Parse step into an array to allow for multiple steps.
+  if (!program.step) exit('No steps passed');
+  program.step = program.step.split(' ');
+
+  // User must input an image.
+  if (!program.image) exit('Can\'t read file.');
+
+  // User must input an image.
+  fs.access(program.image, function(err) {
+    if (err) exit('Can\'t read file.');
+  });
+
+  // User must input a step. If steps exist, check that every step is a valid step.
+  if (!program.step || !(utils.validateSteps(program.step, sequencer)))
+    exit('Please ensure all steps are valid.');
+
+  // If there's no user defined output directory, select a default directory.
+  program.output = program.output || './output/';
+
+  // Set sequencer to log module outputs, if any.
+  sequencer.setUI({
+    onComplete: function(step) {
+      // Get information of outputs.
+      step.info = sequencer.modulesInfo(step.name);
+
+      for (var output in step.info.outputs) {
+        console.log('[' + program.step + ']: ' + output + ' = ' + step[output]);
+      }
+    },
+    notify: function(msg) {
+      console.log('\x1b[36m%s\x1b[0m', '🌟  ' + msg);
+    }
+  });
+
+  // Finally, if everything is alright, load the image, add the steps and run the sequencer.
+  sequencer.loadImages(program.image, function() {
+    console.warn(
+      '\x1b[33m%s\x1b[0m',
+      'Please wait \n output directory generated will be empty until the execution is complete'
+    );
+
+    //Generate the Output Directory
+    var outputFilename = program.output.split('/').slice(-1)[0];
+    if (outputFilename.includes('.')) {
+      // user did give an output filename we have to remove it from dir
+      program.output = program.output.split('/').slice(0, -1).join('/');
+    }
+    else {
+      outputFilename = null;
+    }
+
+    sequencerSteps(program, sequencer, outputFilename);
+
+  });
+
+}

jest-puppeteer.config.js

@@ -1,6 +1,5 @@
 module.exports = {
   launch: {
-    args: ['--no-sandbox', '--disable-setuid-sandbox'], // https://github.com/puppeteer/puppeteer/blob/main/docs/troubleshooting.md#setting-up-chrome-linux-sandbox
     headless: process.env.HEADLESS !== 'false',
   },
   server: {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "image-sequencer",
-  "version": "3.7.1",
+  "version": "3.5.1",
   "description": "A modular JavaScript image manipulation library modeled on a storyboard.",
   "main": "src/ImageSequencer.js",
   "scripts": {
@@ -12,7 +12,6 @@
     "test-all": "npm run test && npm run benchmark && npm run gif-test && grunt tests && npm run core-tests",
     "test-ui": "node node_modules/jasmine/bin/jasmine test/ui/spec/*.js",
     "test-ui-2": "node ./node_modules/.bin/jest",
-    "test-cli": "node test/cli/*.js | tap-spec",
     "setup": "npm i && npm i -g grunt grunt-cli && npm rebuild --build-from-source && grunt build",
     "start": "grunt serve"
   },
@@ -40,13 +39,12 @@
     "base64-img": "^1.0.4",
     "bootstrap": "^3.4.1",
     "bootstrap-colorpicker": "^2.5.3",
-    "buffer": "~6.0.2",
-    "commander": "^8.0.0",
+    "buffer": "~5.6.0",
+    "commander": "^4.0.1",
     "compressorjs": "^1.0.5",
     "data-uri-to-buffer": "^3.0.0",
     "downloadjs": "^1.4.7",
-    "eslint": "^8.0.0",
-    "expr-eval": "^2.0.2",
+    "eslint": "^6.1.0",
     "fisheyegl": "^0.1.2",
     "font-awesome": "~4.7.0",
     "geotiff": "^1.0.0-beta.6",
@@ -54,25 +52,25 @@
     "gifshot": "^0.4.5",
     "glfx": "0.0.4",
     "gpu.js": "^2.3.1",
-    "imgareaselect": "git+https://git@github.com/jywarren/imgareaselect.git#v1.0.0-rc.2",
     "image-sequencer-invert": "^1.0.0",
     "imagejs": "0.0.9",
     "imagemin": "^7.0.1",
     "imagemin-jpegtran": "^7.0.0",
     "imagemin-pngquant": "^9.0.1",
+    "imgareaselect": "git://github.com/jywarren/imgareaselect.git#v1.0.0-rc.2",
     "istanbul": "^0.4.5",
     "jasmine": "^3.4.0",
-    "jpegtran-bin": "^6.0.1",
+    "jpegtran-bin": "^5.0.2",
     "jquery": "^3.3.1",
-    "jsdom": "^19.0.0",
-    "jspdf": "^2.1.1",
+    "jsdom": "^16.3.0",
+    "jspdf": "^1.5.3",
     "jsqr": "^1.1.1",
     "lodash": "^4.17.11",
     "ndarray": "^1.0.18",
     "opencv.js": "^1.2.1",
-    "ora": "^5.1.0",
+    "ora": "^4.0.3",
     "pace": "0.0.4",
-    "pngquant-bin": "^6.0.0",
+    "pngquant-bin": "^5.0.2",
     "puppeteer": "^1.14.0",
     "qrcode": "^1.3.3",
     "readline-sync": "^1.4.7",
@@ -87,31 +85,29 @@
     "@babel/plugin-proposal-object-rest-spread": "^7.4.3",
     "@babel/plugin-syntax-object-rest-spread": "^7.2.0",
     "babelify": "^10.0.0",
-    "browserify": "17.0.0",
-    "canvas": "^2.8.0",
-    "eslint": "^8.0.0",
+    "browserify": "16.5.0",
+    "eslint": "^6.1.0",
     "grunt": "^1.0.3",
     "grunt-browser-sync": "^2.2.0",
     "grunt-browserify": "^5.0.0",
-    "grunt-contrib-concat": "^2.0.0",
+    "grunt-contrib-concat": "^1.0.1",
     "grunt-contrib-uglify-es": "^3.3.0",
     "grunt-contrib-watch": "^1.1.0",
     "grunt-text-replace": "^0.4.0",
-    "husky": "^7.0.0",
+    "husky": "^3.0.5",
     "image-filter-core": "~2.0.2",
     "image-filter-threshold": "~2.0.1",
     "jasmine-core": "^3.3.0",
     "jasmine-jquery": "^2.1.1",
-    "jasmine-spec-reporter": "^7.0.0",
-    "jest": "^27.0.1",
-    "jest-puppeteer": "^6.0.0",
-    "lint-staged": "^12.1.3",
+    "jasmine-spec-reporter": "^4.2.1",
+    "jest": "^26.1.0",
+    "jest-puppeteer": "^4.3.0",
+    "lint-staged": "^10.0.3",
     "looks-same": "^7.0.0",
     "matchdep": "^2.0.0",
-    "resemblejs": "^3.2.5",
     "tap-spec": "^5.0.0",
-    "tape": "^5.2.0",
-    "tape-run": "^9.0.0",
+    "tape": "^4.9.2",
+    "tape-run": "^8.0.0",
     "uglify-es": "^3.3.7"
   },
   "husky": {

scripts/update-demo

@@ -1,26 +0,0 @@
-#!/bin/bash
-
-scriptsDir=$(realpath $(dirname $0))
-
-echo -ne "Enter the repo to push to in the form username/repo (required): "
-read -e pushRepo
-
-echo -ne "Enter repo URL to pull from (upstream) in the form username/repo (default: publiclab/image-sequencer): "
-read -e repoInput
-
-echo -ne "Enter branch name (default: stable): "
-read -e branchInput
-
-echo -ne "Enter CNAME URL(default: none): "
-read -e cnameUrlInput
-
-tempDir=$(mktemp -d)
-pushd $tempDir > /dev/null
-
-git clone https://github.com/$pushRepo
-pushd image-sequencer > /dev/null
-
-$scriptsDir/update-gh-pages "$repoInput" "$branchInput" "$cnameUrlInput" "no warn"
-
-popd > /dev/null
-popd > /dev/null

scripts/update-gh-pages

@@ -1,117 +0,0 @@
-#!/bin/bash
-set -e # So that nothing wrong is published
-
-warn() {
-  echo -e "\033[1;31m
-------IMPORTANT------
-  THIS SCRIPT IS NOT MEANT TO BE USED DIRECTLY, PLEASE NEWLY CLONE THE REPO IN A SEPARATE DIRECTORY AND USE THE SCRIPT THERE.
-  USING THIS SCRIPT IN YOUR MAIN CLONE MAY DELETE YOUR LOCAL CHANGES.
-  This script is made to be reusable: If you want to manually update the demo, \
-  use the interactive script \`update-demo\`. This script can also be used in a github action.
-
-  You can set the 4th argument to anything to bypass this warning. \
-  Setting the 4th argument means that the first 3 arguments are also set which means that you know what you are doing (I assume).
-------IMPORTANT------
-\033[0m"
-
-  echo -ne "Do you still want to continue? [Y/n]: "
-  read -e yN
-
-  case $yN in
-    [yY][eE][sS] | [yY])
-    ;;
-    *)
-      exit 0
-    ;;
-  esac
-}
-
-# --- Constants ---
-deps="jquery bootstrap imgareaselect gifshot downloadjs selectize font-awesome bootstrap-colorpicker jspdf opencv.js/opencv.js" # A list of node_module dependencies to force commit
-# --- Constants ---
-
-# --- Arguments ---
-# $1: Repo(to use as upstream) url in the form username/repo (default: publiclab/image-sequencer) NOTE: Github only
-# $2: Branch to pull from eg: main or stable (default: stable)
-# $3: CNAME URL (default: none)
-# $4: Set the fourth argument to anything to bypass the warning.
-
-if [[ "$1" != "" ]];
-then
-  repo=$1
-else
-  repo="publiclab/image-sequencer"
-fi
-
-if [[ "$2" != "" ]];
-then
-  branch=$2
-else
-  branch="stable"
-fi
-
-if [[ "$3" != "" ]];
-then
-  CNAMEURL=$3
-else
-  CNAMEURL=""
-fi
-# --- Arguments ---
-
-# --- Main Script ---
-if [[ "$4" == "" ]]; # Set a 4th argument to anything to bypass this warning.
-then
-  warn
-fi
-
-git checkout gh-pages
-git remote add upstream https://github.com/$repo
-git fetch upstream
-
-git reset --hard upstream/$branch
-
-echo -e "Running setup script."
-npm run setup
-
-echo -e "Building dist files."
-grunt production
-
-if [ ! -f CNAME ];
-then
-  echo -e "Creating CNAME"
-  touch CNAME
-fi
-
-echo $CNAMEURL > CNAME
-
-echo -e "Removing unnecessary files."
-rm -R docs/
-rm -R test/
-rm CONTRIBUTING.md
-rm index.js
-
-echo -e "Copying important files from src/"
-cp src/ui/prepareDynamic.js prepareDynamic.js
-
-echo "Removing src/"
-rm -R src/
-mkdir -p src/ui/
-mv prepareDynamic.js src/ui/prepareDynamic.js
-
-echo -e "git add dist and node_modules dependencies."
-git add .
-
-for dep in $deps; # Force add node_modules dependencies
-do
-  git add -f node_modules/$dep
-done
-
-git add -f dist/image-sequencer.js
-git add -f dist/image-sequencer-ui.js
-
-echo -e "committing and pusing."
-git commit --no-verify -m "update"
-git push -f
-
-exit 0
-# --- Main Script ---

src/Modules.js

@@ -31,10 +31,8 @@ module.exports = {
   'gradient': require('./modules/Gradient'),
   'grid-overlay': require('./modules/GridOverlay'),
   'import-image': require('./modules/ImportImage'),
-  'mask': require('./modules/Mask'),
   'minify-image': require('./modules/MinifyImage'),
-  // 'invert': require('image-sequencer-invert'), this code imports the invert module from a different repository altogether (using a require statement)
-  // Which is a powerful feature of ImageSequencer, the modules are independent of the rest of the library's source.
+  // 'invert': require('image-sequencer-invert'),
   'invert': require('./modules/Invert'),
   'ndvi': require('./modules/Ndvi'),
   'ndvi-colormap': require('./modules/NdviColormap'),
@@ -45,8 +43,6 @@ module.exports = {
   'resize': require('./modules/Resize'),
   'rotate': require('./modules/Rotate'),
   'saturation': require('./modules/Saturation'),
-  'shadow': require('./modules/Shadow'),
-  'sharpen': require('./modules/Sharpen'),
   'text-overlay': require('./modules/TextOverlay'),
   'threshold': require('./modules/Threshold'),
   'tint': require('./modules/Tint'),

src/cli/index.js

@@ -1,102 +0,0 @@
-require('../ImageSequencer');
-sequencer = ImageSequencer({ ui: true });
-var fs = require('fs');
-var { Command } = require('commander');
-var utils = require('../CliUtils');
-
-var saveSequence = require('./saveSequence.js');
-var installModule = require('./installModule.js');
-var sequencerSteps = require('./sequencerSteps.js');
-
-function exit(message) {
-  console.error(message);
-  process.exit(1);
-}
-
-function executeSteps(program) {
-  // Set sequencer to log module outputs, if any.
-  sequencer.setUI({
-    onComplete: function (step) {
-      // Get information of outputs.
-      step.info = sequencer.modulesInfo(step.name);
-
-      for (var output in step.info.outputs) {
-        console.log('[' + program.step + ']: ' + output + ' = ' + step[output]);
-      }
-    },
-    notify: function (msg) {
-      console.log('\x1b[36m%s\x1b[0m', '🌟  ' + msg);
-    },
-  });
-
-  // Finally, if everything is alright, load the image, add the steps and run the sequencer.
-  sequencer.loadImages(program.image, function () {
-    console.warn(
-      '\x1b[33m%s\x1b[0m',
-      'Please wait \n output directory generated will be empty until the execution is complete'
-    );
-
-    //Generate the Output Directory
-    var outputFilename = program.output.split('/').slice(-1)[0];
-    if (outputFilename.includes('.')) {
-      // user did give an output filename we have to remove it from dir
-      program.output = program.output.split('/').slice(0, -1).join('/');
-    } else {
-      outputFilename = null;
-    }
-
-    sequencerSteps(program, sequencer, outputFilename);
-  });
-}
-
-function parseSteps(program) {
-  // Parse step into an array to allow for multiple steps.
-  if (!program.step) exit('No steps passed');
-  program.step = program.step.split(' ');
-
-  // User must input an image.
-  if (!program.image) exit('Can\'t read file.');
-
-  // User must input an image.
-  fs.access(program.image, function (err) {
-    if (err) exit('Can\'t read file.');
-  });
-
-  // User must input a step. If steps exist, check that every step is a valid step.
-  if (!program.step || !utils.validateSteps(program.step, sequencer))
-    exit('Please ensure all steps are valid.');
-
-  // If there's no user defined output directory, select a default directory.
-  program.output = program.output || './output/';
-
-  executeSteps(program);
-}
-
-function cli(args) {
-
-  let program = new Command();
-
-  program
-    .version('0.1.0')
-    .option('-i, --image [PATH/URL]', 'Input image URL')
-    .option('-s, --step [step-name]', 'Name of the step to be added.')
-    .option('-o, --output [PATH]', 'Directory where output will be stored.')
-    .option('-b, --basic', 'Basic mode outputs only final image')
-    .option('-c, --config [Object]', 'Options for the step')
-    .option(
-      '--save-sequence [string]',
-      'Name space separated with Stringified sequence'
-    )
-    .option(
-      '--install-module [string]',
-      'Module name space seaprated npm package name'
-    )
-    .parse(args);
-
-  const options = program.opts();
-  if (options.saveSequence) saveSequence(options, sequencer);
-  else if (options.installModule) installModule(options, sequencer);
-  else parseSteps(options);
-}
-
-module.exports = cli;

src/modules/ColorHalftone/info.json

@@ -8,8 +8,7 @@
             "desc": "angle of rotation of the halftone patterns in radians",
             "default": "0.25",
             "min": "0",
-            "max": "1.57",
-            "step": "0.05"
+            "max": "1.57"
         },
         "size": {
             "type": "integer",

src/modules/Dynamic/Module.js

@@ -14,10 +14,11 @@ module.exports = function Dynamic(options, UI) {
     options.blue = options.blue || defaults.blue;
     options.green = options.green || defaults.green;
 
-    const Parser = require('expr-eval').Parser;
     function generator(expression) {
-      let expr = Parser.parse('R = r; G = g; B = b; A = a; ' + expression);
-      return expr.toJSFunction("r,g,b,a,R,G,B,A");
+      var func = 'f = function (r, g, b, a) { var R = r, G = g, B = b, A = a; return ' + expression + ';}';
+      var f;
+      eval(func);
+      return f;
     }
 
     var channels = ['red', 'green', 'blue', 'alpha'];
@@ -25,7 +26,8 @@ module.exports = function Dynamic(options, UI) {
     channels.forEach(function(channel) {
       if (channel === 'alpha'){
         options['alpha_function'] = function() { return 255; };
-      } else {
+      }
+      else{
         options[channel + '_function'] = generator(options[channel]);
       }
     });

src/modules/Mask/Module.js

@@ -1,82 +0,0 @@
-module.exports = function Mask(options, UI, util) {
-  var defaults = require('./../../util/getDefaults.js')(require('./info.json'));
-  options.offset = options.offset || defaults.offset;
-  options.resize = options.resize || defaults.resize;
-
-  var output;
-
-  // This function is called on every draw.
-  function draw(input, callback, progressObj) {
-    progressObj.stop(true);
-    progressObj.overrideFlag = true;
-
-    var step = this;
-
-    var getPixels = require('get-pixels');
-
-    // convert offset as string to int
-    if (typeof options.offset === 'string')
-      options.offset = parseInt(options.offset);
-
-    // save first image's pixels
-    var priorStep = this.getStep(options.offset);
-
-    if (priorStep.output === undefined) {
-      this.output = input;
-      UI.notify('Offset Unavailable', 'offset-notification');
-      callback();
-    }
-
-    const alpha_masking = function(c, a) {
-      return (a * c + (255 - a) * c) / 255;
-    };
-    const internalSequencer = ImageSequencer({ inBrowser: false, ui: false });
-    internalSequencer.loadImage(priorStep.output.src, function() {
-      internalSequencer.importJSON([{ 'name': 'resize', 'options': { resize: options.resize } }]);
-      internalSequencer.run(function onCallback(internalOutput) {
-
-        getPixels(internalOutput, function(err, pixels) {
-          options.firstImagePixels = pixels;
-
-          function changePixel(r2, g2, b2, a2, x, y) {
-            let p = options.firstImagePixels;
-            let r1 = p.get(x, y, 0),
-              g1 = p.get(x, y, 1),
-              b1 = p.get(x, y, 2),
-              a1 = p.get(x, y, 3);
-
-            return [alpha_masking(r1, a2), alpha_masking(g1, a2), alpha_masking(b1, a2)];
-          }
-
-          function output(image, datauri, mimetype, wasmSuccess) {
-            step.output = {
-              src: datauri,
-              format: mimetype,
-              wasmSuccess,
-              useWasm: options.useWasm
-            };
-          }
-
-          // 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,
-            inBrowser: options.inBrowser,
-            callback: callback,
-            useWasm: options.useWasm
-          });
-        });
-      });
-    });
-  }
-
-  return {
-    options: options,
-    draw: draw,
-    output: output,
-    UI: UI
-  };
-};

src/modules/Mask/index.js

@@ -1,4 +0,0 @@
-module.exports = [
-  require('./Module'),
-  require('./info.json')
-];

src/modules/Mask/info.json

@@ -1,18 +0,0 @@
-{
-    "name": "mask",
-    "description": "Masks two images according to their Alpha values",
-    "inputs": {
-      "offset": {
-        "type": "integer",
-        "desc": "Choose which image to mask the current image with. Two steps back is -2, three steps back is -3 etc.",
-        "default": -2
-      },
-      "resize": {
-        "type": "string",
-        "desc": "Percentage value by which first image is to be resized",
-        "default": "125%"
-      }
-    },
-    "docs-link":"https://github.com/publiclab/image-sequencer/blob/main/docs/MODULES.md"
-  }
-  

src/modules/Overlay/Module.js

@@ -1,17 +1,15 @@
 module.exports = function Dynamic(options, UI, util) {
 
-  const defaults = require('./../../util/getDefaults.js')(require('./info.json'));
+  var defaults = require('./../../util/getDefaults.js')(require('./info.json'));
   options.x = options.x || defaults.x;
   options.y = options.y || defaults.y;
 
   if(options.step.inBrowser && !options.noUI && sequencer.getSteps().length < 2)
     options.offset = -1;
 
-  let ui;
+  if (options.step.inBrowser && !options.noUI) var ui = require('./Ui.js')(options.step, UI);
 
-  if (options.step.inBrowser && !options.noUI)  ui = require('./Ui.js')(options.step, UI);
-
-  let output;
+  var output;
 
   // This function is called on every draw.
   function draw(input, callback, progressObj) {
@@ -21,15 +19,15 @@ module.exports = function Dynamic(options, UI, util) {
     progressObj.stop(true);
     progressObj.overrideFlag = true;
 
-    const step = this;
+    var step = this;
 
-    const parseCornerCoordinateInputs = require('../../util/ParseInputCoordinates');
+    var parseCornerCoordinateInputs = require('../../util/ParseInputCoordinates');
 
     // save the pixels of the base image
-    const baseStepImage = this.getStep(options.offset).image;
-    const baseStepOutput = this.getOutput(options.offset);
+    var baseStepImage = this.getStep(options.offset).image;
+    var baseStepOutput = this.getOutput(options.offset);
 
-    const getPixels = require('get-pixels');
+    var getPixels = require('get-pixels');
 
     getPixels(input.src, function(err, pixels) {
       // parse the inputs
@@ -49,29 +47,20 @@ module.exports = function Dynamic(options, UI, util) {
 
       function changePixel(r1, g1, b1, a1, x, y) {
 
-        const firstImagePixels = [r1, g1, b1, a1];
-
         // overlay
-        const p = options.secondImagePixels;
+        var p = options.secondImagePixels;
         if (x >= options.x
           && x - options.x < p.shape[0]
           && y >= options.y
-          && y - options.y < p.shape[1]){
-
-          const secondImagePixels = [
+          && y - options.y < p.shape[1])
+          return [
             p.get(x - options.x, y - options.y, 0),
             p.get(x - options.x, y - options.y, 1),
             p.get(x - options.x, y - options.y, 2),
             p.get(x - options.x, y - options.y, 3)
           ];
-          
-          if(secondImagePixels[3] === 0)
-            return firstImagePixels;
         else
-            return secondImagePixels;
-        }
-        else
-          return firstImagePixels;
+          return [r1, g1, b1, a1];
       }
 
       function output(image, datauri, mimetype, wasmSuccess) {

src/modules/Resize/Resize.js

@@ -2,7 +2,7 @@ const imagejs = require('imagejs'),
   pixelSetter = require('../../util/pixelSetter'),
   ndarray = require('ndarray');
 module.exports = function Resize(pixels, options) {
-  const resize_value = parseFloat(options.resize);
+  const resize_value = parseInt(options.resize.slice(0, -1));
 
   if (resize_value == 100) return pixels;
 

src/modules/Shadow/Module.js

@@ -1,146 +0,0 @@
-/*
-* Create Shadow
-*/
-module.exports = function canvasResize(options, UI) {
-
-  var defaults = require('./../../util/getDefaults.js')(require('./info.json'));
-  const pixelSetter = require('../../util/pixelSetter.js');
-
-  var output;
-
-  function draw(input, callback, progressObj) {
-
-    options.X_value = parseInt(options.X_value || defaults.X_value);
-    options.Y_value = parseInt(options.Y_value || defaults.Y_value);
-
-    progressObj.stop(true);
-    progressObj.overrideFlag = true;
-
-    var step = this;
-
-    function extraManipulation(pixels) {
-      let [w, h] = pixels.shape;
-      let newPixels = require('ndarray')(new Uint8Array(4 * (w + Math.abs(options.X_value)) * (h + Math.abs(options.Y_value))).fill(0), [(w + Math.abs(options.X_value)), (h + Math.abs(options.Y_value)), 4]);
-      let iMax = w,
-        jMax = h;
-      if (options.X_value < 0 && options.Y_value < 0) {
-        for (var k = 0; k < Math.abs(options.X_value); k++) {
-          for (var l = 0; l < (h + Math.abs(options.Y_value)); l++) {
-            let val = 255 - ((k / Math.abs(options.X_value)) * 255);
-            pixelSetter(k, l, [val, val, val, 255], newPixels);
-          }
-        }
-        for (var k = 0; k < (w + Math.abs(options.X_value)); k++) {
-          for (var l = 0; l < Math.abs(options.Y_value); l++) {
-            if (k < Math.abs(options.X_value) && k < l) {
-              continue;
-            }
-            let val = 255 - ((l / Math.abs(options.Y_value)) * 255);
-            pixelSetter(k, l, [val, val, val, 255], newPixels);
-          }
-        }
-        for (let i = 0; i < iMax && i < w; i++) {
-          for (let j = 0; j < jMax && j < h; j++) {
-            let x = i + Math.abs(options.X_value), y = j + Math.abs(options.Y_value);
-            pixelSetter(x, y, [pixels.get(i, j, 0), pixels.get(i, j, 1), pixels.get(i, j, 2), pixels.get(i, j, 3)], newPixels);
-          }
-        }
-      }
-
-      else if (options.X_value >= 0 && options.Y_value >= 0) {
-        for (var k = w; k < (w + options.X_value); k++) {
-          for (var l = 0; l < (h + options.Y_value); l++) {
-            let val = (((k - w) / options.X_value) * 255);
-            pixelSetter(k, l, [val, val, val, 255], newPixels);
-          }
-        }
-        for (var k = 0; k < (w + options.X_value); k++) {
-          for (var l = h; l < (h + options.Y_value); l++) {
-            if (k >= w && l >= h && ((k - w) >= (l - h))) {
-              continue;
-            }
-            let val = ((l - h) / options.Y_value * 255);
-            pixelSetter(k, l, [val, val, val, 255], newPixels);
-          }
-        }
-        for (let i = 0; i < iMax && i < w; i++) {
-          for (let j = 0; j < jMax && j < h; j++) {
-            let x = i, y = j;
-            pixelSetter(x, y, [pixels.get(i, j, 0), pixels.get(i, j, 1), pixels.get(i, j, 2), pixels.get(i, j, 3)], newPixels);
-          }
-        }
-      }
-      
-      else if (options.X_value < 0 && options.Y_value >= 0) {
-        for (var k = 0; k < (w + Math.abs(options.X_value)); k++) {
-          for (var l = h; l < (h + options.Y_value); l++) {
-            let val = ((l - h) / options.Y_value * 255);
-            pixelSetter(k, l, [val, val, val, 255], newPixels);
-          }
-        }
-        for (var k = 0; k < Math.abs(options.X_value); k++) {
-          for (var l = 0; l < (h + options.Y_value); l++) {
-            if (l + (k * (options.Y_value / Math.abs(options.X_value))) - (options.Y_value + h) > 0 && l >= h) {
-              continue;
-            }
-            let val = 255 - ((k / Math.abs(options.X_value)) * 255);
-            pixelSetter(k, l, [val, val, val, 255], newPixels);
-          }
-        }
-        for (let i = 0; i < iMax && i < w; i++) {
-          for (let j = 0; j < jMax && j < h; j++) {
-            let x = i + Math.abs(options.X_value), y = j;
-            pixelSetter(x, y, [pixels.get(i, j, 0), pixels.get(i, j, 1), pixels.get(i, j, 2), pixels.get(i, j, 3)], newPixels);
-          }
-        }
-      }
-
-      else if (options.X_value >= 0 && options.Y_value < 0) {
-        for (var k = w; k < (w + options.X_value); k++) {
-          for (var l = 0; l < (h + Math.abs(options.Y_value)); l++) {
-            let val = (((k - w) / options.X_value) * 255);
-            pixelSetter(k, l, [val, val, val, 255], newPixels);
-          }
-        }
-        for (var k = 0; k < (w + options.X_value); k++) {
-          for (var l = 0; l < Math.abs(options.Y_value); l++) {
-            if (l >= ((options.X_value / Math.abs(options.Y_value)) * (w + options.X_value - k)) && k >= w) {
-              continue;
-            }
-            let val = 255 - (l / Math.abs(options.Y_value) * 255);
-            pixelSetter(k, l, [val, val, val, 255], newPixels);
-          }
-        }
-        for (let i = 0; i < iMax && i < w; i++) {
-          for (let j = 0; j < jMax && j < h; j++) {
-            let x = i, y = j + Math.abs(options.Y_value);
-            pixelSetter(x, y, [pixels.get(i, j, 0), pixels.get(i, j, 1), pixels.get(i, j, 2), pixels.get(i, j, 3)], newPixels);
-          }
-        }
-      }
-      return newPixels;
-    }
-
-    function output(image, datauri, mimetype, wasmSuccess) {
-      step.output = { src: datauri, format: mimetype, wasmSuccess, useWasm: options.useWasm };
-    }
-
-    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,
-      useWasm:options.useWasm
-    });
-
-  }
-  return {
-    options: options,
-    draw: draw,
-    output: output,
-    UI: UI
-  };
-};

src/modules/Shadow/index.js

@@ -1,4 +0,0 @@
-module.exports = [
-  require('./Module'),
-  require('./info.json')
-];

src/modules/Shadow/info.json

@@ -1,17 +0,0 @@
-{
-  "name": "shadow",
-  "description": "Creates a two sided shadow.",
-  "inputs": {
-    "X_value": {
-      "type": "integer",
-      "desc": "X-value",
-      "default": 20
-    },
-    "Y_value": {
-      "type": "integer",
-      "desc": "Y-value",
-      "default": 20
-    }
-  },
-  "docs-link":"https://github.com/publiclab/image-sequencer/blob/main/docs/MODULES.md#shadow-module"
-}

src/modules/Sharpen/Module.js

@@ -1,46 +0,0 @@
-/*
-  Sharpen an image
-*/
-module.exports = function Sharpen(options, UI) {
-
-  let defaults = require('./../../util/getDefaults.js')(require('./info.json'));
-  options.sharpenStrength = options.sharpenStrength || defaults.sharpenStrength;
-  options.sharpenStrength = parseFloat(options.sharpenStrength); //returns a float
-  let output;
-  
-  function draw(input, callback, progressObj) {
-  
-    progressObj.stop(true);
-    progressObj.overrideFlag = true;
-  
-    let step = this;
-  
-    function extraManipulation(pixels) {
-      pixels = require('./Sharpen')(pixels, options.sharpenStrength);
-      return (pixels);
-    }
-  
-    function output(image, datauri, mimetype, wasmSuccess) {
-      step.output = { src: datauri, format: mimetype, wasmSuccess, useWasm: options.useWasm };
-    }
-  
-    return require('../_nomodule/PixelManipulation.js')(input, {
-      output: output,
-      ui: options.step.ui,
-      inBrowser: options.inBrowser,
-      extraManipulation: extraManipulation,
-      format: input.format,
-      image: options.image,
-      callback: callback,
-      useWasm:options.useWasm
-    });
-  
-  }
-  return {
-    options: options,
-    draw: draw,
-    output: output,
-    UI: UI
-  };
-};
-  

src/modules/Sharpen/Sharpen.js

@@ -1,48 +0,0 @@
-// Generates a 3x3 convolution sharpening kernel
-function kernelGenerator(strength = 1) { //default value of sharpeningStrength set to 1
-
-  let kernel = [
-    [0, -1 * strength, 0],
-    [-1 * strength, 5 * strength, -1 * strength],
-    [0, -1 * strength, 0]
-  ];
-  return kernel;
-}
-
-module.exports = exports = function(pixels, sharpen) {
-  const pixelSetter = require('../../util/pixelSetter.js');
-    
-  let kernel = kernelGenerator(sharpen), // Generate the kernel based on the strength input.
-    pixs = { // Separates the rgb channel pixels to convolve on the GPU.
-      r: [],
-      g: [],
-      b: [],
-    };
-  for (let y = 0; y < pixels.shape[1]; y++){
-    pixs.r.push([]);
-    pixs.g.push([]);
-    pixs.b.push([]);
-
-    for (let x = 0; x < pixels.shape[0]; x++){
-      pixs.r[y].push(pixels.get(x, y, 0));
-      pixs.g[y].push(pixels.get(x, y, 1));
-      pixs.b[y].push(pixels.get(x, y, 2));
-    }
-  }
-
-  const convolve = require('../_nomodule/gpuUtils').convolve; // GPU convolution function.
-
-  const conPix = convolve([pixs.r, pixs.g, pixs.b], kernel); // Convolves the pixels (all channels separately) on the GPU.
-
-  for (let y = 0; y < pixels.shape[1]; y++){
-    for (let x = 0; x < pixels.shape[0]; x++){
-      var pixelvalue = [Math.max(0, Math.min(conPix[0][y][x], 255)),
-        Math.max(0, Math.min(conPix[1][y][x], 255)),
-        Math.max(0, Math.min(conPix[2][y][x], 255))];
-
-      pixelSetter(x, y, pixelvalue, pixels); // Sets the image pixels according to the sharpened values.
-      
-    }
-  }
-  return (pixels);
-};

src/modules/Sharpen/index.js

@@ -1,4 +0,0 @@
-module.exports = [
-  require('./Module'),
-  require('./info.json')
-];

src/modules/Sharpen/info.json

@@ -1,15 +0,0 @@
-{
-    "name": "sharpen",
-    "description": "Applies a sharpening filter given by the intensity value",
-    "inputs": {
-        "sharpenStrength": {
-            "type": "float",
-            "desc": "Amount of sharpening (More sharpening gives more detail, but may lead to overexposure)",
-            "default": 1,
-            "min": 1,
-            "max": 1.5,
-            "step": 0.05
-        }
-    },
-    "docs-link":"https://github.com/publiclab/image-sequencer/blob/main/docs/MODULES.md#sharpen-module"
-}

src/modules/TextOverlay/info.json

@@ -8,10 +8,6 @@
             "desc": "Enter the text to overlay.",
             "default": "Lorem ipsum"
         },
-        "Custom-Coordinates": {
-            "type": "coordinate-input",
-            "desc": "Click to fill Coordinates"
-        },
         "x": {
             "type": "integer",
             "desc": "Starting text horizontal position.",

src/ui/LoadImage.js

@@ -7,22 +7,6 @@ function LoadImage(ref, name, src, main_callback) {
     };
     return image;
   }
-
-  // function to check whether a image can be fetched from external source or not
-  function checkForError(image_url) {
-    return fetch(image_url).then(function(res) {
-      if(res)
-        return false;
-      else 
-        return true;
-    }).catch(function(err) {
-      if(err)
-        console.log('Error occured because of image URL ',err);
-
-      return true;
-    });
-  }
-
   function CImage(src, step, callback) {
     var datauri;
     if (src.match(/^data:/i)) {
@@ -41,29 +25,6 @@ function LoadImage(ref, name, src, main_callback) {
       });
     }
     else if (ref.options.inBrowser) {
-      
-      let notifyBox = document.querySelector('div.notify-box');
-      let closePopUP = document.getElementById('close-popup');
-      if(src.indexOf('images/') !== 0  && src.indexOf('./images/') !== 0 && checkForError(src)){
-
-        if(notifyBox){
-          notifyBox.classList.remove('d-none');
-          notifyBox.classList.add('d-block');
-        }
-
-        if(closePopUP){
-          closePopUP.addEventListener('click',function(){
-            if(notifyBox){
-              notifyBox.classList.remove('d-block');
-              notifyBox.classList.add('d-none');
-            }
-            if(document.querySelector('button.remove'))
-              document.querySelector('button.remove').click(); // Remove the step due to redundant processing.
-            location.reload();
-          });
-        }
-      }
-      else{
       var ext = src.split('.').pop();
       var image = document.createElement('img');
       var canvas = document.createElement('canvas');
@@ -77,7 +38,6 @@ function LoadImage(ref, name, src, main_callback) {
       };
       image.src = src;
     }
-    }
     else {
       datauri = require('urify')(src);
       callback(datauri, step);

src/ui/SetInputStep.js

@@ -51,48 +51,20 @@ function setInputStepInit() {
         video.onloadedmetadata = function(e) {
           video.play();
         };
-
-        document.getElementById('capture').addEventListener('click', function(){
-          context.drawImage(video, 0, 0, 400, 300);
-          options.onTakePhoto(canvas.toDataURL());
-          setTimeout(stopStream(stream),1); // wait for 1 second before closing webcam so that image loads properly
-        });
-
         document.getElementById('close').addEventListener('click', function () {
           stopStream(stream);
         });
       }
       function handleError(error) {
         console.log('navigator.getUserMedia error: ', error);
-
-        // when user dismissed the camera access (includes closing of prompt which requests for camera access)
-        if(error.message == 'Permission denied' || error.message == 'NotAllowedError' || error.message == 'PermissionDismissedError'){
-          document.getElementById('capture').addEventListener('click', function(e) {
-            alert('Enable camera access in order to take picture');
-          });
-        }
-        
-        // when user don't have webcam to use.
-        if(error.message == 'NotFoundError' || error.message == 'DevicesNotFoundError'){
-          alert('You do not have appropriate devices to use this Functionality');
-        }
-
-        // when webcam is already used by some other application
-        if(error.message == 'NotReadableError' || error.message == 'TrackStartError' || error.message == 'Concurrent mic process limit'){
-          alert('Your webcam is already in use by some other application');
-        }
-
-        // when some of the requested constraints can't be satisfied like high frame rate or high resolution
-        if(error.message == 'OverconstrainedError' || error.message == 'ConstraintNotSatisfiedError'){
-          console.log('Requested Constraints can not be satisfied ', error);
-        }
       }
       navigator.mediaDevices.getUserMedia(constraints).then(handleSuccess).catch(handleError);
   
-      document.getElementById('close').addEventListener('click', function() {
-        video.style.display = 'none';
-      });
 
+      document.getElementById('capture').addEventListener('click', function(stream){
+        context.drawImage(video, 0, 0, 400, 300);
+        options.onTakePhoto(canvas.toDataURL());
+      });
 
       function stopStream(stream) {
         stream.getVideoTracks().forEach(function (track) {
@@ -114,10 +86,10 @@ function setInputStepInit() {
     dropzone[0].addEventListener('drop', handleFile, false);
  
     dropzone.on('dragover', function onDragover(e) {
-      dropzone.addClass('hover');
-      e.preventDefault();
       e.stopPropagation();
-    });
+      e.preventDefault();
+      e.dataTransfer.dropEffect = 'copy'; // Explicitly show this is a copy.
+    }, false);
  
     dropzone.on('dragenter', function onDragEnter(e) {
       dropzone.addClass('hover');
@@ -127,11 +99,6 @@ function setInputStepInit() {
       dropzone.removeClass('hover');
     });
 
-    dropzone.on('drop', function onDrop(e) {
-      dropzone.removeClass('hover');
-      e.preventDefault();
-    });
-
   };
 
 }

src/util/getDefaults.js

@@ -1,4 +1,3 @@
-/** Parses the defaults and gets the input which is available. */
 module.exports = function(info){
   var defaults = {};
   for (var key in info.inputs) {

src/util/pixelSetter.js

@@ -1,10 +1,3 @@
-/**  
- * @param {number} x x-coordinate.
- * @param {number} y y-coordinate.
- * @param {object} value array [r, g, b, a]
- * @param {object} pixels NDarray of pixels.
- * @description Sets the pixels from 0 through length of value. 
-*/
 module.exports = function(x, y, value, pixels){
   for(let i = 0; i < value.length; i++){
     pixels.set(x, y, i, value[i]);

test/cli/saveSequence.js

@@ -1,22 +0,0 @@
-const test = require('tape');
-const cli = require('../../src/cli');
-
-test('testing save sequence function', function (t) {
-  try {
-    cli([
-      'node', 'test',
-      '--save-sequence',
-      '"invert-colormap invert(),colormap()"',
-    ]);
-    t.true(1, 'creation success');
-  } catch (error) {
-    t.true(!error, 'creation fail');
-  }
-  try {
-    cli(['node', 'test', '--save-sequence']);
-    t.true(0, 'creation success');
-  } catch (error) {
-    t.true(1, 'creation fail');
-  }
-  t.end();
-});

test/core/images/moon.js

@@ -1,2 +0,0 @@
-module.exports = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAABTmlDQ1BpY2MAACiRY2BgUkksKMhhYWBgyM0rKQpyd1KIiIxSYH/IwA6EvAxiDAqJycUFjgEBPkAlDDAaFXy7xsAIoi/rgsw6JTW1SbVewNdipvDVi69EmzDVowCulNTiZCD9B4hTkwuKShgYGFOAbOXykgIQuwPIFikCOgrIngNip0PYG0DsJAj7CFhNSJAzkH0DyFZIzkgEmsH4A8jWSUIST0diQ+0FAW6XzOKCnMRKhQBjAq4lA5SkVpSAaOf8gsqizPSMEgVHYCilKnjmJevpKBgZGJozMIDCHKL6cyA4LBnFziDEmu8zMNju/////26EmNd+BoaNQJ1cOxFiGhYMDILcDAwndhYkFiWChZiBmCktjYHh03IGBt5IBgbhC0A90cVpxkZgeUYeJwYG1nv//39WY2Bgn8zA8HfC//+/F/3//3cxUPMdBoYDeQAVIWXu+j9DEQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAABPlBMVEUAAAABAQECAgIKCQoHBwcYGBgyMjIpKSkDAwMXFxdiYmJaWlpLS0tFRUUiIiIFBQUBAAFQUFBra2t0dHRfX19NTU0eHh4CAQEWFhZ1dXVdXV1xcXFnZ2eEhIR2dnZBQUEUFBQ+Pj6JiYmGhoZ9fX2Dg4Nzc3NWVlYxMTEMDAxUU1SampqLi4ukpKR/f397e3tbW1svLy9CQkK7u7uwsLC3t7eSkpKKiopmZmZKSkodHR0uLi61tbWIiIidnZ2ZmZmenp5hYWFPT084ODgPDw+np6eWlpaoqKh5eXlEREQoKCgEBAR8fHyrq6uCgoLT09PIyMi2trYzMzMKCgqHh4exsbHX19empqaVlZWPj489PT3Nzc1ycnKbm5tcXFwsLCxsbGyTk5OqqqplZWVSUlISERJubm4wMDAICAj///+XegsgAAAAAWJLR0RpvGvEtAAAAAlwSFlzAAAWJQAAFiUBSVIk8AAAAAd0SU1FB+UDFAEmFb1Hl3EAAAGLelRYdFJhdyBwcm9maWxlIHR5cGUgaWNjAAA4jbVTW27EMAj89yl6BF4G+zh+JFLvf4FiO15lV92q/ehIUWLAMAwkfLYWPgaipAADRKJoYKANZFpAux4mRpHEhAhiijkWArAD3W3X0wFQPQEERWVjA8EIEaTBhdfzTzi96mCE29CZ+mbWCpYcE1G0E0E6p5yRe+x4FHT7a7Lwm4o3FBWNxsoXl4uxxuCNgZEtZVAvhYjNXCHY9pSWHYdqU611zG3bg9rdUWE79OlCk1si8QEsRtivAkNs1qSbCZ7b0fTNBS/8JtFTzw9UEc1jmtpc/uzjB36NecJfxf6/RDY6SiaPRMJ6+pSykWY1dRf5Uq6d0ujfWQ9lOqgRMDEw8tjsx8Y/MTo5juXcC4roe/n4NW5I3M/x5l7PhVrDd4FS6gysV1UoNX8XR4nTqgh1MmqpZm8BvS28xe0pkTomYyorcY95JuC+IkqswUevzHwvhdBknWM/JnMmXcrmmfzsGVZHhea7F14acZ+r3kCP8AW8zeykgS8wzAAAAAFvck5UAc+id5oAAADLSURBVBjTY2BgYGAEIiYGBGBkYGZhYGJE4rOysbNyMDHB+Zxc3Dy8fPyMAjABQSFhES5RMXGYFglJKWkZWTl5BXGokKKSkLKKqpq6hiYjxGAtbR1dVT19aQNDfoiAkbGJqZmktrmFpRXEbmsbW207ewdlRydniCYXVx1VN3c7WQ8uTy9voAAHg4+vn39AoLafHHdQMNgdmrYhoWGB4RGRalESUKeb6UbbxsSGxInGg01lYnBJSExyD49ITpFgAIsAzU71TEuLS88AcgCXBRyOXT9PTwAAAOBlWElmTU0AKgAAAAgABgESAAMAAAABAAEAAAEaAAUAAAABAAAAVgEbAAUAAAABAAAAXgEoAAMAAAABAAIAAAITAAMAAAABAAEAAIdpAAQAAAABAAAAZgAAAAAAAACQAAAAAQAAAJAAAAABAAiQAAAHAAAABDAyMjGRAQAHAAAABAECAwCShgAHAAAAEgAAAMygAAAHAAAABDAxMDCgAQADAAAAAQABAACgAgAEAAAAAQAAApSgAwAEAAAAAQAAAqikBgADAAAAAQAAAAAAAAAAQVNDSUkAAABTY3JlZW5zaG90AAAsGuu1AAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDIxLTAzLTIwVDAxOjM4OjIxKzAwOjAw3y/n5QAAACV0RVh0ZGF0ZTptb2RpZnkAMjAyMS0wMy0yMFQwMTozODoyMSswMDowMK5yX1kAAAARdEVYdGV4aWY6Q29sb3JTcGFjZQAxD5sCSQAAACd0RVh0ZXhpZjpDb21wb25lbnRzQ29uZmlndXJhdGlvbgAxLCAyLCAzLCAwVaQjvwAAABN0RVh0ZXhpZjpFeGlmT2Zmc2V0ADEwMnNCKacAAAAfdEVYdGV4aWY6RXhpZlZlcnNpb24ANDgsIDUwLCA1MCwgNDlj1An4AAAAI3RFWHRleGlmOkZsYXNoUGl4VmVyc2lvbgA0OCwgNDksIDQ4LCA0OO/ZB2sAAAAYdEVYdGV4aWY6UGl4ZWxYRGltZW5zaW9uADY2MBUn8W4AAAAYdEVYdGV4aWY6UGl4ZWxZRGltZW5zaW9uADY4MBarPZYAAAAXdEVYdGV4aWY6U2NlbmVDYXB0dXJlVHlwZQAwIrQxYwAAAFx0RVh0ZXhpZjpVc2VyQ29tbWVudAA2NSwgODMsIDY3LCA3MywgNzMsIDAsIDAsIDAsIDgzLCA5OSwgMTE0LCAxMDEsIDEwMSwgMTEwLCAxMTUsIDEwNCwgMTExLCAxMTZAuB9yAAAAF3RFWHRleGlmOllDYkNyUG9zaXRpb25pbmcAMawPgGMAAAAodEVYdGljYzpjb3B5cmlnaHQAQ29weXJpZ2h0IEFwcGxlIEluYy4sIDIwMTe/8xjQAAAAGnRFWHRpY2M6ZGVzY3JpcHRpb24ARGlzcGxheSBQM495u7wAAAAASUVORK5CYII=';
-//base64 of original unmodified image

test/core/modules/resize.js

@@ -1,21 +1,4 @@
 const testModule = require('../templates/module-test'),
-  benchmark = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAVCAYAAACpF6WWAAAAAklEQVR4AewaftIAAAAzSURBVLXBAQEAMAiAME7/zN4Ssr2BzzEJSEACEpCABCQgAQlIQAISkIAEJCABCUhAAhJYclMCJyy7k2QAAAAASUVORK5CYII=',
-
-  benchmark1 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAALCAYAAACprHcmAAAAAklEQVR4AewaftIAAAAkSURBVJXBAQEAMAiAME7/zN4Ksr2Bz5EEEkgggQQSSCCBBBIs6poCE8Zr7KAAAAAASUVORK5CYII=',
-
-  benchmark2 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAAklEQVR4AewaftIAAAAiSURBVI3BAQEAAAiAIPP/5uqCMAtHIJFEEkkkkUQSSSTRAzwDAhGkYPRhAAAAAElFTkSuQmCC',
-
-  benchmark3 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAAklEQVR4AewaftIAAAAdSURBVHXBAQEAMAiAME7/zN4Csr2Bz0GCBAkSJCwpbQIJAvmJUgAAAABJRU5ErkJggg==',
-
-  options1 = {
-    resize: '70.85%'
-  },
-  options2 = {
-    resize: '60 %'
-  },
-  options3 = {
-    resize: '40'
-  };
+  benchmark = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAVCAYAAACpF6WWAAAAAklEQVR4AewaftIAAAAzSURBVLXBAQEAMAiAME7/zN4Ssr2BzzEJSEACEpCABCQgAQlIQAISkIAEJCABCUhAAhJYclMCJyy7k2QAAAAASUVORK5CYII=';
 
 testModule('resize', {resize: '129%'}, benchmark);
-require('../templates/options-test')('resize', [options1, options2, options3], [benchmark1, benchmark2, benchmark3]);

test/core/modules/sharpen.js

@@ -1,14 +0,0 @@
-const testModule = require('../templates/module-test'),
-  image = require('../images/moon'),
-  benchmark = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAklEQVR4AewaftIAAAJZSURBVH3BPUvrUACA4bfnJETsoIIV6qBFCtKiQoc6SPD7I3/ACw6KoJv+Bkm4Sy/iD3DQzU2oOLu5iCCilKJQ7CjtFbcEY3Ka24AFEa/PkwAiPmiaRhiGxIQQSCkJgoCfCD7ouk4YhnS0Wi2iKCKRSPATQZuu6wRBQGz11yqFQgHDMAjDkCiKMAyD/xFSSoIgIOZ5HoPpQYaHh9nZ2aG3t5eY7/toaHxH8OHw8JDj42NmZ2eRUiKlZG1tjYQQxEJCviOUUsS2t7dxHIerqyvq9Trr6+tsbm6yvLREhyElX2m0LSwu8Pb2RjKZJJ/PYxgG19fXPD4+0tfXRzabpVar4SuFlBKlFB2CtpW5FZp/m0xPT2NZFvV6nUajgeu6jI6Osru7S7FYJKaU4jNB2+8/v8kMZzg4OGBgYIBCoYBt29i2jWmaPD09YZomXV1dxIQQdEjAfvffsW2bXC5HKpViaGgIy7LwfZ9KpcL5+Tmu61IsFrm/vyeKIqSURFGE4BPTNCmXyxwdHdHT08Pd3R03NzdsbW0xMjJCrVZjbm6OmFKKmEgmk3ScnJxwdnbG6ekpY2NjWJbF/Pw8Dw8PpNNp8vk8ruvymQzD0KbNcRxs26ZareJ5HjMzMzw/PzMxMcHr6ytTU1PkcjnK5TIvLy90SMDWdZ1Wq4XjOFQqFRqNBtlslkwmQ6lUolQqcXFxwd7eHsvLy4yPj3N7e0ssAUS0dXd343kesWq1Sn+qn1R/ipjv+0gp2d/fZ3FxkcnJSWKappEAIj5IKVFK8dnGxgbNZhPXdbm8vOSrf2/T7iEkhMBLAAAAAElFTkSuQmCC',
-  benchmark1 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAklEQVR4AewaftIAAAI8SURBVH3BPUvjYADA8X+Sh6RUqS9jdx0cilMEl1oQQYfTVUHwtJycIoIuTpoigoubn0D0E+jsC+pSqDoXpCB4DkVMsR48aeJzeaABEc/fzwAUbbZtEwQBmmVZCCGQUvIdkzbHcQiCgEQURSilMAyD75jEHMdBSom2VdpifHycdDpNEAQopUin0/yPJYTwWq0WmlKKpz9PGIbB0tISl5eXNJtNWq0WNjYREZ+ZtD0+PlKr1ZienkYIgRCCnZ0dDMtCCwj4ihmGIVo2m6VQKHB8fMzt7S1TU1PMz8/ze3GRRFoIPhPEir+KaD09PeTzeTo6OqjX61xfX5PNZnFdl3K5zN8wRAhBGIYkTGLLP5fRZmdnyWQy3NzccH9/j+/7DA8Pc3BwwOTkJFoYhnxkEhv9MYq2traGNjExwcjICHNzcxQKBSqVCjMzM3R2dqJZlkXCJPZcf0bL5XK8vb0xMDCA7/to1WqVw8NDzs/P2dzcRIuiCCEEmgV4xDzPo9FocHp6ytnZGWNjY1SrVU5OTlhfX0dKycXFBUNDQ9zd3fH+/o5mdnd3k9jY2GB3d5ft7W20/v5+FhYWuLq6oq+vj3w+j+/7fGRJKT1ipVIJz/PQBgcHSaVSaKlUit7eXnK5HK7rsr+/z8PDAwkDUI7jIKVEU0qRyGQyvL6+opSiUqlQLBZZXV2l2WyysrKCZgCKWFdXF41GA00pxVfK5TKu62IYBppt2xiAok0IQRiGfLS3t0etVuPl5YWjoyM++wcQzOdOsGwgXgAAAABJRU5ErkJggg==',
-  option = {
-    sharpenStrength: 1.0
-  },
-  option1 = {
-    sharpenStrength: 1.5
-  },
-  optionsTest = require('../templates/options-test');
-
-optionsTest('sharpen', [option, option1], [benchmark, benchmark1], image);
-testModule('sharpen', option, benchmark, image);

test/core/sequencer/sw.js

@@ -1,37 +0,0 @@
-var setUpCache = new require('../../../examples/lib/cache')();
-var test = require('tape');
-
-function SWInstallation(){
-    return new Promise(() => {
-      return setupCache();
-    });
-}
-
-function UnRegisterSW(){
-
-    function unregister() {
-        return navigator.serviceWorker.getRegistrations()
-        .then(function(registrations) {
-            var unRegisteredWorker = registrations.map(function(registration) {
-            return registration.unregister();
-            });
-            return Promise.all(unRegisteredWorker);
-        });
-    }
-    
-    return Promise.all([
-        unregister(),
-        setUpCache.clearCache()
-    ]);
-}  
-
-test('Register service worker',function(t) {
-
-    t.test('unregister service worker',function(st) {
-      st.equal(UnRegisterSW(),true,'unregistered successfully and cleared the cache') 
-    })
-
-    t.test('install service worker',function(st) {
-      st.equal(SWInstallation(),true,'successfully installed new service worker')
-    });
-});

test/core/templates/gif-module-test.js

@@ -1,8 +1,6 @@
 const test = require('tape'),
   base64Img = require('base64-img');
 
-const compare = require('resemblejs').compare;
-
 const ImageSequencer = require('../../../src/ImageSequencer');
 
 const test_gif = require('../images/test.gif.js');
@@ -20,32 +18,14 @@ module.exports = (moduleName, options, benchmark, input) => {
   let sequencer = ImageSequencer({ui: false});
   sequencer.loadImages(input || test_gif);
   sequencer.addSteps(moduleName, options);
-  test(`${moduleName} module works correctly`, (t) => {
+  test(`${moduleName} module works correctly`, t => {
     sequencer.run({mode: 'test'}, () => {
       let result = sequencer.steps[1].output.src;
 
       base64Img.imgSync(result, target, `${moduleName}-result`);
       base64Img.imgSync(benchmark, target, `${moduleName}-benchmark`);
 
-      let mismatch = 100;
-      compare(
-        result,
-        benchmark,
-        { returnEarlyThreshold: 5 },
-        (err, { rawMisMatchPercentage }) => {
-          if (err) {
-            console.log('An error while comparing!');
-          } else {
-            mismatch = rawMisMatchPercentage;
-          }
-        }
-      );
-
-      t.equal(
-        mismatch < 5,
-        true,
-        `${moduleName} module works correctly with Gif`
-      );
+      t.equal(result === benchmark, true, `${moduleName} module works correctly with Gif`);
       sequencer = null;
       t.end();
     });

test/core/templates/options-test.js

@@ -24,9 +24,6 @@ module.exports = (moduleName, options, benchmark, input) => {
     sequencer.loadImages(input || red);
     // Add the step.
     sequencer.addSteps(moduleName, options[0]);
-
-    t.plan(2);
-
     // Run the ImageSequencer with initial option.
     sequencer.run(() => {
       let result = sequencer.steps[1].output.src;
@@ -40,7 +37,7 @@ module.exports = (moduleName, options, benchmark, input) => {
       looksSame(result, benchmark[0], function(err, res) {
         if (err) console.log(err);
 
-        t.equal(res.equal, true, `${moduleName} module works correctly with initial option ${JSON.stringify(options[0])}`);
+        t.equal(res.equal, true, `${moduleName} module works correctly with initial option ${options[0][moduleName]}`);
       });
       // Change the option of the given module.
       sequencer.steps[1].setOptions(options[1]);
@@ -57,8 +54,9 @@ module.exports = (moduleName, options, benchmark, input) => {
         looksSame(newResult, benchmark[1], function(err, res) {
           if (err) console.log(err);
 
-          t.equal(res.equal, true, `${moduleName} module works correctly when the option is changed to ${JSON.stringify(options[1])}`);
+          t.equal(res.equal, true, `${moduleName} module works correctly when the option is changed to ${options[1][moduleName]}`);
           sequencer = null;
+          t.end();
         });
       });
     });

test/core/util/gpuUtils.js

@@ -9,7 +9,7 @@ test('convolve works with 1x1 array', t => {
       [1, 1, 1]
     ],
     expectedOut = [
-      new Float32Array([9])
+      [9]
     ];
 
   const out = convolve([array], kernel);
@@ -34,10 +34,10 @@ test('convolve works with 3x4 array', t => {
       [1, 1, 1]
     ],
     expectedOut = [
-      new Float32Array([12, 19, 26]),
-      new Float32Array([13, 20, 27]),
-      new Float32Array([13, 20, 27]),
-      new Float32Array([13, 19, 25])
+      [12, 19, 26],
+      [13, 20, 27],
+      [13, 20, 27],
+      [13, 19, 25]
     ];
 
   const out = convolve([array], kernel);
@@ -68,16 +68,16 @@ test('convolve works with multiple 3x4 arrays', t => {
       [1, 1, 1]
     ],
     expectedOut1 = [
-      new Float32Array([12, 19, 26]),
-      new Float32Array([13, 20, 27]),
-      new Float32Array([13, 20, 27]),
-      new Float32Array([13, 19, 25])
+      [12, 19, 26],
+      [13, 20, 27],
+      [13, 20, 27],
+      [13, 19, 25]
     ],
     expectedOut2 = [
-      new Float32Array([14, 19, 24]),
-      new Float32Array([12, 13, 14]),
-      new Float32Array([15, 12,  9]),
-      new Float32Array([16, 13, 10])
+      [14, 19, 24],
+      [12, 13, 14],
+      [15, 12,  9],
+      [16, 13, 10]
     ];
 
   const out = convolve([array1, array2], kernel);

test/ui/spec/mapHtmlTypes.spec.js

@@ -6,12 +6,10 @@ describe('HTML Types Mapping Function', 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, step: 1});
-    expect(mapHtmlTypes({type: 'float', min: 20, max: 100})).toEqual({type: 'range', min: 20, max: 100, step: 0.1}); // should default to step = 1
+    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, step: 0.1});
-    expect(mapHtmlTypes({type: 'float', min: 20, max: 100})).toEqual({type: 'range', min: 20, max: 100, step: 0.1}); // should default to step = 0.1
+    expect(mapHtmlTypes({type: 'float', min: 20, max: 100})).toEqual({type: 'range', min: 20, max: 100});
   });
 
   it('maps text type', function() {