diff --git a/package.json b/package.json index 7470509..2c0b171 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,8 @@ { "scripts": { - "test-serve": "webpack --config webpack-test.config.js --mode development && jasmine-browser-runner" + "build": "webpack --mode development", + "test-serve": "webpack --config webpack-test.config.js --mode development && jasmine-browser-runner", + "test": "webpack --config webpack-test.config.js --mode development && jasmine-browser-runner runSpecs" }, "devDependencies": { "glob": "^11.0.2", diff --git a/spec/RgbSpec.js b/spec/RgbSpec.js index 92fd272..f4e1d95 100644 --- a/spec/RgbSpec.js +++ b/spec/RgbSpec.js @@ -16,4 +16,11 @@ describe("RGB", () => { expect(value.green).toEqual(expected[index].green) }) } + + for (let index = 0; index < hexes.length; index++) { + it(`should return the same hex value: ${hexes[index].toString(16)}`, () => { + const value = expected[index].toHex() + expect(value).toEqual(hexes[index]) + }) + } }) \ No newline at end of file diff --git a/src/color-schemes.ts b/src/color-schemes.ts index 6b571af..640b6c0 100644 --- a/src/color-schemes.ts +++ b/src/color-schemes.ts @@ -1,22 +1,27 @@ import HSL from "./hsl" -abstract class Scheme { +export abstract class Scheme { protected primary: HSL + colors: number[] + protected constructor(initial: number) { this.primary = HSL.fromHex(initial) } - colors: number[] + toString(): string { + let values = this.colors.map(color => color.toString(16)).join(",") + return `${this.constructor.name}: ${values}` + } } export class Analogous extends Scheme { constructor(initial: number) { super(initial) - const left1 = new HSL(this.primary.hue - 60, this.primary.saturation, this.primary.lightness) - const left2 = new HSL(this.primary.hue - 30, this.primary.saturation, this.primary.lightness) - const right1 = new HSL(this.primary.hue + 30, this.primary.saturation, this.primary.lightness) - const right2 = new HSL(this.primary.hue + 60, this.primary.saturation, this.primary.lightness) + const left1 = new HSL(this.primary.hue - 30, this.primary.saturation, this.primary.lightness) + const left2 = new HSL(this.primary.hue - 15, this.primary.saturation, this.primary.lightness) + const right1 = new HSL(this.primary.hue + 15, this.primary.saturation, this.primary.lightness) + const right2 = new HSL(this.primary.hue + 30, this.primary.saturation, this.primary.lightness) this.colors = [ left1.toHex(), diff --git a/src/rgb.ts b/src/rgb.ts index 4a6b55b..1f237d4 100644 --- a/src/rgb.ts +++ b/src/rgb.ts @@ -6,13 +6,13 @@ export default class RGB { blue: number constructor(red: number, green: number, blue: number) { - this.red = red - this.green = green - this.blue = blue + this.red = Math.floor(red < 0 ? 0 : red > 255 ? 255 : red) + this.green = Math.floor(green < 0 ? 0 : green > 255 ? 255 : green) + this.blue = Math.floor(blue < 0 ? 0 : blue > 255 ? 255 : blue) } toHex(): number { - return this.red << 16 + this.green << 8 + this.blue + return (this.red << 16) + (this.green << 8) + this.blue } // https://en.wikipedia.org/wiki/HSL_and_HSV @@ -20,12 +20,10 @@ export default class RGB { let red = 0, green = 0, blue = 0 - const saturationValue = hsl.saturation / 100, - lightnessValue = hsl.lightness / 100, - chroma = 1 - Math.abs(2 * hsl.lightness - 1) * saturationValue, + const chroma = (1 - Math.abs(2 * hsl.lightness - 1)) * hsl.saturation, range = hsl.hue / 60, intermediate = chroma * (1 - Math.abs(range % 2 - 1)), - match = lightnessValue - chroma / 2 + match = hsl.lightness - chroma / 2 if (range >= 0 && range < 1) { red = chroma diff --git a/src/sand-painter.ts b/src/sand-painter.ts index d53e46b..6b1c66c 100644 --- a/src/sand-painter.ts +++ b/src/sand-painter.ts @@ -7,7 +7,7 @@ export default class SandPainter { constructor(crack: Crack) { this.crack = crack - this.color = this.crack.state.getRandomColor() + this.color = this.crack.state.getNextColor() this.gain = Math.random() / 10 } diff --git a/src/state.ts b/src/state.ts index 003a3ac..37988b2 100644 --- a/src/state.ts +++ b/src/state.ts @@ -2,17 +2,18 @@ import Crack from "./crack" export default class State { readonly canvas: HTMLCanvasElement - colors: number[] readonly maxCracks: number readonly grid: number[][] + colors: number[] seeds: {x: number, y: number}[] cracks: Crack[] + colorIndex: number = 0 constructor(colors: number[], maxCracks: number, canvas: HTMLCanvasElement) { this.canvas = canvas - this.colors = colors this.maxCracks = maxCracks this.grid = [] + this.colors = colors this.cracks = [] this.seeds = [] @@ -24,6 +25,7 @@ export default class State { this.cracks.length = 0 this.grid.length = 0 this.seeds.length = 0 + this.colorIndex = 0 const height = this.canvas.height const width = this.canvas.width @@ -55,8 +57,8 @@ export default class State { this.cracks.push(new Crack(this, x, y, angle)) } - getRandomColor(): number { - return this.colors[Math.floor(Math.random() * this.colors.length)] + getNextColor(): number { + return this.colors[this.colorIndex++ % this.colors.length] } isWithinBoundary(x: number, y: number): boolean { diff --git a/src/substrate.ts b/src/substrate.ts index 2da1ede..1e95afc 100644 --- a/src/substrate.ts +++ b/src/substrate.ts @@ -1,6 +1,6 @@ // TS attempt of http://www.complexification.net/gallery/machines/substrate/index.php by laniaung.me import State from "./state" -import {Analogous, Monochromatic, SplitComplementary, Square, Tetradic, Triadic} from "./color-schemes" +import {Scheme, Analogous, Monochromatic, SplitComplementary, Square, Tetradic, Triadic} from "./color-schemes" export default class Substrate { private readonly state: State @@ -24,25 +24,34 @@ export default class Substrate { requestAnimationFrame(draw) } - setInterval(() => me.state.init(me.getRandomColorScheme()), 30 * 1000) + setInterval(() => me.state.init(me.getRandomColorScheme()), 120 * 1000) draw() } getRandomColorScheme(): number[] { const color = Math.floor(Math.random() * Math.pow(256, 3)) + let scheme: Scheme switch (Math.floor(Math.random() * 6)) { case 1: - return new Monochromatic(color).colors + scheme = new Monochromatic(color) + break; case 2: - return new SplitComplementary(color).colors + scheme = new SplitComplementary(color) + break; case 3: - return new Triadic(color).colors + scheme = new Triadic(color) + break; case 4: - return new Tetradic(color).colors + scheme = new Tetradic(color) + break; case 5: - return new Square(color).colors + scheme = new Square(color) + break; default: - return new Analogous(color).colors + scheme = new Analogous(color) } + + console.info(scheme.toString()) + return scheme.colors } } \ No newline at end of file diff --git a/www/main.js b/www/main.js index 4d49671..7edcd79 100644 --- a/www/main.js +++ b/www/main.js @@ -12,6 +12,7 @@ __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ Analogous: () => (/* binding */ Analogous), /* harmony export */ Monochromatic: () => (/* binding */ Monochromatic), +/* harmony export */ Scheme: () => (/* binding */ Scheme), /* harmony export */ SplitComplementary: () => (/* binding */ SplitComplementary), /* harmony export */ Square: () => (/* binding */ Square), /* harmony export */ Tetradic: () => (/* binding */ Tetradic), @@ -34,30 +35,25 @@ var __extends = (undefined && undefined.__extends) || (function () { }; })(); -/* -export enum Scheme { - Analogous, - Monochromatic, - SplitComplementary, - Triadic, - Tetradic, - Square -} -*/ var Scheme = /** @class */ (function () { function Scheme(initial) { - this.primary = _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL.fromHex(initial); + this.primary = _hsl__WEBPACK_IMPORTED_MODULE_0__["default"].fromHex(initial); } + Scheme.prototype.toString = function () { + var values = this.colors.map(function (color) { return color.toString(16); }).join(","); + return "".concat(this.constructor.name, ": ").concat(values); + }; return Scheme; }()); + var Analogous = /** @class */ (function (_super) { __extends(Analogous, _super); function Analogous(initial) { var _this = _super.call(this, initial) || this; - var left1 = new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(_this.primary.hue - 60, _this.primary.saturation, _this.primary.lightness); - var left2 = new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(_this.primary.hue - 30, _this.primary.saturation, _this.primary.lightness); - var right1 = new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(_this.primary.hue + 30, _this.primary.saturation, _this.primary.lightness); - var right2 = new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(_this.primary.hue + 60, _this.primary.saturation, _this.primary.lightness); + var left1 = new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](_this.primary.hue - 30, _this.primary.saturation, _this.primary.lightness); + var left2 = new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](_this.primary.hue - 15, _this.primary.saturation, _this.primary.lightness); + var right1 = new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](_this.primary.hue + 15, _this.primary.saturation, _this.primary.lightness); + var right2 = new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](_this.primary.hue + 30, _this.primary.saturation, _this.primary.lightness); _this.colors = [ left1.toHex(), left2.toHex(), @@ -77,10 +73,10 @@ var Monochromatic = /** @class */ (function (_super) { var delta = _this.primary.lightness / 6; _this.colors = [ initial, - new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(_this.primary.hue, _this.primary.saturation, _this.primary.lightness - delta).toHex(), - new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(_this.primary.hue, _this.primary.saturation, _this.primary.lightness - delta * 2).toHex(), - new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(_this.primary.hue, _this.primary.saturation, _this.primary.lightness - delta * 3).toHex(), - new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(_this.primary.hue, _this.primary.saturation, _this.primary.lightness - delta * 4).toHex() + new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](_this.primary.hue, _this.primary.saturation, _this.primary.lightness - delta).toHex(), + new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](_this.primary.hue, _this.primary.saturation, _this.primary.lightness - delta * 2).toHex(), + new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](_this.primary.hue, _this.primary.saturation, _this.primary.lightness - delta * 3).toHex(), + new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](_this.primary.hue, _this.primary.saturation, _this.primary.lightness - delta * 4).toHex() ]; return _this; } @@ -91,11 +87,11 @@ var SplitComplementary = /** @class */ (function (_super) { __extends(SplitComplementary, _super); function SplitComplementary(initial) { var _this = _super.call(this, initial) || this; - var complement = new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL((_this.primary.hue + 180) % 360, _this.primary.saturation, _this.primary.lightness); + var complement = new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"]((_this.primary.hue + 180) % 360, _this.primary.saturation, _this.primary.lightness); _this.colors = [ initial, - new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(complement.hue - 30, complement.saturation, complement.lightness).toHex(), - new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(complement.hue + 30, complement.saturation, complement.lightness).toHex() + new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](complement.hue - 30, complement.saturation, complement.lightness).toHex(), + new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](complement.hue + 30, complement.saturation, complement.lightness).toHex() ]; return _this; } @@ -108,8 +104,8 @@ var Triadic = /** @class */ (function (_super) { var _this = _super.call(this, initial) || this; _this.colors = [ initial, - new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(_this.primary.hue - 120, _this.primary.saturation, _this.primary.lightness).toHex(), - new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(_this.primary.hue + 120, _this.primary.saturation, _this.primary.lightness).toHex() + new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](_this.primary.hue - 120, _this.primary.saturation, _this.primary.lightness).toHex(), + new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](_this.primary.hue + 120, _this.primary.saturation, _this.primary.lightness).toHex() ]; return _this; } @@ -120,9 +116,9 @@ var Tetradic = /** @class */ (function (_super) { __extends(Tetradic, _super); function Tetradic(initial) { var _this = _super.call(this, initial) || this; - var second = new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(_this.primary.hue + 45, _this.primary.saturation, _this.primary.lightness); - var complement = new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(_this.primary.hue + 180, _this.primary.saturation, _this.primary.lightness); - var secondComplement = new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(second.hue + 180, _this.primary.saturation, _this.primary.lightness); + var second = new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](_this.primary.hue + 45, _this.primary.saturation, _this.primary.lightness); + var complement = new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](_this.primary.hue + 180, _this.primary.saturation, _this.primary.lightness); + var secondComplement = new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](second.hue + 180, _this.primary.saturation, _this.primary.lightness); _this.colors = [ initial, second.toHex(), @@ -138,9 +134,9 @@ var Square = /** @class */ (function (_super) { __extends(Square, _super); function Square(initial) { var _this = _super.call(this, initial) || this; - var second = new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(_this.primary.hue + 90, _this.primary.saturation, _this.primary.lightness); - var third = new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(_this.primary.hue + 180, _this.primary.saturation, _this.primary.lightness); - var fourth = new _hsl__WEBPACK_IMPORTED_MODULE_0__.HSL(second.hue + 270, _this.primary.saturation, _this.primary.lightness); + var second = new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](_this.primary.hue + 90, _this.primary.saturation, _this.primary.lightness); + var third = new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](_this.primary.hue + 180, _this.primary.saturation, _this.primary.lightness); + var fourth = new _hsl__WEBPACK_IMPORTED_MODULE_0__["default"](second.hue + 270, _this.primary.saturation, _this.primary.lightness); _this.colors = [ initial, second.toHex(), @@ -226,7 +222,7 @@ var Crack = /** @class */ (function () { __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ HSL: () => (/* binding */ HSL) +/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) /* harmony export */ }); /* harmony import */ var _rgb__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./rgb */ "./src/rgb.ts"); @@ -236,28 +232,29 @@ var HSL = /** @class */ (function () { this.saturation = saturation; this.lightness = lightness; } - // https://en.wikipedia.org/wiki/RGB_color_model + // https://en.wikipedia.org/wiki/HSL_and_HSV HSL.fromRgb = function (rgb) { - var redValue = rgb.red / 255, greenValue = rgb.green / 255, blueValue = rgb.blue / 255, lightness = (redValue + greenValue + blueValue) / 3, saturation = 1 - (3 / (redValue + greenValue + blueValue)) * Math.min(redValue, greenValue, blueValue); - var dividend = (redValue - greenValue) + (redValue - blueValue); - var divisor = 2 * Math.sqrt((redValue - greenValue) ^ 2 + (redValue - blueValue) * (greenValue - blueValue)); - var hue = (1 / Math.cos(dividend / divisor)); - if (greenValue > blueValue) - hue = 360 - hue; - return new HSL(hue, saturation, lightness); + var redValue = rgb.red / 255, greenValue = rgb.green / 255, blueValue = rgb.blue / 255, max = Math.max(redValue, greenValue, blueValue), min = Math.min(redValue, greenValue, blueValue), chroma = max - min, lightness = .5 * (max + min), saturation = 1 - (3 / (redValue + greenValue + blueValue)) * Math.min(redValue, greenValue, blueValue); + var huePrime = 0; + if (chroma != 0) { + if (redValue == max) + huePrime = ((greenValue - blueValue) / chroma) % 6; + else if (greenValue == max) + huePrime = ((blueValue - redValue) / chroma) + 2; + else + huePrime = ((redValue - greenValue) / chroma) + 4; + } + return new HSL(huePrime * 60, saturation, lightness); }; HSL.fromHex = function (color) { - var red = color >> 16; - var green = (color - (red << 16)) >> 8; - var blue = color - (red << 16) - (green << 8); - return HSL.fromRgb(new _rgb__WEBPACK_IMPORTED_MODULE_0__.RGB(red, green, blue)); + return HSL.fromRgb(_rgb__WEBPACK_IMPORTED_MODULE_0__["default"].fromHex(color)); }; HSL.prototype.toHex = function () { - return _rgb__WEBPACK_IMPORTED_MODULE_0__.RGB.fromHsl(this).toHex(); + return _rgb__WEBPACK_IMPORTED_MODULE_0__["default"].fromHsl(this).toHex(); }; return HSL; }()); - +/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (HSL); /***/ }), @@ -270,21 +267,21 @@ var HSL = /** @class */ (function () { __webpack_require__.r(__webpack_exports__); /* harmony export */ __webpack_require__.d(__webpack_exports__, { -/* harmony export */ RGB: () => (/* binding */ RGB) +/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) /* harmony export */ }); var RGB = /** @class */ (function () { function RGB(red, green, blue) { - this.red = red; - this.green = green; - this.blue = blue; + this.red = Math.floor(red < 0 ? 0 : red > 255 ? 255 : red); + this.green = Math.floor(green < 0 ? 0 : green > 255 ? 255 : green); + this.blue = Math.floor(blue < 0 ? 0 : blue > 255 ? 255 : blue); } RGB.prototype.toHex = function () { - return this.red << 16 + this.green << 8 + this.blue; + return (this.red << 16) + (this.green << 8) + this.blue; }; // https://en.wikipedia.org/wiki/HSL_and_HSV RGB.fromHsl = function (hsl) { var red = 0, green = 0, blue = 0; - var saturationValue = hsl.saturation / 100, lightnessValue = hsl.lightness / 100, chroma = 1 - Math.abs(2 * hsl.lightness - 1) * saturationValue, range = hsl.hue / 60, intermediate = chroma * (1 - Math.abs(range % 2 - 1)), match = lightnessValue - chroma / 2; + var chroma = (1 - Math.abs(2 * hsl.lightness - 1)) * hsl.saturation, range = hsl.hue / 60, intermediate = chroma * (1 - Math.abs(range % 2 - 1)), match = hsl.lightness - chroma / 2; if (range >= 0 && range < 1) { red = chroma; green = intermediate; @@ -311,9 +308,15 @@ var RGB = /** @class */ (function () { } return new RGB((red + match) * 255, (green + match) * 255, (blue + match) * 255); }; + RGB.fromHex = function (color) { + var red = color >> 16; + var green = (color - (red << 16)) >> 8; + var blue = color - (red << 16) - (green << 8); + return new RGB(red, green, blue); + }; return RGB; }()); - +/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (RGB); /***/ }), @@ -331,7 +334,7 @@ __webpack_require__.r(__webpack_exports__); var SandPainter = /** @class */ (function () { function SandPainter(crack) { this.crack = crack; - this.color = this.crack.state.getRandomColor(); + this.color = this.crack.state.getNextColor(); this.gain = Math.random() / 10; } SandPainter.prototype.render = function () { @@ -387,10 +390,11 @@ __webpack_require__.r(__webpack_exports__); var State = /** @class */ (function () { function State(colors, maxCracks, canvas) { + this.colorIndex = 0; this.canvas = canvas; - this.colors = colors; this.maxCracks = maxCracks; this.grid = []; + this.colors = colors; this.cracks = []; this.seeds = []; this.init(); @@ -401,6 +405,7 @@ var State = /** @class */ (function () { this.cracks.length = 0; this.grid.length = 0; this.seeds.length = 0; + this.colorIndex = 0; var height = this.canvas.height; var width = this.canvas.width; var context = this.canvas.getContext("2d"); @@ -426,8 +431,8 @@ var State = /** @class */ (function () { var _a = this.getNewEntry(), x = _a.x, y = _a.y, angle = _a.angle; this.cracks.push(new _crack__WEBPACK_IMPORTED_MODULE_0__["default"](this, x, y, angle)); }; - State.prototype.getRandomColor = function () { - return this.colors[Math.floor(Math.random() * this.colors.length)]; + State.prototype.getNextColor = function () { + return this.colors[this.colorIndex++ % this.colors.length]; }; State.prototype.isWithinBoundary = function (x, y) { return x >= 0 && x < this.canvas.width && y >= 0 && y < this.canvas.height; @@ -493,25 +498,33 @@ var Substrate = /** @class */ (function () { } requestAnimationFrame(draw); }; - setInterval(function () { return me.state.init(me.getRandomColorScheme()); }, 30 * 1000); + setInterval(function () { return me.state.init(me.getRandomColorScheme()); }, 120 * 1000); draw(); }; Substrate.prototype.getRandomColorScheme = function () { var color = Math.floor(Math.random() * Math.pow(256, 3)); + var scheme; switch (Math.floor(Math.random() * 6)) { case 1: - return new _color_schemes__WEBPACK_IMPORTED_MODULE_1__.Monochromatic(color).colors; + scheme = new _color_schemes__WEBPACK_IMPORTED_MODULE_1__.Monochromatic(color); + break; case 2: - return new _color_schemes__WEBPACK_IMPORTED_MODULE_1__.SplitComplementary(color).colors; + scheme = new _color_schemes__WEBPACK_IMPORTED_MODULE_1__.SplitComplementary(color); + break; case 3: - return new _color_schemes__WEBPACK_IMPORTED_MODULE_1__.Triadic(color).colors; + scheme = new _color_schemes__WEBPACK_IMPORTED_MODULE_1__.Triadic(color); + break; case 4: - return new _color_schemes__WEBPACK_IMPORTED_MODULE_1__.Tetradic(color).colors; + scheme = new _color_schemes__WEBPACK_IMPORTED_MODULE_1__.Tetradic(color); + break; case 5: - return new _color_schemes__WEBPACK_IMPORTED_MODULE_1__.Square(color).colors; + scheme = new _color_schemes__WEBPACK_IMPORTED_MODULE_1__.Square(color); + break; default: - return new _color_schemes__WEBPACK_IMPORTED_MODULE_1__.Analogous(color).colors; + scheme = new _color_schemes__WEBPACK_IMPORTED_MODULE_1__.Analogous(color); } + console.info(scheme.toString()); + return scheme.colors; }; return Substrate; }()); diff --git a/www/main.js.map b/www/main.js.map index 6ceeaff..9467eb4 100644 --- a/www/main.js.map +++ b/www/main.js.map @@ -1 +1 @@ -{"version":3,"file":"main.js","mappings":";;;;;;;;;;;;;;;;;;;;AAAA,iBAAiB,SAAI,IAAI,SAAI;AAC7B;AACA;AACA,eAAe,gBAAgB,sCAAsC,kBAAkB;AACvF,8BAA8B;AAC9B;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwB;AACxB;AACA;AACA,CAAC;AAC2B;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,uBAAuB,qCAAG;AAC1B;AACA;AACA,CAAC;AACD;AACA;AACA;AACA;AACA,wBAAwB,qCAAG;AAC3B,wBAAwB,qCAAG;AAC3B,yBAAyB,qCAAG;AAC5B,yBAAyB,qCAAG;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACoB;AACrB;AACA;AACA;AACA;AACA;AACA;AACA;AACA,gBAAgB,qCAAG;AACnB,gBAAgB,qCAAG;AACnB,gBAAgB,qCAAG;AACnB,gBAAgB,qCAAG;AACnB;AACA;AACA;AACA;AACA,CAAC;AACwB;AACzB;AACA;AACA;AACA;AACA,6BAA6B,qCAAG;AAChC;AACA;AACA,gBAAgB,qCAAG;AACnB,gBAAgB,qCAAG;AACnB;AACA;AACA;AACA;AACA,CAAC;AAC6B;AAC9B;AACA;AACA;AACA;AACA;AACA;AACA,gBAAgB,qCAAG;AACnB,gBAAgB,qCAAG;AACnB;AACA;AACA;AACA;AACA,CAAC;AACkB;AACnB;AACA;AACA;AACA;AACA,yBAAyB,qCAAG;AAC5B,6BAA6B,qCAAG;AAChC,mCAAmC,qCAAG;AACtC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACmB;AACpB;AACA;AACA;AACA;AACA,yBAAyB,qCAAG;AAC5B,wBAAwB,qCAAG;AAC3B,yBAAyB,qCAAG;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACiB;;;;;;;;;;;;;;;;ACrIuB;AACzC;AACA;AACA;AACA;AACA;AACA;AACA,2BAA2B,qDAAW;AACtC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wCAAwC,YAAY;AACpD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACD,iEAAe,KAAK,EAAC;;;;;;;;;;;;;;;;AC9CO;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,+BAA+B,qCAAG;AAClC;AACA;AACA,eAAe,qCAAG;AAClB;AACA;AACA,CAAC;AACc;;;;;;;;;;;;;;;AC5Bf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACc;;;;;;;;;;;;;;;ACzCf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,0CAA0C;AAC1C;AACA,wBAAwB,YAAY;AACpC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACD,iEAAe,WAAW,EAAC;;;;;;;;;;;;;;;;ACxCC;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwB,WAAW;AACnC;AACA,4BAA4B,YAAY;AACxC;AACA;AACA;AACA,wBAAwB,OAAO;AAC/B;AACA;AACA;AACA,iCAAiC,8CAAK;AACtC;AACA;AACA;AACA;AACA;AACA;AACA;AACA,6BAA6B,8CAAK;AAClC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,qBAAqB;AACrB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACD,iEAAe,KAAK,EAAC;;;;;;;;;;;;;;;;;ACrErB;AAC4B;AAC8E;AAC1G;AACA;AACA;AACA,yEAAyE;AACzE;AACA;AACA;AACA;AACA,yBAAyB,8CAAK;AAC9B;AACA;AACA;AACA;AACA;AACA,mDAAmD,gBAAgB;AACnE;AACA;AACA;AACA;AACA;AACA,kCAAkC,kDAAkD;AACpF;AACA;AACA;AACA;AACA;AACA;AACA,2BAA2B,yDAAa;AACxC;AACA,2BAA2B,8DAAkB;AAC7C;AACA,2BAA2B,mDAAO;AAClC;AACA,2BAA2B,oDAAQ;AACnC;AACA,2BAA2B,kDAAM;AACjC;AACA,2BAA2B,qDAAS;AACpC;AACA;AACA;AACA,CAAC;AACD,iEAAe,SAAS,EAAC;;;;;;;UC7CzB;UACA;;UAEA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;;UAEA;UACA;;UAEA;UACA;UACA;;;;;WCtBA;WACA;WACA;WACA;WACA,yCAAyC,wCAAwC;WACjF;WACA;WACA;;;;;WCPA;;;;;WCAA;WACA;WACA;WACA,uDAAuD,iBAAiB;WACxE;WACA,gDAAgD,aAAa;WAC7D;;;;;;;;;;;;ACNoC;AACpC,8BAA8B;AAC9B;AACA,QAAQ,kDAAS;AACjB,CAAC;AACD;AACA;AACA;AACA;AACA,CAAC;AACD;AACA,CAAC;AACD","sources":["webpack:///./src/color-schemes.ts","webpack:///./src/crack.ts","webpack:///./src/hsl.ts","webpack:///./src/rgb.ts","webpack:///./src/sand-painter.ts","webpack:///./src/state.ts","webpack:///./src/substrate.ts","webpack:///webpack/bootstrap","webpack:///webpack/runtime/define property getters","webpack:///webpack/runtime/hasOwnProperty shorthand","webpack:///webpack/runtime/make namespace object","webpack:///./src/launch.ts"],"sourcesContent":["var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n if (typeof b !== \"function\" && b !== null)\n throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { HSL } from \"./hsl\";\n/*\nexport enum Scheme {\n Analogous,\n Monochromatic,\n SplitComplementary,\n Triadic,\n Tetradic,\n Square\n}\n*/\nvar Scheme = /** @class */ (function () {\n function Scheme(initial) {\n this.primary = HSL.fromHex(initial);\n }\n return Scheme;\n}());\nvar Analogous = /** @class */ (function (_super) {\n __extends(Analogous, _super);\n function Analogous(initial) {\n var _this = _super.call(this, initial) || this;\n var left1 = new HSL(_this.primary.hue - 60, _this.primary.saturation, _this.primary.lightness);\n var left2 = new HSL(_this.primary.hue - 30, _this.primary.saturation, _this.primary.lightness);\n var right1 = new HSL(_this.primary.hue + 30, _this.primary.saturation, _this.primary.lightness);\n var right2 = new HSL(_this.primary.hue + 60, _this.primary.saturation, _this.primary.lightness);\n _this.colors = [\n left1.toHex(),\n left2.toHex(),\n initial,\n right1.toHex(),\n right2.toHex()\n ];\n return _this;\n }\n return Analogous;\n}(Scheme));\nexport { Analogous };\nvar Monochromatic = /** @class */ (function (_super) {\n __extends(Monochromatic, _super);\n function Monochromatic(initial) {\n var _this = _super.call(this, initial) || this;\n var delta = _this.primary.lightness / 6;\n _this.colors = [\n initial,\n new HSL(_this.primary.hue, _this.primary.saturation, _this.primary.lightness - delta).toHex(),\n new HSL(_this.primary.hue, _this.primary.saturation, _this.primary.lightness - delta * 2).toHex(),\n new HSL(_this.primary.hue, _this.primary.saturation, _this.primary.lightness - delta * 3).toHex(),\n new HSL(_this.primary.hue, _this.primary.saturation, _this.primary.lightness - delta * 4).toHex()\n ];\n return _this;\n }\n return Monochromatic;\n}(Scheme));\nexport { Monochromatic };\nvar SplitComplementary = /** @class */ (function (_super) {\n __extends(SplitComplementary, _super);\n function SplitComplementary(initial) {\n var _this = _super.call(this, initial) || this;\n var complement = new HSL((_this.primary.hue + 180) % 360, _this.primary.saturation, _this.primary.lightness);\n _this.colors = [\n initial,\n new HSL(complement.hue - 30, complement.saturation, complement.lightness).toHex(),\n new HSL(complement.hue + 30, complement.saturation, complement.lightness).toHex()\n ];\n return _this;\n }\n return SplitComplementary;\n}(Scheme));\nexport { SplitComplementary };\nvar Triadic = /** @class */ (function (_super) {\n __extends(Triadic, _super);\n function Triadic(initial) {\n var _this = _super.call(this, initial) || this;\n _this.colors = [\n initial,\n new HSL(_this.primary.hue - 120, _this.primary.saturation, _this.primary.lightness).toHex(),\n new HSL(_this.primary.hue + 120, _this.primary.saturation, _this.primary.lightness).toHex()\n ];\n return _this;\n }\n return Triadic;\n}(Scheme));\nexport { Triadic };\nvar Tetradic = /** @class */ (function (_super) {\n __extends(Tetradic, _super);\n function Tetradic(initial) {\n var _this = _super.call(this, initial) || this;\n var second = new HSL(_this.primary.hue + 45, _this.primary.saturation, _this.primary.lightness);\n var complement = new HSL(_this.primary.hue + 180, _this.primary.saturation, _this.primary.lightness);\n var secondComplement = new HSL(second.hue + 180, _this.primary.saturation, _this.primary.lightness);\n _this.colors = [\n initial,\n second.toHex(),\n complement.toHex(),\n secondComplement.toHex()\n ];\n return _this;\n }\n return Tetradic;\n}(Scheme));\nexport { Tetradic };\nvar Square = /** @class */ (function (_super) {\n __extends(Square, _super);\n function Square(initial) {\n var _this = _super.call(this, initial) || this;\n var second = new HSL(_this.primary.hue + 90, _this.primary.saturation, _this.primary.lightness);\n var third = new HSL(_this.primary.hue + 180, _this.primary.saturation, _this.primary.lightness);\n var fourth = new HSL(second.hue + 270, _this.primary.saturation, _this.primary.lightness);\n _this.colors = [\n initial,\n second.toHex(),\n third.toHex(),\n fourth.toHex()\n ];\n return _this;\n }\n return Square;\n}(Scheme));\nexport { Square };\n","import SandPainter from \"./sand-painter\";\nvar Crack = /** @class */ (function () {\n function Crack(state, x, y, angle) {\n this.x = 0;\n this.y = 0;\n this.angle = 0;\n this.state = state;\n this.painter = new SandPainter(this);\n this.start(x, y, angle);\n }\n Crack.prototype.start = function (x, y, angle) {\n this.x = x + .61 * Math.cos(angle * Math.PI / 180);\n this.y = y + .61 * Math.sin(angle * Math.PI / 180);\n var flip = Math.random() < 0.5;\n this.angle = angle + (90 + Math.floor(Math.random() * 4.1 - 2)) * (flip ? -1 : 1);\n };\n Crack.prototype.draw = function () {\n this.x += .42 * Math.cos(this.angle * Math.PI / 180);\n this.y += .42 * Math.sin(this.angle * Math.PI / 180);\n var fuzzX = this.x + (Math.random() * .66 - .33);\n var fuzzY = this.y + (Math.random() * .66 - .33);\n var context = this.state.canvas.getContext(\"2d\");\n context.fillStyle = \"#000\";\n context.fillRect(fuzzX, fuzzY, 1, 1);\n this.painter.render();\n var x = Math.floor(this.x);\n var y = Math.floor(this.y);\n if (this.state.isWithinBoundary(x, y)) {\n var angle = this.state.grid[x][y];\n if (angle > 10000) {\n this.state.grid[x][y] = Math.floor(this.angle);\n this.state.seeds.push({ x: x, y: y });\n }\n else if (this.state.grid[x][y] != Math.floor(this.angle)) {\n var entry = this.state.getNewEntry();\n this.start(entry.x, entry.y, entry.angle);\n }\n }\n else {\n var entry = this.state.getNewEntry();\n this.start(entry.x, entry.y, entry.angle);\n this.state.addCrack();\n }\n };\n return Crack;\n}());\nexport default Crack;\n","import { RGB } from \"./rgb\";\nvar HSL = /** @class */ (function () {\n function HSL(hue, saturation, lightness) {\n this.hue = (hue + 360) % 360;\n this.saturation = saturation;\n this.lightness = lightness;\n }\n // https://en.wikipedia.org/wiki/RGB_color_model\n HSL.fromRgb = function (rgb) {\n var redValue = rgb.red / 255, greenValue = rgb.green / 255, blueValue = rgb.blue / 255, lightness = (redValue + greenValue + blueValue) / 3, saturation = 1 - (3 / (redValue + greenValue + blueValue)) * Math.min(redValue, greenValue, blueValue);\n var dividend = (redValue - greenValue) + (redValue - blueValue);\n var divisor = 2 * Math.sqrt((redValue - greenValue) ^ 2 + (redValue - blueValue) * (greenValue - blueValue));\n var hue = (1 / Math.cos(dividend / divisor));\n if (greenValue > blueValue)\n hue = 360 - hue;\n return new HSL(hue, saturation, lightness);\n };\n HSL.fromHex = function (color) {\n var red = color >> 16;\n var green = (color - (red << 16)) >> 8;\n var blue = color - (red << 16) - (green << 8);\n return HSL.fromRgb(new RGB(red, green, blue));\n };\n HSL.prototype.toHex = function () {\n return RGB.fromHsl(this).toHex();\n };\n return HSL;\n}());\nexport { HSL };\n","var RGB = /** @class */ (function () {\n function RGB(red, green, blue) {\n this.red = red;\n this.green = green;\n this.blue = blue;\n }\n RGB.prototype.toHex = function () {\n return this.red << 16 + this.green << 8 + this.blue;\n };\n // https://en.wikipedia.org/wiki/HSL_and_HSV\n RGB.fromHsl = function (hsl) {\n var red = 0, green = 0, blue = 0;\n var saturationValue = hsl.saturation / 100, lightnessValue = hsl.lightness / 100, chroma = 1 - Math.abs(2 * hsl.lightness - 1) * saturationValue, range = hsl.hue / 60, intermediate = chroma * (1 - Math.abs(range % 2 - 1)), match = lightnessValue - chroma / 2;\n if (range >= 0 && range < 1) {\n red = chroma;\n green = intermediate;\n }\n else if (range >= 1 && range < 2) {\n red = intermediate;\n green = chroma;\n }\n else if (range >= 2 && range < 3) {\n green = chroma;\n blue = intermediate;\n }\n else if (range >= 3 && range < 4) {\n green = intermediate;\n blue = chroma;\n }\n else if (range >= 4 && range < 5) {\n red = intermediate;\n blue = chroma;\n }\n else if (range >= 5 && range < 6) {\n red = chroma;\n blue = intermediate;\n }\n return new RGB((red + match) * 255, (green + match) * 255, (blue + match) * 255);\n };\n return RGB;\n}());\nexport { RGB };\n","var SandPainter = /** @class */ (function () {\n function SandPainter(crack) {\n this.crack = crack;\n this.color = this.crack.state.getRandomColor();\n this.gain = Math.random() / 10;\n }\n SandPainter.prototype.render = function () {\n var state = this.crack.state, x = this.crack.x, y = this.crack.y, angle = this.crack.angle;\n var open = true, endX = x, endY = y;\n while (open) {\n endX += .81 * Math.sin(angle * Math.PI / 180);\n endY -= .81 * Math.cos(angle * Math.PI / 180);\n var gridX = Math.floor(endX);\n var gridY = Math.floor(endY);\n if (state.isWithinBoundary(gridX, gridY)) {\n open = state.grid[gridX][gridY] > 10000;\n }\n else {\n open = false;\n }\n }\n this.gain += (Math.random() / 10 - .05);\n if (this.gain < 0)\n this.gain = 0;\n if (this.gain > 1)\n this.gain = 1;\n var grains = 64;\n var hex = this.color.toString(16);\n var w = this.gain / (grains - 1); // some kind of multiplier\n var context = state.canvas.getContext(\"2d\");\n for (var i = 0; i < grains; i++) {\n var alpha = Math.floor((.1 - i / (grains * 10)) * 255);\n var paintX = x + (endX - x) * Math.sin(Math.sin(i * w));\n var paintY = y + (endY - y) * Math.sin(Math.sin(i * w));\n context.fillStyle = \"#\".concat(hex.padStart(6, \"0\")).concat(alpha.toString(16).padStart(2, \"0\"));\n context.fillRect(paintX, paintY, 1, 1);\n }\n };\n return SandPainter;\n}());\nexport default SandPainter;\n","import Crack from \"./crack\";\nvar State = /** @class */ (function () {\n function State(colors, maxCracks, canvas) {\n this.canvas = canvas;\n this.colors = colors;\n this.maxCracks = maxCracks;\n this.grid = [];\n this.cracks = [];\n this.seeds = [];\n this.init();\n }\n State.prototype.init = function (colors) {\n if (colors)\n this.colors = colors;\n this.cracks.length = 0;\n this.grid.length = 0;\n this.seeds.length = 0;\n var height = this.canvas.height;\n var width = this.canvas.width;\n var context = this.canvas.getContext(\"2d\");\n context.fillStyle = \"rgb(255 255 255 / 95%)\";\n context.fillRect(0, 0, width, height);\n for (var x = 0; x < width; x++) {\n this.grid[x] = [];\n for (var y = 0; y < height; y++) {\n this.grid[x][y] = 10001;\n }\n }\n for (var i = 0; i < 3; i++) {\n var x = Math.floor(Math.random() * width);\n var y = Math.floor(Math.random() * height);\n var angle = Math.floor(Math.random() * 360);\n this.cracks.push(new Crack(this, x, y, angle));\n this.grid[x][y] = angle;\n }\n };\n State.prototype.addCrack = function () {\n if (this.cracks.length >= this.maxCracks)\n return;\n var _a = this.getNewEntry(), x = _a.x, y = _a.y, angle = _a.angle;\n this.cracks.push(new Crack(this, x, y, angle));\n };\n State.prototype.getRandomColor = function () {\n return this.colors[Math.floor(Math.random() * this.colors.length)];\n };\n State.prototype.isWithinBoundary = function (x, y) {\n return x >= 0 && x < this.canvas.width && y >= 0 && y < this.canvas.height;\n };\n State.prototype.getNewEntry = function () {\n if (!this.seeds.length) {\n var x = Math.floor(Math.random() * this.canvas.width);\n var y = Math.floor(Math.random() * this.canvas.height);\n var angle = this.grid[x][y];\n if (angle > 10000) {\n angle = Math.floor(Math.random() * 360);\n this.grid[x][y] = angle;\n }\n return { x: x, y: y, angle: angle };\n }\n var randomIndex = Math.floor(Math.random() * this.seeds.length);\n var entry = this.seeds.splice(randomIndex, 1)[0];\n return {\n x: entry.x,\n y: entry.y,\n angle: this.grid[entry.x][entry.y]\n };\n };\n return State;\n}());\nexport default State;\n","// TS attempt of http://www.complexification.net/gallery/machines/substrate/index.php by laniaung.me\nimport State from \"./state\";\nimport { Analogous, Monochromatic, SplitComplementary, Square, Tetradic, Triadic } from \"./color-schemes\";\nvar Substrate = /** @class */ (function () {\n function Substrate(maxCracks, colors) {\n if (!(colors === null || colors === void 0 ? void 0 : colors.length))\n colors = [0x3a1e3e, 0x7c2d3b, 0xb94f3c, 0xf4a462, 0xf9c54e]; // https://colormagic.app/palette/671eeb6c42273fc4c1bb1ac7\n var canvas = document.createElement(\"canvas\");\n canvas.width = document.body.clientWidth;\n canvas.height = document.body.clientHeight;\n document.body.appendChild(canvas);\n this.state = new State(colors, maxCracks, canvas);\n this.init();\n }\n Substrate.prototype.init = function () {\n var me = this;\n var draw = function () {\n for (var _i = 0, _a = me.state.cracks; _i < _a.length; _i++) {\n var crack = _a[_i];\n crack.draw();\n }\n requestAnimationFrame(draw);\n };\n setInterval(function () { return me.state.init(me.getRandomColorScheme()); }, 30 * 1000);\n draw();\n };\n Substrate.prototype.getRandomColorScheme = function () {\n var color = Math.floor(Math.random() * Math.pow(256, 3));\n switch (Math.floor(Math.random() * 6)) {\n case 1:\n return new Monochromatic(color).colors;\n case 2:\n return new SplitComplementary(color).colors;\n case 3:\n return new Triadic(color).colors;\n case 4:\n return new Tetradic(color).colors;\n case 5:\n return new Square(color).colors;\n default:\n return new Analogous(color).colors;\n }\n };\n return Substrate;\n}());\nexport default Substrate;\n","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","import Substrate from \"./substrate\";\nvar ready = function (func) { return document.readyState !== \"loading\" ? func() : document.addEventListener(\"DOMContentLoaded\", func); };\nready(function () {\n new Substrate(20);\n});\n/*\nlet weather: Weather\nnavigator.geolocation.getCurrentPosition(position => {\n weather = new Weather(position.coords.latitude, position.coords.longitude)\n}, () => {\n weather = new Weather()\n})\n */ \n"],"names":[],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"main.js","mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,iBAAiB,SAAI,IAAI,SAAI;AAC7B;AACA;AACA,eAAe,gBAAgB,sCAAsC,kBAAkB;AACvF,8BAA8B;AAC9B;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwB;AACxB;AACA;AACA,CAAC;AACuB;AACxB;AACA;AACA,uBAAuB,4CAAG;AAC1B;AACA;AACA,wDAAwD,4BAA4B;AACpF;AACA;AACA;AACA,CAAC;AACiB;AAClB;AACA;AACA;AACA;AACA,wBAAwB,4CAAG;AAC3B,wBAAwB,4CAAG;AAC3B,yBAAyB,4CAAG;AAC5B,yBAAyB,4CAAG;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACoB;AACrB;AACA;AACA;AACA;AACA;AACA;AACA;AACA,gBAAgB,4CAAG;AACnB,gBAAgB,4CAAG;AACnB,gBAAgB,4CAAG;AACnB,gBAAgB,4CAAG;AACnB;AACA;AACA;AACA;AACA,CAAC;AACwB;AACzB;AACA;AACA;AACA;AACA,6BAA6B,4CAAG;AAChC;AACA;AACA,gBAAgB,4CAAG;AACnB,gBAAgB,4CAAG;AACnB;AACA;AACA;AACA;AACA,CAAC;AAC6B;AAC9B;AACA;AACA;AACA;AACA;AACA;AACA,gBAAgB,4CAAG;AACnB,gBAAgB,4CAAG;AACnB;AACA;AACA;AACA;AACA,CAAC;AACkB;AACnB;AACA;AACA;AACA;AACA,yBAAyB,4CAAG;AAC5B,6BAA6B,4CAAG;AAChC,mCAAmC,4CAAG;AACtC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACmB;AACpB;AACA;AACA;AACA;AACA,yBAAyB,4CAAG;AAC5B,wBAAwB,4CAAG;AAC3B,yBAAyB,4CAAG;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACiB;;;;;;;;;;;;;;;;AChIuB;AACzC;AACA;AACA;AACA;AACA;AACA;AACA,2BAA2B,qDAAW;AACtC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wCAAwC,YAAY;AACpD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACD,iEAAe,KAAK,EAAC;;;;;;;;;;;;;;;;AC9CG;AACxB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,2BAA2B,4CAAG;AAC9B;AACA;AACA,eAAe,4CAAG;AAClB;AACA;AACA,CAAC;AACD,iEAAe,GAAG,EAAC;;;;;;;;;;;;;;;AC7BnB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACD,iEAAe,GAAG,EAAC;;;;;;;;;;;;;;;AC/CnB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,0CAA0C;AAC1C;AACA,wBAAwB,YAAY;AACpC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACD,iEAAe,WAAW,EAAC;;;;;;;;;;;;;;;;ACxCC;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwB,WAAW;AACnC;AACA,4BAA4B,YAAY;AACxC;AACA;AACA;AACA,wBAAwB,OAAO;AAC/B;AACA;AACA;AACA,iCAAiC,8CAAK;AACtC;AACA;AACA;AACA;AACA;AACA;AACA;AACA,6BAA6B,8CAAK;AAClC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,qBAAqB;AACrB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACD,iEAAe,KAAK,EAAC;;;;;;;;;;;;;;;;;ACvErB;AAC4B;AAC8E;AAC1G;AACA;AACA;AACA,yEAAyE;AACzE;AACA;AACA;AACA;AACA,yBAAyB,8CAAK;AAC9B;AACA;AACA;AACA;AACA;AACA,mDAAmD,gBAAgB;AACnE;AACA;AACA;AACA;AACA;AACA,kCAAkC,kDAAkD;AACpF;AACA;AACA;AACA;AACA;AACA;AACA;AACA,6BAA6B,yDAAa;AAC1C;AACA;AACA,6BAA6B,8DAAkB;AAC/C;AACA;AACA,6BAA6B,mDAAO;AACpC;AACA;AACA,6BAA6B,oDAAQ;AACrC;AACA;AACA,6BAA6B,kDAAM;AACnC;AACA;AACA,6BAA6B,qDAAS;AACtC;AACA;AACA;AACA;AACA;AACA,CAAC;AACD,iEAAe,SAAS,EAAC;;;;;;;UCrDzB;UACA;;UAEA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;;UAEA;UACA;;UAEA;UACA;UACA;;;;;WCtBA;WACA;WACA;WACA;WACA,yCAAyC,wCAAwC;WACjF;WACA;WACA;;;;;WCPA;;;;;WCAA;WACA;WACA;WACA,uDAAuD,iBAAiB;WACxE;WACA,gDAAgD,aAAa;WAC7D;;;;;;;;;;;;ACNoC;AACpC,8BAA8B;AAC9B;AACA,QAAQ,kDAAS;AACjB,CAAC;AACD;AACA;AACA;AACA;AACA,CAAC;AACD;AACA,CAAC;AACD","sources":["webpack:///./src/color-schemes.ts","webpack:///./src/crack.ts","webpack:///./src/hsl.ts","webpack:///./src/rgb.ts","webpack:///./src/sand-painter.ts","webpack:///./src/state.ts","webpack:///./src/substrate.ts","webpack:///webpack/bootstrap","webpack:///webpack/runtime/define property getters","webpack:///webpack/runtime/hasOwnProperty shorthand","webpack:///webpack/runtime/make namespace object","webpack:///./src/launch.ts"],"sourcesContent":["var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n if (typeof b !== \"function\" && b !== null)\n throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport HSL from \"./hsl\";\nvar Scheme = /** @class */ (function () {\n function Scheme(initial) {\n this.primary = HSL.fromHex(initial);\n }\n Scheme.prototype.toString = function () {\n var values = this.colors.map(function (color) { return color.toString(16); }).join(\",\");\n return \"\".concat(this.constructor.name, \": \").concat(values);\n };\n return Scheme;\n}());\nexport { Scheme };\nvar Analogous = /** @class */ (function (_super) {\n __extends(Analogous, _super);\n function Analogous(initial) {\n var _this = _super.call(this, initial) || this;\n var left1 = new HSL(_this.primary.hue - 30, _this.primary.saturation, _this.primary.lightness);\n var left2 = new HSL(_this.primary.hue - 15, _this.primary.saturation, _this.primary.lightness);\n var right1 = new HSL(_this.primary.hue + 15, _this.primary.saturation, _this.primary.lightness);\n var right2 = new HSL(_this.primary.hue + 30, _this.primary.saturation, _this.primary.lightness);\n _this.colors = [\n left1.toHex(),\n left2.toHex(),\n initial,\n right1.toHex(),\n right2.toHex()\n ];\n return _this;\n }\n return Analogous;\n}(Scheme));\nexport { Analogous };\nvar Monochromatic = /** @class */ (function (_super) {\n __extends(Monochromatic, _super);\n function Monochromatic(initial) {\n var _this = _super.call(this, initial) || this;\n var delta = _this.primary.lightness / 6;\n _this.colors = [\n initial,\n new HSL(_this.primary.hue, _this.primary.saturation, _this.primary.lightness - delta).toHex(),\n new HSL(_this.primary.hue, _this.primary.saturation, _this.primary.lightness - delta * 2).toHex(),\n new HSL(_this.primary.hue, _this.primary.saturation, _this.primary.lightness - delta * 3).toHex(),\n new HSL(_this.primary.hue, _this.primary.saturation, _this.primary.lightness - delta * 4).toHex()\n ];\n return _this;\n }\n return Monochromatic;\n}(Scheme));\nexport { Monochromatic };\nvar SplitComplementary = /** @class */ (function (_super) {\n __extends(SplitComplementary, _super);\n function SplitComplementary(initial) {\n var _this = _super.call(this, initial) || this;\n var complement = new HSL((_this.primary.hue + 180) % 360, _this.primary.saturation, _this.primary.lightness);\n _this.colors = [\n initial,\n new HSL(complement.hue - 30, complement.saturation, complement.lightness).toHex(),\n new HSL(complement.hue + 30, complement.saturation, complement.lightness).toHex()\n ];\n return _this;\n }\n return SplitComplementary;\n}(Scheme));\nexport { SplitComplementary };\nvar Triadic = /** @class */ (function (_super) {\n __extends(Triadic, _super);\n function Triadic(initial) {\n var _this = _super.call(this, initial) || this;\n _this.colors = [\n initial,\n new HSL(_this.primary.hue - 120, _this.primary.saturation, _this.primary.lightness).toHex(),\n new HSL(_this.primary.hue + 120, _this.primary.saturation, _this.primary.lightness).toHex()\n ];\n return _this;\n }\n return Triadic;\n}(Scheme));\nexport { Triadic };\nvar Tetradic = /** @class */ (function (_super) {\n __extends(Tetradic, _super);\n function Tetradic(initial) {\n var _this = _super.call(this, initial) || this;\n var second = new HSL(_this.primary.hue + 45, _this.primary.saturation, _this.primary.lightness);\n var complement = new HSL(_this.primary.hue + 180, _this.primary.saturation, _this.primary.lightness);\n var secondComplement = new HSL(second.hue + 180, _this.primary.saturation, _this.primary.lightness);\n _this.colors = [\n initial,\n second.toHex(),\n complement.toHex(),\n secondComplement.toHex()\n ];\n return _this;\n }\n return Tetradic;\n}(Scheme));\nexport { Tetradic };\nvar Square = /** @class */ (function (_super) {\n __extends(Square, _super);\n function Square(initial) {\n var _this = _super.call(this, initial) || this;\n var second = new HSL(_this.primary.hue + 90, _this.primary.saturation, _this.primary.lightness);\n var third = new HSL(_this.primary.hue + 180, _this.primary.saturation, _this.primary.lightness);\n var fourth = new HSL(second.hue + 270, _this.primary.saturation, _this.primary.lightness);\n _this.colors = [\n initial,\n second.toHex(),\n third.toHex(),\n fourth.toHex()\n ];\n return _this;\n }\n return Square;\n}(Scheme));\nexport { Square };\n","import SandPainter from \"./sand-painter\";\nvar Crack = /** @class */ (function () {\n function Crack(state, x, y, angle) {\n this.x = 0;\n this.y = 0;\n this.angle = 0;\n this.state = state;\n this.painter = new SandPainter(this);\n this.start(x, y, angle);\n }\n Crack.prototype.start = function (x, y, angle) {\n this.x = x + .61 * Math.cos(angle * Math.PI / 180);\n this.y = y + .61 * Math.sin(angle * Math.PI / 180);\n var flip = Math.random() < 0.5;\n this.angle = angle + (90 + Math.floor(Math.random() * 4.1 - 2)) * (flip ? -1 : 1);\n };\n Crack.prototype.draw = function () {\n this.x += .42 * Math.cos(this.angle * Math.PI / 180);\n this.y += .42 * Math.sin(this.angle * Math.PI / 180);\n var fuzzX = this.x + (Math.random() * .66 - .33);\n var fuzzY = this.y + (Math.random() * .66 - .33);\n var context = this.state.canvas.getContext(\"2d\");\n context.fillStyle = \"#000\";\n context.fillRect(fuzzX, fuzzY, 1, 1);\n this.painter.render();\n var x = Math.floor(this.x);\n var y = Math.floor(this.y);\n if (this.state.isWithinBoundary(x, y)) {\n var angle = this.state.grid[x][y];\n if (angle > 10000) {\n this.state.grid[x][y] = Math.floor(this.angle);\n this.state.seeds.push({ x: x, y: y });\n }\n else if (this.state.grid[x][y] != Math.floor(this.angle)) {\n var entry = this.state.getNewEntry();\n this.start(entry.x, entry.y, entry.angle);\n }\n }\n else {\n var entry = this.state.getNewEntry();\n this.start(entry.x, entry.y, entry.angle);\n this.state.addCrack();\n }\n };\n return Crack;\n}());\nexport default Crack;\n","import RGB from \"./rgb\";\nvar HSL = /** @class */ (function () {\n function HSL(hue, saturation, lightness) {\n this.hue = (hue + 360) % 360;\n this.saturation = saturation;\n this.lightness = lightness;\n }\n // https://en.wikipedia.org/wiki/HSL_and_HSV\n HSL.fromRgb = function (rgb) {\n var redValue = rgb.red / 255, greenValue = rgb.green / 255, blueValue = rgb.blue / 255, max = Math.max(redValue, greenValue, blueValue), min = Math.min(redValue, greenValue, blueValue), chroma = max - min, lightness = .5 * (max + min), saturation = 1 - (3 / (redValue + greenValue + blueValue)) * Math.min(redValue, greenValue, blueValue);\n var huePrime = 0;\n if (chroma != 0) {\n if (redValue == max)\n huePrime = ((greenValue - blueValue) / chroma) % 6;\n else if (greenValue == max)\n huePrime = ((blueValue - redValue) / chroma) + 2;\n else\n huePrime = ((redValue - greenValue) / chroma) + 4;\n }\n return new HSL(huePrime * 60, saturation, lightness);\n };\n HSL.fromHex = function (color) {\n return HSL.fromRgb(RGB.fromHex(color));\n };\n HSL.prototype.toHex = function () {\n return RGB.fromHsl(this).toHex();\n };\n return HSL;\n}());\nexport default HSL;\n","var RGB = /** @class */ (function () {\n function RGB(red, green, blue) {\n this.red = Math.floor(red < 0 ? 0 : red > 255 ? 255 : red);\n this.green = Math.floor(green < 0 ? 0 : green > 255 ? 255 : green);\n this.blue = Math.floor(blue < 0 ? 0 : blue > 255 ? 255 : blue);\n }\n RGB.prototype.toHex = function () {\n return (this.red << 16) + (this.green << 8) + this.blue;\n };\n // https://en.wikipedia.org/wiki/HSL_and_HSV\n RGB.fromHsl = function (hsl) {\n var red = 0, green = 0, blue = 0;\n var chroma = (1 - Math.abs(2 * hsl.lightness - 1)) * hsl.saturation, range = hsl.hue / 60, intermediate = chroma * (1 - Math.abs(range % 2 - 1)), match = hsl.lightness - chroma / 2;\n if (range >= 0 && range < 1) {\n red = chroma;\n green = intermediate;\n }\n else if (range >= 1 && range < 2) {\n red = intermediate;\n green = chroma;\n }\n else if (range >= 2 && range < 3) {\n green = chroma;\n blue = intermediate;\n }\n else if (range >= 3 && range < 4) {\n green = intermediate;\n blue = chroma;\n }\n else if (range >= 4 && range < 5) {\n red = intermediate;\n blue = chroma;\n }\n else if (range >= 5 && range < 6) {\n red = chroma;\n blue = intermediate;\n }\n return new RGB((red + match) * 255, (green + match) * 255, (blue + match) * 255);\n };\n RGB.fromHex = function (color) {\n var red = color >> 16;\n var green = (color - (red << 16)) >> 8;\n var blue = color - (red << 16) - (green << 8);\n return new RGB(red, green, blue);\n };\n return RGB;\n}());\nexport default RGB;\n","var SandPainter = /** @class */ (function () {\n function SandPainter(crack) {\n this.crack = crack;\n this.color = this.crack.state.getNextColor();\n this.gain = Math.random() / 10;\n }\n SandPainter.prototype.render = function () {\n var state = this.crack.state, x = this.crack.x, y = this.crack.y, angle = this.crack.angle;\n var open = true, endX = x, endY = y;\n while (open) {\n endX += .81 * Math.sin(angle * Math.PI / 180);\n endY -= .81 * Math.cos(angle * Math.PI / 180);\n var gridX = Math.floor(endX);\n var gridY = Math.floor(endY);\n if (state.isWithinBoundary(gridX, gridY)) {\n open = state.grid[gridX][gridY] > 10000;\n }\n else {\n open = false;\n }\n }\n this.gain += (Math.random() / 10 - .05);\n if (this.gain < 0)\n this.gain = 0;\n if (this.gain > 1)\n this.gain = 1;\n var grains = 64;\n var hex = this.color.toString(16);\n var w = this.gain / (grains - 1); // some kind of multiplier\n var context = state.canvas.getContext(\"2d\");\n for (var i = 0; i < grains; i++) {\n var alpha = Math.floor((.1 - i / (grains * 10)) * 255);\n var paintX = x + (endX - x) * Math.sin(Math.sin(i * w));\n var paintY = y + (endY - y) * Math.sin(Math.sin(i * w));\n context.fillStyle = \"#\".concat(hex.padStart(6, \"0\")).concat(alpha.toString(16).padStart(2, \"0\"));\n context.fillRect(paintX, paintY, 1, 1);\n }\n };\n return SandPainter;\n}());\nexport default SandPainter;\n","import Crack from \"./crack\";\nvar State = /** @class */ (function () {\n function State(colors, maxCracks, canvas) {\n this.colorIndex = 0;\n this.canvas = canvas;\n this.maxCracks = maxCracks;\n this.grid = [];\n this.colors = colors;\n this.cracks = [];\n this.seeds = [];\n this.init();\n }\n State.prototype.init = function (colors) {\n if (colors)\n this.colors = colors;\n this.cracks.length = 0;\n this.grid.length = 0;\n this.seeds.length = 0;\n this.colorIndex = 0;\n var height = this.canvas.height;\n var width = this.canvas.width;\n var context = this.canvas.getContext(\"2d\");\n context.fillStyle = \"rgb(255 255 255 / 95%)\";\n context.fillRect(0, 0, width, height);\n for (var x = 0; x < width; x++) {\n this.grid[x] = [];\n for (var y = 0; y < height; y++) {\n this.grid[x][y] = 10001;\n }\n }\n for (var i = 0; i < 3; i++) {\n var x = Math.floor(Math.random() * width);\n var y = Math.floor(Math.random() * height);\n var angle = Math.floor(Math.random() * 360);\n this.cracks.push(new Crack(this, x, y, angle));\n this.grid[x][y] = angle;\n }\n };\n State.prototype.addCrack = function () {\n if (this.cracks.length >= this.maxCracks)\n return;\n var _a = this.getNewEntry(), x = _a.x, y = _a.y, angle = _a.angle;\n this.cracks.push(new Crack(this, x, y, angle));\n };\n State.prototype.getNextColor = function () {\n return this.colors[this.colorIndex++ % this.colors.length];\n };\n State.prototype.isWithinBoundary = function (x, y) {\n return x >= 0 && x < this.canvas.width && y >= 0 && y < this.canvas.height;\n };\n State.prototype.getNewEntry = function () {\n if (!this.seeds.length) {\n var x = Math.floor(Math.random() * this.canvas.width);\n var y = Math.floor(Math.random() * this.canvas.height);\n var angle = this.grid[x][y];\n if (angle > 10000) {\n angle = Math.floor(Math.random() * 360);\n this.grid[x][y] = angle;\n }\n return { x: x, y: y, angle: angle };\n }\n var randomIndex = Math.floor(Math.random() * this.seeds.length);\n var entry = this.seeds.splice(randomIndex, 1)[0];\n return {\n x: entry.x,\n y: entry.y,\n angle: this.grid[entry.x][entry.y]\n };\n };\n return State;\n}());\nexport default State;\n","// TS attempt of http://www.complexification.net/gallery/machines/substrate/index.php by laniaung.me\nimport State from \"./state\";\nimport { Analogous, Monochromatic, SplitComplementary, Square, Tetradic, Triadic } from \"./color-schemes\";\nvar Substrate = /** @class */ (function () {\n function Substrate(maxCracks, colors) {\n if (!(colors === null || colors === void 0 ? void 0 : colors.length))\n colors = [0x3a1e3e, 0x7c2d3b, 0xb94f3c, 0xf4a462, 0xf9c54e]; // https://colormagic.app/palette/671eeb6c42273fc4c1bb1ac7\n var canvas = document.createElement(\"canvas\");\n canvas.width = document.body.clientWidth;\n canvas.height = document.body.clientHeight;\n document.body.appendChild(canvas);\n this.state = new State(colors, maxCracks, canvas);\n this.init();\n }\n Substrate.prototype.init = function () {\n var me = this;\n var draw = function () {\n for (var _i = 0, _a = me.state.cracks; _i < _a.length; _i++) {\n var crack = _a[_i];\n crack.draw();\n }\n requestAnimationFrame(draw);\n };\n setInterval(function () { return me.state.init(me.getRandomColorScheme()); }, 120 * 1000);\n draw();\n };\n Substrate.prototype.getRandomColorScheme = function () {\n var color = Math.floor(Math.random() * Math.pow(256, 3));\n var scheme;\n switch (Math.floor(Math.random() * 6)) {\n case 1:\n scheme = new Monochromatic(color);\n break;\n case 2:\n scheme = new SplitComplementary(color);\n break;\n case 3:\n scheme = new Triadic(color);\n break;\n case 4:\n scheme = new Tetradic(color);\n break;\n case 5:\n scheme = new Square(color);\n break;\n default:\n scheme = new Analogous(color);\n }\n console.info(scheme.toString());\n return scheme.colors;\n };\n return Substrate;\n}());\nexport default Substrate;\n","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","import Substrate from \"./substrate\";\nvar ready = function (func) { return document.readyState !== \"loading\" ? func() : document.addEventListener(\"DOMContentLoaded\", func); };\nready(function () {\n new Substrate(20);\n});\n/*\nlet weather: Weather\nnavigator.geolocation.getCurrentPosition(position => {\n weather = new Weather(position.coords.latitude, position.coords.longitude)\n}, () => {\n weather = new Weather()\n})\n */ \n"],"names":[],"sourceRoot":""} \ No newline at end of file