script-arts v1.0.1
Script arts
Another one npm package :) Encode any text files into images and decode them back.
If you ask "Why"?
"Code like no one's watching." @noopkat From #jsconf Budapest "Formulartic Spectrum".
Just imagine
- transform your code into images
- apply instagram filters
- BOOM! Your code is refactored now :)
Usage
npm install -g script-arts
script-arts --help
script-arts encode --help
script-arts decode --help
Glossary
Theme - is a symbol encode (symbol to rgb) / decode (rgb to symbol) rule.
{ encode: function(symbol), decode: function(rgb) }
Iterator - is how we will iterate image and source file. Could be linear, or by lines or even radial. Also responsible on image size and form.
{ iterateSource: function(source, encode), iterateImage: function(image, decode) }
Iterators
linear (default)
script-arts encode source output -i linear
. Iterate by symbolslines
script-arts encode source output -i lines
. Iterate by lines
Themes
char code (default)
script-arts encode source output -t char-code
. Translate symbol code to hex.-d <number>
code offset. If delta was used for encode - same value should be used for decode.spaces and semicolons
script-arts encode source output -t spaces-and-semicolons
. Highlite spaces and semicolons. Other symbols will be encoded with char-code theme.js
script-arts encode source output -t js
. Highlite js keywords.md
script-arts encode source output -t md
. Highlite md keywords.
Custom theme
Existing themes:
import chartCodeTheme from 'script-arts/themes/char-code-theme';
import { add as addTheme } from 'script-arts/src/themes';
import encode from 'script-arts/encode';
const myTheme = options => {
return chartCodeTheme({
...options,
matches: {
// encode whole words with specific colors
'constructor': '#ffcc33',
'var': '#cc0000',
'const': '#54DE43',
'new': '#54DE43',
// encode each symbol of "decode" word with specific color
'for': ['#E74C3C', '#ECF0F1', '#ECF0F1']
}
}),
}
addTheme('my-theme', {
create: myTheme,
// bottom left image corner will be marked with this color
// will be used for decode() - automatically detect encoded theme.
color: '#47D0DB'
});
encode('path/to/source-file', 'path/to/output-image', {
theme: 'my-theme',
iterator: 'lines',
delta: 2512 // if you want to make char code offset
}).then(() => {
console.log('done');
})
Custom iterator
Sames as custom themes. Default iterators example:
Contribute
You are welcome to this useless app better :)
Use npm run dev
to start watchers and convert ES6 code from /src/ dir.
Use npm run test
- to run tests.
Use npm run test-dev
- to start tests with watchers.
Encode examples: parts of lodash source with different options
Encode examples of this README file
Tests
Tests are ok. But travis fails. And I dont care :)
8 years ago