mirror of
https://github.com/publiclab/image-sequencer.git
synced 2025-12-08 09:20:10 +01:00
Compare commits
19 Commits
blend-test
...
first-time
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
d09231bcef | ||
|
|
985c67847e | ||
|
|
690c126f41 | ||
|
|
bc1151c340 | ||
|
|
32268c54df | ||
|
|
12df02a0fd | ||
|
|
a51644963a | ||
|
|
9f524615a5 | ||
|
|
8ad171ee56 | ||
|
|
a8757a888a | ||
|
|
24fb83a565 | ||
|
|
60cfcb4d30 | ||
|
|
488bbd86da | ||
|
|
a923f48c87 | ||
|
|
15e93f09bd | ||
|
|
eb12d061ee | ||
|
|
95efe812c3 | ||
|
|
9be102e1dd | ||
|
|
b0a00a71d3 |
6
.gitignore
vendored
6
.gitignore
vendored
@@ -27,6 +27,10 @@ build/Release
|
||||
node_modules
|
||||
node_modules/*
|
||||
|
||||
# Dist Files
|
||||
dist/*
|
||||
dist
|
||||
|
||||
# Optional npm cache directory
|
||||
.npm
|
||||
|
||||
@@ -45,4 +49,4 @@ test/core/modules/test_outputs/*
|
||||
node_modules/
|
||||
node_modules/*
|
||||
test_outputs
|
||||
/test_outputs
|
||||
/test_outputs
|
||||
|
||||
@@ -37,6 +37,8 @@ test.js
|
||||
output.txt
|
||||
output/
|
||||
|
||||
|
||||
|
||||
examples/
|
||||
icons/
|
||||
|
||||
|
||||
@@ -27,7 +27,7 @@ If you find a bug please list it here, and help us develop Image Sequencer by [o
|
||||
|
||||
## Contributing modules
|
||||
|
||||
Most contributions can happen in modules, rather than to core library code. Modules and their [corresponding info files](#info-file) are included into the library in this file: https://github.com/publiclab/image-sequencer/blob/master/src/Modules.js#L5-L7
|
||||
Most contributions can happen in modules, rather than to core library code. Modules and their [corresponding info files](#info-file) are included into the library in this file: https://github.com/publiclab/image-sequencer/blob/main/src/Modules.js#L5-L7
|
||||
|
||||
Module names, descriptions, and parameters are set in the `info.json` file -- [see below](#info-file).
|
||||
|
||||
@@ -142,7 +142,7 @@ input = {
|
||||
pixelManipulation: "general purpose pixel manipulation API, see https://github.com/publiclab/image-sequencer/blob/master/src/modules/_nomodule/PixelManipulation.js"
|
||||
}
|
||||
```
|
||||
For example usage for pixelManipulation see https://github.com/publiclab/image-sequencer/blob/master/src/modules/Invert/Module.js
|
||||
For example usage of pixelManipulation see https://github.com/publiclab/image-sequencer/blob/main/src/modules/Invert/Module.js
|
||||
|
||||
**The module is included in the browser inside a script tag and since the code runs directly in the browser if any other module is required apart from the apis available on the input object, it should be either bundled with the module code and imported in es6 format or the module code must be browserified before distribution for browser**
|
||||
|
||||
@@ -264,9 +264,9 @@ The `progressObj` parameter of `draw()` is not consumed unless a custom progress
|
||||
|
||||
### Module example
|
||||
|
||||
See existing module `green-channel` for an example: https://github.com/publiclab/image-sequencer/tree/master/src/modules/GreenChannel/Module.js
|
||||
See existing module `channel` for an example: https://github.com/publiclab/image-sequencer/blob/main/src/modules/Channel/Module.js
|
||||
|
||||
The `green-channel` module is included into the core modules here: https://github.com/publiclab/image-sequencer/blob/master/src/Modules.js#L5-L7
|
||||
The `channel` module is included into the core modules here: https://github.com/publiclab/image-sequencer/blob/main/src/Modules.js#L5-L7
|
||||
|
||||
For help integrating, please open an issue.
|
||||
|
||||
|
||||
29
README.md
29
README.md
@@ -4,8 +4,9 @@ Image Sequencer
|
||||
|
||||
[](https://travis-ci.org/publiclab/image-sequencer)
|
||||
|
||||
**Latest Stable Demo**: https://sequencer.publiclab.org
|
||||
**Latest Beta Demo**: https://beta.sequencer.publiclab.org
|
||||
- **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/
|
||||
|
||||
## Why
|
||||
|
||||
@@ -18,9 +19,9 @@ Image Sequencer is different from other image processing systems because it's _n
|
||||
|
||||
The following diagrams attempt to explain how the applications various components interconnect:
|
||||
|
||||

|
||||

|
||||
|
||||

|
||||

|
||||
|
||||
It also for prototypes other related ideas:
|
||||
|
||||
@@ -28,15 +29,17 @@ It also for prototypes other related ideas:
|
||||
* test-based image processing -- the ability to create a sequence of steps that do the same task as other image processing tools, provable with example before/after images to compare with
|
||||
* logging each step -- to produce an evidentiary record of modifications to an original image
|
||||
* cascading changes -- change an earlier step's settings, and see those changes affect later steps
|
||||
* "small modules" -- based extensibility: see [Contributing](https://github.com/publiclab/image-sequencer/blob/master/CONTRIBUTING.md)
|
||||
* "small modules" -- based extensibility: see [Contributing](https://github.com/publiclab/image-sequencer/blob/main/CONTRIBUTING.md)
|
||||
|
||||
|
||||
## Examples
|
||||
|
||||
* [Simple Demo](https://publiclab.github.io/image-sequencer/)
|
||||
* [Simple Demo](https://sequencer.publiclab.org)
|
||||
* [Latest Beta Demo](https://beta.sequencer.publiclab.org)
|
||||
|
||||
A diagram of this running 5 steps on a single sample image may help explain how it works:
|
||||
|
||||

|
||||

|
||||
|
||||
## Jump to:
|
||||
|
||||
@@ -47,8 +50,8 @@ A diagram of this running 5 steps on a single sample image may help explain how
|
||||
* [Method Chaining](#method-chaining)
|
||||
* [Multiple Images](#multiple-images)
|
||||
* [Creating a User Interface](#creating-a-user-interface)
|
||||
* [Contributing](https://github.com/publiclab/image-sequencer/blob/master/CONTRIBUTING.md)
|
||||
* [Submit a Module](https://github.com/publiclab/image-sequencer/blob/master/CONTRIBUTING.md#contributing-modules)
|
||||
* [Contributing](https://github.com/publiclab/image-sequencer/blob/main/CONTRIBUTING.md)
|
||||
* [Submit a Module](https://github.com/publiclab/image-sequencer/blob/main/CONTRIBUTING.md#contributing-modules)
|
||||
* [Get Demo Bookmarklet](https://publiclab.org/w/imagesequencerbookmarklet)
|
||||
|
||||
## Installation
|
||||
@@ -56,12 +59,12 @@ A diagram of this running 5 steps on a single sample image may help explain how
|
||||
This library conveniently works in the browser, in Node, and on the command line (CLI).
|
||||
|
||||
### Unix based platforms
|
||||
You can set up a local environment to test the UI with `sudo npm run setup` followed by `npm start`
|
||||
You can set up a local environment to test the UI with `npm run setup` followed by `npm start`.
|
||||
|
||||
### Windows
|
||||
Our npm scripts do not support windows shells, please run the following snippet in PowerShell.
|
||||
```powershell
|
||||
npm i ; npm i -g grunt grunt-cli ; grunt serve
|
||||
npm i ; npm i -g grunt grunt-cli ; grunt build; grunt serve
|
||||
```
|
||||
In case of a port conflict please run the following
|
||||
```powershell
|
||||
@@ -70,12 +73,12 @@ npm i -g http-server ; http-server -p 3000
|
||||
|
||||
### Browser
|
||||
|
||||
Just include [image-sequencer.js](https://publiclab.github.io/image-sequencer/dist/image-sequencer.js) in the Head section of your web page. See the [demo here](https://publiclab.github.io/image-sequencer/)!
|
||||
Just include [image-sequencer.min.js](https://github.com/publiclab/image-sequencer/blob/stable/dist/image-sequencer.min.js) in the Head section of your web page. See the [demo here](https://sequencer.publiclab.org)!
|
||||
|
||||
### Node (via NPM)
|
||||
|
||||
(You must have NPM for this)
|
||||
Add `image-sequencer` to your list of dependencies and run `$ npm install`
|
||||
Add `image-sequencer` to your list of dependencies and run `npm install`
|
||||
|
||||
### CLI
|
||||
|
||||
|
||||
@@ -36,7 +36,6 @@
|
||||
"node_shared_libuv": "false",
|
||||
"node_shared_openssl": "false",
|
||||
"node_shared_zlib": "false",
|
||||
"node_tag": "",
|
||||
"node_use_bundled_v8": "true",
|
||||
"node_use_dtrace": "true",
|
||||
"node_use_etw": "false",
|
||||
|
||||
18088
dist/image-sequencer-ui.js
vendored
18088
dist/image-sequencer-ui.js
vendored
File diff suppressed because it is too large
Load Diff
1
dist/image-sequencer-ui.min.js
vendored
1
dist/image-sequencer-ui.min.js
vendored
File diff suppressed because one or more lines are too long
73628
dist/image-sequencer.js
vendored
73628
dist/image-sequencer.js
vendored
File diff suppressed because one or more lines are too long
1
dist/image-sequencer.min.js
vendored
1
dist/image-sequencer.min.js
vendored
File diff suppressed because one or more lines are too long
@@ -37,7 +37,7 @@ List of Module Documentations
|
||||
32. [Saturation](#saturation-module)
|
||||
33. [Threshold](#threshold)
|
||||
34. [Tint](#tint)
|
||||
35. [WhiteBalance](#white-balance)
|
||||
35. [ColorTemperature](#color-temperature)
|
||||
|
||||
|
||||
## crop-module
|
||||
@@ -571,15 +571,15 @@ where `options` is an object with the following property:
|
||||
* factor : amount of tint (default 0.5)
|
||||
|
||||
|
||||
## White Balance
|
||||
## Color Temperature
|
||||
|
||||
This Change the colour balance of the image by adjusting the colour temperature.
|
||||
This changes the color temperature of the image.
|
||||
|
||||
## Usage
|
||||
|
||||
```js
|
||||
sequencer.loadImage('PATH')
|
||||
.addSteps('white-balance',options)
|
||||
.addSteps('color-temperature',options)
|
||||
.run()
|
||||
```
|
||||
where `options` is an object with the following property:
|
||||
|
||||
@@ -1,14 +1,14 @@
|
||||
/* https://github.com/theleagueof/league-spartan */
|
||||
@font-face {
|
||||
font-family: 'League Spartan';
|
||||
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;
|
||||
font-family: 'League Spartan';
|
||||
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;
|
||||
}
|
||||
|
||||
body {
|
||||
@@ -18,11 +18,19 @@ body {
|
||||
background: #f8f8fa;
|
||||
}
|
||||
|
||||
footer {
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: 'League Spartan';
|
||||
color: #445;
|
||||
}
|
||||
|
||||
body > .container,
|
||||
body > .container-fluid {
|
||||
}
|
||||
|
||||
.center-align {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
@@ -71,17 +79,6 @@ h1 {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.details {
|
||||
border-top: 3px solid #444;
|
||||
padding-left: 6px;
|
||||
}
|
||||
|
||||
.details h3 {
|
||||
font-family: monospace;
|
||||
margin-top: 12px;
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
.det {
|
||||
padding: 10px 16px;
|
||||
text-decoration: italic;
|
||||
@@ -100,11 +97,6 @@ h1 {
|
||||
color: #444;
|
||||
}
|
||||
|
||||
.load-spin{
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
}
|
||||
|
||||
#addStep {
|
||||
max-width: 500px;
|
||||
margin: 20px auto;
|
||||
@@ -159,19 +151,19 @@ h1 {
|
||||
}
|
||||
|
||||
#move-up {
|
||||
position: fixed;
|
||||
bottom: 50px;
|
||||
right: 40px;
|
||||
z-index: 550;
|
||||
display: none;
|
||||
background:transparent;
|
||||
border:none;
|
||||
position: fixed;
|
||||
bottom: 50px;
|
||||
right: 40px;
|
||||
z-index: 550;
|
||||
display: none;
|
||||
background:transparent;
|
||||
border:none;
|
||||
}
|
||||
|
||||
#move-up i {
|
||||
font-size:60px;
|
||||
opacity:0.7;
|
||||
color:#BABABA;
|
||||
font-size:60px;
|
||||
opacity:0.7;
|
||||
color:#BABABA;
|
||||
}
|
||||
|
||||
.btn-circle{
|
||||
@@ -208,7 +200,7 @@ h1 {
|
||||
.savesequencemsg{
|
||||
display: none;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.notification {
|
||||
background-color: #808b96;
|
||||
@@ -252,7 +244,11 @@ a.name-header{
|
||||
}
|
||||
|
||||
.step-column{
|
||||
display:flex;
|
||||
align-content: center;
|
||||
justify-content: center;
|
||||
display:flex;
|
||||
align-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.trash-container button.btn-xs {
|
||||
margin-top: -5px !important;
|
||||
}
|
||||
|
||||
@@ -2,7 +2,6 @@
|
||||
|
||||
<html>
|
||||
|
||||
|
||||
<head>
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
@@ -16,7 +15,6 @@
|
||||
<meta property="og:url" content="https://sequencer.publiclab.org">
|
||||
<meta property="og:title" content="Image Sequencer">
|
||||
|
||||
|
||||
<title>Image Sequencer</title>
|
||||
|
||||
<script src="../node_modules/jquery/dist/jquery.min.js"></script>
|
||||
@@ -35,7 +33,6 @@
|
||||
<script src="../node_modules/selectize/dist/js/standalone/selectize.min.js"></script>
|
||||
</head>
|
||||
|
||||
|
||||
<body>
|
||||
|
||||
<link href="../node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
@@ -130,12 +127,16 @@
|
||||
<p>Crop</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="center-align">
|
||||
<div class="row center-align">
|
||||
<div class="col-md-8">
|
||||
|
||||
<select id="selectStep" >
|
||||
<!-- The default null selection has been appended manually in demo.js
|
||||
This is because the options in select are overritten when options are appended.-->
|
||||
</select>
|
||||
<button class="btn btn-success btn-lg" name="add" id="add-step-btn">Add Step</button>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<button class="btn btn-success btn-lg" name="add" id="add-step-btn">Add Step</button></div>
|
||||
</div>
|
||||
<div class="row center-align">
|
||||
<button id="resetButton" class="btn btn-default btn-lg" style=" margin: 20px 35px 0px 35px; width:100%;">Clear All Steps</button>
|
||||
@@ -147,13 +148,6 @@
|
||||
<section id="sequence-actions" class="panel">
|
||||
<div class="panel-body">
|
||||
|
||||
<div class="row center-align">
|
||||
<!--<button class="btn btn-primary btn-block btn-lg" name="save-sequence" id="save-seq">Save Sequence</button> -->
|
||||
<!--<button class="btn btn-primary btn-block btn-lg" id="download-btn" name="download" style="display: block; margin: 0px 10px 0px 0px; width: 250px;">Download PNG</button> -->
|
||||
<button class="btn btn-primary btn-block btn-lg js-view-as-gif" id="gif" style="margin: 0px 35px 0px 35px;width:100%;">View GIF</button>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="modal fade" id="js-download-gif-modal" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
@@ -185,14 +179,14 @@
|
||||
<div class="panel-body">
|
||||
<div style="text-align:center;">
|
||||
<h2 style="margin-top:20px">Save</h2>
|
||||
<p>Or click ARROW to save the entire sequence as a workflow for future use.</p>
|
||||
<select class="form-control input-md" id="selectSaveOption" style="margin-top:20px">
|
||||
<option>Save as PNG</option>
|
||||
<option>Save as GIF (all steps)</option>
|
||||
<option>Save sequence</option>
|
||||
<option>Save sequence string</option>
|
||||
</select>
|
||||
<button id="saveButton" class="btn btn-primary btn-lg" style="margin-top:20px; margin-bottom:0px;align:center; width:100%;">Save</button>
|
||||
<select class="form-control input-md" id="selectSaveOption" style="margin-top:20px">
|
||||
<option>Save as PNG</option>
|
||||
<option>Save as GIF (all steps)</option>
|
||||
<option>Save sequence</option>
|
||||
<option>Save sequence string</option>
|
||||
</select>
|
||||
<p><button id="saveButton" class="btn btn-primary btn-lg" style="margin-top:20px; margin-bottom:0px;align:center; width:100%;">Save</button></p>
|
||||
<p><button class="btn btn-default js-view-as-gif" id="gif" style="align:center;">Preview GIF</button></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -206,19 +200,17 @@
|
||||
<div class="col-md-6">
|
||||
<h2>Need Help?</h2>
|
||||
<p>
|
||||
Post a link to this and ask help from other community members on <a href="https://github.com/publiclab/image-sequencer/issues/new">Github Issues</a>
|
||||
</p>
|
||||
<p>
|
||||
<a class="btn btn-primary" href="https://gitter.im/publiclab/publiclab">Ask a question on Gitter</a>
|
||||
<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>
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<h2>Improve this tool</h2>
|
||||
<p>
|
||||
This is an open source toolkit which you can help add to and improve on <a href="https://github.com/publiclab/image-sequencer/">Github</a>
|
||||
This is an open source toolkit which you can help improve on Github
|
||||
</p>
|
||||
<p>
|
||||
<a class="btn btn-primary" href="https://github.com/publiclab/image-sequencer">View the code »</a>
|
||||
<a class="btn btn-default" href="https://github.com/publiclab/image-sequencer">View the code »</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -25,46 +25,50 @@ function DefaultHtmlStepUi(_sequencer, options) {
|
||||
|
||||
step.ui =
|
||||
'\
|
||||
<div class="container">\
|
||||
<div class="row step">\
|
||||
<form class="input-form">\
|
||||
<div class="col-md-4 details">\
|
||||
<h3>\
|
||||
<span class = "toggle">' +step.name + ' <i class="fa fa-caret-up toggleIcon" aria-hidden="true"></i></span>' +
|
||||
'<span class="load-spin" style="display:none;"><i class="fa fa-circle-o-notch fa-spin"></i></span>' +
|
||||
'</h3><div class="cal collapse in"><p><i>"'+
|
||||
(step.description || "") +
|
||||
'</i></p></div>\
|
||||
</div>\
|
||||
</form>\
|
||||
<div class="col-md-8 cal collapse in step-column">\
|
||||
<div class="load" style="display:none;"><i class="fa fa-circle-o-notch fa-spin"></i></div>\
|
||||
<div class="step-image">\
|
||||
<a class="cal collapse in"><img alt="" class="img-thumbnail step-thumbnail"/></a>\
|
||||
</div>\
|
||||
</div>\
|
||||
</div>\
|
||||
</div>\
|
||||
</div>';
|
||||
<div class="container-fluid step-container">\
|
||||
<form class="input-form">\
|
||||
<div class="panel panel-default">\
|
||||
<div class="panel-heading">\
|
||||
<div class="trash-container pull-right"></div>\
|
||||
<h3 class="panel-title">' +
|
||||
'<span class="toggle">' +step.name + ' <span class="caret"></span>\
|
||||
<span class="load-spin pull-right" style="display:none;padding:1px 8px;"><i class="fa fa-circle-o-notch fa-spin"></i></span>\
|
||||
</h3>\
|
||||
</div>\
|
||||
<div class="panel-body cal collapse in">\
|
||||
<div class="row step">\
|
||||
<div class="col-md-4 details container-fluid">\
|
||||
<div class="cal collapse in"><p>' +
|
||||
'<i>' + (step.description || "") + '</i>' +
|
||||
'</p></div>\
|
||||
</div>\
|
||||
<div class="col-md-8 cal collapse in step-column">\
|
||||
<div class="load load-spin" style="display:none;"><i class="fa fa-circle-o-notch fa-spin"></i></div>\
|
||||
<div class="step-image">\
|
||||
<a class="cal collapse in"><img class="img-thumbnail step-thumbnail"/></a>\
|
||||
</div>\
|
||||
</div>\
|
||||
</div>\
|
||||
</div>\
|
||||
<div class="panel-footer cal collapse in"></div>\
|
||||
</div>\
|
||||
</form>\
|
||||
</div>';
|
||||
|
||||
var tools =
|
||||
'<div class="cal collapse in"><div class="tools btn-group">\
|
||||
<button confirm="Are you sure?" class="remove btn btn btn-default">\
|
||||
<i class="fa fa-trash"></i>\
|
||||
</button>\
|
||||
<button class="btn insert-step" style="margin-left:10px;border-radius:6px;background-color:#fff;border:solid #bababa 1.1px;" >\
|
||||
<i class="fa fa-plus"></i> Add\
|
||||
</button>\
|
||||
</div>\
|
||||
'<div class="trash">\
|
||||
<button confirm="Are you sure?" class="remove btn btn-default btn-xs">\
|
||||
<i class="fa fa-trash"></i>\
|
||||
</button>\
|
||||
</div>';
|
||||
|
||||
var util = intermediateHtmlStepUi(_sequencer, step);
|
||||
|
||||
var parser = new DOMParser();
|
||||
step.ui = parser.parseFromString(step.ui, "text/html");
|
||||
step.ui = step.ui.querySelector("div.container");
|
||||
step.ui = step.ui.querySelector("div.container-fluid");
|
||||
step.linkElements = step.ui.querySelectorAll("a");
|
||||
step.imgElement = step.ui.querySelector("a img");
|
||||
step.imgElement = step.ui.querySelector("a img.img-thumbnail");
|
||||
|
||||
if (_sequencer.modulesInfo().hasOwnProperty(step.name)) {
|
||||
var inputs = _sequencer.modulesInfo(step.name).inputs;
|
||||
@@ -125,29 +129,30 @@ function DefaultHtmlStepUi(_sequencer, options) {
|
||||
</div>";
|
||||
step.ui.querySelector("div.details").appendChild(div);
|
||||
}
|
||||
|
||||
$(step.ui.querySelector("div.details")).append(
|
||||
'<div class="cal collapse in"><p><button type="submit" class="btn btn-default btn-save" disabled = "true" >Apply</button><span> Press apply to see changes</span></p></div>'
|
||||
$(step.ui.querySelector("div.panel-footer")).append(
|
||||
'<div class="cal collapse in"><button type="submit" class="btn btn-sm btn-default btn-save" disabled = "true" >Apply</button> <small style="padding-top:2px;">Press apply to see changes</small></div>'
|
||||
);
|
||||
|
||||
|
||||
$(step.ui.querySelector("div.panel-footer")).prepend(
|
||||
'<button class="pull-right btn btn-default btn-sm insert-step" >\
|
||||
<i class="fa fa-plus"></i> Insert Step\
|
||||
</button>'
|
||||
);
|
||||
}
|
||||
|
||||
if (step.name != "load-image") {
|
||||
step.ui
|
||||
.querySelector("div.details")
|
||||
.appendChild(
|
||||
.querySelector("div.trash-container")
|
||||
.prepend(
|
||||
parser.parseFromString(tools, "text/html").querySelector("div")
|
||||
);
|
||||
$(step.ui.querySelectorAll(".remove")).on('click', function() {notify('Step Removed','remove-notification')});
|
||||
$(step.ui.querySelectorAll(".insert-step")).on('click', function() { util.insertStep(step.ID) });
|
||||
|
||||
$(step.ui.querySelectorAll(".insert-step")).on('click', function() { util.insertStep(step.ID) });
|
||||
// Insert the step's UI in the right place
|
||||
if (stepOptions.index == _sequencer.steps.length) {
|
||||
stepsEl.appendChild(step.ui);
|
||||
$("#steps .container:nth-last-child(1) .insert-step").prop('disabled',true);
|
||||
if($("#steps .container:nth-last-child(2)"))
|
||||
$("#steps .container:nth-last-child(2) .insert-step").prop('disabled',false);
|
||||
$("#steps .step-container:nth-last-child(1) .insert-step").prop('disabled',true);
|
||||
if($("#steps .step-container:nth-last-child(2)"))
|
||||
$("#steps .step-container:nth-last-child(2) .insert-step").prop('disabled',false);
|
||||
} else {
|
||||
stepsEl.insertBefore(step.ui, $(stepsEl).children()[stepOptions.index]);
|
||||
}
|
||||
@@ -225,16 +230,13 @@ function DefaultHtmlStepUi(_sequencer, options) {
|
||||
function onDraw(step) {
|
||||
$(step.ui.querySelector(".load")).show();
|
||||
$(step.ui.querySelector("img")).hide();
|
||||
if( $(step.ui.querySelector(".toggleIcon")).hasClass("fa-caret-down") )
|
||||
{
|
||||
$(step.ui.querySelector(".load-spin")).show();
|
||||
}
|
||||
$(step.ui.querySelectorAll(".load-spin")).show();
|
||||
}
|
||||
|
||||
function onComplete(step) {
|
||||
$(step.ui.querySelector(".load")).hide();
|
||||
$(step.ui.querySelector("img")).show();
|
||||
$(step.ui.querySelector(".load-spin")).hide();
|
||||
$(step.ui.querySelectorAll(".load-spin")).hide();
|
||||
$(step.ui.querySelector(".load")).hide();
|
||||
|
||||
step.imgElement.src = (step.name == "load-image") ? step.output.src : step.output;
|
||||
var imgthumbnail = step.ui.querySelector(".img-thumbnail");
|
||||
@@ -299,7 +301,7 @@ function DefaultHtmlStepUi(_sequencer, options) {
|
||||
|
||||
function onRemove(step) {
|
||||
step.ui.remove();
|
||||
$("#steps .container:nth-last-child(1) .insert-step").prop('disabled',true);
|
||||
$("#steps .step-container:nth-last-child(1) .insert-step").prop('disabled',true);
|
||||
$('div[class*=imgareaselect-]').remove();
|
||||
}
|
||||
|
||||
@@ -319,7 +321,8 @@ function DefaultHtmlStepUi(_sequencer, options) {
|
||||
|
||||
$('#'+id).fadeIn(500).delay(200).fadeOut(500);
|
||||
}
|
||||
|
||||
|
||||
|
||||
return {
|
||||
getPreview: getPreview,
|
||||
onSetup: onSetup,
|
||||
|
||||
@@ -47,12 +47,16 @@ function IntermediateHtmlStepUi(_sequencer, step, options) {
|
||||
<p>Crop</p>\
|
||||
</div>\
|
||||
</div>\
|
||||
<div class="center-align">\
|
||||
<div class="row center-align">\
|
||||
<div class="col-md-8">\
|
||||
<select class="form-control input-lg" id="selectStep">\
|
||||
<!-- The default null selection has been appended manually in demo.js\
|
||||
This is because the options in select are overritten when options are appended.-->\
|
||||
</select>\
|
||||
<div>\
|
||||
<div class="col-md-4">\
|
||||
<button class="btn btn-success btn-lg" name="add" id="add-step-btn">Add Step</button>\
|
||||
<div>\
|
||||
</div>\
|
||||
</div>\
|
||||
</div>\
|
||||
|
||||
3625
package-lock.json
generated
3625
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -37,7 +37,7 @@
|
||||
"imagejs": "0.0.9",
|
||||
"imgareaselect": "git://github.com/jywarren/imgareaselect.git#v1.0.0-rc.2",
|
||||
"jquery": "^3.3.1",
|
||||
"jsdom": "^13.1.0",
|
||||
"jsdom": "^14.0.0",
|
||||
"jsqr": "^1.1.1",
|
||||
"lodash": "^4.17.11",
|
||||
"ndarray-gaussian-filter": "^1.0.0",
|
||||
|
||||
@@ -34,7 +34,8 @@ module.exports = {
|
||||
'resize': require('./modules/Resize'),
|
||||
'rotate': require('./modules/Rotate'),
|
||||
'saturation': require('./modules/Saturation'),
|
||||
'text-overlay': require('./modules/TextOverlay'),
|
||||
'threshold': require('./modules/Threshold'),
|
||||
'tint': require('./modules/Tint'),
|
||||
'white-balance': require('./modules/WhiteBalance')
|
||||
}
|
||||
'color-temperature': require('./modules/ColorTemperature')
|
||||
}
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
module.exports = function Balance(options, UI) {
|
||||
module.exports = function ColorTemperature(options, UI) {
|
||||
|
||||
var output;
|
||||
|
||||
@@ -78,4 +78,4 @@ module.exports = function Balance(options, UI) {
|
||||
UI: UI
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
4
src/modules/ColorTemperature/index.js
Normal file
4
src/modules/ColorTemperature/index.js
Normal file
@@ -0,0 +1,4 @@
|
||||
module.exports = [
|
||||
require('./Module'),
|
||||
require('./info.json')
|
||||
]
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "White Balance",
|
||||
"description": "Change the colour balance of the image by adjusting the colour temperature.",
|
||||
"name": "Color Temperature",
|
||||
"description": "Changes the color temperature of the image.",
|
||||
"inputs": {
|
||||
"temperature": {
|
||||
"type": "integer",
|
||||
@@ -8,5 +8,5 @@
|
||||
"default": 6000
|
||||
}
|
||||
},
|
||||
"docs-link":"https://github.com/publiclab/image-sequencer/blob/main/docs/MODULES.md#white-balance"
|
||||
"docs-link":"https://github.com/publiclab/image-sequencer/blob/main/docs/MODULES.md#color-temperature"
|
||||
}
|
||||
@@ -7,7 +7,7 @@ module.exports = function edgeDetect(options, UI) {
|
||||
options.blur = options.blur || defaults.blur;
|
||||
options.highThresholdRatio = options.highThresholdRatio || defaults.highThresholdRatio;
|
||||
options.lowThresholdRatio = options.lowThresholdRatio || defaults.lowThresholdRatio;
|
||||
options.hystereis = options.hysteresis || defaults.hysteresis;
|
||||
options.hysteresis = options.hysteresis || defaults.hysteresis;
|
||||
|
||||
var output;
|
||||
|
||||
@@ -27,7 +27,7 @@ module.exports = function edgeDetect(options, UI) {
|
||||
|
||||
function extraManipulation(pixels) {
|
||||
pixels = require('ndarray-gaussian-filter')(pixels, options.blur);
|
||||
pixels = require('./EdgeUtils')(pixels, options.highThresholdRatio, options.lowThresholdRatio, options.hystereis);
|
||||
pixels = require('./EdgeUtils')(pixels, options.highThresholdRatio, options.lowThresholdRatio, options.hysteresis);
|
||||
return pixels;
|
||||
}
|
||||
|
||||
|
||||
51
src/modules/TextOverlay/Module.js
Normal file
51
src/modules/TextOverlay/Module.js
Normal file
@@ -0,0 +1,51 @@
|
||||
|
||||
module.exports = function TextOverlay(options,UI) {
|
||||
|
||||
var output;
|
||||
|
||||
function draw(input, callback, progressObj) {
|
||||
|
||||
progressObj.stop(true);
|
||||
progressObj.overrideFlag = true;
|
||||
|
||||
var step = this;
|
||||
if (!options.step.inBrowser) { // This module is only for browser
|
||||
this.output = input;
|
||||
callback();
|
||||
}
|
||||
else{
|
||||
var priorStep = this.getStep(-1); // get the previous step to add text onto it.
|
||||
|
||||
function extraManipulation(pixels) {
|
||||
//if (options.step.inBrowser)
|
||||
pixels = require('./TextOverlay')(pixels, options,priorStep);
|
||||
return pixels
|
||||
}
|
||||
|
||||
function output(image, datauri, mimetype) {
|
||||
|
||||
// This output is accesible by Image Sequencer
|
||||
step.output = { src: datauri, format: mimetype };
|
||||
|
||||
}
|
||||
|
||||
return require('../_nomodule/PixelManipulation.js')(input, {
|
||||
output: output,
|
||||
extraManipulation: extraManipulation,
|
||||
format: input.format,
|
||||
image: options.image,
|
||||
inBrowser: options.inBrowser,
|
||||
callback: callback
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
options: options,
|
||||
draw: draw,
|
||||
output: output,
|
||||
UI: UI
|
||||
}
|
||||
}
|
||||
|
||||
25
src/modules/TextOverlay/TextOverlay.js
Normal file
25
src/modules/TextOverlay/TextOverlay.js
Normal file
@@ -0,0 +1,25 @@
|
||||
module.exports = exports = function(pixels, options,priorstep){
|
||||
var defaults = require('./../../util/getDefaults.js')(require('./info.json'));
|
||||
|
||||
options.text = options.text || defaults.text;
|
||||
options.x = options.x || defaults.x;
|
||||
options.y = options.y || defaults.y;
|
||||
options.font = options.font || defaults.font;
|
||||
options.color = options.color || defaults.color;
|
||||
options.size = options.size || defaults.size;
|
||||
|
||||
|
||||
var img = $(priorstep.imgElement);
|
||||
var canvas = document.createElement("canvas");
|
||||
canvas.width = pixels.shape[0]; //img.width();
|
||||
canvas.height = pixels.shape[1]; //img.height();
|
||||
var ctx = canvas.getContext('2d');
|
||||
ctx.drawImage(img[0], 0, 0);
|
||||
ctx.fillStyle = options.color;
|
||||
ctx.font = options.size +"px " + options.font;
|
||||
ctx.fillText(options.text, options.x, options.y);
|
||||
|
||||
var myImageData = ctx.getImageData(0,0,canvas.width,canvas.height);
|
||||
pixels.data = myImageData.data
|
||||
return pixels;
|
||||
}
|
||||
53
src/modules/TextOverlay/info.json
Normal file
53
src/modules/TextOverlay/info.json
Normal file
@@ -0,0 +1,53 @@
|
||||
{
|
||||
"name": "Text-Overlay",
|
||||
"description": "Overlay text on image.",
|
||||
"inputs": {
|
||||
"text": {
|
||||
"type": "string",
|
||||
"desc": "Enter the text to overlay.",
|
||||
"default": "Lorem ipsum"
|
||||
},
|
||||
"x": {
|
||||
"type": "integer",
|
||||
"desc": "Starting text horizontal position.",
|
||||
"default": "20"
|
||||
},
|
||||
"y": {
|
||||
"type": "integer",
|
||||
"desc": "Starting text vertical position.",
|
||||
"default": "20"
|
||||
},
|
||||
"font": {
|
||||
"type": "select",
|
||||
"desc": "Select the font style.",
|
||||
"default": "serif",
|
||||
"values": [
|
||||
"serif",
|
||||
"arial",
|
||||
"times",
|
||||
"courier",
|
||||
"Montserrat"
|
||||
]
|
||||
},
|
||||
"color": {
|
||||
"type": "select",
|
||||
"desc": "Select the text color.",
|
||||
"default": "black",
|
||||
"values": [
|
||||
"black",
|
||||
"blue",
|
||||
"green",
|
||||
"red",
|
||||
"white",
|
||||
"pink",
|
||||
"orange"
|
||||
]
|
||||
},
|
||||
"size": {
|
||||
"type" : "integer",
|
||||
"desc": "Enter the font size in pixels.",
|
||||
"default": "12"
|
||||
}
|
||||
},
|
||||
"only": "browser"
|
||||
}
|
||||
@@ -6,26 +6,26 @@ require('../../../src/ImageSequencer')
|
||||
|
||||
var sequencer = ImageSequencer({ui: false})
|
||||
var red = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABlBMVEX+AAD///+KQee0AAAAAWJLR0QB/wIt3gAAAAd0SU1FB+EGHRIVAvrm6EMAAAAMSURBVAjXY2AgDQAAADAAAceqhY4AAAAldEVYdGRhdGU6Y3JlYXRlADIwMTctMDYtMjlUMTg6MjE6MDIrMDI6MDDGD83DAAAAJXRFWHRkYXRlOm1vZGlmeQAyMDE3LTA2LTI5VDE4OjIxOjAyKzAyOjAwt1J1fwAAAABJRU5ErkJggg=="
|
||||
var benchmark = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAklEQVR4AewaftIAAACSSURBVKXBMUoDURAA0Dc/w4ZgJdh5AE/urawsBMuIpDBkx4VNESzWH/57gTKgGZSuXvGAPQJh2wkfyHd8onDAhIaw7Yxn5CP2mJFIBMK2whPygAkXq7AK/5uQgR0aCqFfQ1oEAuU+gXQj3KfQDEp/lH6FdFUolD4XfCEtfnDGjNLnhDekxRHfmFH6vFjlzphm0C96GR7JNsLICQAAAABJRU5ErkJggg=="
|
||||
var benchmark = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAklEQVR4AewaftIAAAA0SURBVKXBwRGAIBDAwBiu/44ZeWgFZPcBXgKJht/mzmwaiSSSSCKJJJJIIomGS4vPLBqJDh2XAyeCsOZ9AAAAAElFTkSuQmCC"
|
||||
var target = 'test_outputs'
|
||||
|
||||
var options = {blur: 3.25}
|
||||
|
||||
test('Blur module loads correctly', function(t) {
|
||||
sequencer.loadImages('test', red)
|
||||
sequencer.loadImages(red)
|
||||
sequencer.addSteps('blur', options)
|
||||
t.equal(sequencer.images.test.steps[1].options.name, 'blur', 'Blur module is getting loaded')
|
||||
t.equal(sequencer.steps[1].options.name, 'blur', 'Blur module is getting loaded')
|
||||
t.end()
|
||||
})
|
||||
|
||||
test('Blur module loads with correct options', function(t) {
|
||||
t.equal(sequencer.images.test.steps[1].options.blur, 3.25, 'Options are correct');
|
||||
t.equal(sequencer.steps[1].options.blur, 3.25, 'Options are correct');
|
||||
t.end();
|
||||
})
|
||||
|
||||
test('Blur module works correctly', function(t) {
|
||||
sequencer.run({mode:'test'}, function(out) {
|
||||
var result = sequencer.images.test.steps[1].output.src
|
||||
var result = sequencer.steps[1].output.src
|
||||
base64Img.imgSync(result, target, 'result')
|
||||
base64Img.imgSync(benchmark, target, 'benchmark')
|
||||
result = './test_outputs/result.png'
|
||||
|
||||
@@ -13,20 +13,20 @@ var target = 'test_outputs'
|
||||
var options = {channel: 'red'}
|
||||
|
||||
test('Channel module loads correctly', function(t) {
|
||||
sequencer.loadImages('test', red)
|
||||
sequencer.loadImages( red)
|
||||
sequencer.addSteps('channel', options)
|
||||
t.equal(sequencer.images.test.steps[1].options.name, 'channel', 'Channel module is getting loaded')
|
||||
t.equal(sequencer.steps[1].options.name, 'channel', 'Channel module is getting loaded')
|
||||
t.end()
|
||||
})
|
||||
|
||||
test('Channel module loads with correct options', function(t) {
|
||||
t.equal(sequencer.images.test.steps[1].options.channel, 'red', 'Options are correct');
|
||||
t.equal(sequencer.steps[1].options.channel, 'red', 'Options are correct');
|
||||
t.end();
|
||||
})
|
||||
|
||||
test('Channel module works correctly', function(t) {
|
||||
sequencer.run({mode:'test'}, function(out) {
|
||||
var result = sequencer.images.test.steps[1].output.src
|
||||
var result = sequencer.steps[1].output.src
|
||||
base64Img.imgSync(result, target, 'result')
|
||||
base64Img.imgSync(benchmark, target, 'benchmark')
|
||||
result = './test_outputs/result.png'
|
||||
|
||||
@@ -13,20 +13,20 @@ var target = 'test_outputs'
|
||||
var options = {colormap: 'blutoredjet'}
|
||||
|
||||
test('Colormap module loads correctly', function(t) {
|
||||
sequencer.loadImages('test', red)
|
||||
sequencer.loadImages( red)
|
||||
sequencer.addSteps('colormap', options)
|
||||
t.equal(sequencer.images.test.steps[1].options.name, 'colormap', 'Colormap module is getting loaded')
|
||||
t.equal(sequencer.steps[1].options.name, 'colormap', 'Colormap module is getting loaded')
|
||||
t.end()
|
||||
})
|
||||
|
||||
test('Colormap module loads with correct options', function(t) {
|
||||
t.equal(sequencer.images.test.steps[1].options.colormap, 'blutoredjet', 'Options are correct');
|
||||
t.equal(sequencer.steps[1].options.colormap, 'blutoredjet', 'Options are correct');
|
||||
t.end();
|
||||
})
|
||||
|
||||
test('Colormap module works correctly', function(t) {
|
||||
sequencer.run({mode:'test'}, function(out) {
|
||||
var result = sequencer.images.test.steps[1].output.src
|
||||
var result = sequencer.steps[1].output.src
|
||||
base64Img.imgSync(result, target, 'result')
|
||||
base64Img.imgSync(benchmark, target, 'benchmark')
|
||||
result = './test_outputs/result.png'
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -13,20 +13,20 @@ var target = 'test_outputs'
|
||||
var options = {dither: 'bayer'}
|
||||
|
||||
test('Dither module loads correctly', function(t) {
|
||||
sequencer.loadImages('test', red)
|
||||
sequencer.loadImages(red)
|
||||
sequencer.addSteps('dither', options)
|
||||
t.equal(sequencer.images.test.steps[1].options.name, 'dither', 'Dither module is getting loaded')
|
||||
t.equal(sequencer.steps[1].options.name, 'dither', 'Dither module is getting loaded')
|
||||
t.end()
|
||||
})
|
||||
|
||||
test('Dither module loads with correct options', function(t) {
|
||||
t.equal(sequencer.images.test.steps[1].options.dither, 'bayer', 'Options are correct');
|
||||
t.equal(sequencer.steps[1].options.dither, 'bayer', 'Options are correct');
|
||||
t.end();
|
||||
})
|
||||
|
||||
test('Dither module works correctly', function(t) {
|
||||
sequencer.run({mode:'test'}, function(out) {
|
||||
var result = sequencer.images.test.steps[1].output.src
|
||||
var result = sequencer.steps[1].output.src
|
||||
base64Img.imgSync(result, target, 'result')
|
||||
base64Img.imgSync(benchmark, target, 'benchmark')
|
||||
result = './test_outputs/result.png'
|
||||
|
||||
@@ -13,20 +13,20 @@ var target = 'test_outputs'
|
||||
var options = {resize: '129%'}
|
||||
|
||||
test('Resize module loads correctly', function(t) {
|
||||
sequencer.loadImages('test', red)
|
||||
sequencer.loadImages(red)
|
||||
sequencer.addSteps('resize', options)
|
||||
t.equal(sequencer.images.test.steps[1].options.name, 'resize', 'Resize module is getting loaded')
|
||||
t.equal(sequencer.steps[1].options.name, 'resize', 'Resize module is getting loaded')
|
||||
t.end()
|
||||
})
|
||||
|
||||
test('Resize module loads with correct options', function(t) {
|
||||
t.equal(sequencer.images.test.steps[1].options.resize, '129%', 'Options are correct');
|
||||
t.equal(sequencer.steps[1].options.resize, '129%', 'Options are correct');
|
||||
t.end();
|
||||
})
|
||||
|
||||
test('Resize module works correctly', function(t) {
|
||||
sequencer.run({mode:'test'}, function(out) {
|
||||
var result = sequencer.images.test.steps[1].output.src
|
||||
var result = sequencer.steps[1].output.src
|
||||
base64Img.imgSync(result, target, 'result')
|
||||
base64Img.imgSync(benchmark, target, 'benchmark')
|
||||
result = './test_outputs/result.png'
|
||||
|
||||
@@ -12,20 +12,20 @@ var target = 'test_outputs'
|
||||
var options = {rotate: 45}
|
||||
|
||||
test('Rotate module loads correctly', function(t) {
|
||||
sequencer.loadImages('test', red)
|
||||
sequencer.loadImages(red)
|
||||
sequencer.addSteps('rotate', options)
|
||||
t.equal(sequencer.images.test.steps[1].options.name, 'rotate', 'Rotate module is getting loaded')
|
||||
t.equal(sequencer.steps[1].options.name, 'rotate', 'Rotate module is getting loaded')
|
||||
t.end()
|
||||
})
|
||||
|
||||
test('Rotate module loads with correct options', function(t) {
|
||||
t.equal(sequencer.images.test.steps[1].options.rotate, 45, 'Options are correct');
|
||||
t.equal(sequencer.steps[1].options.rotate, 45, 'Options are correct');
|
||||
t.end();
|
||||
})
|
||||
|
||||
test('Rotate module works correctly', function(t) {
|
||||
sequencer.run({mode:'test'}, function(out) {
|
||||
var result = sequencer.images.test.steps[1].output.src
|
||||
var result = sequencer.steps[1].output.src
|
||||
base64Img.imgSync(result, target, 'result')
|
||||
base64Img.imgSync(benchmark, target, 'benchmark')
|
||||
result = './test_outputs/result.png'
|
||||
|
||||
42
test/core/modules/text-overlay.js
Normal file
42
test/core/modules/text-overlay.js
Normal file
@@ -0,0 +1,42 @@
|
||||
var test = require('tape');
|
||||
var base64Img = require('base64-img');
|
||||
var looksSame = require('looks-same');
|
||||
|
||||
require('../../../src/ImageSequencer.js');
|
||||
|
||||
var sequencer = ImageSequencer({ ui: false });
|
||||
var options = {text : "Hello World"};
|
||||
var target = 'test_outputs';
|
||||
var red = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABlBMVEX+AAD///+KQee0AAAAAWJLR0QB/wIt3gAAAAd0SU1FB+EGHRIVAvrm6EMAAAAMSURBVAjXY2AgDQAAADAAAceqhY4AAAAldEVYdGRhdGU6Y3JlYXRlADIwMTctMDYtMjlUMTg6MjE6MDIrMDI6MDDGD83DAAAAJXRFWHRkYXRlOm1vZGlmeQAyMDE3LTA2LTI5VDE4OjIxOjAyKzAyOjAwt1J1fwAAAABJRU5ErkJggg==";
|
||||
|
||||
// Test 1 to check text overlay module is getting loaded.
|
||||
test('Load Text Overlay module', function(t) {
|
||||
sequencer.loadImages(red);
|
||||
sequencer.addSteps('text-overlay', options);
|
||||
t.equal(sequencer.steps[1].options.name, 'text-overlay', 'Text Overlay module is getting loaded');
|
||||
t.end();
|
||||
});
|
||||
|
||||
// Test 2 to check options are correct.
|
||||
test('Check Options', function(t) {
|
||||
t.equal(sequencer.steps[1].options.text, "Hello World", 'Options are correct');
|
||||
t.end();
|
||||
});
|
||||
|
||||
// Test 3 to check Text Overlay module works as expected.
|
||||
test('Text Overlay module works correctly', function(t) {
|
||||
sequencer.run({ mode: 'test' }, function(out) {
|
||||
// The test runs in node , and the text overlay is a browser only module,
|
||||
// thus it there is no image processing and output is same as input.
|
||||
var result = sequencer.steps[1].output.src
|
||||
base64Img.imgSync(result, target, 'result')
|
||||
base64Img.imgSync(red, target, 'red')
|
||||
result = './test_outputs/result.png'
|
||||
red = './test_outputs/red.png'
|
||||
looksSame(result, red, function(err, res) {
|
||||
if (err) console.log(err)
|
||||
t.equal(res.equal, true)
|
||||
t.end()
|
||||
})
|
||||
})
|
||||
})
|
||||
46
yarn.lock
46
yarn.lock
@@ -180,7 +180,7 @@ are-we-there-yet@~1.1.2:
|
||||
delegates "^1.0.0"
|
||||
readable-stream "^2.0.6"
|
||||
|
||||
argparse@^1.0.2:
|
||||
argparse@^1.0.7:
|
||||
version "1.0.10"
|
||||
resolved "https://registry.yarnpkg.com/argparse/-/argparse-1.0.10.tgz#bcd6791ea5ae09725e17e5ad988134cd40b3d911"
|
||||
integrity sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==
|
||||
@@ -1887,16 +1887,16 @@ esprima@^1.0.3:
|
||||
resolved "https://registry.yarnpkg.com/esprima/-/esprima-1.2.5.tgz#0993502feaf668138325756f30f9a51feeec11e9"
|
||||
integrity sha1-CZNQL+r2aBODJXVvMPmlH+7sEek=
|
||||
|
||||
esprima@^2.6.0:
|
||||
version "2.7.3"
|
||||
resolved "https://registry.yarnpkg.com/esprima/-/esprima-2.7.3.tgz#96e3b70d5779f6ad49cd032673d1c312767ba581"
|
||||
integrity sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE=
|
||||
|
||||
esprima@^3.1.3:
|
||||
version "3.1.3"
|
||||
resolved "https://registry.yarnpkg.com/esprima/-/esprima-3.1.3.tgz#fdca51cee6133895e3c88d535ce49dbff62a4633"
|
||||
integrity sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM=
|
||||
|
||||
esprima@^4.0.0:
|
||||
version "4.0.1"
|
||||
resolved "https://registry.yarnpkg.com/esprima/-/esprima-4.0.1.tgz#13b04cdb3e6c5d19df91ab6987a8695619b0aa71"
|
||||
integrity sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==
|
||||
|
||||
esprima@~1.0.2:
|
||||
version "1.0.4"
|
||||
resolved "https://registry.yarnpkg.com/esprima/-/esprima-1.0.4.tgz#9f557e08fc3b4d26ece9dd34f8fbf476b62585ad"
|
||||
@@ -2627,9 +2627,9 @@ grunt-legacy-util@~1.1.1:
|
||||
which "~1.3.0"
|
||||
|
||||
grunt@^1.0.3:
|
||||
version "1.0.3"
|
||||
resolved "https://registry.yarnpkg.com/grunt/-/grunt-1.0.3.tgz#b3c99260c51d1b42835766e796527b60f7bba374"
|
||||
integrity sha512-/JzmZNPfKorlCrrmxWqQO4JVodO+DVd5XX4DkocL/1WlLlKVLE9+SdEIempOAxDhWPysLle6afvn/hg7Ck2k9g==
|
||||
version "1.0.4"
|
||||
resolved "https://registry.yarnpkg.com/grunt/-/grunt-1.0.4.tgz#c799883945a53a3d07622e0737c8f70bfe19eb38"
|
||||
integrity sha512-PYsMOrOC+MsdGEkFVwMaMyc6Ob7pKmq+deg1Sjr+vvMWp35sztfwKE7qoN51V+UEtHsyNuMcGdgMLFkBHvMxHQ==
|
||||
dependencies:
|
||||
coffeescript "~1.10.0"
|
||||
dateformat "~1.0.12"
|
||||
@@ -2642,7 +2642,7 @@ grunt@^1.0.3:
|
||||
grunt-legacy-log "~2.0.0"
|
||||
grunt-legacy-util "~1.1.1"
|
||||
iconv-lite "~0.4.13"
|
||||
js-yaml "~3.5.2"
|
||||
js-yaml "~3.13.0"
|
||||
minimatch "~3.0.2"
|
||||
mkdirp "~0.5.1"
|
||||
nopt "~3.0.6"
|
||||
@@ -3346,23 +3346,23 @@ js-graph-algorithms@1.0.18:
|
||||
resolved "https://registry.yarnpkg.com/js-graph-algorithms/-/js-graph-algorithms-1.0.18.tgz#f96ec87bf194f5c0a31365fa0e1d07b7b962d891"
|
||||
integrity sha1-+W7Ie/GU9cCjE2X6Dh0Ht7li2JE=
|
||||
|
||||
js-yaml@~3.5.2:
|
||||
version "3.5.5"
|
||||
resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.5.5.tgz#0377c38017cabc7322b0d1fbcd25a491641f2fbe"
|
||||
integrity sha1-A3fDgBfKvHMisNH7zSWkkWQfL74=
|
||||
js-yaml@~3.13.0:
|
||||
version "3.13.0"
|
||||
resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.13.0.tgz#38ee7178ac0eea2c97ff6d96fff4b18c7d8cf98e"
|
||||
integrity sha512-pZZoSxcCYco+DIKBTimr67J6Hy+EYGZDY/HCWC+iAEA9h1ByhMXAIVUXMcMFpOCxQ/xjXmPI2MkDL5HRm5eFrQ==
|
||||
dependencies:
|
||||
argparse "^1.0.2"
|
||||
esprima "^2.6.0"
|
||||
argparse "^1.0.7"
|
||||
esprima "^4.0.0"
|
||||
|
||||
jsbn@~0.1.0:
|
||||
version "0.1.1"
|
||||
resolved "https://registry.yarnpkg.com/jsbn/-/jsbn-0.1.1.tgz#a5e654c2e5a2deb5f201d96cefbca80c0ef2f513"
|
||||
integrity sha1-peZUwuWi3rXyAdls77yoDA7y9RM=
|
||||
|
||||
jsdom@^13.1.0:
|
||||
version "13.2.0"
|
||||
resolved "https://registry.yarnpkg.com/jsdom/-/jsdom-13.2.0.tgz#b1a0dbdadc255435262be8ea3723d2dba0d7eb3a"
|
||||
integrity sha512-cG1NtMWO9hWpqRNRR3dSvEQa8bFI6iLlqU2x4kwX51FQjp0qus8T9aBaAO6iGp3DeBrhdwuKxckknohkmfvsFw==
|
||||
jsdom@^14.0.0:
|
||||
version "14.0.0"
|
||||
resolved "https://registry.yarnpkg.com/jsdom/-/jsdom-14.0.0.tgz#c7f1441ebcc57902d08d5fb2f6ba2baf746da7c6"
|
||||
integrity sha512-/VkyPmdtbwqpJSkwDx3YyJ3U1oawYNB/h5z8vTUZGAzjtu2OHTeFRfnJqyMHsJ5Cyes23trOmvUpM1GfHH1leA==
|
||||
dependencies:
|
||||
abab "^2.0.0"
|
||||
acorn "^6.0.4"
|
||||
@@ -3601,9 +3601,9 @@ longest@^1.0.1:
|
||||
integrity sha1-MKCy2jj3N3DoKUoNIuZiXtd9AJc=
|
||||
|
||||
looks-same@^7.0.0:
|
||||
version "7.1.1"
|
||||
resolved "https://registry.yarnpkg.com/looks-same/-/looks-same-7.1.1.tgz#599fe1b23a1c37665d78f3277a6df8b71d8363fe"
|
||||
integrity sha512-AqyjVTnkF9ksgAtO+k7bPJcEafH12BAnj58z6o87yn2d6tKGOgd6yR1QnXJIT04Reg7EL1VCy8MBmubelMyUvQ==
|
||||
version "7.2.0"
|
||||
resolved "https://registry.yarnpkg.com/looks-same/-/looks-same-7.2.0.tgz#54772d2ed088f77691e271c4531d7ba97a5818eb"
|
||||
integrity sha512-LCE5Md8ZQ9Wn5lJbaGW4r6Fs00P8p8+JOjvXKkq9LdI/datYG8JOSRycMes+bp2h/UJ/RYYzJjvP0CXLPeVq1A==
|
||||
dependencies:
|
||||
color-diff "^1.1.0"
|
||||
concat-stream "^1.6.2"
|
||||
|
||||
Reference in New Issue
Block a user