├── .gitignore ├── Gulpfile.js ├── LICENSE ├── README.md ├── dist ├── index.js ├── main.css └── themes │ ├── basic │ └── assets │ │ └── fonts │ │ ├── icons.eot │ │ ├── icons.svg │ │ ├── icons.ttf │ │ └── icons.woff │ ├── default │ └── assets │ │ ├── fonts │ │ ├── icons.eot │ │ ├── icons.otf │ │ ├── icons.svg │ │ ├── icons.ttf │ │ ├── icons.woff │ │ └── icons.woff2 │ │ └── images │ │ └── flags.png │ └── github │ └── assets │ └── fonts │ ├── octicons-local.ttf │ ├── octicons.svg │ ├── octicons.ttf │ └── octicons.woff ├── img ├── 2girls.png ├── 2girls_thumb.png ├── above-the-clouds.png ├── above-the-clouds_thumb.png ├── art-sky.png ├── art-sky_thumb.png ├── artificial-trees.png ├── artificial-trees_thumb.png ├── audience.png ├── audience_thumb.png ├── autumn.png ├── autumn_thumb.png ├── billboard.png ├── blur-fireworks.png ├── blur-fireworks_thumb.png ├── blurred-light.png ├── blurred-light_thumb.png ├── buildings.png ├── buildings_thumb.png ├── chaos.png ├── chaos_thumb.png ├── code.png ├── code_thumb.png ├── davideragusa.png ├── davideragusa_thumb.png ├── favicon.ico ├── ferrari.png ├── ferrari_thumb.png ├── fireworks.png ├── fireworks_thumb.png ├── flowers.png ├── flowers_thumb.png ├── fun.png ├── fun_thumb.png ├── light-circles.png ├── light-circles_thumb.png ├── lightning.png ├── lightning_thumb.png ├── lights.png ├── lights_thumb.png ├── more-clouds.png ├── more-clouds_thumb.png ├── nature.png ├── nature_thumb.png ├── party-people.png ├── party-people_thumb.png ├── party.png ├── party_thumb.png ├── pier-sunset.png ├── pier-sunset_thumb.png ├── plant.png ├── plant_thumb.png ├── projectspace.png ├── projectspace_thumb.png ├── roses.png ├── roses_thumb.png ├── tree-and-sky.png ├── tree-and-sky_thumb.png ├── volcanoes.png ├── volcanoes_thumb.png ├── water-texture.png ├── water-texture_thumb.png ├── water.png ├── water_thumb.png ├── woman-glasses.png └── woman-glasses_thumb.png ├── index.html ├── js ├── controller.js ├── draw.js ├── main.js ├── pubsub.js ├── share.js ├── ui.js └── vendor │ ├── caman.full.min.js │ ├── caman.min.js │ ├── dat.gui.min.js │ ├── jquery.min.js │ └── semantic.min.js ├── package.json ├── sass ├── _defaults.scss ├── _responsive.scss ├── _variables.scss ├── main.scss └── vendor │ └── semantic.min.css ├── semantic.json └── webpack.config.js /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | semantic 3 | temp -------------------------------------------------------------------------------- /Gulpfile.js: -------------------------------------------------------------------------------- 1 | /** 2 | * GULP tasks 3 | * @author Tibor Szász 4 | */ 5 | var gulp = require('gulp'), 6 | sass = require('gulp-sass'); 7 | uglify = require('gulp-uglify'); 8 | concat = require('gulp-concat'); 9 | autoprefixer = require('gulp-autoprefixer'); 10 | 11 | var port = 4000; 12 | 13 | /** 14 | * Launch static server 15 | */ 16 | gulp.task('express', function() { 17 | var express = require('express'); 18 | var app = express(); 19 | app.use(express.static(__dirname)); 20 | app.listen(port); 21 | }); 22 | 23 | /** 24 | * Compile sass files to the /dist folder 25 | */ 26 | gulp.task('sass', function () { 27 | gulp.src('./sass/**/*.scss') 28 | .pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError)) 29 | .pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1')) 30 | .pipe(gulp.dest('./dist')); 31 | }); 32 | 33 | /** 34 | * Compile JS files 35 | */ 36 | gulp.task('js', function () { 37 | gulp.src('./js/*.js') 38 | .pipe(uglify()) 39 | .on('error', function (e) { 40 | console.log(e) 41 | }) 42 | .pipe(concat('flat.js')) 43 | .pipe(gulp.dest('./dist')); 44 | }); 45 | 46 | /** 47 | * And the main entry point: 48 | * - compiles sass 49 | * - watches sass 50 | */ 51 | gulp.task('default', ['sass'], function() { 52 | // Peek for changes 53 | gulp.watch('./sass/**/*.scss', ['sass']); 54 | }); 55 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 Tibor Szász 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | 23 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # unique-background-gradients 2 | Generate background gradients from a few pixels 3 | -------------------------------------------------------------------------------- /dist/themes/basic/assets/fonts/icons.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/dist/themes/basic/assets/fonts/icons.eot -------------------------------------------------------------------------------- /dist/themes/basic/assets/fonts/icons.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Created by FontForge 20100429 at Thu Sep 20 22:09:47 2012 6 | By root 7 | Copyright (C) 2012 by original authors @ fontello.com 8 | 9 | 10 | 11 | 24 | 26 | 28 | 30 | 32 | 35 | 37 | 41 | 44 | 47 | 49 | 51 | 53 | 55 | 57 | 59 | 61 | 63 | 65 | 68 | 71 | 74 | 76 | 80 | 86 | 89 | 91 | 101 | 103 | 105 | 108 | 110 | 112 | 115 | 118 | 121 | 123 | 125 | 127 | 129 | 131 | 133 | 135 | 137 | 140 | 142 | 146 | 149 | 153 | 158 | 161 | 163 | 165 | 169 | 172 | 174 | 178 | 181 | 184 | 191 | 193 | 196 | 199 | 203 | 206 | 209 | 213 | 217 | 219 | 221 | 223 | 225 | 228 | 231 | 234 | 237 | 240 | 243 | 245 | 247 | 250 | 253 | 255 | 258 | 262 | 264 | 266 | 268 | 270 | 273 | 275 | 278 | 283 | 289 | 292 | 295 | 299 | 301 | 304 | 307 | 311 | 315 | 317 | 322 | 325 | 329 | 334 | 341 | 344 | 347 | 351 | 354 | 358 | 362 | 367 | 372 | 377 | 380 | 385 | 388 | 392 | 398 | 401 | 403 | 409 | 411 | 413 | 418 | 422 | 425 | 428 | 431 | 434 | 436 | 440 | 443 | 446 | 449 | 450 | 451 | -------------------------------------------------------------------------------- /dist/themes/basic/assets/fonts/icons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/dist/themes/basic/assets/fonts/icons.ttf -------------------------------------------------------------------------------- /dist/themes/basic/assets/fonts/icons.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/dist/themes/basic/assets/fonts/icons.woff -------------------------------------------------------------------------------- /dist/themes/default/assets/fonts/icons.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/dist/themes/default/assets/fonts/icons.eot -------------------------------------------------------------------------------- /dist/themes/default/assets/fonts/icons.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/dist/themes/default/assets/fonts/icons.otf -------------------------------------------------------------------------------- /dist/themes/default/assets/fonts/icons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/dist/themes/default/assets/fonts/icons.ttf -------------------------------------------------------------------------------- /dist/themes/default/assets/fonts/icons.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/dist/themes/default/assets/fonts/icons.woff -------------------------------------------------------------------------------- /dist/themes/default/assets/fonts/icons.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/dist/themes/default/assets/fonts/icons.woff2 -------------------------------------------------------------------------------- /dist/themes/default/assets/images/flags.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/dist/themes/default/assets/images/flags.png -------------------------------------------------------------------------------- /dist/themes/github/assets/fonts/octicons-local.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/dist/themes/github/assets/fonts/octicons-local.ttf -------------------------------------------------------------------------------- /dist/themes/github/assets/fonts/octicons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/dist/themes/github/assets/fonts/octicons.ttf -------------------------------------------------------------------------------- /dist/themes/github/assets/fonts/octicons.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/dist/themes/github/assets/fonts/octicons.woff -------------------------------------------------------------------------------- /img/2girls.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/2girls.png -------------------------------------------------------------------------------- /img/2girls_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/2girls_thumb.png -------------------------------------------------------------------------------- /img/above-the-clouds.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/above-the-clouds.png -------------------------------------------------------------------------------- /img/above-the-clouds_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/above-the-clouds_thumb.png -------------------------------------------------------------------------------- /img/art-sky.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/art-sky.png -------------------------------------------------------------------------------- /img/art-sky_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/art-sky_thumb.png -------------------------------------------------------------------------------- /img/artificial-trees.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/artificial-trees.png -------------------------------------------------------------------------------- /img/artificial-trees_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/artificial-trees_thumb.png -------------------------------------------------------------------------------- /img/audience.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/audience.png -------------------------------------------------------------------------------- /img/audience_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/audience_thumb.png -------------------------------------------------------------------------------- /img/autumn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/autumn.png -------------------------------------------------------------------------------- /img/autumn_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/autumn_thumb.png -------------------------------------------------------------------------------- /img/billboard.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/billboard.png -------------------------------------------------------------------------------- /img/blur-fireworks.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/blur-fireworks.png -------------------------------------------------------------------------------- /img/blur-fireworks_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/blur-fireworks_thumb.png -------------------------------------------------------------------------------- /img/blurred-light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/blurred-light.png -------------------------------------------------------------------------------- /img/blurred-light_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/blurred-light_thumb.png -------------------------------------------------------------------------------- /img/buildings.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/buildings.png -------------------------------------------------------------------------------- /img/buildings_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/buildings_thumb.png -------------------------------------------------------------------------------- /img/chaos.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/chaos.png -------------------------------------------------------------------------------- /img/chaos_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/chaos_thumb.png -------------------------------------------------------------------------------- /img/code.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/code.png -------------------------------------------------------------------------------- /img/code_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/code_thumb.png -------------------------------------------------------------------------------- /img/davideragusa.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/davideragusa.png -------------------------------------------------------------------------------- /img/davideragusa_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/davideragusa_thumb.png -------------------------------------------------------------------------------- /img/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/favicon.ico -------------------------------------------------------------------------------- /img/ferrari.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/ferrari.png -------------------------------------------------------------------------------- /img/ferrari_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/ferrari_thumb.png -------------------------------------------------------------------------------- /img/fireworks.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/fireworks.png -------------------------------------------------------------------------------- /img/fireworks_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/fireworks_thumb.png -------------------------------------------------------------------------------- /img/flowers.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/flowers.png -------------------------------------------------------------------------------- /img/flowers_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/flowers_thumb.png -------------------------------------------------------------------------------- /img/fun.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/fun.png -------------------------------------------------------------------------------- /img/fun_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/fun_thumb.png -------------------------------------------------------------------------------- /img/light-circles.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/light-circles.png -------------------------------------------------------------------------------- /img/light-circles_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/light-circles_thumb.png -------------------------------------------------------------------------------- /img/lightning.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/lightning.png -------------------------------------------------------------------------------- /img/lightning_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/lightning_thumb.png -------------------------------------------------------------------------------- /img/lights.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/lights.png -------------------------------------------------------------------------------- /img/lights_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/lights_thumb.png -------------------------------------------------------------------------------- /img/more-clouds.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/more-clouds.png -------------------------------------------------------------------------------- /img/more-clouds_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/more-clouds_thumb.png -------------------------------------------------------------------------------- /img/nature.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/nature.png -------------------------------------------------------------------------------- /img/nature_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/nature_thumb.png -------------------------------------------------------------------------------- /img/party-people.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/party-people.png -------------------------------------------------------------------------------- /img/party-people_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/party-people_thumb.png -------------------------------------------------------------------------------- /img/party.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/party.png -------------------------------------------------------------------------------- /img/party_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/party_thumb.png -------------------------------------------------------------------------------- /img/pier-sunset.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/pier-sunset.png -------------------------------------------------------------------------------- /img/pier-sunset_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/pier-sunset_thumb.png -------------------------------------------------------------------------------- /img/plant.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/plant.png -------------------------------------------------------------------------------- /img/plant_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/plant_thumb.png -------------------------------------------------------------------------------- /img/projectspace.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/projectspace.png -------------------------------------------------------------------------------- /img/projectspace_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/projectspace_thumb.png -------------------------------------------------------------------------------- /img/roses.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/roses.png -------------------------------------------------------------------------------- /img/roses_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/roses_thumb.png -------------------------------------------------------------------------------- /img/tree-and-sky.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/tree-and-sky.png -------------------------------------------------------------------------------- /img/tree-and-sky_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/tree-and-sky_thumb.png -------------------------------------------------------------------------------- /img/volcanoes.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/volcanoes.png -------------------------------------------------------------------------------- /img/volcanoes_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/volcanoes_thumb.png -------------------------------------------------------------------------------- /img/water-texture.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/water-texture.png -------------------------------------------------------------------------------- /img/water-texture_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/water-texture_thumb.png -------------------------------------------------------------------------------- /img/water.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/water.png -------------------------------------------------------------------------------- /img/water_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/water_thumb.png -------------------------------------------------------------------------------- /img/woman-glasses.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/woman-glasses.png -------------------------------------------------------------------------------- /img/woman-glasses_thumb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tiborsaas/unique-gradient-generator/b69c1d09646aebe14171ef074f8cad11d43dcde0/img/woman-glasses_thumb.png -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Unique gradient generator 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 |
62 | 63 | 64 | 65 |
66 |
67 |

Unique gradient generator

68 |

This tool helps you to generate beautiful blurry background images that you can use in any project. It doesn't use CSS3 gradients, but a rather unique approach. It takes a stock image, extracts a very small area (sample area) and scales it up to 100%. The browser's image smoothing algorithm takes care of the rest.

69 |

You can then use the image as an inline, base64 encoded image in any HTML element's background, just click Generate CSS button at the bottom of the app. Select source images from the gallery or use yours, the possibilities are endless.

70 |

Goodies

71 | 77 |

Credits

78 |

This tool was dreamed, developed, directed, executive produced by Tibor Szász. The images used in the project are all public domain stock images. Sources can be found in the image titles. Technologies used: Semantic UI, Dat.GUI, SASS, ES6, Pen and paper.

79 |
80 | 81 |
82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 |
91 |
92 | 93 | 94 | 95 | 117 | 118 | 119 | 120 | 144 | 145 | 146 | 147 | 148 | 156 | 157 | -------------------------------------------------------------------------------- /js/controller.js: -------------------------------------------------------------------------------- 1 | 2 | /** 3 | * The DAT.GUI wrapper class 4 | */ 5 | 6 | import dat from './vendor/dat.gui.min'; 7 | import pubsub from './pubsub'; 8 | 9 | class controller { 10 | 11 | constructor () { 12 | this.gui = new dat.GUI(); 13 | this.events = pubsub; 14 | 15 | this.params = { 16 | topX: 220, 17 | topY: 143, 18 | sampleArea: '7,3', 19 | invertText: false 20 | }; 21 | 22 | this.imageWidth = 0; 23 | this.imageHeight = 0; 24 | 25 | this.sampleAreaOptions = {}; 26 | this.createSampleArea(); 27 | 28 | this.controllers = {}; 29 | 30 | this.addKeyboardEvents(); 31 | } 32 | 33 | /** 34 | * expects a DOM image reference 35 | */ 36 | set image( img ) { 37 | this.imageWidth = img.width; 38 | this.imageHeight = img.height; 39 | 40 | if( this.controllers.list ) { 41 | this.clearGUIParams(); 42 | // reset positions 43 | this.params.topX = this.imageWidth / 2; 44 | this.params.topY = this.imageHeight / 2; 45 | } 46 | this.addGUIParams(); 47 | } 48 | 49 | set shared( share ) { 50 | this.params.topX = share.topX; 51 | this.params.topY = share.topY; 52 | this.params.sampleArea = share.sampleArea; 53 | this.params.invertText = share.invertText; 54 | // 55 | this.events.trigger('invertText', this.params); 56 | } 57 | 58 | createSampleArea () { 59 | const sampleAreaArray = [ 60 | [7,3],[9,5],[5,5],[9,9],[12,9],[15,9],[15,15],[20,15] 61 | ]; 62 | 63 | sampleAreaArray.forEach((e) => { 64 | this.sampleAreaOptions[ e[0] + ' × ' + e[1] ] = e; 65 | }); 66 | } 67 | 68 | addGUIParams () { 69 | /** 70 | * Start X 71 | */ 72 | this.controllers.topX = this.gui.add(this.params, 'topX'); 73 | this.controllers.topX = this.controllers.topX.min(0).max(this.imageWidth).step(1).name('X position'); 74 | 75 | this.controllers.topX.onChange((val) => { 76 | this.events.trigger('change', this.params); 77 | }); 78 | 79 | /** 80 | * Start Y 81 | */ 82 | this.controllers.topY = this.gui.add(this.params, 'topY'); 83 | this.controllers.topY = this.controllers.topY.min(0).max(this.imageHeight).step(1).name('Y position'); 84 | 85 | this.controllers.topY.onChange((val) => { 86 | this.events.trigger('change', this.params); 87 | }); 88 | 89 | /** 90 | * Sample area 91 | */ 92 | this.controllers.list = this.gui.add(this.params, 'sampleArea', this.sampleAreaOptions ); 93 | this.controllers.list = this.controllers.list.name('Sample area'); 94 | 95 | this.controllers.list.onChange((val) => { 96 | this.events.trigger('change', this.params); 97 | }); 98 | 99 | /** 100 | * Invert text 101 | */ 102 | this.controllers.invertText = this.gui.add(this.params, "invertText"); 103 | this.controllers.invertText = this.controllers.invertText.name('Invert text color'); 104 | 105 | this.controllers.invertText.onChange((val) => { 106 | this.events.trigger('invertText', this.params); 107 | }); 108 | 109 | /** 110 | * Randomize Button 111 | */ 112 | this.controllers.randomizeButton = this.gui.add({ 113 | "Randomize": () => { 114 | this.randomize(); 115 | } 116 | }, "Randomize"); 117 | } 118 | 119 | clearGUIParams () { 120 | this.gui.remove( this.controllers.topY ); 121 | this.gui.remove( this.controllers.topX ); 122 | this.gui.remove( this.controllers.list ); 123 | this.gui.remove( this.controllers.invertText ); 124 | this.gui.remove( this.controllers.randomizeButton ); 125 | } 126 | 127 | randomBetween (min, max) { 128 | return Math.floor(Math.random() * (max - min + 1)) + min; 129 | } 130 | 131 | randomize () { 132 | this.params.topX = this.randomBetween(0, this.imageWidth); 133 | this.params.topY = this.randomBetween(0, this.imageHeight); 134 | this.gui.__controllers[0].setValue(this.params.topX); 135 | this.gui.__controllers[1].setValue(this.params.topY); 136 | } 137 | 138 | addKeyboardEvents () { 139 | window.addEventListener('keydown', (e) => { 140 | switch ( e.keyCode ) { 141 | case 37: 142 | e.preventDefault(); 143 | this.params.topX--; 144 | this.gui.__controllers[0].setValue(this.params.topX); 145 | break; 146 | case 39: 147 | e.preventDefault(); 148 | this.params.topX++; 149 | this.gui.__controllers[0].setValue(this.params.topX); 150 | break; 151 | case 38: 152 | e.preventDefault(); 153 | this.params.topY--; 154 | this.gui.__controllers[1].setValue(this.params.topY); 155 | break; 156 | case 40: 157 | e.preventDefault(); 158 | this.params.topY++; 159 | this.gui.__controllers[1].setValue(this.params.topY); 160 | break; 161 | case 82: 162 | e.preventDefault(); 163 | this.randomize(); 164 | break; 165 | } 166 | }); 167 | } 168 | } 169 | 170 | export default new controller(); 171 | -------------------------------------------------------------------------------- /js/draw.js: -------------------------------------------------------------------------------- 1 | 2 | /** 3 | * Handles drawing on canvas and image base64 encoding 4 | */ 5 | 6 | import pubsub from './pubsub'; 7 | 8 | class draw { 9 | 10 | constructor () { 11 | this.canvas = document.querySelector('#slicer'); 12 | this.ctx = this.canvas.getContext('2d'); 13 | this.imageData = null; 14 | } 15 | 16 | render ( imageObj, params ) { 17 | let areaArr = params.sampleArea.split(','); 18 | let sourceX = params.topX; 19 | let sourceY = params.topY; 20 | let sourceWidth = parseInt( areaArr[0] ); 21 | let sourceHeight = parseInt( areaArr[1] ); 22 | let destWidth = sourceWidth; 23 | let destHeight = sourceHeight; 24 | let destX = 0 25 | let destY = 0 26 | 27 | this.canvas.width = sourceWidth; 28 | this.canvas.height = sourceHeight; 29 | 30 | this.ctx.drawImage(imageObj, sourceX, sourceY, sourceWidth, sourceHeight, destX, destY, destWidth, destHeight); 31 | this.imageData = this.canvas.toDataURL(); 32 | } 33 | } 34 | 35 | export default new draw(); 36 | -------------------------------------------------------------------------------- /js/main.js: -------------------------------------------------------------------------------- 1 | 2 | /** 3 | * Unique gradient generator 4 | * -- 5 | * @author Tibor Szász 6 | * All rights reserved 7 | */ 8 | 9 | /* Vendor scripts */ 10 | import $ from './vendor/jquery.min'; 11 | import semantic from './vendor/semantic.min'; 12 | 13 | /* App scripts */ 14 | import controller from './controller'; 15 | import ui from './ui'; 16 | import draw from './draw'; 17 | import { hashDetect, getStateURL } from './share'; 18 | 19 | window.addEventListener('DOMContentLoaded', function () { 20 | 21 | /** 22 | * dat.GUI event listeners 23 | */ 24 | controller.events.on('change', ( params ) => { 25 | draw.render( ui.image, params ); 26 | ui.updateGradient( draw.imageData ); 27 | }); 28 | 29 | controller.events.on('invertText', ( params ) => { 30 | ui.invertText( params.invertText ); 31 | }); 32 | 33 | /** 34 | * General image onload event 35 | */ 36 | ui.events.on('load', ( image ) => { 37 | controller.image = image; 38 | draw.render( image, controller.params ); 39 | ui.updateGradient( draw.imageData ); 40 | }); 41 | 42 | /** 43 | * Wire up modules via pubsub events 44 | */ 45 | ui.events.on('sharing', () => { 46 | let state = controller.params; 47 | state.image = ui.getImageId(); 48 | 49 | const url = getStateURL( state ); 50 | ui.events.trigger('share-url', url ); 51 | }); 52 | 53 | /** 54 | * On first load let's see if we need to present a setting 55 | */ 56 | const shared = hashDetect(); 57 | 58 | if( shared ) { 59 | ui.loadImageById( shared.image ); 60 | controller.shared = shared; 61 | } else { 62 | ui.loadImageById( 'artificial-trees' ); 63 | } 64 | }); 65 | 66 | /* That's all folks */ 67 | -------------------------------------------------------------------------------- /js/pubsub.js: -------------------------------------------------------------------------------- 1 | 2 | // http://dev.housetrip.com/2014/09/15/decoupling-javascript-apps-using-pub-sub-pattern/ 3 | 4 | var EventBus = { 5 | topics: {}, 6 | 7 | on: function(topic, listener) { 8 | // create the topic if not yet created 9 | if(!this.topics[topic]) this.topics[topic] = []; 10 | 11 | // add the listener 12 | this.topics[topic].push(listener); 13 | }, 14 | 15 | trigger: function(topic, data) { 16 | // return if the topic doesn't exist, or there are no listeners 17 | if(!this.topics[topic] || this.topics[topic].length < 1) return; 18 | 19 | // send the event to all listeners 20 | this.topics[topic].forEach(function(listener) { 21 | listener(data || {}); 22 | }); 23 | } 24 | }; 25 | 26 | export default EventBus; -------------------------------------------------------------------------------- /js/share.js: -------------------------------------------------------------------------------- 1 | 2 | /** 3 | * Detect if user is using a shared URL 4 | * -- 5 | * Valid hash structure: 6 | * topX|topY|sampleArea|invert|image_preset 7 | * 312|123|7,7|false|lights 8 | */ 9 | export function hashDetect () { 10 | 11 | // Test if URL is really a shared URL 12 | if( location.href.indexOf('?s=') == -1 ) { 13 | return; 14 | } 15 | 16 | let hash = location.search.replace(/^.*?\=/, '').split('&')[0]; 17 | 18 | if( hash === '' ) { 19 | return false; 20 | } 21 | 22 | try { 23 | var decoded = atob( hash ); 24 | } catch (e) { 25 | console.log('ErR0r: The shared code is not valid'); 26 | return; 27 | } 28 | 29 | const parts = decoded.split('|'); 30 | 31 | return { 32 | topX: parseInt( parts[0] ), 33 | topY: parseInt( parts[1] ), 34 | sampleArea: parts[2], 35 | invertText: JSON.parse( parts[3] ), 36 | image: parts[4] 37 | } 38 | } 39 | 40 | export function getStateURL ( state ) { 41 | return 'http://' + document.location.host + '?s=' + encodeState( state ); 42 | } 43 | 44 | /** 45 | * Create a shareable string that encodes the state of the app 46 | * Input data: 47 | * - controller.params 48 | * - selected image ID 49 | * @return {string} base64 encoded string 50 | */ 51 | function encodeState ( state ) { 52 | return btoa( state.topX + '|' + state.topY + '|' + state.sampleArea + '|' + state.invertText.toString() + '|' + state.image ); 53 | } 54 | 55 | /** 56 | * https://github.com/h5bp/mothereffinganimatedgif/blob/master/assets/js/share.js 57 | * http://i.imgur.com.rsz.io/d60kpBw.jpg?width=800 58 | */ -------------------------------------------------------------------------------- /js/ui.js: -------------------------------------------------------------------------------- 1 | 2 | /** 3 | * Manage UI 4 | * -- 5 | * Semantic UI modules used: 6 | * - reset 7 | * - button 8 | * - modal 9 | * - sidebar 10 | * - icons 11 | * - message 12 | */ 13 | 14 | import $ from './vendor/jquery.min'; 15 | import pubsub from './pubsub'; 16 | import { getStateURL } from './share'; 17 | 18 | class ui { 19 | 20 | constructor () { 21 | this.events = pubsub; 22 | this.image = null; 23 | this.ownImage = true; 24 | this.shareURL = ''; 25 | 26 | this.$imagePickerButton = $('#image-selector'); 27 | this.$imageUploadButton = $('#browse-image'); 28 | this.$getURLButton = $('#get-url'); 29 | this.$generateButton = $('#generate'); 30 | this.$facebookShareButton = $('.facebook.button'); 31 | this.$twitterShareButton = $('.twitter.button'); 32 | 33 | this.$fileInput = $('#file'); 34 | 35 | this.$images = $('.sidebar.images img'); 36 | this.$sidebar = $('.ui.sidebar'); 37 | 38 | this.$modal = $('#generate-css'); 39 | this.$urlDialog = $('#get-url-dialog'); 40 | 41 | this.$gradient = $('.pusher'); 42 | this.$content = $('.page-content'); 43 | 44 | this.addEvents(); 45 | this.addKeyboardEvents(); 46 | } 47 | 48 | addEvents () { 49 | this.$imagePickerButton.on('click', () => { 50 | this.$sidebar.sidebar('setting', 'transition', 'push').sidebar('toggle'); 51 | }); 52 | 53 | this.$generateButton.on('click', () => { 54 | this.$modal.modal('show'); 55 | this.$modal.find('textarea').val( `.myElement { 56 | /* Generated with http://gradient.quasi.ink */ 57 | background-size: cover; 58 | background-image: ${this.$gradient.css('backgroundImage')}; 59 | }`); 60 | }); 61 | 62 | this.$imageUploadButton.on('click', ( e ) => { 63 | this.$fileInput.click(); 64 | }); 65 | 66 | this.$images.on('click', ( e ) => { 67 | this.loadImage( e.target.src.replace('_thumb','') ); 68 | this.$sidebar.sidebar('setting', 'transition', 'push').sidebar('toggle'); 69 | }); 70 | 71 | this.$fileInput.on('change', this.handleFileSelect.bind(this)); 72 | 73 | this.$getURLButton.on('click', ( e ) => { 74 | this.events.trigger('sharing'); 75 | this.showSharingDialog( this.shareURL ); 76 | }); 77 | 78 | this.$facebookShareButton.on('click', ( e ) => { 79 | this.events.trigger('sharing'); 80 | this.$facebookShareButton.attr('href', 'https://www.facebook.com/sharer/sharer.php?u=' + this.shareURL ); 81 | }); 82 | 83 | this.$twitterShareButton.on('click', ( e ) => { 84 | this.events.trigger('sharing'); 85 | this.$twitterShareButton.attr('href', 'https://twitter.com/intent/tweet?text=I just create a new background gradient: ' + this.shareURL ); 86 | }); 87 | 88 | this.events.on('share-url', ( url ) => { 89 | this.shareURL = url; 90 | }); 91 | } 92 | 93 | addKeyboardEvents () { 94 | window.addEventListener('keydown', (e) => { 95 | if ( e.keyCode == 27 ) { // ESC 96 | $('.dg.ac').fadeToggle(); 97 | $('.hideable').fadeToggle(); 98 | } 99 | }); 100 | } 101 | 102 | handleFileSelect(evt) { 103 | let reader = new FileReader(); 104 | 105 | reader.onload = (e) => { 106 | let dynImg = $('', { 107 | src: e.target.result, 108 | css: { 'display': 'none' } 109 | }).on('load', () => { 110 | $( document.body ).append( dynImg ); 111 | this.events.trigger('load', dynImg[0]); 112 | this.image = dynImg[0]; 113 | this.ownImage = false; 114 | }); 115 | } 116 | reader.readAsDataURL( evt.target.files[0] ); 117 | } 118 | 119 | updateGradient ( imageData ) { 120 | this.$modal.find('.bytes').html( imageData.length ); 121 | this.$gradient.css({ 122 | "backgroundImage": 'url(' + imageData + ')' 123 | }); 124 | } 125 | 126 | showSharingDialog ( url ) { 127 | this.$urlDialog.modal('show'); 128 | this.$urlDialog.find('input').val( url ); 129 | 130 | if( this.ownImage ) { 131 | this.$urlDialog.find('input').show(); 132 | this.$urlDialog.find('.sorry').hide(); 133 | } else { 134 | this.$urlDialog.find('input').hide(); 135 | this.$urlDialog.find('.sorry').show(); 136 | } 137 | } 138 | 139 | loadFirstImage () { 140 | this.loadImage( this.$images[0].src.replace('_thumb','') ); 141 | } 142 | 143 | loadImage ( src ) { 144 | let img = $('', { src: src }).on('load', () => { 145 | this.events.trigger('load', img[0]); 146 | this.image = img[0]; 147 | }); 148 | this.ownImage = true; 149 | } 150 | 151 | /** 152 | * Loads image by filename root 153 | * @param {[string]} id [the name of the file without extension, it's always .png] 154 | */ 155 | loadImageById ( id ) { 156 | const item = this.$images.filter(function(i,el){ 157 | const img = el.src.split('/'); 158 | let found = false; 159 | if( img[img.length-1].replace('_thumb.png','') == id ) { 160 | found = el; 161 | } 162 | return found; 163 | }); 164 | this.loadImage( item[0].src.replace('_thumb','') ); 165 | } 166 | 167 | getImageId () { 168 | const img = this.image.src.split('/'); 169 | return img[img.length-1].replace('.png',''); 170 | } 171 | 172 | invertText ( val ) { 173 | if( val ) { 174 | this.$content.addClass('invert'); 175 | } else { 176 | this.$content.removeClass('invert'); 177 | } 178 | } 179 | } 180 | 181 | export default new ui(); 182 | -------------------------------------------------------------------------------- /js/vendor/caman.min.js: -------------------------------------------------------------------------------- 1 | 2 | (function(){var $,Analyze,Blender,Calculate,Caman,CamanParser,Canvas,Convert,Event,Fiber,Filter,IO,Image,Layer,Log,Logger,PixelInfo,Plugin,Renderer,Root,Store,Util,fs,slice,__hasProp={}.hasOwnProperty,__indexOf=[].indexOf||function(item){for(var i=0,l=this.length;i255){return 255;} 8 | return val;};Util.copyAttributes=function(from,to,opts){var attr,_i,_len,_ref,_ref1,_results;if(opts==null){opts={};} 9 | _ref=from.attributes;_results=[];for(_i=0,_len=_ref.length;_i<_len;_i++){attr=_ref[_i];if((opts.except!=null)&&(_ref1=attr.nodeName,__indexOf.call(opts.except,_ref1)>=0)){continue;} 10 | _results.push(to.setAttribute(attr.nodeName,attr.nodeValue));} 11 | return _results;};Util.dataArray=function(length){if(length==null){length=0;} 12 | if(Caman.NodeJS||(window.Uint8Array!=null)){return new Uint8Array(length);} 13 | return new Array(length);};return Util;})();if(typeof exports!=="undefined"&&exports!==null){Root=exports;Canvas=require('canvas');Image=Canvas.Image;Fiber=require('fibers');fs=require('fs');}else{Root=window;} 14 | Root.Caman=Caman=(function(){Caman.version={release:"4.1.1",date:"4/8/2013"};Caman.DEBUG=false;Caman.NodeJS=typeof exports!=="undefined"&&exports!==null;Caman.autoload=!Caman.NodeJS;Caman.allowRevert=true;Caman.crossOrigin="anonymous";Caman.toString=function(){return"Version "+Caman.version.release+", Released "+Caman.version.date;};Caman.remoteProxy="";Caman.proxyParam="camanProxyUrl";Caman.getAttrId=function(canvas){if(Caman.NodeJS){return true;} 15 | if(typeof canvas==="string"){canvas=$(canvas);} 16 | if(!((canvas!=null)&&(canvas.getAttribute!=null))){return null;} 17 | return canvas.getAttribute('data-caman-id');};function Caman(){var args,callback,id,_this=this;if(arguments.length===0){throw"Invalid arguments";} 18 | if(this instanceof Caman){this.finishInit=this.finishInit.bind(this);this.imageLoaded=this.imageLoaded.bind(this);args=arguments[0];if(!Caman.NodeJS){id=parseInt(Caman.getAttrId(args[0]),10);callback=typeof args[1]==="function"?args[1]:typeof args[2]==="function"?args[2]:function(){};if(!isNaN(id)&&Store.has(id)){return Store.execute(id,callback);}} 19 | this.id=Util.uniqid.get();this.initializedPixelData=this.originalPixelData=null;this.cropCoordinates={x:0,y:0};this.cropped=false;this.resized=false;this.pixelStack=[];this.layerStack=[];this.canvasQueue=[];this.currentLayer=null;this.scaled=false;this.analyze=new Analyze(this);this.renderer=new Renderer(this);this.domIsLoaded(function(){_this.parseArguments(args);return _this.setup();});return this;}else{return new Caman(arguments);}} 20 | Caman.prototype.domIsLoaded=function(cb){var listener,_this=this;if(Caman.NodeJS){return setTimeout(function(){return cb.call(_this);},0);}else{if(document.readyState==="complete"){Log.debug("DOM initialized");return setTimeout(function(){return cb.call(_this);},0);}else{listener=function(){if(document.readyState==="complete"){Log.debug("DOM initialized");return cb.call(_this);}};return document.addEventListener("readystatechange",listener,false);}}};Caman.prototype.parseArguments=function(args){var key,val,_ref,_results;if(args.length===0){throw"Invalid arguments given";} 21 | this.initObj=null;this.initType=null;this.imageUrl=null;this.callback=function(){};this.setInitObject(args[0]);if(args.length===1){return;} 22 | switch(typeof args[1]){case"string":this.imageUrl=args[1];break;case"function":this.callback=args[1];} 23 | if(args.length===2){return;} 24 | this.callback=args[2];if(args.length===4){_ref=args[4];_results=[];for(key in _ref){if(!__hasProp.call(_ref,key))continue;val=_ref[key];_results.push(this.options[key]=val);} 25 | return _results;}};Caman.prototype.setInitObject=function(obj){if(Caman.NodeJS){this.initObj=obj;this.initType='node';return;} 26 | if(typeof obj==="object"){this.initObj=obj;}else{this.initObj=$(obj);} 27 | if(this.initObj==null){throw"Could not find image or canvas for initialization.";} 28 | return this.initType=this.initObj.nodeName.toLowerCase();};Caman.prototype.setup=function(){switch(this.initType){case"node":return this.initNode();case"img":return this.initImage();case"canvas":return this.initCanvas();}};Caman.prototype.initNode=function(){var _this=this;Log.debug("Initializing for NodeJS");this.image=new Image();this.image.onload=function(){Log.debug("Image loaded. Width = "+(_this.imageWidth())+", Height = "+(_this.imageHeight()));_this.canvas=new Canvas(_this.imageWidth(),_this.imageHeight());return _this.finishInit();};this.image.onerror=function(err){throw err;};return this.image.src=this.initObj;};Caman.prototype.initImage=function(){this.image=this.initObj;this.canvas=document.createElement('canvas');this.context=this.canvas.getContext('2d');Util.copyAttributes(this.image,this.canvas,{except:['src']});this.image.parentNode.replaceChild(this.canvas,this.image);this.imageAdjustments();return this.waitForImageLoaded();};Caman.prototype.initCanvas=function(){this.canvas=this.initObj;this.context=this.canvas.getContext('2d');if(this.imageUrl!=null){this.image=document.createElement('img');this.image.src=this.imageUrl;this.imageAdjustments();return this.waitForImageLoaded();}else{return this.finishInit();}};Caman.prototype.imageAdjustments=function(){if(this.needsHiDPISwap()){Log.debug(this.image.src,"->",this.hiDPIReplacement());this.swapped=true;this.image.src=this.hiDPIReplacement();} 29 | if(IO.isRemote(this.image)){this.image.src=IO.proxyUrl(this.image.src);return Log.debug("Remote image detected, using URL = "+this.image.src);}};Caman.prototype.waitForImageLoaded=function(){if(this.isImageLoaded()){return this.imageLoaded();}else{return this.image.onload=this.imageLoaded;}};Caman.prototype.isImageLoaded=function(){if(!this.image.complete){return false;} 30 | if((this.image.naturalWidth!=null)&&this.image.naturalWidth===0){return false;} 31 | return true;};Caman.prototype.imageWidth=function(){return this.image.width||this.image.naturalWidth;};Caman.prototype.imageHeight=function(){return this.image.height||this.image.naturalHeight;};Caman.prototype.imageLoaded=function(){Log.debug("Image loaded. Width = "+(this.imageWidth())+", Height = "+(this.imageHeight()));if(this.swapped){this.canvas.width=this.imageWidth()/this.hiDPIRatio();this.canvas.height=this.imageHeight()/this.hiDPIRatio();}else{this.canvas.width=this.imageWidth();this.canvas.height=this.imageHeight();} 32 | return this.finishInit();};Caman.prototype.finishInit=function(){var i,pixel,_i,_len,_ref;if(this.context==null){this.context=this.canvas.getContext('2d');} 33 | this.originalWidth=this.preScaledWidth=this.width=this.canvas.width;this.originalHeight=this.preScaledHeight=this.height=this.canvas.height;this.hiDPIAdjustments();if(!this.hasId()){this.assignId();} 34 | if(this.image!=null){this.context.drawImage(this.image,0,0,this.imageWidth(),this.imageHeight(),0,0,this.preScaledWidth,this.preScaledHeight);} 35 | this.reloadCanvasData();if(Caman.allowRevert){this.initializedPixelData=Util.dataArray(this.pixelData.length);this.originalPixelData=Util.dataArray(this.pixelData.length);_ref=this.pixelData;for(i=_i=0,_len=_ref.length;_i<_len;i=++_i){pixel=_ref[i];this.initializedPixelData[i]=pixel;this.originalPixelData[i]=pixel;}} 36 | this.dimensions={width:this.canvas.width,height:this.canvas.height};Store.put(this.id,this);this.callback.call(this,this);return this.callback=function(){};};Caman.prototype.reloadCanvasData=function(){this.imageData=this.context.getImageData(0,0,this.canvas.width,this.canvas.height);return this.pixelData=this.imageData.data;};Caman.prototype.resetOriginalPixelData=function(){var pixel,_i,_len,_ref,_results;if(!Caman.allowRevert){throw"Revert disabled";} 37 | this.originalPixelData=Util.dataArray(this.pixelData.length);_ref=this.pixelData;_results=[];for(_i=0,_len=_ref.length;_i<_len;_i++){pixel=_ref[_i];_results.push(this.originalPixelData.push(pixel));} 38 | return _results;};Caman.prototype.hasId=function(){return Caman.getAttrId(this.canvas)!=null;};Caman.prototype.assignId=function(){if(Caman.NodeJS||this.canvas.getAttribute('data-caman-id')){return;} 39 | return this.canvas.setAttribute('data-caman-id',this.id);};Caman.prototype.hiDPIDisabled=function(){return this.canvas.getAttribute('data-caman-hidpi-disabled')!==null;};Caman.prototype.hiDPIAdjustments=function(){var ratio;if(Caman.NodeJS||this.hiDPIDisabled()){return;} 40 | ratio=this.hiDPIRatio();if(ratio!==1){Log.debug("HiDPI ratio = "+ratio);this.scaled=true;this.preScaledWidth=this.canvas.width;this.preScaledHeight=this.canvas.height;this.canvas.width=this.preScaledWidth*ratio;this.canvas.height=this.preScaledHeight*ratio;this.canvas.style.width=""+this.preScaledWidth+"px";this.canvas.style.height=""+this.preScaledHeight+"px";this.context.scale(ratio,ratio);this.width=this.originalWidth=this.canvas.width;return this.height=this.originalHeight=this.canvas.height;}};Caman.prototype.hiDPIRatio=function(){var backingStoreRatio,devicePixelRatio;devicePixelRatio=window.devicePixelRatio||1;backingStoreRatio=this.context.webkitBackingStorePixelRatio||this.context.mozBackingStorePixelRatio||this.context.msBackingStorePixelRatio||this.context.oBackingStorePixelRatio||this.context.backingStorePixelRatio||1;return devicePixelRatio/backingStoreRatio;};Caman.prototype.hiDPICapable=function(){return(window.devicePixelRatio!=null)&&window.devicePixelRatio!==1;};Caman.prototype.needsHiDPISwap=function(){if(this.hiDPIDisabled()||!this.hiDPICapable()){return false;} 41 | return this.hiDPIReplacement()!==null;};Caman.prototype.hiDPIReplacement=function(){if(this.image==null){return null;} 42 | return this.image.getAttribute('data-caman-hidpi');};Caman.prototype.replaceCanvas=function(newCanvas){var oldCanvas;oldCanvas=this.canvas;this.canvas=newCanvas;this.context=this.canvas.getContext('2d');oldCanvas.parentNode.replaceChild(this.canvas,oldCanvas);this.width=this.canvas.width;this.height=this.canvas.height;this.reloadCanvasData();return this.dimensions={width:this.canvas.width,height:this.canvas.height};};Caman.prototype.render=function(callback){var _this=this;if(callback==null){callback=function(){};} 43 | Event.trigger(this,"renderStart");return this.renderer.execute(function(){_this.context.putImageData(_this.imageData,0,0);return callback.call(_this);});};Caman.prototype.revert=function(){var i,pixel,_i,_len,_ref;if(!Caman.allowRevert){throw"Revert disabled";} 44 | _ref=this.originalVisiblePixels();for(i=_i=0,_len=_ref.length;_i<_len;i=++_i){pixel=_ref[i];this.pixelData[i]=pixel;} 45 | return this.context.putImageData(this.imageData,0,0);};Caman.prototype.reset=function(){var canvas,ctx,i,imageData,pixel,pixelData,_i,_len,_ref;canvas=document.createElement('canvas');Util.copyAttributes(this.canvas,canvas);canvas.width=this.originalWidth;canvas.height=this.originalHeight;ctx=canvas.getContext('2d');imageData=ctx.getImageData(0,0,canvas.width,canvas.height);pixelData=imageData.data;_ref=this.initializedPixelData;for(i=_i=0,_len=_ref.length;_i<_len;i=++_i){pixel=_ref[i];pixelData[i]=pixel;} 46 | ctx.putImageData(imageData,0,0);this.cropCoordinates={x:0,y:0};this.resized=false;return this.replaceCanvas(canvas);};Caman.prototype.originalVisiblePixels=function(){var canvas,coord,ctx,endX,endY,i,imageData,pixel,pixelData,pixels,scaledCanvas,startX,startY,width,_i,_j,_len,_ref,_ref1,_ref2,_ref3;if(!Caman.allowRevert){throw"Revert disabled";} 47 | pixels=[];startX=this.cropCoordinates.x;endX=startX+this.width;startY=this.cropCoordinates.y;endY=startY+this.height;if(this.resized){canvas=document.createElement('canvas');canvas.width=this.originalWidth;canvas.height=this.originalHeight;ctx=canvas.getContext('2d');imageData=ctx.getImageData(0,0,canvas.width,canvas.height);pixelData=imageData.data;_ref=this.originalPixelData;for(i=_i=0,_len=_ref.length;_i<_len;i=++_i){pixel=_ref[i];pixelData[i]=pixel;} 48 | ctx.putImageData(imageData,0,0);scaledCanvas=document.createElement('canvas');scaledCanvas.width=this.width;scaledCanvas.height=this.height;ctx=scaledCanvas.getContext('2d');ctx.drawImage(canvas,0,0,this.originalWidth,this.originalHeight,0,0,this.width,this.height);pixelData=ctx.getImageData(0,0,this.width,this.height).data;width=this.width;}else{pixelData=this.originalPixelData;width=this.originalWidth;} 49 | for(i=_j=0,_ref1=pixelData.length;_j<_ref1;i=_j+=4){coord=PixelInfo.locationToCoordinates(i,width);if(((startX<=(_ref2=coord.x)&&_ref2_ref;i=0<=_ref?++_i:--_i){divisor+=adjust[i];}} 51 | this.renderer.add({type:Filter.Type.Kernel,name:name,adjust:adjust,divisor:divisor,bias:bias||0});return this;};Caman.prototype.processPlugin=function(plugin,args){this.renderer.add({type:Filter.Type.Plugin,plugin:plugin,args:args});return this;};Caman.prototype.newLayer=function(callback){var layer;layer=new Layer(this);this.canvasQueue.push(layer);this.renderer.add({type:Filter.Type.LayerDequeue});callback.call(layer);this.renderer.add({type:Filter.Type.LayerFinished});return this;};Caman.prototype.executeLayer=function(layer){return this.pushContext(layer);};Caman.prototype.pushContext=function(layer){this.layerStack.push(this.currentLayer);this.pixelStack.push(this.pixelData);this.currentLayer=layer;return this.pixelData=layer.pixelData;};Caman.prototype.popContext=function(){this.pixelData=this.pixelStack.pop();return this.currentLayer=this.layerStack.pop();};Caman.prototype.applyCurrentLayer=function(){return this.currentLayer.applyToParent();};return Caman;})();Analyze=(function(){function Analyze(c){this.c=c;} 52 | Analyze.prototype.calculateLevels=function(){var i,levels,numPixels,_i,_j,_k,_ref;levels={r:{},g:{},b:{}};for(i=_i=0;_i<=255;i=++_i){levels.r[i]=0;levels.g[i]=0;levels.b[i]=0;} 53 | for(i=_j=0,_ref=this.c.pixelData.length;_j<_ref;i=_j+=4){levels.r[this.c.pixelData[i]]++;levels.g[this.c.pixelData[i+1]]++;levels.b[this.c.pixelData[i+2]]++;} 54 | numPixels=this.c.pixelData.length/4;for(i=_k=0;_k<=255;i=++_k){levels.r[i]/=numPixels;levels.g[i]/=numPixels;levels.b[i]/=numPixels;} 55 | return levels;};return Analyze;})();Caman.DOMUpdated=function(){var img,imgs,parser,_i,_len,_results;imgs=document.querySelectorAll("img[data-caman]");if(!(imgs.length>0)){return;} 56 | _results=[];for(_i=0,_len=imgs.length;_i<_len;_i++){img=imgs[_i];_results.push(parser=new CamanParser(img,function(){this.parse();return this.execute();}));} 57 | return _results;};if(Caman.autoload){(function(){if(document.readyState==="complete"){return Caman.DOMUpdated();}else{return document.addEventListener("DOMContentLoaded",Caman.DOMUpdated,false);}})();} 58 | CamanParser=(function(){var INST_REGEX;INST_REGEX="(\\w+)\\((.*?)\\)";function CamanParser(ele,ready){this.dataStr=ele.getAttribute('data-caman');this.caman=Caman(ele,ready.bind(this));} 59 | CamanParser.prototype.parse=function(){var args,filter,func,inst,instFunc,m,r,unparsedInstructions,_i,_len,_ref,_results;this.ele=this.caman.canvas;r=new RegExp(INST_REGEX,'g');unparsedInstructions=this.dataStr.match(r);if(!(unparsedInstructions.length>0)){return;} 60 | r=new RegExp(INST_REGEX);_results=[];for(_i=0,_len=unparsedInstructions.length;_i<_len;_i++){inst=unparsedInstructions[_i];_ref=inst.match(r),m=_ref[0],filter=_ref[1],args=_ref[2];instFunc=new Function("return function() { this."+filter+"("+args+"); };");try{func=instFunc();_results.push(func.call(this.caman));}catch(e){_results.push(Log.debug(e));}} 61 | return _results;};CamanParser.prototype.execute=function(){var ele;ele=this.ele;return this.caman.render(function(){return ele.parentNode.replaceChild(this.toImage(),ele);});};return CamanParser;})();Caman.Blender=Blender=(function(){function Blender(){} 62 | Blender.blenders={};Blender.register=function(name,func){return this.blenders[name]=func;};Blender.execute=function(name,rgbaLayer,rgbaParent){return this.blenders[name](rgbaLayer,rgbaParent);};return Blender;})();Caman.Calculate=Calculate=(function(){function Calculate(){} 63 | Calculate.distance=function(x1,y1,x2,y2){return Math.sqrt(Math.pow(x2-x1,2)+Math.pow(y2-y1,2));};Calculate.randomRange=function(min,max,getFloat){var rand;if(getFloat==null){getFloat=false;} 64 | rand=min+(Math.random()*(max-min));if(getFloat){return rand.toFixed(getFloat);}else{return Math.round(rand);}};Calculate.luminance=function(rgba){return(0.299*rgba.r)+(0.587*rgba.g)+(0.114*rgba.b);};Calculate.bezier=function(start,ctrl1,ctrl2,end,lowBound,highBound){var Ax,Ay,Bx,By,Cx,Cy,bezier,curveX,curveY,i,j,leftCoord,rightCoord,t,x0,x1,x2,x3,y0,y1,y2,y3,_i,_j,_k,_ref,_ref1;x0=start[0];y0=start[1];x1=ctrl1[0];y1=ctrl1[1];x2=ctrl2[0];y2=ctrl2[1];x3=end[0];y3=end[1];bezier={};Cx=parseInt(3*(x1-x0),10);Bx=3*(x2-x1)-Cx;Ax=x3-x0-Cx-Bx;Cy=3*(y1-y0);By=3*(y2-y1)-Cy;Ay=y3-y0-Cy-By;for(i=_i=0;_i<1000;i=++_i){t=i/1000;curveX=Math.round((Ax*Math.pow(t,3))+(Bx*Math.pow(t,2))+(Cx*t)+x0);curveY=Math.round((Ay*Math.pow(t,3))+(By*Math.pow(t,2))+(Cy*t)+y0);if(lowBound&&curveYhighBound){curveY=highBound;} 65 | bezier[curveX]=curveY;} 66 | if(bezier.length=_ref;i=0<=_ref?++_j:--_j){if(bezier[i]==null){leftCoord=[i-1,bezier[i-1]];for(j=_k=i,_ref1=end[0];i<=_ref1?_k<=_ref1:_k>=_ref1;j=i<=_ref1?++_k:--_k){if(bezier[j]!=null){rightCoord=[j,bezier[j]];break;}} 67 | bezier[i]=leftCoord[1]+((rightCoord[1]-leftCoord[1])/(rightCoord[0]-leftCoord[0]))*(i-leftCoord[0]);}}} 68 | if(bezier[end[0]]==null){bezier[end[0]]=bezier[end[0]-1];} 69 | return bezier;};return Calculate;})();Convert=(function(){function Convert(){} 70 | Convert.hexToRGB=function(hex){var b,g,r;if(hex.charAt(0)==="#"){hex=hex.substr(1);} 71 | r=parseInt(hex.substr(0,2),16);g=parseInt(hex.substr(2,2),16);b=parseInt(hex.substr(4,2),16);return{r:r,g:g,b:b};};Convert.rgbToHSL=function(r,g,b){var d,h,l,max,min,s;if(typeof r==="object"){g=r.g;b=r.b;r=r.r;} 72 | r/=255;g/=255;b/=255;max=Math.max(r,g,b);min=Math.min(r,g,b);l=(max+min)/2;if(max===min){h=s=0;}else{d=max-min;s=l>0.5?d/(2-max-min):d/(max+min);h=(function(){switch(max){case r:return(g-b)/d+(g1){t-=1;} 77 | if(t<1/6){return p+(q-p)*6*t;} 78 | if(t<1/2){return q;} 79 | if(t<2/3){return p+(q-p)*(2/3-t)*6;} 80 | return p;};Convert.rgbToHSV=function(r,g,b){var d,h,max,min,s,v;r/=255;g/=255;b/=255;max=Math.max(r,g,b);min=Math.min(r,g,b);v=max;d=max-min;s=max===0?0:d/max;if(max===min){h=0;}else{h=(function(){switch(max){case r:return(g-b)/d+(g0.04045){r=Math.pow((r+0.055)/1.055,2.4);}else{r/=12.92;} 83 | if(g>0.04045){g=Math.pow((g+0.055)/1.055,2.4);}else{g/=12.92;} 84 | if(b>0.04045){b=Math.pow((b+0.055)/1.055,2.4);}else{b/=12.92;} 85 | x=r*0.4124+g*0.3576+b*0.1805;y=r*0.2126+g*0.7152+b*0.0722;z=r*0.0193+g*0.1192+b*0.9505;return{x:x*100,y:y*100,z:z*100};};Convert.xyzToRGB=function(x,y,z){var b,g,r;x/=100;y/=100;z/=100;r=(3.2406*x)+(-1.5372*y)+(-0.4986*z);g=(-0.9689*x)+(1.8758*y)+(0.0415*z);b=(0.0557*x)+(-0.2040*y)+(1.0570*z);if(r>0.0031308){r=(1.055*Math.pow(r,0.4166666667))-0.055;}else{r*=12.92;} 86 | if(g>0.0031308){g=(1.055*Math.pow(g,0.4166666667))-0.055;}else{g*=12.92;} 87 | if(b>0.0031308){b=(1.055*Math.pow(b,0.4166666667))-0.055;}else{b*=12.92;} 88 | return{r:r*255,g:g*255,b:b*255};};Convert.xyzToLab=function(x,y,z){var a,b,l,whiteX,whiteY,whiteZ;if(typeof x==="object"){y=x.y;z=x.z;x=x.x;} 89 | whiteX=95.047;whiteY=100.0;whiteZ=108.883;x/=whiteX;y/=whiteY;z/=whiteZ;if(x>0.008856451679){x=Math.pow(x,0.3333333333);}else{x=(7.787037037*x)+0.1379310345;} 90 | if(y>0.008856451679){y=Math.pow(y,0.3333333333);}else{y=(7.787037037*y)+0.1379310345;} 91 | if(z>0.008856451679){z=Math.pow(z,0.3333333333);}else{z=(7.787037037*z)+0.1379310345;} 92 | l=116*y-16;a=500*(x-y);b=200*(y-z);return{l:l,a:a,b:b};};Convert.labToXYZ=function(l,a,b){var x,y,z;if(typeof l==="object"){a=l.a;b=l.b;l=l.l;} 93 | y=(l+16)/116;x=y+(a/500);z=y-(b/200);if(x>0.2068965517){x=x*x*x;}else{x=0.1284185493*(x-0.1379310345);} 94 | if(y>0.2068965517){y=y*y*y;}else{y=0.1284185493*(y-0.1379310345);} 95 | if(z>0.2068965517){z=z*z*z;}else{z=0.1284185493*(z-0.1379310345);} 96 | return{x:x*95.047,y:y*100.0,z:z*108.883};};Convert.rgbToLab=function(r,g,b){var xyz;if(typeof r==="object"){g=r.g;b=r.b;r=r.r;} 97 | xyz=this.rgbToXYZ(r,g,b);return this.xyzToLab(xyz);};Convert.labToRGB=function(l,a,b){};return Convert;})();Event=(function(){function Event(){} 98 | Event.events={};Event.types=["processStart","processComplete","renderStart","renderFinished","blockStarted","blockFinished"];Event.trigger=function(target,type,data){var event,_i,_len,_ref,_results;if(this.events[type]&&this.events[type].length){_ref=this.events[type];_results=[];for(_i=0,_len=_ref.length;_i<_len;_i++){event=_ref[_i];if(event.target===null||target.id===event.target.id){_results.push(event.fn.call(target,data));}else{_results.push(void 0);}} 99 | return _results;}};Event.listen=function(target,type,fn){var _fn,_type;if(typeof target==="string"){_type=target;_fn=type;target=null;type=_type;fn=_fn;} 100 | if(__indexOf.call(this.types,type)<0){return false;} 101 | if(!this.events[type]){this.events[type]=[];} 102 | this.events[type].push({target:target,fn:fn});return true;};return Event;})();Caman.Event=Event;Caman.Filter=Filter=(function(){function Filter(){} 103 | Filter.Type={Single:1,Kernel:2,LayerDequeue:3,LayerFinished:4,LoadOverlay:5,Plugin:6};Filter.register=function(name,filterFunc){return Caman.prototype[name]=filterFunc;};return Filter;})();Caman.IO=IO=(function(){function IO(){} 104 | IO.domainRegex=/(?:(?:http|https):\/\/)((?:\w+)\.(?:(?:\w|\.)+))/;IO.isRemote=function(img){if(img==null){return false;} 105 | if(this.corsEnabled(img)){return false;} 106 | return this.isURLRemote(img.src);};IO.corsEnabled=function(img){var _ref;return(img.crossOrigin!=null)&&((_ref=img.crossOrigin.toLowerCase())==='anonymous'||_ref==='use-credentials');};IO.isURLRemote=function(url){var matches;matches=url.match(this.domainRegex);if(matches){return matches[1]!==document.domain;}else{return false;}};IO.remoteCheck=function(src){if(this.isURLRemote(src)){if(!Caman.remoteProxy.length){Log.info("Attempting to load a remote image without a configured proxy. URL: "+src);}else{if(Caman.isURLRemote(Caman.remoteProxy)){Log.info("Cannot use a remote proxy for loading images.");return;} 107 | return""+Caman.remoteProxy+"?camanProxyUrl="+(encodeURIComponent(src));}}};IO.proxyUrl=function(src){return""+Caman.remoteProxy+"?"+Caman.proxyParam+"="+(encodeURIComponent(src));};IO.useProxy=function(lang){var langToExt;langToExt={ruby:'rb',python:'py',perl:'pl',javascript:'js'};lang=lang.toLowerCase();if(langToExt[lang]!=null){lang=langToExt[lang];} 108 | return"proxies/caman_proxy."+lang;};return IO;})();Caman.prototype.save=function(){if(typeof exports!=="undefined"&&exports!==null){return this.nodeSave.apply(this,arguments);}else{return this.browserSave.apply(this,arguments);}};Caman.prototype.browserSave=function(type){var image;if(type==null){type="png";} 109 | type=type.toLowerCase();image=this.toBase64(type).replace("image/"+type,"image/octet-stream");return document.location.href=image;};Caman.prototype.nodeSave=function(file,overwrite){var stats;if(overwrite==null){overwrite=true;} 110 | try{stats=fs.statSync(file);if(stats.isFile()&&!overwrite){return false;}}catch(e){Log.debug("Creating output file "+file);} 111 | return fs.writeFile(file,this.canvas.toBuffer(),function(){return Log.debug("Finished writing to "+file);});};Caman.prototype.toImage=function(type){var img;img=document.createElement('img');img.src=this.toBase64(type);img.width=this.dimensions.width;img.height=this.dimensions.height;if(window.devicePixelRatio){img.width/=window.devicePixelRatio;img.height/=window.devicePixelRatio;} 112 | return img;};Caman.prototype.toBase64=function(type){if(type==null){type="png";} 113 | type=type.toLowerCase();return this.canvas.toDataURL("image/"+type);};Layer=(function(){function Layer(c){this.c=c;this.filter=this.c;this.options={blendingMode:'normal',opacity:1.0};this.layerID=Util.uniqid.get();this.canvas=typeof exports!=="undefined"&&exports!==null?new Canvas():document.createElement('canvas');this.canvas.width=this.c.dimensions.width;this.canvas.height=this.c.dimensions.height;this.context=this.canvas.getContext('2d');this.context.createImageData(this.canvas.width,this.canvas.height);this.imageData=this.context.getImageData(0,0,this.canvas.width,this.canvas.height);this.pixelData=this.imageData.data;} 114 | Layer.prototype.newLayer=function(cb){return this.c.newLayer.call(this.c,cb);};Layer.prototype.setBlendingMode=function(mode){this.options.blendingMode=mode;return this;};Layer.prototype.opacity=function(opacity){this.options.opacity=opacity/100;return this;};Layer.prototype.copyParent=function(){var i,parentData,_i,_ref;parentData=this.c.pixelData;for(i=_i=0,_ref=this.c.pixelData.length;_i<_ref;i=_i+=4){this.pixelData[i]=parentData[i];this.pixelData[i+1]=parentData[i+1];this.pixelData[i+2]=parentData[i+2];this.pixelData[i+3]=parentData[i+3];} 115 | return this;};Layer.prototype.fillColor=function(){return this.c.fillColor.apply(this.c,arguments);};Layer.prototype.overlayImage=function(image){if(typeof image==="object"){image=image.src;}else if(typeof image==="string"&&image[0]==="#"){image=$(image).src;} 116 | if(!image){return this;} 117 | this.c.renderer.renderQueue.push({type:Filter.Type.LoadOverlay,src:image,layer:this});return this;};Layer.prototype.applyToParent=function(){var i,layerData,parentData,result,rgbaLayer,rgbaParent,_i,_ref,_results;parentData=this.c.pixelStack[this.c.pixelStack.length-1];layerData=this.c.pixelData;_results=[];for(i=_i=0,_ref=layerData.length;_i<_ref;i=_i+=4){rgbaParent={r:parentData[i],g:parentData[i+1],b:parentData[i+2],a:parentData[i+3]};rgbaLayer={r:layerData[i],g:layerData[i+1],b:layerData[i+2],a:layerData[i+3]};result=Blender.execute(this.options.blendingMode,rgbaLayer,rgbaParent);result.r=Util.clampRGB(result.r);result.g=Util.clampRGB(result.g);result.b=Util.clampRGB(result.b);if(result.a==null){result.a=rgbaLayer.a;} 118 | parentData[i]=rgbaParent.r-((rgbaParent.r-result.r)*(this.options.opacity*(result.a/255)));parentData[i+1]=rgbaParent.g-((rgbaParent.g-result.g)*(this.options.opacity*(result.a/255)));_results.push(parentData[i+2]=rgbaParent.b-((rgbaParent.b-result.b)*(this.options.opacity*(result.a/255))));} 119 | return _results;};return Layer;})();Logger=(function(){function Logger(){var name,_i,_len,_ref;_ref=['log','info','warn','error'];for(_i=0,_len=_ref.length;_i<_len;_i++){name=_ref[_i];this[name]=(function(name){return function(){var args;args=1<=arguments.length?__slice.call(arguments,0):[];if(!Caman.DEBUG){return;} 120 | try{return console[name].apply(console,args);}catch(e){return console[name](args);}};})(name);} 121 | this.debug=this.log;} 122 | return Logger;})();Log=new Logger();PixelInfo=(function(){PixelInfo.coordinatesToLocation=function(x,y,width){return(y*width+x)*4;};PixelInfo.locationToCoordinates=function(loc,width){var x,y;y=Math.floor(loc/(width*4));x=(loc%(width*4))/4;return{x:x,y:y};};function PixelInfo(c){this.c=c;this.loc=0;} 123 | PixelInfo.prototype.locationXY=function(){var x,y;y=this.c.dimensions.height-Math.floor(this.loc/(this.c.dimensions.width*4));x=(this.loc%(this.c.dimensions.width*4))/4;return{x:x,y:y};};PixelInfo.prototype.getPixelRelative=function(horiz,vert){var newLoc;newLoc=this.loc+(this.c.dimensions.width*4*(vert*-1))+(4*horiz);if(newLoc>this.c.pixelData.length||newLoc<0){return{r:0,g:0,b:0,a:0};} 124 | return{r:this.c.pixelData[newLoc],g:this.c.pixelData[newLoc+1],b:this.c.pixelData[newLoc+2],a:this.c.pixelData[newLoc+3]};};PixelInfo.prototype.putPixelRelative=function(horiz,vert,rgba){var nowLoc;nowLoc=this.loc+(this.c.dimensions.width*4*(vert*-1))+(4*horiz);if(newLoc>this.c.pixelData.length||newLoc<0){return;} 125 | this.c.pixelData[newLoc]=rgba.r;this.c.pixelData[newLoc+1]=rgba.g;this.c.pixelData[newLoc+2]=rgba.b;this.c.pixelData[newLoc+3]=rgba.a;return true;};PixelInfo.prototype.getPixel=function(x,y){var loc;loc=this.coordinatesToLocation(x,y,this.width);return{r:this.c.pixelData[loc],g:this.c.pixelData[loc+1],b:this.c.pixelData[loc+2],a:this.c.pixelData[loc+3]};};PixelInfo.prototype.putPixel=function(x,y,rgba){var loc;loc=this.coordinatesToLocation(x,y,this.width);this.c.pixelData[loc]=rgba.r;this.c.pixelData[loc+1]=rgba.g;this.c.pixelData[loc+2]=rgba.b;return this.c.pixelData[loc+3]=rgba.a;};return PixelInfo;})();Plugin=(function(){function Plugin(){} 126 | Plugin.plugins={};Plugin.register=function(name,plugin){return this.plugins[name]=plugin;};Plugin.execute=function(context,name,args){return this.plugins[name].apply(context,args);};return Plugin;})();Caman.Plugin=Plugin;Caman.Renderer=Renderer=(function(){Renderer.Blocks=Caman.NodeJS?require('os').cpus().length:4;function Renderer(c){var _this=this;this.c=c;this.processNext=function(){return Renderer.prototype.processNext.apply(_this,arguments);};this.renderQueue=[];this.modPixelData=null;} 127 | Renderer.prototype.add=function(job){if(job==null){return;} 128 | return this.renderQueue.push(job);};Renderer.prototype.processNext=function(){var layer;if(this.renderQueue.length===0){Event.trigger(this,"renderFinished");if(this.finishedFn!=null){this.finishedFn.call(this.c);} 129 | return this;} 130 | this.currentJob=this.renderQueue.shift();switch(this.currentJob.type){case Filter.Type.LayerDequeue:layer=this.c.canvasQueue.shift();this.c.executeLayer(layer);return this.processNext();case Filter.Type.LayerFinished:this.c.applyCurrentLayer();this.c.popContext();return this.processNext();case Filter.Type.LoadOverlay:return this.loadOverlay(this.currentJob.layer,this.currentJob.src);case Filter.Type.Plugin:return this.executePlugin();default:return this.executeFilter();}};Renderer.prototype.execute=function(callback){this.finishedFn=callback;this.modPixelData=Util.dataArray(this.c.pixelData.length);return this.processNext();};Renderer.prototype.eachBlock=function(fn){var blockN,blockPixelLength,bnum,end,f,i,lastBlockN,n,start,_i,_ref,_results,_this=this;this.blocksDone=0;n=this.c.pixelData.length;blockPixelLength=Math.floor((n/4)/Renderer.Blocks);blockN=blockPixelLength*4;lastBlockN=blockN+((n/4)%Renderer.Blocks)*4;_results=[];for(i=_i=0,_ref=Renderer.Blocks;0<=_ref?_i<_ref:_i>_ref;i=0<=_ref?++_i:--_i){start=i*blockN;end=start+(i===Renderer.Blocks-1?lastBlockN:blockN);if(Caman.NodeJS){f=Fiber(function(){return fn.call(_this,i,start,end);});bnum=f.run();_results.push(this.blockFinished(bnum));}else{_results.push(setTimeout((function(i,start,end){return function(){return fn.call(_this,i,start,end);};})(i,start,end),0));}} 131 | return _results;};Renderer.prototype.executeFilter=function(){Event.trigger(this.c,"processStart",this.currentJob);if(this.currentJob.type===Filter.Type.Single){return this.eachBlock(this.renderBlock);}else{return this.eachBlock(this.renderKernel);}};Renderer.prototype.executePlugin=function(){Log.debug("Executing plugin "+this.currentJob.plugin);Plugin.execute(this.c,this.currentJob.plugin,this.currentJob.args);Log.debug("Plugin "+this.currentJob.plugin+" finished!");return this.processNext();};Renderer.prototype.renderBlock=function(bnum,start,end){var data,i,pixelInfo,res,_i;Log.debug("Block #"+bnum+" - Filter: "+this.currentJob.name+", Start: "+start+", End: "+end);Event.trigger(this.c,"blockStarted",{blockNum:bnum,totalBlocks:Renderer.Blocks,startPixel:start,endPixel:end});data={r:0,g:0,b:0,a:0};pixelInfo=new PixelInfo(this.c);for(i=_i=start;_i=builder;j=-builder<=builder?++_j:--_j){for(k=_k=builder;builder<=-builder?_k<=-builder:_k>=-builder;k=builder<=-builder?++_k:--_k){pixel=pixelInfo.getPixelRelative(j,k);kernel[builderIndex*3]=pixel.r;kernel[builderIndex*3+1]=pixel.g;kernel[builderIndex*3+2]=pixel.b;builderIndex++;}} 134 | res=this.processKernel(adjust,kernel,divisor,bias);this.modPixelData[i]=Util.clampRGB(res.r);this.modPixelData[i+1]=Util.clampRGB(res.g);this.modPixelData[i+2]=Util.clampRGB(res.b);this.modPixelData[i+3]=this.c.pixelData[i+3];} 135 | if(Caman.NodeJS){return Fiber["yield"](bnum);}else{return this.blockFinished(bnum);}};Renderer.prototype.blockFinished=function(bnum){var i,_i,_ref;if(bnum>=0){Log.debug("Block #"+bnum+" finished! Filter: "+this.currentJob.name);} 136 | this.blocksDone++;Event.trigger(this.c,"blockFinished",{blockNum:bnum,blocksFinished:this.blocksDone,totalBlocks:Renderer.Blocks});if(this.blocksDone===Renderer.Blocks){if(this.currentJob.type===Filter.Type.Kernel){for(i=_i=0,_ref=this.c.pixelData.length;0<=_ref?_i<_ref:_i>_ref;i=0<=_ref?++_i:--_i){this.c.pixelData[i]=this.modPixelData[i];}} 137 | if(bnum>=0){Log.debug("Filter "+this.currentJob.name+" finished!");} 138 | Event.trigger(this.c,"processComplete",this.currentJob);return this.processNext();}};Renderer.prototype.processKernel=function(adjust,kernel,divisor,bias){var i,val,_i,_ref;val={r:0,g:0,b:0};for(i=_i=0,_ref=adjust.length;0<=_ref?_i<_ref:_i>_ref;i=0<=_ref?++_i:--_i){val.r+=adjust[i]*kernel[i*3];val.g+=adjust[i]*kernel[i*3+1];val.b+=adjust[i]*kernel[i*3+2];} 139 | val.r=(val.r/divisor)+bias;val.g=(val.g/divisor)+bias;val.b=(val.b/divisor)+bias;return val;};Renderer.prototype.loadOverlay=function(layer,src){var img,proxyUrl,_this=this;img=document.createElement('img');img.onload=function(){layer.context.drawImage(img,0,0,_this.c.dimensions.width,_this.c.dimensions.height);layer.imageData=layer.context.getImageData(0,0,_this.c.dimensions.width,_this.c.dimensions.height);layer.pixelData=layer.imageData.data;_this.c.pixelData=layer.pixelData;return _this.processNext();};proxyUrl=IO.remoteCheck(src);return img.src=proxyUrl!=null?proxyUrl:src;};return Renderer;})();Caman.Store=Store=(function(){function Store(){} 140 | Store.items={};Store.has=function(search){return this.items[search]!=null;};Store.get=function(search){return this.items[search];};Store.put=function(name,obj){return this.items[name]=obj;};Store.execute=function(search,callback){var _this=this;setTimeout(function(){return callback.call(_this.get(search),_this.get(search));},0);return this.get(search);};Store.flush=function(name){if(name==null){name=false;} 141 | if(name){return delete this.items[name];}else{return this.items={};}};return Store;})();Blender.register("normal",function(rgbaLayer,rgbaParent){return{r:rgbaLayer.r,g:rgbaLayer.g,b:rgbaLayer.b};});Blender.register("multiply",function(rgbaLayer,rgbaParent){return{r:(rgbaLayer.r*rgbaParent.r)/255,g:(rgbaLayer.g*rgbaParent.g)/255,b:(rgbaLayer.b*rgbaParent.b)/255};});Blender.register("screen",function(rgbaLayer,rgbaParent){return{r:255-(((255-rgbaLayer.r)*(255-rgbaParent.r))/255),g:255-(((255-rgbaLayer.g)*(255-rgbaParent.g))/255),b:255-(((255-rgbaLayer.b)*(255-rgbaParent.b))/255)};});Blender.register("overlay",function(rgbaLayer,rgbaParent){var result;result={};result.r=rgbaParent.r>128?255-2*(255-rgbaLayer.r)*(255-rgbaParent.r)/255:(rgbaParent.r*rgbaLayer.r*2)/255;result.g=rgbaParent.g>128?255-2*(255-rgbaLayer.g)*(255-rgbaParent.g)/255:(rgbaParent.g*rgbaLayer.g*2)/255;result.b=rgbaParent.b>128?255-2*(255-rgbaLayer.b)*(255-rgbaParent.b)/255:(rgbaParent.b*rgbaLayer.b*2)/255;return result;});Blender.register("difference",function(rgbaLayer,rgbaParent){return{r:rgbaLayer.r-rgbaParent.r,g:rgbaLayer.g-rgbaParent.g,b:rgbaLayer.b-rgbaParent.b};});Blender.register("addition",function(rgbaLayer,rgbaParent){return{r:rgbaParent.r+rgbaLayer.r,g:rgbaParent.g+rgbaLayer.g,b:rgbaParent.b+rgbaLayer.b};});Blender.register("exclusion",function(rgbaLayer,rgbaParent){return{r:128-2*(rgbaParent.r-128)*(rgbaLayer.r-128)/255,g:128-2*(rgbaParent.g-128)*(rgbaLayer.g-128)/255,b:128-2*(rgbaParent.b-128)*(rgbaLayer.b-128)/255};});Blender.register("softLight",function(rgbaLayer,rgbaParent){var result;result={};result.r=rgbaParent.r>128?255-((255-rgbaParent.r)*(255-(rgbaLayer.r-128)))/255:(rgbaParent.r*(rgbaLayer.r+128))/255;result.g=rgbaParent.g>128?255-((255-rgbaParent.g)*(255-(rgbaLayer.g-128)))/255:(rgbaParent.g*(rgbaLayer.g+128))/255;result.b=rgbaParent.b>128?255-((255-rgbaParent.b)*(255-(rgbaLayer.b-128)))/255:(rgbaParent.b*(rgbaLayer.b+128))/255;return result;});Blender.register("lighten",function(rgbaLayer,rgbaParent){return{r:rgbaParent.r>rgbaLayer.r?rgbaParent.r:rgbaLayer.r,g:rgbaParent.g>rgbaLayer.g?rgbaParent.g:rgbaLayer.g,b:rgbaParent.b>rgbaLayer.b?rgbaParent.b:rgbaLayer.b};});Blender.register("darken",function(rgbaLayer,rgbaParent){return{r:rgbaParent.r>rgbaLayer.r?rgbaLayer.r:rgbaParent.r,g:rgbaParent.g>rgbaLayer.g?rgbaLayer.g:rgbaParent.g,b:rgbaParent.b>rgbaLayer.b?rgbaLayer.b:rgbaParent.b};});Filter.register("fillColor",function(){var color;if(arguments.length===1){color=Convert.hexToRGB(arguments[0]);}else{color={r:arguments[0],g:arguments[1],b:arguments[2]};} 142 | return this.process("fillColor",function(rgba){rgba.r=color.r;rgba.g=color.g;rgba.b=color.b;rgba.a=255;return rgba;});});Filter.register("brightness",function(adjust){adjust=Math.floor(255*(adjust/100));return this.process("brightness",function(rgba){rgba.r+=adjust;rgba.g+=adjust;rgba.b+=adjust;return rgba;});});Filter.register("saturation",function(adjust){adjust*=-0.01;return this.process("saturation",function(rgba){var max;max=Math.max(rgba.r,rgba.g,rgba.b);if(rgba.r!==max){rgba.r+=(max-rgba.r)*adjust;} 143 | if(rgba.g!==max){rgba.g+=(max-rgba.g)*adjust;} 144 | if(rgba.b!==max){rgba.b+=(max-rgba.b)*adjust;} 145 | return rgba;});});Filter.register("vibrance",function(adjust){adjust*=-1;return this.process("vibrance",function(rgba){var amt,avg,max;max=Math.max(rgba.r,rgba.g,rgba.b);avg=(rgba.r+rgba.g+rgba.b)/3;amt=((Math.abs(max-avg)*2/255)*adjust)/100;if(rgba.r!==max){rgba.r+=(max-rgba.r)*amt;} 146 | if(rgba.g!==max){rgba.g+=(max-rgba.g)*amt;} 147 | if(rgba.b!==max){rgba.b+=(max-rgba.b)*amt;} 148 | return rgba;});});Filter.register("greyscale",function(adjust){return this.process("greyscale",function(rgba){var avg;avg=Calculate.luminance(rgba);rgba.r=avg;rgba.g=avg;rgba.b=avg;return rgba;});});Filter.register("contrast",function(adjust){adjust=Math.pow((adjust+100)/100,2);return this.process("contrast",function(rgba){rgba.r/=255;rgba.r-=0.5;rgba.r*=adjust;rgba.r+=0.5;rgba.r*=255;rgba.g/=255;rgba.g-=0.5;rgba.g*=adjust;rgba.g+=0.5;rgba.g*=255;rgba.b/=255;rgba.b-=0.5;rgba.b*=adjust;rgba.b+=0.5;rgba.b*=255;return rgba;});});Filter.register("hue",function(adjust){return this.process("hue",function(rgba){var h,hsv,rgb;hsv=Convert.rgbToHSV(rgba.r,rgba.g,rgba.b);h=hsv.h*100;h+=Math.abs(adjust);h=h%100;h/=100;hsv.h=h;rgb=Convert.hsvToRGB(hsv.h,hsv.s,hsv.v);rgb.a=rgba.a;return rgb;});});Filter.register("colorize",function(){var level,rgb;if(arguments.length===2){rgb=Convert.hexToRGB(arguments[0]);level=arguments[1];}else if(arguments.length===4){rgb={r:arguments[0],g:arguments[1],b:arguments[2]};level=arguments[3];} 149 | return this.process("colorize",function(rgba){rgba.r-=(rgba.r-rgb.r)*(level/100);rgba.g-=(rgba.g-rgb.g)*(level/100);rgba.b-=(rgba.b-rgb.b)*(level/100);return rgba;});});Filter.register("invert",function(){return this.process("invert",function(rgba){rgba.r=255-rgba.r;rgba.g=255-rgba.g;rgba.b=255-rgba.b;return rgba;});});Filter.register("sepia",function(adjust){if(adjust==null){adjust=100;} 150 | adjust/=100;return this.process("sepia",function(rgba){rgba.r=Math.min(255,(rgba.r*(1-(0.607*adjust)))+(rgba.g*(0.769*adjust))+(rgba.b*(0.189*adjust)));rgba.g=Math.min(255,(rgba.r*(0.349*adjust))+(rgba.g*(1-(0.314*adjust)))+(rgba.b*(0.168*adjust)));rgba.b=Math.min(255,(rgba.r*(0.272*adjust))+(rgba.g*(0.534*adjust))+(rgba.b*(1-(0.869*adjust))));return rgba;});});Filter.register("gamma",function(adjust){return this.process("gamma",function(rgba){rgba.r=Math.pow(rgba.r/255,adjust)*255;rgba.g=Math.pow(rgba.g/255,adjust)*255;rgba.b=Math.pow(rgba.b/255,adjust)*255;return rgba;});});Filter.register("noise",function(adjust){adjust=Math.abs(adjust)*2.55;return this.process("noise",function(rgba){var rand;rand=Calculate.randomRange(adjust*-1,adjust);rgba.r+=rand;rgba.g+=rand;rgba.b+=rand;return rgba;});});Filter.register("clip",function(adjust){adjust=Math.abs(adjust)*2.55;return this.process("clip",function(rgba){if(rgba.r>255-adjust){rgba.r=255;}else if(rgba.r255-adjust){rgba.g=255;}else if(rgba.g255-adjust){rgba.b=255;}else if(rgba.b0){rgba.r+=(255-rgba.r)*options.red;}else{rgba.r-=rgba.r*Math.abs(options.red);}} 158 | if(options.green!=null){if(options.green>0){rgba.g+=(255-rgba.g)*options.green;}else{rgba.g-=rgba.g*Math.abs(options.green);}} 159 | if(options.blue!=null){if(options.blue>0){rgba.b+=(255-rgba.b)*options.blue;}else{rgba.b-=rgba.b*Math.abs(options.blue);}} 160 | return rgba;});});Filter.register("curves",function(){var bezier,chans,cps,ctrl1,ctrl2,end,i,start,_i,_j,_ref,_ref1;chans=arguments[0],cps=2<=arguments.length?__slice.call(arguments,1):[];if(typeof chans==="string"){chans=chans.split("");} 161 | if(chans[0]==="v"){chans=['r','g','b'];} 162 | if(cps.length<3||cps.length>4){throw"Invalid number of arguments to curves filter";} 163 | start=cps[0];ctrl1=cps[1];ctrl2=cps.length===4?cps[2]:cps[1];end=cps[cps.length-1];bezier=Calculate.bezier(start,ctrl1,ctrl2,end,0,255);if(start[0]>0){for(i=_i=0,_ref=start[0];0<=_ref?_i<_ref:_i>_ref;i=0<=_ref?++_i:--_i){bezier[i]=start[1];}} 164 | if(end[0]<255){for(i=_j=_ref1=end[0];_ref1<=255?_j<=255:_j>=255;i=_ref1<=255?++_j:--_j){bezier[i]=end[1];}} 165 | return this.process("curves",function(rgba){var _k,_ref2;for(i=_k=0,_ref2=chans.length;0<=_ref2?_k<_ref2:_k>_ref2;i=0<=_ref2?++_k:--_k){rgba[chans[i]]=bezier[rgba[chans[i]]];} 166 | return rgba;});});Filter.register("exposure",function(adjust){var ctrl1,ctrl2,p;p=Math.abs(adjust)/100;ctrl1=[0,255*p];ctrl2=[255-(255*p),255];if(adjust<0){ctrl1=ctrl1.reverse();ctrl2=ctrl2.reverse();} 167 | return this.curves('rgb',[0,0],ctrl1,ctrl2,[255,255]);});Caman.Plugin.register("crop",function(width,height,x,y){var canvas,ctx;if(x==null){x=0;} 168 | if(y==null){y=0;} 169 | if(typeof exports!=="undefined"&&exports!==null){canvas=new Canvas(width,height);}else{canvas=document.createElement('canvas');Util.copyAttributes(this.canvas,canvas);canvas.width=width;canvas.height=height;} 170 | ctx=canvas.getContext('2d');ctx.drawImage(this.canvas,x,y,width,height,0,0,width,height);this.cropCoordinates={x:x,y:y};this.cropped=true;return this.replaceCanvas(canvas);});Caman.Plugin.register("resize",function(newDims){var canvas,ctx;if(newDims==null){newDims=null;} 171 | if(newDims===null||((newDims.width==null)&&(newDims.height==null))){Log.error("Invalid or missing dimensions given for resize");return;} 172 | if(newDims.width==null){newDims.width=this.canvas.width*newDims.height/this.canvas.height;}else if(newDims.height==null){newDims.height=this.canvas.height*newDims.width/this.canvas.width;} 173 | if(typeof exports!=="undefined"&&exports!==null){canvas=new Canvas(newDims.width,newDims.height);}else{canvas=document.createElement('canvas');Util.copyAttributes(this.canvas,canvas);canvas.width=newDims.width;canvas.height=newDims.height;} 174 | ctx=canvas.getContext('2d');ctx.drawImage(this.canvas,0,0,this.canvas.width,this.canvas.height,0,0,newDims.width,newDims.height);this.resized=true;return this.replaceCanvas(canvas);});Caman.Filter.register("crop",function(){return this.processPlugin("crop",Array.prototype.slice.call(arguments,0));});Caman.Filter.register("resize",function(){return this.processPlugin("resize",Array.prototype.slice.call(arguments,0));});}).call(this); -------------------------------------------------------------------------------- /js/vendor/dat.gui.min.js: -------------------------------------------------------------------------------- 1 | /** 2 | * dat-gui JavaScript Controller Library 3 | * http://code.google.com/p/dat-gui 4 | * 5 | * Copyright 2011 Data Arts Team, Google Creative Lab 6 | * 7 | * Licensed under the Apache License, Version 2.0 (the "License"); 8 | * you may not use this file except in compliance with the License. 9 | * You may obtain a copy of the License at 10 | * 11 | * http://www.apache.org/licenses/LICENSE-2.0 12 | */ 13 | var dat=dat||{};dat.gui=dat.gui||{};dat.utils=dat.utils||{};dat.controllers=dat.controllers||{};dat.dom=dat.dom||{};dat.color=dat.color||{};dat.utils.css=function(){return{load:function(f,a){a=a||document;var d=a.createElement("link");d.type="text/css";d.rel="stylesheet";d.href=f;a.getElementsByTagName("head")[0].appendChild(d)},inject:function(f,a){a=a||document;var d=document.createElement("style");d.type="text/css";d.innerHTML=f;a.getElementsByTagName("head")[0].appendChild(d)}}}(); 14 | dat.utils.common=function(){var f=Array.prototype.forEach,a=Array.prototype.slice;return{BREAK:{},extend:function(d){this.each(a.call(arguments,1),function(a){for(var c in a)this.isUndefined(a[c])||(d[c]=a[c])},this);return d},defaults:function(d){this.each(a.call(arguments,1),function(a){for(var c in a)this.isUndefined(d[c])&&(d[c]=a[c])},this);return d},compose:function(){var d=a.call(arguments);return function(){for(var e=a.call(arguments),c=d.length-1;0<=c;c--)e=[d[c].apply(this,e)];return e[0]}}, 15 | each:function(a,e,c){if(a)if(f&&a.forEach&&a.forEach===f)a.forEach(e,c);else if(a.length===a.length+0)for(var b=0,p=a.length;bthis.__max&&(a=this.__max);void 0!==this.__step&&0!=a%this.__step&&(a=Math.round(a/this.__step)*this.__step);return e.superclass.prototype.setValue.call(this,a)},min:function(a){this.__min=a;return this},max:function(a){this.__max=a;return this},step:function(a){this.__impliedStep=this.__step=a;this.__precision=d(a);return this}});return e}(dat.controllers.Controller,dat.utils.common); 29 | dat.controllers.NumberControllerBox=function(f,a,d){var e=function(c,b,f){function q(){var a=parseFloat(n.__input.value);d.isNaN(a)||n.setValue(a)}function l(a){var b=u-a.clientY;n.setValue(n.getValue()+b*n.__impliedStep);u=a.clientY}function r(){a.unbind(window,"mousemove",l);a.unbind(window,"mouseup",r)}this.__truncationSuspended=!1;e.superclass.call(this,c,b,f);var n=this,u;this.__input=document.createElement("input");this.__input.setAttribute("type","text");a.bind(this.__input,"change",q);a.bind(this.__input, 30 | "blur",function(){q();n.__onFinishChange&&n.__onFinishChange.call(n,n.getValue())});a.bind(this.__input,"mousedown",function(b){a.bind(window,"mousemove",l);a.bind(window,"mouseup",r);u=b.clientY});a.bind(this.__input,"keydown",function(a){13===a.keyCode&&(n.__truncationSuspended=!0,this.blur(),n.__truncationSuspended=!1)});this.updateDisplay();this.domElement.appendChild(this.__input)};e.superclass=f;d.extend(e.prototype,f.prototype,{updateDisplay:function(){var a=this.__input,b;if(this.__truncationSuspended)b= 31 | this.getValue();else{b=this.getValue();var d=Math.pow(10,this.__precision);b=Math.round(b*d)/d}a.value=b;return e.superclass.prototype.updateDisplay.call(this)}});return e}(dat.controllers.NumberController,dat.dom.dom,dat.utils.common); 32 | dat.controllers.NumberControllerSlider=function(f,a,d,e,c){function b(a,b,c,e,d){return e+(a-b)/(c-b)*(d-e)}var p=function(c,e,d,f,u){function A(c){c.preventDefault();var e=a.getOffset(k.__background),d=a.getWidth(k.__background);k.setValue(b(c.clientX,e.left,e.left+d,k.__min,k.__max));return!1}function g(){a.unbind(window,"mousemove",A);a.unbind(window,"mouseup",g);k.__onFinishChange&&k.__onFinishChange.call(k,k.getValue())}p.superclass.call(this,c,e,{min:d,max:f,step:u});var k=this;this.__background= 33 | document.createElement("div");this.__foreground=document.createElement("div");a.bind(this.__background,"mousedown",function(b){a.bind(window,"mousemove",A);a.bind(window,"mouseup",g);A(b)});a.addClass(this.__background,"slider");a.addClass(this.__foreground,"slider-fg");this.updateDisplay();this.__background.appendChild(this.__foreground);this.domElement.appendChild(this.__background)};p.superclass=f;p.useDefaultStyles=function(){d.inject(c)};e.extend(p.prototype,f.prototype,{updateDisplay:function(){var a= 34 | (this.getValue()-this.__min)/(this.__max-this.__min);this.__foreground.style.width=100*a+"%";return p.superclass.prototype.updateDisplay.call(this)}});return p}(dat.controllers.NumberController,dat.dom.dom,dat.utils.css,dat.utils.common,"/**\n * dat-gui JavaScript Controller Library\n * http://code.google.com/p/dat-gui\n *\n * Copyright 2011 Data Arts Team, Google Creative Lab\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n */\n\n.slider {\n box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);\n height: 1em;\n border-radius: 1em;\n background-color: #eee;\n padding: 0 0.5em;\n overflow: hidden;\n}\n\n.slider-fg {\n padding: 1px 0 2px 0;\n background-color: #aaa;\n height: 1em;\n margin-left: -0.5em;\n padding-right: 0.5em;\n border-radius: 1em 0 0 1em;\n}\n\n.slider-fg:after {\n display: inline-block;\n border-radius: 1em;\n background-color: #fff;\n border: 1px solid #aaa;\n content: '';\n float: right;\n margin-right: -1em;\n margin-top: -1px;\n height: 0.9em;\n width: 0.9em;\n}"); 35 | dat.controllers.FunctionController=function(f,a,d){var e=function(c,b,d){e.superclass.call(this,c,b);var f=this;this.__button=document.createElement("div");this.__button.innerHTML=void 0===d?"Fire":d;a.bind(this.__button,"click",function(a){a.preventDefault();f.fire();return!1});a.addClass(this.__button,"button");this.domElement.appendChild(this.__button)};e.superclass=f;d.extend(e.prototype,f.prototype,{fire:function(){this.__onChange&&this.__onChange.call(this);this.getValue().call(this.object); 36 | this.__onFinishChange&&this.__onFinishChange.call(this,this.getValue())}});return e}(dat.controllers.Controller,dat.dom.dom,dat.utils.common); 37 | dat.controllers.BooleanController=function(f,a,d){var e=function(c,b){e.superclass.call(this,c,b);var d=this;this.__prev=this.getValue();this.__checkbox=document.createElement("input");this.__checkbox.setAttribute("type","checkbox");a.bind(this.__checkbox,"change",function(){d.setValue(!d.__prev)},!1);this.domElement.appendChild(this.__checkbox);this.updateDisplay()};e.superclass=f;d.extend(e.prototype,f.prototype,{setValue:function(a){a=e.superclass.prototype.setValue.call(this,a);this.__onFinishChange&& 38 | this.__onFinishChange.call(this,this.getValue());this.__prev=this.getValue();return a},updateDisplay:function(){!0===this.getValue()?(this.__checkbox.setAttribute("checked","checked"),this.__checkbox.checked=!0):this.__checkbox.checked=!1;return e.superclass.prototype.updateDisplay.call(this)}});return e}(dat.controllers.Controller,dat.dom.dom,dat.utils.common); 39 | dat.color.toString=function(f){return function(a){if(1==a.a||f.isUndefined(a.a)){for(a=a.hex.toString(16);6>a.length;)a="0"+a;return"#"+a}return"rgba("+Math.round(a.r)+","+Math.round(a.g)+","+Math.round(a.b)+","+a.a+")"}}(dat.utils.common); 40 | dat.color.interpret=function(f,a){var d,e,c=[{litmus:a.isString,conversions:{THREE_CHAR_HEX:{read:function(a){a=a.match(/^#([A-F0-9])([A-F0-9])([A-F0-9])$/i);return null===a?!1:{space:"HEX",hex:parseInt("0x"+a[1].toString()+a[1].toString()+a[2].toString()+a[2].toString()+a[3].toString()+a[3].toString())}},write:f},SIX_CHAR_HEX:{read:function(a){a=a.match(/^#([A-F0-9]{6})$/i);return null===a?!1:{space:"HEX",hex:parseInt("0x"+a[1].toString())}},write:f},CSS_RGB:{read:function(a){a=a.match(/^rgb\(\s*(.+)\s*,\s*(.+)\s*,\s*(.+)\s*\)/); 41 | return null===a?!1:{space:"RGB",r:parseFloat(a[1]),g:parseFloat(a[2]),b:parseFloat(a[3])}},write:f},CSS_RGBA:{read:function(a){a=a.match(/^rgba\(\s*(.+)\s*,\s*(.+)\s*,\s*(.+)\s*\,\s*(.+)\s*\)/);return null===a?!1:{space:"RGB",r:parseFloat(a[1]),g:parseFloat(a[2]),b:parseFloat(a[3]),a:parseFloat(a[4])}},write:f}}},{litmus:a.isNumber,conversions:{HEX:{read:function(a){return{space:"HEX",hex:a,conversionName:"HEX"}},write:function(a){return a.hex}}}},{litmus:a.isArray,conversions:{RGB_ARRAY:{read:function(a){return 3!= 42 | a.length?!1:{space:"RGB",r:a[0],g:a[1],b:a[2]}},write:function(a){return[a.r,a.g,a.b]}},RGBA_ARRAY:{read:function(a){return 4!=a.length?!1:{space:"RGB",r:a[0],g:a[1],b:a[2],a:a[3]}},write:function(a){return[a.r,a.g,a.b,a.a]}}}},{litmus:a.isObject,conversions:{RGBA_OBJ:{read:function(b){return a.isNumber(b.r)&&a.isNumber(b.g)&&a.isNumber(b.b)&&a.isNumber(b.a)?{space:"RGB",r:b.r,g:b.g,b:b.b,a:b.a}:!1},write:function(a){return{r:a.r,g:a.g,b:a.b,a:a.a}}},RGB_OBJ:{read:function(b){return a.isNumber(b.r)&& 43 | a.isNumber(b.g)&&a.isNumber(b.b)?{space:"RGB",r:b.r,g:b.g,b:b.b}:!1},write:function(a){return{r:a.r,g:a.g,b:a.b}}},HSVA_OBJ:{read:function(b){return a.isNumber(b.h)&&a.isNumber(b.s)&&a.isNumber(b.v)&&a.isNumber(b.a)?{space:"HSV",h:b.h,s:b.s,v:b.v,a:b.a}:!1},write:function(a){return{h:a.h,s:a.s,v:a.v,a:a.a}}},HSV_OBJ:{read:function(b){return a.isNumber(b.h)&&a.isNumber(b.s)&&a.isNumber(b.v)?{space:"HSV",h:b.h,s:b.s,v:b.v}:!1},write:function(a){return{h:a.h,s:a.s,v:a.v}}}}}];return function(){e=!1; 44 | var b=1\n\n Here\'s the new load parameter for your GUI\'s constructor:\n\n \n\n
\n\n Automatically save\n values to localStorage on exit.\n\n
The values saved to localStorage will\n override those passed to dat.GUI\'s constructor. This makes it\n easier to work incrementally, but localStorage is fragile,\n and your friends may not see the same values you do.\n \n
\n \n
\n\n', 71 | ".dg {\n /** Clear list styles */\n /* Auto-place container */\n /* Auto-placed GUI's */\n /* Line items that don't contain folders. */\n /** Folder names */\n /** Hides closed items */\n /** Controller row */\n /** Name-half (left) */\n /** Controller-half (right) */\n /** Controller placement */\n /** Shorter number boxes when slider is present. */\n /** Ensure the entire boolean and function row shows a hand */ }\n .dg ul {\n list-style: none;\n margin: 0;\n padding: 0;\n width: 100%;\n clear: both; }\n .dg.ac {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 0;\n z-index: 0; }\n .dg:not(.ac) .main {\n /** Exclude mains in ac so that we don't hide close button */\n overflow: hidden; }\n .dg.main {\n -webkit-transition: opacity 0.1s linear;\n -o-transition: opacity 0.1s linear;\n -moz-transition: opacity 0.1s linear;\n transition: opacity 0.1s linear; }\n .dg.main.taller-than-window {\n overflow-y: auto; }\n .dg.main.taller-than-window .close-button {\n opacity: 1;\n /* TODO, these are style notes */\n margin-top: -1px;\n border-top: 1px solid #2c2c2c; }\n .dg.main ul.closed .close-button {\n opacity: 1 !important; }\n .dg.main:hover .close-button,\n .dg.main .close-button.drag {\n opacity: 1; }\n .dg.main .close-button {\n /*opacity: 0;*/\n -webkit-transition: opacity 0.1s linear;\n -o-transition: opacity 0.1s linear;\n -moz-transition: opacity 0.1s linear;\n transition: opacity 0.1s linear;\n border: 0;\n position: absolute;\n line-height: 19px;\n height: 20px;\n /* TODO, these are style notes */\n cursor: pointer;\n text-align: center;\n background-color: #000; }\n .dg.main .close-button:hover {\n background-color: #111; }\n .dg.a {\n float: right;\n margin-right: 15px;\n overflow-x: hidden; }\n .dg.a.has-save > ul {\n margin-top: 27px; }\n .dg.a.has-save > ul.closed {\n margin-top: 0; }\n .dg.a .save-row {\n position: fixed;\n top: 0;\n z-index: 1002; }\n .dg li {\n -webkit-transition: height 0.1s ease-out;\n -o-transition: height 0.1s ease-out;\n -moz-transition: height 0.1s ease-out;\n transition: height 0.1s ease-out; }\n .dg li:not(.folder) {\n cursor: auto;\n height: 27px;\n line-height: 27px;\n overflow: hidden;\n padding: 0 4px 0 5px; }\n .dg li.folder {\n padding: 0;\n border-left: 4px solid rgba(0, 0, 0, 0); }\n .dg li.title {\n cursor: pointer;\n margin-left: -4px; }\n .dg .closed li:not(.title),\n .dg .closed ul li,\n .dg .closed ul li > * {\n height: 0;\n overflow: hidden;\n border: 0; }\n .dg .cr {\n clear: both;\n padding-left: 3px;\n height: 27px; }\n .dg .property-name {\n cursor: default;\n float: left;\n clear: left;\n width: 40%;\n overflow: hidden;\n text-overflow: ellipsis; }\n .dg .c {\n float: left;\n width: 60%; }\n .dg .c input[type=text] {\n border: 0;\n margin-top: 4px;\n padding: 3px;\n width: 100%;\n float: right; }\n .dg .has-slider input[type=text] {\n width: 30%;\n /*display: none;*/\n margin-left: 0; }\n .dg .slider {\n float: left;\n width: 66%;\n margin-left: -5px;\n margin-right: 0;\n height: 19px;\n margin-top: 4px; }\n .dg .slider-fg {\n height: 100%; }\n .dg .c input[type=checkbox] {\n margin-top: 9px; }\n .dg .c select {\n margin-top: 5px; }\n .dg .cr.function,\n .dg .cr.function .property-name,\n .dg .cr.function *,\n .dg .cr.boolean,\n .dg .cr.boolean * {\n cursor: pointer; }\n .dg .selector {\n display: none;\n position: absolute;\n margin-left: -9px;\n margin-top: 23px;\n z-index: 10; }\n .dg .c:hover .selector,\n .dg .selector.drag {\n display: block; }\n .dg li.save-row {\n padding: 0; }\n .dg li.save-row .button {\n display: inline-block;\n padding: 0px 6px; }\n .dg.dialogue {\n background-color: #222;\n width: 460px;\n padding: 15px;\n font-size: 13px;\n line-height: 15px; }\n\n/* TODO Separate style and structure */\n#dg-new-constructor {\n padding: 10px;\n color: #222;\n font-family: Monaco, monospace;\n font-size: 10px;\n border: 0;\n resize: none;\n box-shadow: inset 1px 1px 1px #888;\n word-wrap: break-word;\n margin: 12px 0;\n display: block;\n width: 440px;\n overflow-y: scroll;\n height: 100px;\n position: relative; }\n\n#dg-local-explain {\n display: none;\n font-size: 11px;\n line-height: 17px;\n border-radius: 3px;\n background-color: #333;\n padding: 8px;\n margin-top: 10px; }\n #dg-local-explain code {\n font-size: 10px; }\n\n#dat-gui-save-locally {\n display: none; }\n\n/** Main type */\n.dg {\n color: #eee;\n font: 11px 'Lucida Grande', sans-serif;\n text-shadow: 0 -1px 0 #111;\n /** Auto place */\n /* Controller row,
  • */\n /** Controllers */ }\n .dg.main {\n /** Scrollbar */ }\n .dg.main::-webkit-scrollbar {\n width: 5px;\n background: #1a1a1a; }\n .dg.main::-webkit-scrollbar-corner {\n height: 0;\n display: none; }\n .dg.main::-webkit-scrollbar-thumb {\n border-radius: 5px;\n background: #676767; }\n .dg li:not(.folder) {\n background: #1a1a1a;\n border-bottom: 1px solid #2c2c2c; }\n .dg li.save-row {\n line-height: 25px;\n background: #dad5cb;\n border: 0; }\n .dg li.save-row select {\n margin-left: 5px;\n width: 108px; }\n .dg li.save-row .button {\n margin-left: 5px;\n margin-top: 1px;\n border-radius: 2px;\n font-size: 9px;\n line-height: 7px;\n padding: 4px 4px 5px 4px;\n background: #c5bdad;\n color: #fff;\n text-shadow: 0 1px 0 #b0a58f;\n box-shadow: 0 -1px 0 #b0a58f;\n cursor: pointer; }\n .dg li.save-row .button.gears {\n background: #c5bdad url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAANCAYAAAB/9ZQ7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAQJJREFUeNpiYKAU/P//PwGIC/ApCABiBSAW+I8AClAcgKxQ4T9hoMAEUrxx2QSGN6+egDX+/vWT4e7N82AMYoPAx/evwWoYoSYbACX2s7KxCxzcsezDh3evFoDEBYTEEqycggWAzA9AuUSQQgeYPa9fPv6/YWm/Acx5IPb7ty/fw+QZblw67vDs8R0YHyQhgObx+yAJkBqmG5dPPDh1aPOGR/eugW0G4vlIoTIfyFcA+QekhhHJhPdQxbiAIguMBTQZrPD7108M6roWYDFQiIAAv6Aow/1bFwXgis+f2LUAynwoIaNcz8XNx3Dl7MEJUDGQpx9gtQ8YCueB+D26OECAAQDadt7e46D42QAAAABJRU5ErkJggg==) 2px 1px no-repeat;\n height: 7px;\n width: 8px; }\n .dg li.save-row .button:hover {\n background-color: #bab19e;\n box-shadow: 0 -1px 0 #b0a58f; }\n .dg li.folder {\n border-bottom: 0; }\n .dg li.title {\n padding-left: 16px;\n background: black url(data:image/gif;base64,R0lGODlhBQAFAJEAAP////Pz8////////yH5BAEAAAIALAAAAAAFAAUAAAIIlI+hKgFxoCgAOw==) 6px 10px no-repeat;\n cursor: pointer;\n border-bottom: 1px solid rgba(255, 255, 255, 0.2); }\n .dg .closed li.title {\n background-image: url(data:image/gif;base64,R0lGODlhBQAFAJEAAP////Pz8////////yH5BAEAAAIALAAAAAAFAAUAAAIIlGIWqMCbWAEAOw==); }\n .dg .cr.boolean {\n border-left: 3px solid #806787; }\n .dg .cr.function {\n border-left: 3px solid #e61d5f; }\n .dg .cr.number {\n border-left: 3px solid #2fa1d6; }\n .dg .cr.number input[type=text] {\n color: #2fa1d6; }\n .dg .cr.string {\n border-left: 3px solid #1ed36f; }\n .dg .cr.string input[type=text] {\n color: #1ed36f; }\n .dg .cr.function:hover, .dg .cr.boolean:hover {\n background: #111; }\n .dg .c input[type=text] {\n background: #303030;\n outline: none; }\n .dg .c input[type=text]:hover {\n background: #3c3c3c; }\n .dg .c input[type=text]:focus {\n background: #494949;\n color: #fff; }\n .dg .c .slider {\n background: #303030;\n cursor: ew-resize; }\n .dg .c .slider-fg {\n background: #2fa1d6; }\n .dg .c .slider:hover {\n background: #3c3c3c; }\n .dg .c .slider:hover .slider-fg {\n background: #44abda; }\n", 72 | dat.controllers.factory=function(f,a,d,e,c,b,p){return function(q,l,r,n){var u=q[l];if(p.isArray(r)||p.isObject(r))return new f(q,l,r);if(p.isNumber(u))return p.isNumber(r)&&p.isNumber(n)?new d(q,l,r,n):new a(q,l,{min:r,max:n});if(p.isString(u))return new e(q,l);if(p.isFunction(u))return new c(q,l,"");if(p.isBoolean(u))return new b(q,l)}}(dat.controllers.OptionController,dat.controllers.NumberControllerBox,dat.controllers.NumberControllerSlider,dat.controllers.StringController=function(f,a,d){var e= 73 | function(c,b){function d(){f.setValue(f.__input.value)}e.superclass.call(this,c,b);var f=this;this.__input=document.createElement("input");this.__input.setAttribute("type","text");a.bind(this.__input,"keyup",d);a.bind(this.__input,"change",d);a.bind(this.__input,"blur",function(){f.__onFinishChange&&f.__onFinishChange.call(f,f.getValue())});a.bind(this.__input,"keydown",function(a){13===a.keyCode&&this.blur()});this.updateDisplay();this.domElement.appendChild(this.__input)};e.superclass=f;d.extend(e.prototype, 74 | f.prototype,{updateDisplay:function(){a.isActive(this.__input)||(this.__input.value=this.getValue());return e.superclass.prototype.updateDisplay.call(this)}});return e}(dat.controllers.Controller,dat.dom.dom,dat.utils.common),dat.controllers.FunctionController,dat.controllers.BooleanController,dat.utils.common),dat.controllers.Controller,dat.controllers.BooleanController,dat.controllers.FunctionController,dat.controllers.NumberControllerBox,dat.controllers.NumberControllerSlider,dat.controllers.OptionController, 75 | dat.controllers.ColorController=function(f,a,d,e,c){function b(a,b,d,e){a.style.background="";c.each(l,function(c){a.style.cssText+="background: "+c+"linear-gradient("+b+", "+d+" 0%, "+e+" 100%); "})}function p(a){a.style.background="";a.style.cssText+="background: -moz-linear-gradient(top, #ff0000 0%, #ff00ff 17%, #0000ff 34%, #00ffff 50%, #00ff00 67%, #ffff00 84%, #ff0000 100%);";a.style.cssText+="background: -webkit-linear-gradient(top, #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);"; 76 | a.style.cssText+="background: -o-linear-gradient(top, #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);";a.style.cssText+="background: -ms-linear-gradient(top, #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);";a.style.cssText+="background: linear-gradient(top, #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);"}var q=function(f,n){function u(b){v(b);a.bind(window,"mousemove",v);a.bind(window, 77 | "mouseup",l)}function l(){a.unbind(window,"mousemove",v);a.unbind(window,"mouseup",l)}function g(){var a=e(this.value);!1!==a?(t.__color.__state=a,t.setValue(t.__color.toOriginal())):this.value=t.__color.toString()}function k(){a.unbind(window,"mousemove",w);a.unbind(window,"mouseup",k)}function v(b){b.preventDefault();var c=a.getWidth(t.__saturation_field),d=a.getOffset(t.__saturation_field),e=(b.clientX-d.left+document.body.scrollLeft)/c;b=1-(b.clientY-d.top+document.body.scrollTop)/c;1 78 | b&&(b=0);1e&&(e=0);t.__color.v=b;t.__color.s=e;t.setValue(t.__color.toOriginal());return!1}function w(b){b.preventDefault();var c=a.getHeight(t.__hue_field),d=a.getOffset(t.__hue_field);b=1-(b.clientY-d.top+document.body.scrollTop)/c;1b&&(b=0);t.__color.h=360*b;t.setValue(t.__color.toOriginal());return!1}q.superclass.call(this,f,n);this.__color=new d(this.getValue());this.__temp=new d(0);var t=this;this.domElement=document.createElement("div");a.makeSelectable(this.domElement,!1); 79 | this.__selector=document.createElement("div");this.__selector.className="selector";this.__saturation_field=document.createElement("div");this.__saturation_field.className="saturation-field";this.__field_knob=document.createElement("div");this.__field_knob.className="field-knob";this.__field_knob_border="2px solid ";this.__hue_knob=document.createElement("div");this.__hue_knob.className="hue-knob";this.__hue_field=document.createElement("div");this.__hue_field.className="hue-field";this.__input=document.createElement("input"); 80 | this.__input.type="text";this.__input_textShadow="0 1px 1px ";a.bind(this.__input,"keydown",function(a){13===a.keyCode&&g.call(this)});a.bind(this.__input,"blur",g);a.bind(this.__selector,"mousedown",function(b){a.addClass(this,"drag").bind(window,"mouseup",function(b){a.removeClass(t.__selector,"drag")})});var y=document.createElement("div");c.extend(this.__selector.style,{width:"122px",height:"102px",padding:"3px",backgroundColor:"#222",boxShadow:"0px 1px 3px rgba(0,0,0,0.3)"});c.extend(this.__field_knob.style, 81 | {position:"absolute",width:"12px",height:"12px",border:this.__field_knob_border+(.5>this.__color.v?"#fff":"#000"),boxShadow:"0px 1px 3px rgba(0,0,0,0.5)",borderRadius:"12px",zIndex:1});c.extend(this.__hue_knob.style,{position:"absolute",width:"15px",height:"2px",borderRight:"4px solid #fff",zIndex:1});c.extend(this.__saturation_field.style,{width:"100px",height:"100px",border:"1px solid #555",marginRight:"3px",display:"inline-block",cursor:"pointer"});c.extend(y.style,{width:"100%",height:"100%", 82 | background:"none"});b(y,"top","rgba(0,0,0,0)","#000");c.extend(this.__hue_field.style,{width:"15px",height:"100px",display:"inline-block",border:"1px solid #555",cursor:"ns-resize"});p(this.__hue_field);c.extend(this.__input.style,{outline:"none",textAlign:"center",color:"#fff",border:0,fontWeight:"bold",textShadow:this.__input_textShadow+"rgba(0,0,0,0.7)"});a.bind(this.__saturation_field,"mousedown",u);a.bind(this.__field_knob,"mousedown",u);a.bind(this.__hue_field,"mousedown",function(b){w(b);a.bind(window, 83 | "mousemove",w);a.bind(window,"mouseup",k)});this.__saturation_field.appendChild(y);this.__selector.appendChild(this.__field_knob);this.__selector.appendChild(this.__saturation_field);this.__selector.appendChild(this.__hue_field);this.__hue_field.appendChild(this.__hue_knob);this.domElement.appendChild(this.__input);this.domElement.appendChild(this.__selector);this.updateDisplay()};q.superclass=f;c.extend(q.prototype,f.prototype,{updateDisplay:function(){var a=e(this.getValue());if(!1!==a){var f=!1; 84 | c.each(d.COMPONENTS,function(b){if(!c.isUndefined(a[b])&&!c.isUndefined(this.__color.__state[b])&&a[b]!==this.__color.__state[b])return f=!0,{}},this);f&&c.extend(this.__color.__state,a)}c.extend(this.__temp.__state,this.__color.__state);this.__temp.a=1;var l=.5>this.__color.v||.5a&&(a+=1);return{h:360*a,s:c/b,v:b/255}},rgb_to_hex:function(a,d,e){a=this.hex_with_component(0,2,a);a=this.hex_with_component(a,1,d);return a=this.hex_with_component(a,0,e)},component_from_hex:function(a,d){return a>>8*d&255},hex_with_component:function(a,d,e){return e<<(f=8*d)|a&~(255<=3.1.11" 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /sass/_defaults.scss: -------------------------------------------------------------------------------- 1 | 2 | /** 3 | * Basic HTML tag definitions 4 | */ 5 | 6 | body{ 7 | font-family: $fontSans; 8 | width: 100%; 9 | height: 100%; 10 | font-size: 14px; 11 | } 12 | 13 | a { 14 | color: lighten($bodyTextColor, 30); 15 | text-decoration: none; 16 | border-bottom: 1px $bodyTextColor dotted; 17 | } 18 | 19 | a:hover { 20 | color: $higlightText; 21 | } 22 | 23 | ::selection { 24 | color: $higlightText; 25 | background: darken( $higlightText, 20 ); 26 | } 27 | 28 | canvas { 29 | position: absolute; 30 | top: -20px; 31 | left: -20px; 32 | z-index: 1; 33 | } 34 | 35 | option, select { 36 | color: #000 !important; 37 | padding: 2px 3px; 38 | margin: 0; 39 | } 40 | -------------------------------------------------------------------------------- /sass/_responsive.scss: -------------------------------------------------------------------------------- 1 | 2 | $mobile-width: 644px; 3 | 4 | @mixin mobile { 5 | @media (max-width: #{$mobile-width}) { 6 | @content; 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /sass/_variables.scss: -------------------------------------------------------------------------------- 1 | 2 | // Theme colors 3 | $bodyColor: #262262; 4 | $bodyTextColor: #ccc; 5 | $higlightText: #ef413d; 6 | 7 | // Settings for Typesettings 8 | $fontSans: "open sans", sans-serif; 9 | -------------------------------------------------------------------------------- /sass/main.scss: -------------------------------------------------------------------------------- 1 | 2 | /** 3 | * Main entry point 4 | */ 5 | 6 | @import 'variables'; 7 | @import 'responsive'; 8 | @import './vendor/semantic.min'; 9 | @import 'defaults'; 10 | 11 | .pusher { 12 | min-height: 100%; 13 | background-color: #121212; 14 | background-size: cover !important; 15 | padding-top: 2em; 16 | padding-bottom: 2em; 17 | } 18 | 19 | .action-buttons { 20 | position: fixed; 21 | right: 10px; 22 | bottom: 15px; 23 | z-index: 2; 24 | 25 | input { 26 | display: none; 27 | } 28 | 29 | @include mobile { 30 | width: 180px; 31 | text-align: right; 32 | 33 | .button { 34 | margin-bottom: 0.5em; 35 | } 36 | } 37 | } 38 | 39 | .page-content { 40 | /*position: absolute;*/ 41 | min-height: 100%; 42 | margin-left: 3em; 43 | margin-right: 3em; 44 | max-width: 654px; 45 | color: #fff; 46 | 47 | @include mobile { 48 | margin-left: 1em; 49 | margin-right: 1em; 50 | padding-bottom: 13em; 51 | } 52 | 53 | &.invert { 54 | color: #121212; 55 | opacity: 0.9999; /* ugly chrome hack */ 56 | 57 | a { 58 | color: #121212; 59 | border-bottom-color: #121212; 60 | } 61 | 62 | li { 63 | color: #121212; 64 | } 65 | } 66 | 67 | h1 { 68 | font-family: 'Playfair Display', serif; 69 | font-weight: 800; 70 | font-size: 3em; 71 | } 72 | 73 | h2 { 74 | font-family: 'Playfair Display', serif; 75 | font-weight: 400; 76 | font-size: 2em; 77 | } 78 | 79 | p { 80 | font-family: arial; 81 | font-size: 1em; 82 | line-height: 1.62em; 83 | } 84 | } 85 | 86 | .sidebar.images { 87 | padding-top: 5px; 88 | background: #000; 89 | text-align: center; 90 | } 91 | 92 | 93 | /** 94 | * Dat GUI 95 | */ 96 | .dg .c select { 97 | margin-top: 0 !important; 98 | position: relative; 99 | left: -5px; 100 | } 101 | 102 | .dg.ac { 103 | z-index: 2 !important; 104 | } 105 | -------------------------------------------------------------------------------- /semantic.json: -------------------------------------------------------------------------------- 1 | { 2 | "base": "semantic\\", 3 | "paths": { 4 | "source": { 5 | "config": "src/theme.config", 6 | "definitions": "src/definitions/", 7 | "site": "src/site/", 8 | "themes": "src/themes/" 9 | }, 10 | "output": { 11 | "packaged": "dist\\", 12 | "uncompressed": "dist\\components\\", 13 | "compressed": "dist\\components\\", 14 | "themes": "dist\\themes\\" 15 | }, 16 | "clean": "dist/" 17 | }, 18 | "permission": false, 19 | "rtl": "No", 20 | "components": [ 21 | "reset", 22 | "site", 23 | "button", 24 | "container", 25 | "header", 26 | "icon", 27 | "image", 28 | "input", 29 | "form", 30 | "dimmer", 31 | "modal", 32 | "sidebar", 33 | "transition" 34 | ], 35 | "version": "2.1.8" 36 | } -------------------------------------------------------------------------------- /webpack.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | entry: './js/main.js', 3 | output: { 4 | path: './dist', 5 | filename: 'index.js' 6 | }, 7 | devServer: { 8 | inline: true, 9 | port: 3333 10 | }, 11 | module: { 12 | loaders: [{ 13 | test: /\.js$/, 14 | exclude: /node_modules/, 15 | loader: 'babel', 16 | query: { 17 | presets: ['es2015'] 18 | } 19 | }] 20 | } 21 | } --------------------------------------------------------------------------------