Merge branch 'main' into HarshKhandeparkar-patch-2

.github/CODEOWNERS

@@ -0,0 +1,74 @@
+# <-- DOCS FOR THIS FILE -->
+# This is a comment.
+# Each line is a file pattern followed by one or more owners.
+
+# These owners will be the default owners for everything in
+# the repo. Unless a later match takes precedence,
+# @global-owner1 and @global-owner2 will be requested for
+# review when someone opens a pull request.
+# *       @global-owner1 @global-owner2
+
+# Order is important; the last matching pattern takes the most
+# precedence. When someone opens a pull request that only
+# modifies JS files, only @js-owner and not the global
+# owner(s) will be requested for a review.
+# *.js    @js-owner
+
+# You can also use email addresses if you prefer. They'll be
+# used to look up users just like we do for commit author
+# emails.
+# *.go docs@example.com
+
+# In this example, @doctocat owns any files in the build/logs
+# directory at the root of the repository and any of its
+# subdirectories.
+# /build/logs/ @doctocat
+
+# The `docs/*` pattern will match files like
+# `docs/getting-started.md` but not further nested files like
+# `docs/build-app/troubleshooting.md`.
+# docs/*  docs@example.com
+
+# In this example, @octocat owns any file in an apps directory
+# anywhere in your repository.
+# apps/ @octocat
+
+# In this example, @doctocat owns any file in the `/docs`
+# directory in the root of your repository.
+# /docs/ @doctocat
+# <-- /DOCS FOR THIS FILE -->
+
+# <-- COMMON TO ALL MAINTAINERS -->
+/*.json @publiclab/is-maintainers
+/*.md @publiclab/is-maintainers
+/*.lock @ubliclab/is-maintainers
+/Gruntfile.js @publiclab/is-maintainers
+/.github/ @publiclab/is-maintainers
+# <-- /COMMON TO ALL MAINTAINERS -->
+
+# <-- SPECIFIC MAINTAINERS -->
+/index.js @publiclab/is-cli-maintainers
+/src/cli/ @publiclab/is-cli-maintainers
+/src/CliUtils.js @publiclab/is-cli-maintainers
+
+/src/*.js @publiclab/is-core-maintainers
+/src/*.json @publiclab/is-core-maintainers
+/src/util/ @publiclab/is-core-maintainers
+/test/core/* @publiclab/is-core-maintainers
+
+/src/modules/ @publiclab/is-module-maintainers
+/docs/ @publiclab/is-module-maintainers
+
+/test/ @publiclab/is-tests-maintainers
+/jest* @publiclab/is-tests-maintainers
+/eslint* @publiclab/is-tests-maintainers
+/travis* @publiclab/is-tests-maintainers
+.travis.yml @publiclab/is-tests-maintainers
+.gitpod* @publiclab/is-tests-maintainers
+/gitpod* @publiclab/is-tests-maintainers
+
+/examples/ @publiclab/is-ui-maintainers
+/icons/ @publiclab/is-ui-maintainers
+/test/ui-2/test/* @publiclab/is-ui-maintainers
+/test/ui/spec/* @publiclab/is-ui-maintainers
+# <-- /SPECIFIC MAINTAINERS -->

README.md

@@ -4,12 +4,16 @@ Image Sequencer
 [![Code of Conduct](https://img.shields.io/badge/code-of%20conduct-green.svg)](https://publiclab.org/conduct)
 [![npm version](https://badge.fury.io/js/image-sequencer.svg)](https://badge.fury.io/js/image-sequencer)
 [![Build Status](https://travis-ci.org/publiclab/image-sequencer.svg?branch=master)](https://travis-ci.org/publiclab/image-sequencer) [![Maintainability](https://api.codeclimate.com/v1/badges/5906996dd2e90aca6398/maintainability)](https://codeclimate.com/github/publiclab/image-sequencer/maintainability) [![Codecov](https://img.shields.io/codecov/c/github/publiclab/image-sequencer.svg?logo=codecov)](https://codecov.io/gh/publiclab/image-sequencer)
-[![Gitpod Ready-to-Code](https://img.shields.io/badge/Gitpod-ready--to--code-blue?logo=gitpod)](https://gitpod.io/from-referrer/)
+[![Gitpod Ready-to-Code](https://img.shields.io/badge/Gitpod-ready--to--code-blue?logo=gitpod)](https://gitpod.io/#https://github.com/publiclab/image-sequencer/)
 
 - **Latest Stable Demo**: https://sequencer.publiclab.org
 - **Latest Beta Demo**: https://beta.sequencer.publiclab.org
 - **Stable Branch**: https://github.com/publiclab/image-sequencer/tree/stable/
 
+Begin running (and contributing to) this codebase immediately with [GitPod](https://gitpod.io) (this also opens the latest `main` branch code):
+
+[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/publiclab/image-sequencer)
+
 ## Why
 
 Image Sequencer is different from other image processing systems because it's _non-destructive_: instead of modifying the original image, it **creates a new image at each step in a sequence**. This is because it:

examples/demo.css

@@ -324,7 +324,7 @@ a.name-header{
   position: fixed;
   right: 2%;
   top: 5%;
-  color: lightgray;
+  color: gray;
 }
 /* Non float rightward alignment*/
 .right {

examples/index.html

@@ -218,7 +218,7 @@
           <h2>Need Help?</h2>
           <p>
             <a class="btn btn-default" href="https://github.com/publiclab/image-sequencer/issues">Ask a question</a>
-            <a class="btn btn-default" href="https://publiclab.org/chat">Ask in our chatroom</a>
+            <a class="btn btn-default" href="https://gitter.im/publiclab/image-sequencer"  target="_blank">Ask in our chatroom </a>
           </p>
         </div>
         <div class="col-md-6">

examples/lib/defaultHtmlSequencerUi.js

@@ -28,7 +28,7 @@ function DefaultHtmlSequencerUi(_sequencer, options) {
   function selectNewStepUi() {
     var m = $(addStepSel + ' select').val();
     if(!m) m = arguments[0];
-    $(addStepSel + ' .info').html(_sequencer.modulesInfo(m).description);
+    else $(addStepSel + ' .info').html(_sequencer.modulesInfo(m).description);
     $(addStepSel + ' #add-step-btn').prop('disabled', false);
   }
 

package.json

@@ -6,9 +6,9 @@
   "scripts": {
     "debug": "TEST=true node ./index.js -i ./examples/images/monarch.png -s invert",
     "test": "TEST=true istanbul cover tape test/core/*.js test/core/ui/user-interface.js test/core/modules/*.js | tap-spec;",
-    "benchmark" : "node test/core/sequencer/benchmark.js | tap-spec;",
-    "gif-test" : "node test/core/gifs/gif-test.js | tap-spec;",
-    "core-tests" : "cat ./output/core-tests.js | tape-run --render=\"tap-spec\"",
+    "benchmark": "node test/core/sequencer/benchmark.js | tap-spec;",
+    "gif-test": "node test/core/gifs/gif-test.js | tap-spec;",
+    "core-tests": "cat ./output/core-tests.js | tape-run --render=\"tap-spec\"",
     "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",
@@ -56,13 +56,13 @@
     "imagejs": "0.0.9",
     "imagemin": "^7.0.1",
     "imagemin-jpegtran": "^7.0.0",
-    "imagemin-pngquant": "^8.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": "^4.0.0",
+    "jpegtran-bin": "^5.0.2",
     "jquery": "^3.3.1",
-    "jsdom": "^15.0.0",
+    "jsdom": "^16.3.0",
     "jspdf": "^1.5.3",
     "jsqr": "^1.1.1",
     "lodash": "^4.17.11",
@@ -107,7 +107,7 @@
     "matchdep": "^2.0.0",
     "tap-spec": "^5.0.0",
     "tape": "^4.9.2",
-    "tape-run": "^7.0.0",
+    "tape-run": "^8.0.0",
     "uglify-es": "^3.3.7"
   },
   "husky": {
@@ -119,4 +119,4 @@
   "bin": {
     "sequencer": "./index.js"
   }
-} 
+}

test/ui-2/test/apply-button.test.js

@@ -0,0 +1,35 @@
+const timeout = process.env.SLOWMO ? 30000 : 10000;
+const fs = require('fs');
+beforeAll(async () => {
+  path = fs.realpathSync('file://../examples/index.html');
+  await page.goto('file://' + path, {waitUntil: 'domcontentloaded'});
+});
+
+describe('Apply Button Works', () => {
+  test('Apply Button is clicked', async () => {
+    await page.waitForSelector('.step');
+
+  
+    await page.click('[data-value=\'resize\']');
+    const Length1 = await page.evaluate(() => document.querySelectorAll('.step').length);
+    //Lets change the default value
+    expect(Length1).toBe(2);
+    // Let's check the source of the image output by the default values
+    const src1 = await page.evaluate(() => document.querySelectorAll('.step img')[1].src);
+    //Lets change the default value
+    await page.evaluate(() => document.querySelector('div[name="resize"] input').value = '');
+    await page.type('div[name="resize"] input', '50%');
+    //Wait for the apply button to get enabled then click
+    await page.waitForFunction('document.querySelector(".btn-save").disabled == false');
+    await page.$eval('.btn-save', elem => elem.click());
+    //Wait for the image to process with the new value
+    await page.waitForSelector('.load', {visible: false});
+    
+    //Let's check the source of the image output by the new values
+    const src2 = await page.evaluate(() => document.querySelectorAll('.step img')[1].src);
+    //Expect default and new image to be changed
+    expect(src1).not.toEqual(src2);
+    
+    
+  }, timeout);
+});