labuba

.gitmodules

@@ -0,0 +1,3 @@
+[submodule "simplex-noise.js"]
+	path = simplex-noise.js
+	url = https://github.com/jwagner/simplex-noise.js

README.md

@@ -3,7 +3,7 @@ The library for creating creepy sticky background
 
 ## Example
 ```html
-<canvas class="wrap"></canvas>
+<canvas id="wrap"></canvas>
 
 <svg style="position: absolute">
   <defs>
@@ -15,7 +15,7 @@ The library for creating creepy sticky background
 </svg>
 ```
 ```js
-import("/js/modules/gallery.mjs").then((module) => {
+import("/js/modules/womb3-simplex.mjs").then((module) => {
   // Initializing the instance
   const womb = new module.womb(document.getElementById("wrap"));
   womb.init();
@@ -39,6 +39,19 @@ import("/js/modules/gallery.mjs").then((module) => {
   }, true);
 });
 ```
+```css
+#wrap {
+  background-color: black; /* cool effects with changing the alpha channel */
+  filter: url("#blob") contrast(var(--contrast, 30));
+  /* mix-blend-mode: ... cool effects with this */
+}
+```
+
+## Installation
+```bash
+cd simplex-noise.js
+./build.sh
+```
 
 ## Demonstration
 ### [CodePen](https://codepen.io/mirzaev-sexy/pen/BaxQjYo)

simplex-noise.mjs

@@ -0,0 +1 @@
+simplex-noise.js/dist/esm/simplex-noise.js

womb3-simplex.mjs

@@ -1,4 +1,4 @@
-import * as noise from "https://cdn.skypack.dev/perlin.js@1.0.0";
+import * as noise from "./simplex-noise.mjs";
 
 ("use strict");
 
@@ -17,7 +17,9 @@ import * as noise from "https://cdn.skypack.dev/perlin.js@1.0.0";
  * @license http://www.wtfpl.net/ Do What The Fuck You Want To Public License
  * @author Arsen Mirzaev Tatyano-Muradovich <arsen@mirzaev.sexy>
  */
-export default class womb {
+export class womb {
+	noise = new noise.createNoise2D();
+
 	constructor(shell) {
 		if (typeof shell === "object") {
 			// Получены входные параметры
@@ -57,7 +59,7 @@ export default class womb {
 
 	clean(x, y, offset, to = 0, smooth = 0.3, ticks = 3) {
 		// Инициализация актуального значения альфа-канала
-		const alpha = 0.5 + noise.simplex2(x + offset, y + offset) / 2;
+		const alpha = 0.5 + this.noise(x + offset, y + offset) / 2;
 
 		// Запись в реестр
 		this.restricted.push({
@@ -81,9 +83,6 @@ export default class womb {
 		// Запись размеров полотна
 		this.shell.width = document.body.offsetWidth;
 		this.shell.height = document.body.offsetHeight;
-
-		// Генерация шума
-		// noise.seed(Math.random());
 	}
 
 	generate(offset = 0, color = "red") {
@@ -98,7 +97,7 @@ export default class womb {
 					x,
 					y,
 					color,
-					0.5 + noise.simplex2(x + offset, y + offset) / 2
+					0.5 + this.noise(x + offset, y + offset) / 2
 				);
 			}
 		}
@@ -112,7 +111,7 @@ export default class womb {
 				// Перебор строк
 
 				// Инициализация альфа-канала
-				let alpha = 0.5 + noise.simplex2(x + offset, y + offset) / 2;
+				let alpha = 0.5 + this.noise(x + offset, y + offset) / 2;
 
 				for (const i in this.restricted) {
 					// Перебор запрещённых блоков