├── .gitignore ├── .prettierignore ├── LICENSE.md ├── README.md ├── index.html ├── jsconfig.json ├── package-lock.json ├── package.json ├── src ├── App.svelte ├── Generator.svelte ├── Progress.svelte ├── dither.js ├── main.js ├── prelude.js ├── query.js ├── recording.js ├── render.js ├── templates.js └── vendor │ ├── regl.2.1.0.js │ ├── three.r124.js │ └── three.r124.min.js └── vite.config.js /.gitignore: -------------------------------------------------------------------------------- 1 | bower_components 2 | node_modules 3 | *.log 4 | .DS_Store 5 | dist/ -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | src/vendor/ 2 | src/vendor/*.js -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | Copyright (c) 2017 Matt DesLauriers 3 | 4 | Permission is hereby granted, free of charge, to any person obtaining a copy 5 | of this software and associated documentation files (the "Software"), to deal 6 | in the Software without restriction, including without limitation the rights 7 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 8 | copies of the Software, and to permit persons to whom the Software is 9 | furnished to do so, subject to the following conditions: 10 | 11 | The above copyright notice and this permission notice shall be included in all 12 | copies or substantial portions of the Software. 13 | 14 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 15 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF 16 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. 17 | IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, 18 | DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR 19 | OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE 20 | OR OTHER DEALINGS IN THE SOFTWARE. 21 | 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # artblocks-renderer 2 | 3 | video renderer 4 | 5 | ## Usage 6 | 7 | [![NPM](https://nodei.co/npm/artblocks-renderer.png)](https://www.npmjs.com/package/artblocks-renderer) 8 | 9 | ## License 10 | 11 | MIT, see [LICENSE.md](http://github.com/mattdesl/artblocks-renderer/blob/master/LICENSE.md) for details. 12 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | artblocks-renderer 7 | 8 | 9 | 13 | 19 | 28 | 29 | 30 | 35 | 63 | 64 | 91 | 92 | 93 | 94 | -------------------------------------------------------------------------------- /jsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "moduleResolution": "node", 4 | "target": "esnext", 5 | "module": "esnext", 6 | /** 7 | * svelte-preprocess cannot figure out whether you have 8 | * a value or a type, so tell TypeScript to enforce using 9 | * `import type` instead of `import` for Types. 10 | */ 11 | "importsNotUsedAsValues": "error", 12 | "isolatedModules": true, 13 | "resolveJsonModule": true, 14 | /** 15 | * To have warnings / errors of the Svelte compiler at the 16 | * correct position, enable source maps by default. 17 | */ 18 | "sourceMap": true, 19 | "esModuleInterop": true, 20 | "skipLibCheck": true, 21 | "forceConsistentCasingInFileNames": true, 22 | "baseUrl": ".", 23 | /** 24 | * Typecheck JS in `.svelte` and `.js` files by default. 25 | * Disable this if you'd like to use dynamic types. 26 | */ 27 | "checkJs": true 28 | }, 29 | /** 30 | * Use global.d.ts instead of compilerOptions.types 31 | * to avoid limiting type declarations. 32 | */ 33 | "include": ["src/**/*.d.ts", "src/**/*.js", "src/**/*.svelte"] 34 | } 35 | -------------------------------------------------------------------------------- /package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "artblocks-renderer", 3 | "version": "1.0.0", 4 | "lockfileVersion": 2, 5 | "requires": true, 6 | "packages": { 7 | "": { 8 | "name": "artblocks-renderer", 9 | "version": "1.0.0", 10 | "license": "MIT", 11 | "dependencies": { 12 | "esbuild": "^0.12.9", 13 | "escape-html": "^1.0.3", 14 | "gifenc": "^1.0.3", 15 | "maxstache": "^1.0.7", 16 | "mp4-wasm": "^1.0.3", 17 | "node-fetch": "^2.6.1", 18 | "svelte-hmr": "^0.14.4" 19 | }, 20 | "devDependencies": { 21 | "@sveltejs/vite-plugin-svelte": "^1.0.0-next.11", 22 | "svelte": "^3.37.0", 23 | "vite": "^2.3.8" 24 | } 25 | }, 26 | "node_modules/@rollup/pluginutils": { 27 | "version": "4.1.0", 28 | "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-4.1.0.tgz", 29 | "integrity": "sha512-TrBhfJkFxA+ER+ew2U2/fHbebhLT/l/2pRk0hfj9KusXUuRXd2v0R58AfaZK9VXDQ4TogOSEmICVrQAA3zFnHQ==", 30 | "dev": true, 31 | "dependencies": { 32 | "estree-walker": "^2.0.1", 33 | "picomatch": "^2.2.2" 34 | }, 35 | "engines": { 36 | "node": ">= 8.0.0" 37 | }, 38 | "peerDependencies": { 39 | "rollup": "^1.20.0||^2.0.0" 40 | } 41 | }, 42 | "node_modules/@sveltejs/vite-plugin-svelte": { 43 | "version": "1.0.0-next.11", 44 | "resolved": "https://registry.npmjs.org/@sveltejs/vite-plugin-svelte/-/vite-plugin-svelte-1.0.0-next.11.tgz", 45 | "integrity": "sha512-EYR1I145k5rflVqhPwk3442m3bkYimTKSHM9uO5KdomXzt+GS9ZSBJQE3/wy1Di9V8OnGa3oKpckI3OZsHkTIA==", 46 | "dev": true, 47 | "dependencies": { 48 | "@rollup/pluginutils": "^4.1.0", 49 | "chalk": "^4.1.1", 50 | "debug": "^4.3.2", 51 | "require-relative": "^0.8.7", 52 | "svelte-hmr": "^0.14.4" 53 | }, 54 | "engines": { 55 | "node": "^12.20 || ^14.13.1 || >= 16" 56 | }, 57 | "peerDependencies": { 58 | "svelte": "^3.38.2", 59 | "vite": "^2.3.7" 60 | } 61 | }, 62 | "node_modules/ansi-styles": { 63 | "version": "4.3.0", 64 | "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", 65 | "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", 66 | "dev": true, 67 | "dependencies": { 68 | "color-convert": "^2.0.1" 69 | }, 70 | "engines": { 71 | "node": ">=8" 72 | }, 73 | "funding": { 74 | "url": "https://github.com/chalk/ansi-styles?sponsor=1" 75 | } 76 | }, 77 | "node_modules/chalk": { 78 | "version": "4.1.1", 79 | "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.1.tgz", 80 | "integrity": "sha512-diHzdDKxcU+bAsUboHLPEDQiw0qEe0qd7SYUn3HgcFlWgbDcfLGswOHYeGrHKzG9z6UYf01d9VFMfZxPM1xZSg==", 81 | "dev": true, 82 | "dependencies": { 83 | "ansi-styles": "^4.1.0", 84 | "supports-color": "^7.1.0" 85 | }, 86 | "engines": { 87 | "node": ">=10" 88 | }, 89 | "funding": { 90 | "url": "https://github.com/chalk/chalk?sponsor=1" 91 | } 92 | }, 93 | "node_modules/color-convert": { 94 | "version": "2.0.1", 95 | "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", 96 | "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", 97 | "dev": true, 98 | "dependencies": { 99 | "color-name": "~1.1.4" 100 | }, 101 | "engines": { 102 | "node": ">=7.0.0" 103 | } 104 | }, 105 | "node_modules/color-name": { 106 | "version": "1.1.4", 107 | "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", 108 | "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", 109 | "dev": true 110 | }, 111 | "node_modules/colorette": { 112 | "version": "1.2.2", 113 | "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz", 114 | "integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==", 115 | "dev": true 116 | }, 117 | "node_modules/debug": { 118 | "version": "4.3.2", 119 | "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.2.tgz", 120 | "integrity": "sha512-mOp8wKcvj7XxC78zLgw/ZA+6TSgkoE2C/ienthhRD298T7UNwAg9diBpLRxC0mOezLl4B0xV7M0cCO6P/O0Xhw==", 121 | "dev": true, 122 | "dependencies": { 123 | "ms": "2.1.2" 124 | }, 125 | "engines": { 126 | "node": ">=6.0" 127 | }, 128 | "peerDependenciesMeta": { 129 | "supports-color": { 130 | "optional": true 131 | } 132 | } 133 | }, 134 | "node_modules/esbuild": { 135 | "version": "0.12.9", 136 | "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.12.9.tgz", 137 | "integrity": "sha512-MWRhAbMOJ9RJygCrt778rz/qNYgA4ZVj6aXnNPxFjs7PmIpb0fuB9Gmg5uWrr6n++XKwwm/RmSz6RR5JL2Ocsw==", 138 | "hasInstallScript": true, 139 | "bin": { 140 | "esbuild": "bin/esbuild" 141 | } 142 | }, 143 | "node_modules/escape-html": { 144 | "version": "1.0.3", 145 | "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz", 146 | "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg=" 147 | }, 148 | "node_modules/estree-walker": { 149 | "version": "2.0.2", 150 | "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz", 151 | "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==", 152 | "dev": true 153 | }, 154 | "node_modules/fsevents": { 155 | "version": "2.3.2", 156 | "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", 157 | "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", 158 | "dev": true, 159 | "hasInstallScript": true, 160 | "optional": true, 161 | "os": [ 162 | "darwin" 163 | ], 164 | "engines": { 165 | "node": "^8.16.0 || ^10.6.0 || >=11.0.0" 166 | } 167 | }, 168 | "node_modules/function-bind": { 169 | "version": "1.1.1", 170 | "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz", 171 | "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==", 172 | "dev": true 173 | }, 174 | "node_modules/gifenc": { 175 | "version": "1.0.3", 176 | "resolved": "https://registry.npmjs.org/gifenc/-/gifenc-1.0.3.tgz", 177 | "integrity": "sha512-xdr6AdrfGBcfzncONUOlXMBuc5wJDtOueE3c5rdG0oNgtINLD+f2iFZltrBRZYzACRbKr+mSVU/x98zv2u3jmw==" 178 | }, 179 | "node_modules/has": { 180 | "version": "1.0.3", 181 | "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz", 182 | "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==", 183 | "dev": true, 184 | "dependencies": { 185 | "function-bind": "^1.1.1" 186 | }, 187 | "engines": { 188 | "node": ">= 0.4.0" 189 | } 190 | }, 191 | "node_modules/has-flag": { 192 | "version": "4.0.0", 193 | "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", 194 | "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", 195 | "dev": true, 196 | "engines": { 197 | "node": ">=8" 198 | } 199 | }, 200 | "node_modules/is-core-module": { 201 | "version": "2.4.0", 202 | "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.4.0.tgz", 203 | "integrity": "sha512-6A2fkfq1rfeQZjxrZJGerpLCTHRNEBiSgnu0+obeJpEPZRUooHgsizvzv0ZjJwOz3iWIHdJtVWJ/tmPr3D21/A==", 204 | "dev": true, 205 | "dependencies": { 206 | "has": "^1.0.3" 207 | }, 208 | "funding": { 209 | "url": "https://github.com/sponsors/ljharb" 210 | } 211 | }, 212 | "node_modules/maxstache": { 213 | "version": "1.0.7", 214 | "resolved": "https://registry.npmjs.org/maxstache/-/maxstache-1.0.7.tgz", 215 | "integrity": "sha1-IjHVGAung9Xs/DHEX+2seuQnaYQ=" 216 | }, 217 | "node_modules/mp4-wasm": { 218 | "version": "1.0.3", 219 | "resolved": "https://registry.npmjs.org/mp4-wasm/-/mp4-wasm-1.0.3.tgz", 220 | "integrity": "sha512-2h3iX7xmVch9j71YrbtSFRXr3EZtCSSpb/DNp3dQ3/X8lpnBVz4VIIKCc5KD+hF0EFGquFcAR4WeiuKGwcGGtg==" 221 | }, 222 | "node_modules/ms": { 223 | "version": "2.1.2", 224 | "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", 225 | "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==", 226 | "dev": true 227 | }, 228 | "node_modules/nanoid": { 229 | "version": "3.1.23", 230 | "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.23.tgz", 231 | "integrity": "sha512-FiB0kzdP0FFVGDKlRLEQ1BgDzU87dy5NnzjeW9YZNt+/c3+q82EQDUwniSAUxp/F0gFNI1ZhKU1FqYsMuqZVnw==", 232 | "dev": true, 233 | "bin": { 234 | "nanoid": "bin/nanoid.cjs" 235 | }, 236 | "engines": { 237 | "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1" 238 | } 239 | }, 240 | "node_modules/node-fetch": { 241 | "version": "2.6.1", 242 | "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.1.tgz", 243 | "integrity": "sha512-V4aYg89jEoVRxRb2fJdAg8FHvI7cEyYdVAh94HH0UIK8oJxUfkjlDQN9RbMx+bEjP7+ggMiFRprSti032Oipxw==", 244 | "engines": { 245 | "node": "4.x || >=6.0.0" 246 | } 247 | }, 248 | "node_modules/path-parse": { 249 | "version": "1.0.7", 250 | "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz", 251 | "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==", 252 | "dev": true 253 | }, 254 | "node_modules/picomatch": { 255 | "version": "2.3.0", 256 | "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.0.tgz", 257 | "integrity": "sha512-lY1Q/PiJGC2zOv/z391WOTD+Z02bCgsFfvxoXXf6h7kv9o+WmsmzYqrAwY63sNgOxE4xEdq0WyUnXfKeBrSvYw==", 258 | "dev": true, 259 | "engines": { 260 | "node": ">=8.6" 261 | }, 262 | "funding": { 263 | "url": "https://github.com/sponsors/jonschlinkert" 264 | } 265 | }, 266 | "node_modules/postcss": { 267 | "version": "8.3.5", 268 | "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.5.tgz", 269 | "integrity": "sha512-NxTuJocUhYGsMiMFHDUkmjSKT3EdH4/WbGF6GCi1NDGk+vbcUTun4fpbOqaPtD8IIsztA2ilZm2DhYCuyN58gA==", 270 | "dev": true, 271 | "dependencies": { 272 | "colorette": "^1.2.2", 273 | "nanoid": "^3.1.23", 274 | "source-map-js": "^0.6.2" 275 | }, 276 | "engines": { 277 | "node": "^10 || ^12 || >=14" 278 | }, 279 | "funding": { 280 | "type": "opencollective", 281 | "url": "https://opencollective.com/postcss/" 282 | } 283 | }, 284 | "node_modules/require-relative": { 285 | "version": "0.8.7", 286 | "resolved": "https://registry.npmjs.org/require-relative/-/require-relative-0.8.7.tgz", 287 | "integrity": "sha1-eZlTn8ngR6N5KPoZb44VY9q9Nt4=", 288 | "dev": true 289 | }, 290 | "node_modules/resolve": { 291 | "version": "1.20.0", 292 | "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.20.0.tgz", 293 | "integrity": "sha512-wENBPt4ySzg4ybFQW2TT1zMQucPK95HSh/nq2CFTZVOGut2+pQvSsgtda4d26YrYcr067wjbmzOG8byDPBX63A==", 294 | "dev": true, 295 | "dependencies": { 296 | "is-core-module": "^2.2.0", 297 | "path-parse": "^1.0.6" 298 | }, 299 | "funding": { 300 | "url": "https://github.com/sponsors/ljharb" 301 | } 302 | }, 303 | "node_modules/rollup": { 304 | "version": "2.52.2", 305 | "resolved": "https://registry.npmjs.org/rollup/-/rollup-2.52.2.tgz", 306 | "integrity": "sha512-4RlFC3k2BIHlUsJ9mGd8OO+9Lm2eDF5P7+6DNQOp5sx+7N/1tFM01kELfbxlMX3MxT6owvLB1ln4S3QvvQlbUA==", 307 | "dev": true, 308 | "bin": { 309 | "rollup": "dist/bin/rollup" 310 | }, 311 | "engines": { 312 | "node": ">=10.0.0" 313 | }, 314 | "optionalDependencies": { 315 | "fsevents": "~2.3.2" 316 | } 317 | }, 318 | "node_modules/source-map-js": { 319 | "version": "0.6.2", 320 | "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-0.6.2.tgz", 321 | "integrity": "sha512-/3GptzWzu0+0MBQFrDKzw/DvvMTUORvgY6k6jd/VS6iCR4RDTKWH6v6WPwQoUO8667uQEf9Oe38DxAYWY5F/Ug==", 322 | "dev": true, 323 | "engines": { 324 | "node": ">=0.10.0" 325 | } 326 | }, 327 | "node_modules/supports-color": { 328 | "version": "7.2.0", 329 | "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", 330 | "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", 331 | "dev": true, 332 | "dependencies": { 333 | "has-flag": "^4.0.0" 334 | }, 335 | "engines": { 336 | "node": ">=8" 337 | } 338 | }, 339 | "node_modules/svelte": { 340 | "version": "3.38.3", 341 | "resolved": "https://registry.npmjs.org/svelte/-/svelte-3.38.3.tgz", 342 | "integrity": "sha512-N7bBZJH0iF24wsalFZF+fVYMUOigaAUQMIcEKHO3jstK/iL8VmP9xE+P0/a76+FkNcWt+TDv2Gx1taUoUscrvw==", 343 | "engines": { 344 | "node": ">= 8" 345 | } 346 | }, 347 | "node_modules/svelte-hmr": { 348 | "version": "0.14.4", 349 | "resolved": "https://registry.npmjs.org/svelte-hmr/-/svelte-hmr-0.14.4.tgz", 350 | "integrity": "sha512-kItFF7vqzStckSigoFmMnxJpTOdB9TWnQAW6Js+yAB4277tLbJIIE5KBlGHNmJNpA7MguqidsPB27Uw5UzQPCA==", 351 | "peerDependencies": { 352 | "svelte": ">=3.19.0" 353 | } 354 | }, 355 | "node_modules/vite": { 356 | "version": "2.3.8", 357 | "resolved": "https://registry.npmjs.org/vite/-/vite-2.3.8.tgz", 358 | "integrity": "sha512-QiEx+iqNnJntSgSF2fWRQvRey9pORIrtNJzNyBJXwc+BdzWs83FQolX84cTBo393cfhObrtWa6180dAa4NLDiQ==", 359 | "dev": true, 360 | "dependencies": { 361 | "esbuild": "^0.12.8", 362 | "postcss": "^8.3.4", 363 | "resolve": "^1.20.0", 364 | "rollup": "^2.38.5" 365 | }, 366 | "bin": { 367 | "vite": "bin/vite.js" 368 | }, 369 | "engines": { 370 | "node": ">=12.0.0" 371 | }, 372 | "optionalDependencies": { 373 | "fsevents": "~2.3.2" 374 | } 375 | } 376 | }, 377 | "dependencies": { 378 | "@rollup/pluginutils": { 379 | "version": "4.1.0", 380 | "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-4.1.0.tgz", 381 | "integrity": "sha512-TrBhfJkFxA+ER+ew2U2/fHbebhLT/l/2pRk0hfj9KusXUuRXd2v0R58AfaZK9VXDQ4TogOSEmICVrQAA3zFnHQ==", 382 | "dev": true, 383 | "requires": { 384 | "estree-walker": "^2.0.1", 385 | "picomatch": "^2.2.2" 386 | } 387 | }, 388 | "@sveltejs/vite-plugin-svelte": { 389 | "version": "1.0.0-next.11", 390 | "resolved": "https://registry.npmjs.org/@sveltejs/vite-plugin-svelte/-/vite-plugin-svelte-1.0.0-next.11.tgz", 391 | "integrity": "sha512-EYR1I145k5rflVqhPwk3442m3bkYimTKSHM9uO5KdomXzt+GS9ZSBJQE3/wy1Di9V8OnGa3oKpckI3OZsHkTIA==", 392 | "dev": true, 393 | "requires": { 394 | "@rollup/pluginutils": "^4.1.0", 395 | "chalk": "^4.1.1", 396 | "debug": "^4.3.2", 397 | "require-relative": "^0.8.7", 398 | "svelte-hmr": "^0.14.4" 399 | } 400 | }, 401 | "ansi-styles": { 402 | "version": "4.3.0", 403 | "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", 404 | "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", 405 | "dev": true, 406 | "requires": { 407 | "color-convert": "^2.0.1" 408 | } 409 | }, 410 | "chalk": { 411 | "version": "4.1.1", 412 | "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.1.tgz", 413 | "integrity": "sha512-diHzdDKxcU+bAsUboHLPEDQiw0qEe0qd7SYUn3HgcFlWgbDcfLGswOHYeGrHKzG9z6UYf01d9VFMfZxPM1xZSg==", 414 | "dev": true, 415 | "requires": { 416 | "ansi-styles": "^4.1.0", 417 | "supports-color": "^7.1.0" 418 | } 419 | }, 420 | "color-convert": { 421 | "version": "2.0.1", 422 | "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", 423 | "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", 424 | "dev": true, 425 | "requires": { 426 | "color-name": "~1.1.4" 427 | } 428 | }, 429 | "color-name": { 430 | "version": "1.1.4", 431 | "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", 432 | "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", 433 | "dev": true 434 | }, 435 | "colorette": { 436 | "version": "1.2.2", 437 | "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz", 438 | "integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==", 439 | "dev": true 440 | }, 441 | "debug": { 442 | "version": "4.3.2", 443 | "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.2.tgz", 444 | "integrity": "sha512-mOp8wKcvj7XxC78zLgw/ZA+6TSgkoE2C/ienthhRD298T7UNwAg9diBpLRxC0mOezLl4B0xV7M0cCO6P/O0Xhw==", 445 | "dev": true, 446 | "requires": { 447 | "ms": "2.1.2" 448 | } 449 | }, 450 | "esbuild": { 451 | "version": "0.12.9", 452 | "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.12.9.tgz", 453 | "integrity": "sha512-MWRhAbMOJ9RJygCrt778rz/qNYgA4ZVj6aXnNPxFjs7PmIpb0fuB9Gmg5uWrr6n++XKwwm/RmSz6RR5JL2Ocsw==" 454 | }, 455 | "escape-html": { 456 | "version": "1.0.3", 457 | "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz", 458 | "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg=" 459 | }, 460 | "estree-walker": { 461 | "version": "2.0.2", 462 | "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz", 463 | "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==", 464 | "dev": true 465 | }, 466 | "fsevents": { 467 | "version": "2.3.2", 468 | "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", 469 | "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", 470 | "dev": true, 471 | "optional": true 472 | }, 473 | "function-bind": { 474 | "version": "1.1.1", 475 | "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz", 476 | "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==", 477 | "dev": true 478 | }, 479 | "gifenc": { 480 | "version": "1.0.3", 481 | "resolved": "https://registry.npmjs.org/gifenc/-/gifenc-1.0.3.tgz", 482 | "integrity": "sha512-xdr6AdrfGBcfzncONUOlXMBuc5wJDtOueE3c5rdG0oNgtINLD+f2iFZltrBRZYzACRbKr+mSVU/x98zv2u3jmw==" 483 | }, 484 | "has": { 485 | "version": "1.0.3", 486 | "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz", 487 | "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==", 488 | "dev": true, 489 | "requires": { 490 | "function-bind": "^1.1.1" 491 | } 492 | }, 493 | "has-flag": { 494 | "version": "4.0.0", 495 | "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", 496 | "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", 497 | "dev": true 498 | }, 499 | "is-core-module": { 500 | "version": "2.4.0", 501 | "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.4.0.tgz", 502 | "integrity": "sha512-6A2fkfq1rfeQZjxrZJGerpLCTHRNEBiSgnu0+obeJpEPZRUooHgsizvzv0ZjJwOz3iWIHdJtVWJ/tmPr3D21/A==", 503 | "dev": true, 504 | "requires": { 505 | "has": "^1.0.3" 506 | } 507 | }, 508 | "maxstache": { 509 | "version": "1.0.7", 510 | "resolved": "https://registry.npmjs.org/maxstache/-/maxstache-1.0.7.tgz", 511 | "integrity": "sha1-IjHVGAung9Xs/DHEX+2seuQnaYQ=" 512 | }, 513 | "mp4-wasm": { 514 | "version": "1.0.3", 515 | "resolved": "https://registry.npmjs.org/mp4-wasm/-/mp4-wasm-1.0.3.tgz", 516 | "integrity": "sha512-2h3iX7xmVch9j71YrbtSFRXr3EZtCSSpb/DNp3dQ3/X8lpnBVz4VIIKCc5KD+hF0EFGquFcAR4WeiuKGwcGGtg==" 517 | }, 518 | "ms": { 519 | "version": "2.1.2", 520 | "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", 521 | "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==", 522 | "dev": true 523 | }, 524 | "nanoid": { 525 | "version": "3.1.23", 526 | "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.23.tgz", 527 | "integrity": "sha512-FiB0kzdP0FFVGDKlRLEQ1BgDzU87dy5NnzjeW9YZNt+/c3+q82EQDUwniSAUxp/F0gFNI1ZhKU1FqYsMuqZVnw==", 528 | "dev": true 529 | }, 530 | "node-fetch": { 531 | "version": "2.6.1", 532 | "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.1.tgz", 533 | "integrity": "sha512-V4aYg89jEoVRxRb2fJdAg8FHvI7cEyYdVAh94HH0UIK8oJxUfkjlDQN9RbMx+bEjP7+ggMiFRprSti032Oipxw==" 534 | }, 535 | "path-parse": { 536 | "version": "1.0.7", 537 | "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz", 538 | "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==", 539 | "dev": true 540 | }, 541 | "picomatch": { 542 | "version": "2.3.0", 543 | "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.0.tgz", 544 | "integrity": "sha512-lY1Q/PiJGC2zOv/z391WOTD+Z02bCgsFfvxoXXf6h7kv9o+WmsmzYqrAwY63sNgOxE4xEdq0WyUnXfKeBrSvYw==", 545 | "dev": true 546 | }, 547 | "postcss": { 548 | "version": "8.3.5", 549 | "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.5.tgz", 550 | "integrity": "sha512-NxTuJocUhYGsMiMFHDUkmjSKT3EdH4/WbGF6GCi1NDGk+vbcUTun4fpbOqaPtD8IIsztA2ilZm2DhYCuyN58gA==", 551 | "dev": true, 552 | "requires": { 553 | "colorette": "^1.2.2", 554 | "nanoid": "^3.1.23", 555 | "source-map-js": "^0.6.2" 556 | } 557 | }, 558 | "require-relative": { 559 | "version": "0.8.7", 560 | "resolved": "https://registry.npmjs.org/require-relative/-/require-relative-0.8.7.tgz", 561 | "integrity": "sha1-eZlTn8ngR6N5KPoZb44VY9q9Nt4=", 562 | "dev": true 563 | }, 564 | "resolve": { 565 | "version": "1.20.0", 566 | "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.20.0.tgz", 567 | "integrity": "sha512-wENBPt4ySzg4ybFQW2TT1zMQucPK95HSh/nq2CFTZVOGut2+pQvSsgtda4d26YrYcr067wjbmzOG8byDPBX63A==", 568 | "dev": true, 569 | "requires": { 570 | "is-core-module": "^2.2.0", 571 | "path-parse": "^1.0.6" 572 | } 573 | }, 574 | "rollup": { 575 | "version": "2.52.2", 576 | "resolved": "https://registry.npmjs.org/rollup/-/rollup-2.52.2.tgz", 577 | "integrity": "sha512-4RlFC3k2BIHlUsJ9mGd8OO+9Lm2eDF5P7+6DNQOp5sx+7N/1tFM01kELfbxlMX3MxT6owvLB1ln4S3QvvQlbUA==", 578 | "dev": true, 579 | "requires": { 580 | "fsevents": "~2.3.2" 581 | } 582 | }, 583 | "source-map-js": { 584 | "version": "0.6.2", 585 | "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-0.6.2.tgz", 586 | "integrity": "sha512-/3GptzWzu0+0MBQFrDKzw/DvvMTUORvgY6k6jd/VS6iCR4RDTKWH6v6WPwQoUO8667uQEf9Oe38DxAYWY5F/Ug==", 587 | "dev": true 588 | }, 589 | "supports-color": { 590 | "version": "7.2.0", 591 | "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", 592 | "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", 593 | "dev": true, 594 | "requires": { 595 | "has-flag": "^4.0.0" 596 | } 597 | }, 598 | "svelte": { 599 | "version": "3.38.3", 600 | "resolved": "https://registry.npmjs.org/svelte/-/svelte-3.38.3.tgz", 601 | "integrity": "sha512-N7bBZJH0iF24wsalFZF+fVYMUOigaAUQMIcEKHO3jstK/iL8VmP9xE+P0/a76+FkNcWt+TDv2Gx1taUoUscrvw==" 602 | }, 603 | "svelte-hmr": { 604 | "version": "0.14.4", 605 | "resolved": "https://registry.npmjs.org/svelte-hmr/-/svelte-hmr-0.14.4.tgz", 606 | "integrity": "sha512-kItFF7vqzStckSigoFmMnxJpTOdB9TWnQAW6Js+yAB4277tLbJIIE5KBlGHNmJNpA7MguqidsPB27Uw5UzQPCA==", 607 | "requires": {} 608 | }, 609 | "vite": { 610 | "version": "2.3.8", 611 | "resolved": "https://registry.npmjs.org/vite/-/vite-2.3.8.tgz", 612 | "integrity": "sha512-QiEx+iqNnJntSgSF2fWRQvRey9pORIrtNJzNyBJXwc+BdzWs83FQolX84cTBo393cfhObrtWa6180dAa4NLDiQ==", 613 | "dev": true, 614 | "requires": { 615 | "esbuild": "^0.12.8", 616 | "fsevents": "~2.3.2", 617 | "postcss": "^8.3.4", 618 | "resolve": "^1.20.0", 619 | "rollup": "^2.38.5" 620 | } 621 | } 622 | } 623 | } 624 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "artblocks-renderer", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "license": "MIT", 7 | "author": { 8 | "name": "Matt DesLauriers", 9 | "email": "dave.des@gmail.com", 10 | "url": "https://github.com/mattdesl" 11 | }, 12 | "dependencies": { 13 | "esbuild": "^0.12.9", 14 | "escape-html": "^1.0.3", 15 | "gifenc": "^1.0.3", 16 | "maxstache": "^1.0.7", 17 | "mp4-wasm": "^1.0.3", 18 | "node-fetch": "^2.6.1", 19 | "svelte-hmr": "^0.14.4" 20 | }, 21 | "type": "module", 22 | "scripts": { 23 | "dev": "vite", 24 | "build": "vite build", 25 | "serve": "vite preview" 26 | }, 27 | "devDependencies": { 28 | "@sveltejs/vite-plugin-svelte": "^1.0.0-next.11", 29 | "svelte": "^3.37.0", 30 | "vite": "^2.3.8" 31 | }, 32 | "keywords": [], 33 | "repository": { 34 | "type": "git", 35 | "url": "git://github.com/mattdesl/artblocks-renderer.git" 36 | }, 37 | "homepage": "https://github.com/mattdesl/artblocks-renderer", 38 | "bugs": { 39 | "url": "https://github.com/mattdesl/artblocks-renderer/issues" 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /src/App.svelte: -------------------------------------------------------------------------------- 1 | 34 | 35 |
36 |
37 |

ArtBlocks Recorder

38 |

39 | Enter your configuration and click the Render button to export 40 | the high quality media. 41 |

42 |

43 | Made by 44 | @mattdesl. 45 |

46 |
47 | {#if rendering} 48 |
49 | 50 | {#if format !== "png" && format !== 'inline'} 51 | {:else} 52 |
Rendering...
53 | {/if} 54 |
55 | { 57 | progress = detail; 58 | }} 59 | on:finish={stopRender} 60 | {fps} 61 | {dithering} 62 | totalFrames={format === "png" ? 1 : totalFrames} 63 | {width} 64 | {height} 65 | {format} 66 | {id} 67 | /> 68 | {:else} 69 |
70 |
71 | TokenID / ArtBlocks URL 72 | 73 |
74 |
75 | Format 76 | 89 |
90 | {#if format === "gif"} 91 |
92 | Dithering 93 | 97 |
98 | {/if} 99 |
100 | Framerate 101 | 109 | {#each fpsPresets as preset} 110 | 115 | {/each} 116 |
117 |
118 | Duration 119 | 126 | seconds 127 |
128 |
129 | Dimensions 130 | 138 | x 139 | 147 | px (use 0 for 'auto') 148 | 149 |
150 | 151 | {#await canUseMP4() then canUse} 152 | {#if !canUse} 153 |

154 | Note: MP4 support disabled, please use Chrome with "Experimental Web 155 | Platform Features" enabled in chrome://flags. 156 |

157 | {/if} 158 | {/await} 159 | 160 | 161 |
162 | {/if} 163 |
164 | 165 | 305 | -------------------------------------------------------------------------------- /src/Generator.svelte: -------------------------------------------------------------------------------- 1 | 219 | 220 |
225 | {#await promise} 226 |
loading...
227 | {:then html} 228 | {#if html} 229 | {#if format !== 'inline'} 230 | 231 | {/if} 232 |