moving-mondrian

Randomly generated animated images in the style of Piet Mondrian  https://p.ce9e.org/moving-mondrian/
git clone https://git.ce9e.org/moving-mondrian.git

commit
d40523e738f2b6a9fa3527b314dde7f8a1844328
parent
781c0e2525864550610007d6a3b0f9c88c2afa39
Author
Tobias Bengfort <tobias.bengfort@posteo.de>
Date
2025-01-16 12:25
rm easing_inverse

Diffstat

M mondrian.js 18 ++++++++----------

1 files changed, 8 insertions, 10 deletions


diff --git a/mondrian.js b/mondrian.js

@@ -34,10 +34,9 @@ var easing = function(x) {
   34    34 	return yy / easing_max / 2 + 0.5;
   35    35 };
   36    36 
   37    -1 var easing_inverse = function(y) {
   38    -1 	var yy = (y - 0.5) * 2 * easing_max;
   39    -1 	var xx = Math.atan(yy);
   40    -1 	return xx / easing_factor / Math.PI + 0.5;
   -1    37 var setPos = function(element, x) {
   -1    38 	element.style.setProperty("--pos-raw", x);
   -1    39 	element.style.setProperty("--pos", easing(x));
   41    40 };
   42    41 
   43    42 var animate = function(element, delta) {
@@ -46,15 +45,14 @@ var animate = function(element, delta) {
   46    45 			animate(element.children[i], delta);
   47    46 		}
   48    47 
   49    -1 		var pos = parseFloat(element.style.getPropertyValue("--pos"));
   50    -1 		var x = easing_inverse(pos);
   -1    48 		var x = parseFloat(element.style.getPropertyValue("--pos-raw"));
   51    49 		if (element.dataset.grow) {
   52    50 			x += delta / 1000 / 100 * speed;
   53    51 			if (x >= 1){
   54    52 				element.before(element.children[0]);
   55    53 				element.remove();
   56    54 			} else {
   57    -1 				element.style.setProperty("--pos", easing(x));
   -1    55 				setPos(element, x);
   58    56 			}
   59    57 		} else {
   60    58 			x -= delta / 1000 / 100 * speed;
@@ -62,7 +60,7 @@ var animate = function(element, delta) {
   62    60 				element.before(element.children[1]);
   63    61 				element.remove();
   64    62 			} else {
   65    -1 				element.style.setProperty("--pos", easing(x));
   -1    63 				setPos(element, x);
   66    64 			}
   67    65 		}
   68    66 	} else if (Math.random() < delta / 1000 * getRelSize(element)){
@@ -72,11 +70,11 @@ var animate = function(element, delta) {
   72    70 		element.before(div);
   73    71 		if (grow) {
   74    72 			div.dataset.grow = true;
   75    -1 			div.style.setProperty("--pos", 0);
   -1    73 			setPos(div, 0);
   76    74 			div.append(other);
   77    75 			div.append(element);
   78    76 		} else {
   79    -1 			div.style.setProperty("--pos", 1);
   -1    77 			setPos(div, 1);
   80    78 			div.append(element);
   81    79 			div.append(other);
   82    80 		}