eessppeelllloo/image-sequencer
1
0
Fork 0
mirror of https://github.com/publiclab/image-sequencer.git synced 2025-12-12 03:10:03 +01:00
Code Issues Packages Projects Releases Wiki Activity

Requested Changed Made

Browse Source
This commit is contained in:
Chinmay Pandhare
2017-07-08 19:03:38 +05:30
parent 10f9a19ca3
commit ef8cd3a9d8
2 changed files with 16 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
README.md
View File

@@ -33,12 +33,20 @@ Image Sequencer can be used to run modules on an HTML Image Element using the
`selector` is a CSS selector. If it matches multiple images, all images will be `selector` is a CSS selector. If it matches multiple images, all images will be
modified. `steps` may be the name of a module or array of names of modules. modified. `steps` may be the name of a module or array of names of modules.
Note: Local images will work only if they are in the same directory or a subdirectory. Note: Browser CORS Restrictions apply. Some browsers may not allow local images
form other folders, and throw a Security Error instead.
```js ```js
sequencer.replaceImage(selector,steps); sequencer.replaceImage(selector,steps);
``` ```
For example:
```js
sequencer.replaceImage('#photo','invert');
sequencer.replaceImage('#photo',['invert','ndvi-red']);
```
## Classic Usage ## Classic Usage

14
replace-demo.html → examples/replace.html
View File

@@ -7,13 +7,13 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="content-type" content="text/html; charset=UTF8"> <meta http-equiv="content-type" content="text/html; charset=UTF8">
<link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"> <link href="../node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="node_modules/font-awesome/css/font-awesome.min.css" rel="stylesheet"> <link href="../node_modules/font-awesome/css/font-awesome.min.css" rel="stylesheet">
<link href="dist/image-sequencer.css" rel="stylesheet"> <link href="../dist/image-sequencer.css" rel="stylesheet">
<script src="node_modules/jquery/dist/jquery.min.js"></script> <script src="../node_modules/jquery/dist/jquery.min.js"></script>
<script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script> <script src="../node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="dist/image-sequencer.js"></script> <script src="../dist/image-sequencer.js"></script>
</head> </head>
@@ -33,7 +33,7 @@
<div class="panels"> <div class="panels">
<div class="panel ismod-image-select" style="display:flex;justify-content:center"> <div class="panel ismod-image-select" style="display:flex;justify-content:center">
<img src="examples/replace.jpg" id="pencils" style="cursor:pointer"> <img src="replace.jpg" id="pencils" style="cursor:pointer">
</div> </div>
</div> </div>