refreshed 2025

README.md

@@ -0,0 +1,47 @@
+# womb3-simplex.mjs
+The library for creating creepy sticky background
+
+## Example
+```html
+<canvas class="wrap"></canvas>
+
+<svg style="position: absolute">
+  <defs>
+    <filter id="blob">
+      <feGaussianBlur in="SourceGraphic" stdDeviation="12" result="blur"></feGaussianBlur>
+      <feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 19 -9" result="blob"></feColorMatrix>
+    </filter>
+  </defs>
+</svg>
+```
+```js
+import("/js/modules/gallery.mjs").then((module) => {
+  // Initializing the instance
+  const womb = new module.womb(document.getElementById("wrap"));
+  womb.init();
+  womb.generate();
+        
+  // Initializing the process registers
+  let offset = 0;
+  let speed = 0.01;
+
+  // Starting the process
+  setInterval(function() {
+    womb.dump();
+    womb.generate(offset += speed);
+  }, 30);
+
+  // Initializing the resizing event processor
+  window.addEventListener('resize', function(e) {
+    womb.init();
+    womb.dump();
+    womb.generate(offset += speed);
+  }, true);
+});
+```
+
+## Demonstration
+### [CodePen](https://codepen.io/mirzaev-sexy/pen/BaxQjYo)
+<br>
+
+![Demonstration gid](assets/1.gif)

womb3-simplex.js

@@ -1,11 +1,23 @@
 import * as noise from "https://cdn.skypack.dev/perlin.js@1.0.0";
 
-"use strict";
+("use strict");
 
 /**
+ * @name womb3-simplex.mjs
+ *
+ * @description
+ * The library for creating creepy sticky background
+ *
+ * @class
+ * @public
+ *
+ * {@link https://git.svoboda.works/mirzaev/womb3-simplex.mjs}
+ * {@link https://codepen.io/mirzaev-sexy/pen/BaxQjYo}
+ *
+ * @license http://www.wtfpl.net/ Do What The Fuck You Want To Public License
  * @author Arsen Mirzaev Tatyano-Muradovich <arsen@mirzaev.sexy>
  */
-class womb {
+export default class womb {
 	constructor(shell) {
 		if (typeof shell === "object") {
 			// Получены входные параметры
@@ -27,7 +39,7 @@ class womb {
 
 	block = {
 		width: 28,
-    height: 28
+		height: 28,
 	};
 
 	draw(x, y, color = "red", alpha) {
@@ -56,7 +68,7 @@ class womb {
 			to,
 			smooth,
 			limit: ticks,
-      ticks: 0
+			ticks: 0,
 		});
 	}
 
@@ -74,7 +86,7 @@ class womb {
 		// noise.seed(Math.random());
 	}
 
-  generate(offset = 0, color = 'red') {
+	generate(offset = 0, color = "red") {
 		for (let y = 0; y < this.shell.height; y += this.block.height) {
 			// Перебор колонок
 
@@ -92,7 +104,7 @@ class womb {
 		}
 	}
 
-  interactive(offset = 0, color = 'red') {
+	interactive(offset = 0, color = "red") {
 		for (let y = 0; y < this.shell.height; y += this.block.height) {
 			// Перебор колонок
 
@@ -134,7 +146,10 @@ class womb {
 						} else {
 							// Плавный переход
 
-              if (block.ticks < block.limit && block.alpha - block.smooth > block.to) {
+							if (
+								block.ticks < block.limit &&
+								block.alpha - block.smooth > block.to
+							) {
 								// Процесс "затухание"
 
 								// Запись нового значения альфа-канала
@@ -156,7 +171,10 @@ class womb {
 								} else {
 									// Завершён процесс "ожидание"
 
-                  if (block.ticks >= block.limit && block.alpha + block.smooth < block.from) {
+									if (
+										block.ticks >= block.limit &&
+										block.alpha + block.smooth < block.from
+									) {
 										// Процесс "появление"
 
 										// Запись нового значения альфа-канала
@@ -187,6 +205,6 @@ class womb {
 
 document.dispatchEvent(
 	new CustomEvent("womb.loaded", {
-    detail: { womb }
+		detail: { womb },
 	})
 );