primitive 1.0.0 → 1.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +89 -0
- package/bin/run.js +16 -0
- package/dist/cli-config-B5hrwe8q.js +1330 -0
- package/dist/oclif/index.js +22785 -0
- package/dist/oclif/proxy-auto-detect.js +71 -0
- package/dist/oclif/root-signup-hint.js +136 -0
- package/man/primitive.1 +111 -0
- package/package.json +131 -67
- package/.babelrc +0 -12
- package/.editorconfig +0 -9
- package/.eslintrc +0 -5
- package/.travis.yml +0 -5
- package/browser.js +0 -109
- package/dist/browser.js +0 -5447
- package/lib/browser-context.js +0 -98
- package/lib/color.js +0 -6
- package/lib/context.js +0 -101
- package/lib/context.test.js +0 -31
- package/lib/core.js +0 -199
- package/lib/core.test.js +0 -70
- package/lib/model.js +0 -168
- package/lib/optimize.js +0 -53
- package/lib/primitive.js +0 -76
- package/lib/rasterize.js +0 -101
- package/lib/scanline.js +0 -25
- package/lib/shapes/ellipse.js +0 -112
- package/lib/shapes/factory.js +0 -52
- package/lib/shapes/rectangle.js +0 -93
- package/lib/shapes/rotated-ellipse.js +0 -99
- package/lib/shapes/rotated-rectangle.js +0 -126
- package/lib/shapes/shape.js +0 -26
- package/lib/shapes/triangle.js +0 -217
- package/lib/shapes/triangle.test.js +0 -73
- package/lib/state.js +0 -69
- package/lib/worker.js +0 -50
- package/main.js +0 -6
- package/main.test.js +0 -39
- package/module.js +0 -126
- package/notes.md +0 -15
- package/readme.md +0 -154
- package/rollup.config.js +0 -28
package/module.js
DELETED
|
@@ -1,126 +0,0 @@
|
|
|
1
|
-
// node es module entrypoint
|
|
2
|
-
|
|
3
|
-
import ow from 'ow'
|
|
4
|
-
import path from 'path'
|
|
5
|
-
import rmfr from 'rmfr'
|
|
6
|
-
import tempy from 'tempy'
|
|
7
|
-
import Time from 'time-diff'
|
|
8
|
-
|
|
9
|
-
import context from './lib/context'
|
|
10
|
-
import primitive from './lib/primitive'
|
|
11
|
-
|
|
12
|
-
const supportedOutputFormats = new Set([
|
|
13
|
-
'png',
|
|
14
|
-
'jpg',
|
|
15
|
-
'svg',
|
|
16
|
-
'gif'
|
|
17
|
-
])
|
|
18
|
-
|
|
19
|
-
/**
|
|
20
|
-
* Reproduces the given input image using geometric primitives.
|
|
21
|
-
*
|
|
22
|
-
* Returns a Promise for the generated model.
|
|
23
|
-
*
|
|
24
|
-
* Available output formats:
|
|
25
|
-
* - png
|
|
26
|
-
* - jpg
|
|
27
|
-
* - svg
|
|
28
|
-
* - gif
|
|
29
|
-
*
|
|
30
|
-
* @name primitive
|
|
31
|
-
* @function
|
|
32
|
-
*
|
|
33
|
-
* @param {Object} opts - Configuration options
|
|
34
|
-
* @param {string} opts.input - Input image to process (can be a local path, http url, or data url)
|
|
35
|
-
* @param {string} [opts.output] - Path to generate output image
|
|
36
|
-
* @param {number} [opts.numSteps=200] - Number of steps to process [1, 1000]
|
|
37
|
-
* @param {number} [opts.minEnergy] - Minimum energy to stop processing early [0, 1]
|
|
38
|
-
* @param {number} [opts.shapeAlpha=128] - Alpha opacity of shapes [0, 255]
|
|
39
|
-
* @param {string} [opts.shapeType=traingle] - Type of shapes to use
|
|
40
|
-
* @param {number} [opts.numCandidates=1] - Number of top-level candidates per step [1, 32]
|
|
41
|
-
* @param {number} [opts.numCandidateShapes=50] - Number of random candidate shapes per step [10, 1000]
|
|
42
|
-
* @param {number} [opts.numCandidateMutations=100] - Number of candidate mutations per step [10, 500]
|
|
43
|
-
* @param {number} [opts.numCandidateExtras=0] - Number of extra candidate shapes per step [0, 16]
|
|
44
|
-
* @param {function} [opts.onStep] - Optional async function taking in the model and step index
|
|
45
|
-
* @param {function} [opts.log=noop] - Optional logging function (console.log to enable logging)
|
|
46
|
-
*
|
|
47
|
-
* @return {Promise}
|
|
48
|
-
*/
|
|
49
|
-
export default async (opts) => {
|
|
50
|
-
const {
|
|
51
|
-
input,
|
|
52
|
-
output,
|
|
53
|
-
onStep,
|
|
54
|
-
numSteps = 200,
|
|
55
|
-
nthFrame = 0,
|
|
56
|
-
...rest
|
|
57
|
-
} = opts
|
|
58
|
-
|
|
59
|
-
ow(opts, ow.object.label('opts'))
|
|
60
|
-
ow(input, ow.string.nonEmpty.label('input'))
|
|
61
|
-
ow(nthFrame, ow.number.integer)
|
|
62
|
-
ow(numSteps, ow.number.integer.positive.label('numSteps'))
|
|
63
|
-
if (output) ow(output, ow.string.nonEmpty.label('output'))
|
|
64
|
-
|
|
65
|
-
const ext = output && path.extname(output).slice(1).toLowerCase()
|
|
66
|
-
const isGIF = (ext === 'gif')
|
|
67
|
-
|
|
68
|
-
if (output && !supportedOutputFormats.has(ext)) {
|
|
69
|
-
throw new Error(`unsupported output format "${ext}"`)
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
const target = await context.loadImage(input)
|
|
73
|
-
|
|
74
|
-
const tempDir = isGIF && tempy.directory()
|
|
75
|
-
const tempOutput = isGIF && path.join(tempDir, 'frame-%d.png')
|
|
76
|
-
const frames = []
|
|
77
|
-
|
|
78
|
-
const { model, step } = await primitive({
|
|
79
|
-
...rest,
|
|
80
|
-
context,
|
|
81
|
-
target,
|
|
82
|
-
onStep: async (model, step) => {
|
|
83
|
-
if (onStep) await onStep(model, step)
|
|
84
|
-
|
|
85
|
-
if (isGIF) {
|
|
86
|
-
if (nthFrame <= 0 || (step - 1) % nthFrame === 0) {
|
|
87
|
-
const frame = tempOutput.replace('%d', frames.length)
|
|
88
|
-
await context.saveImage(model.current, frame)
|
|
89
|
-
frames.push(frame)
|
|
90
|
-
}
|
|
91
|
-
} else if (output) {
|
|
92
|
-
if (nthFrame > 0 && (step - 1) % nthFrame === 0) {
|
|
93
|
-
const frame = output.replace('.', `-${step - 1}.`)
|
|
94
|
-
await context.saveImage(model.current, frame, opts)
|
|
95
|
-
}
|
|
96
|
-
}
|
|
97
|
-
}
|
|
98
|
-
})
|
|
99
|
-
|
|
100
|
-
const time = new Time()
|
|
101
|
-
|
|
102
|
-
for (let s = 1; s <= numSteps; ++s) {
|
|
103
|
-
time.start(`step ${s}`)
|
|
104
|
-
|
|
105
|
-
const candidates = await step(s)
|
|
106
|
-
|
|
107
|
-
console.log(`${s})`, {
|
|
108
|
-
time: time.end(`step ${s}`),
|
|
109
|
-
candidates,
|
|
110
|
-
score: model.score
|
|
111
|
-
})
|
|
112
|
-
|
|
113
|
-
if (!candidates) break
|
|
114
|
-
}
|
|
115
|
-
|
|
116
|
-
if (output) {
|
|
117
|
-
if (isGIF) {
|
|
118
|
-
await context.saveGIF(frames, output, opts)
|
|
119
|
-
await rmfr(tempDir)
|
|
120
|
-
} else {
|
|
121
|
-
await context.saveImage(model.current, output, opts)
|
|
122
|
-
}
|
|
123
|
-
}
|
|
124
|
-
|
|
125
|
-
return model
|
|
126
|
-
}
|
package/notes.md
DELETED
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
|
|
2
|
-
- core
|
|
3
|
-
- support resizing input
|
|
4
|
-
- min-heap of possible {energy,shape} pairs to add
|
|
5
|
-
- add a way of short-circuiting candidates in later steps in order to reuse previously rejected shapes
|
|
6
|
-
- add a way of focusing attention on more detailed areas like faces
|
|
7
|
-
- add svg viewbox (https://github.com/fogleman/primitive/pull/79/files)
|
|
8
|
-
- add svg blur option (https://github.com/fogleman/primitive/pull/56/files)
|
|
9
|
-
- output options
|
|
10
|
-
- svg support
|
|
11
|
-
- browser version
|
|
12
|
-
- test browser / canvas support
|
|
13
|
-
- web demo
|
|
14
|
-
- threejs demo (https://bl.ocks.org/duhaime/6f2a71a76091162c57f66ea9e04db407)
|
|
15
|
-
|
package/readme.md
DELETED
|
@@ -1,154 +0,0 @@
|
|
|
1
|
-
# primitive ([demo](https://transitive-bullshit.github.io/primitive-web/))
|
|
2
|
-
|
|
3
|
-
> Reproduce images from geometric primitives (Node.js + browser port of [primitive](https://github.com/fogleman/primitive)).
|
|
4
|
-
|
|
5
|
-
[](https://www.npmjs.com/package/primitive) [](https://travis-ci.com/transitive-bullshit/primitive) [](https://standardjs.com)
|
|
6
|
-
|
|
7
|
-
This library is also available as a [CLI](https://github.com/transitive-bullshit/primitive-cli).
|
|
8
|
-
|
|
9
|
-
[](https://transitive-bullshit.github.io/primitive-web/)
|
|
10
|
-
|
|
11
|
-
#### Table of Contents
|
|
12
|
-
|
|
13
|
-
- [Install](#install)
|
|
14
|
-
- [Usage](#usage)
|
|
15
|
-
- [How It Works](#how-it-works)
|
|
16
|
-
- [Node API](#node-api)
|
|
17
|
-
* [primitive](#primitive)
|
|
18
|
-
- [Browser API](#browser-api)
|
|
19
|
-
* [primitive](#primitive-1)
|
|
20
|
-
- [Related](#related)
|
|
21
|
-
- [Examples](#examples)
|
|
22
|
-
- [License](#license)
|
|
23
|
-
|
|
24
|
-
## Install
|
|
25
|
-
|
|
26
|
-
**Note**: We are currently trying to get the `primitive` npm package name. For now, you have to link to this repository directly.
|
|
27
|
-
|
|
28
|
-
```bash
|
|
29
|
-
npm install --save transitive-bullshit/primitive
|
|
30
|
-
|
|
31
|
-
# (hopefully soon)
|
|
32
|
-
npm install --save primitive
|
|
33
|
-
```
|
|
34
|
-
|
|
35
|
-
## Usage
|
|
36
|
-
|
|
37
|
-
Primitive is usable from both Node.js and browser environments. Most of the API options between the two are the same, with minor differences in input and output configurations.
|
|
38
|
-
|
|
39
|
-
A good place to start is by checking out the [web demo](https://transitive-bullshit.github.io/primitive-web/).
|
|
40
|
-
|
|
41
|
-
Available shape types:
|
|
42
|
-
|
|
43
|
-
- triangle
|
|
44
|
-
- ellipse
|
|
45
|
-
- rotated-ellipse
|
|
46
|
-
- rectangle
|
|
47
|
-
- rotated-rectangle
|
|
48
|
-
- random (will use all the shape types)
|
|
49
|
-
|
|
50
|
-
## How It Works
|
|
51
|
-
|
|
52
|
-
A target image is provided as input. The algorithm tries to find the single most optimal shape that can be drawn to minimize the error between the target image and the drawn image. It repeats this process, adding one shape at a time. Around 50 to 200 shapes are needed to reach a result that is recognizable yet artistic and abstract.
|
|
53
|
-
|
|
54
|
-
This GIF demonstrates the iterative nature of the algorithm, attempting to minimize the mean squared error by adding one shape at a time (use a ".gif" output file to generate one yourself).
|
|
55
|
-
|
|
56
|
-
[](https://transitive-bullshit.github.io/primitive-web/)
|
|
57
|
-
|
|
58
|
-
## Node API
|
|
59
|
-
|
|
60
|
-
<!-- Generated by documentation.js. Update this documentation by updating the source code. -->
|
|
61
|
-
|
|
62
|
-
### [primitive](https://github.com/transitive-bullshit/primitive/blob/b242853b0f4634b85b788b8c4d81d4d480d7f617/index.js#L48-L98)
|
|
63
|
-
|
|
64
|
-
Reproduces the given input image using geometric primitives.
|
|
65
|
-
|
|
66
|
-
Returns a Promise for the generated model.
|
|
67
|
-
|
|
68
|
-
Available output formats:
|
|
69
|
-
|
|
70
|
-
- png
|
|
71
|
-
- jpg
|
|
72
|
-
- svg
|
|
73
|
-
- gif
|
|
74
|
-
|
|
75
|
-
Type: `function (opts): Promise`
|
|
76
|
-
|
|
77
|
-
- `opts` **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Configuration options
|
|
78
|
-
- `opts.input` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Input image to process (can be a local path, http url, or data url)
|
|
79
|
-
- `opts.output` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** Path to generate output image
|
|
80
|
-
- `opts.numSteps` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)** Number of steps to process [1, 1000] \(optional, default `200`)
|
|
81
|
-
- `opts.minEnergy` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)?** Minimum energy to stop processing early [0, 1]
|
|
82
|
-
- `opts.shapeAlpha` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)** Alpha opacity of shapes [0, 255] \(optional, default `128`)
|
|
83
|
-
- `opts.shapeType` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Type of shapes to use (optional, default `traingle`)
|
|
84
|
-
- `opts.numCandidates` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)** Number of top-level candidates per step [1, 32] \(optional, default `1`)
|
|
85
|
-
- `opts.numCandidateShapes` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)** Number of random candidate shapes per step [10, 1000] \(optional, default `50`)
|
|
86
|
-
- `opts.numCandidateMutations` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)** Number of candidate mutations per step [10, 500] \(optional, default `100`)
|
|
87
|
-
- `opts.numCandidateExtras` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)** Number of extra candidate shapes per step [0, 16] \(optional, default `0`)
|
|
88
|
-
- `opts.onStep` **[function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)?** Optional async function taking in the model and step index
|
|
89
|
-
- `opts.log` **[function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Optional logging function (console.log to enable logging) (optional, default `noop`)
|
|
90
|
-
|
|
91
|
-
## Browser API
|
|
92
|
-
|
|
93
|
-
<!-- Generated by documentation.js. Update this documentation by updating the source code. -->
|
|
94
|
-
|
|
95
|
-
### [primitive](https://github.com/transitive-bullshit/primitive/blob/b242853b0f4634b85b788b8c4d81d4d480d7f617/browser.js#L34-L83)
|
|
96
|
-
|
|
97
|
-
Reproduces the given input image using geometric primitives.
|
|
98
|
-
|
|
99
|
-
Optionally draws the results to an HTML canvas.
|
|
100
|
-
|
|
101
|
-
Returns a Promise for the generated model.
|
|
102
|
-
|
|
103
|
-
Type: `function (opts): Promise`
|
|
104
|
-
|
|
105
|
-
- `opts` **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Configuration options
|
|
106
|
-
- `opts.input` **([string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String) \| [Image](https://developer.mozilla.org/docs/Web/API/HTMLImageElement/Image) | ImageData)** URL, Image, or ImageData of input image to process
|
|
107
|
-
- `opts.output` **([string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String) \| [HTMLCanvasElement](https://developer.mozilla.org/docs/Web/API/HTMLCanvasElement))?** Selector or DOM Element of HTMLCanvas to draw results
|
|
108
|
-
- `opts.numSteps` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)** Number of steps to process [1, 1000] (optional, default `200`)
|
|
109
|
-
- `opts.minEnergy` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)?** Minimum energy to stop processing early [0, 1]
|
|
110
|
-
- `opts.shapeAlpha` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)** Alpha opacity of shapes [0, 255] (optional, default `128`)
|
|
111
|
-
- `opts.shapeType` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Type of shapes to use (optional, default `traingle`)
|
|
112
|
-
- `opts.numCandidates` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)** Number of top-level candidates per step [1, 32] (optional, default `1`)
|
|
113
|
-
- `opts.numCandidateShapes` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)** Number of random candidate shapes per step [10, 1000] (optional, default `50`)
|
|
114
|
-
- `opts.numCandidateMutations` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)** Number of candidate mutations per step [10, 500] (optional, default `100`)
|
|
115
|
-
- `opts.numCandidateExtras` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)** Number of extra candidate shapes per step [0, 16] (optional, default `0`)
|
|
116
|
-
- `opts.onStep` **[function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)?** Optional async function taking in the model and step index
|
|
117
|
-
- `opts.log` **[function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Optional logging function (console.log to enable logging) (optional, default `noop`)
|
|
118
|
-
|
|
119
|
-
## Related
|
|
120
|
-
|
|
121
|
-
There are several other ports of the primitive algorithm, including at least two JavaScript ports that I'm aware of. This module isn't necessarily better; I created it out of pure fascination.
|
|
122
|
-
|
|
123
|
-
- [primitive-cli](https://github.com/transitive-bullshit/primitive-cli) - CLI for this module.
|
|
124
|
-
- [primitive](https://github.com/fogleman/primitive) - Original Go version by [Michael Fogleman](https://www.michaelfogleman.com/).
|
|
125
|
-
- [primitive.js](https://github.com/ondras/primitive.js) - JavaScript (browser) port by [Ondřej Žára](https://github.com/ondras).
|
|
126
|
-
- [geometrize](http://www.geometrize.co.uk/) - Haxe and C++ ports by [Sam Twidale](https://samcodes.co.uk/).
|
|
127
|
-
- [node-primitive](https://github.com/vincentdesmares/node-primitive) - Node.js port by [Vincent Desmares](https://github.com/vincentdesmares).
|
|
128
|
-
- [sqip](https://github.com/technopagan/sqip) - An SVG-based LQIP library built on top of the [original primitive](https://github.com/fogleman/primitive).
|
|
129
|
-
|
|
130
|
-
## Examples
|
|
131
|
-
|
|
132
|
-

|
|
133
|
-
|
|
134
|
-

|
|
135
|
-
|
|
136
|
-

|
|
137
|
-
|
|
138
|
-

|
|
139
|
-
|
|
140
|
-

|
|
141
|
-
|
|
142
|
-

|
|
143
|
-
|
|
144
|
-

|
|
145
|
-
|
|
146
|
-

|
|
147
|
-
|
|
148
|
-

|
|
149
|
-
|
|
150
|
-
## License
|
|
151
|
-
|
|
152
|
-
MIT © [Travis Fischer](https://github.com/transitive-bullshit)
|
|
153
|
-
|
|
154
|
-
All images are provided by [Unsplash](https://unsplash.com/) via a [CC0](https://creativecommons.org/publicdomain/zero/1.0/) license.
|
package/rollup.config.js
DELETED
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
import babel from 'rollup-plugin-babel'
|
|
2
|
-
import commonjs from 'rollup-plugin-commonjs'
|
|
3
|
-
import resolve from 'rollup-plugin-node-resolve'
|
|
4
|
-
|
|
5
|
-
import pkg from './package.json'
|
|
6
|
-
|
|
7
|
-
export default {
|
|
8
|
-
input: 'browser.js',
|
|
9
|
-
output: [
|
|
10
|
-
{
|
|
11
|
-
file: pkg.browser,
|
|
12
|
-
format: 'cjs',
|
|
13
|
-
sourceMap: true
|
|
14
|
-
}
|
|
15
|
-
],
|
|
16
|
-
external: [ 'ow' ],
|
|
17
|
-
plugins: [
|
|
18
|
-
babel({
|
|
19
|
-
exclude: 'node_modules/**',
|
|
20
|
-
externalHelpers: false,
|
|
21
|
-
runtimeHelpers: true
|
|
22
|
-
}),
|
|
23
|
-
resolve({
|
|
24
|
-
browser: true
|
|
25
|
-
}),
|
|
26
|
-
commonjs()
|
|
27
|
-
]
|
|
28
|
-
}
|