From bb45f07e323536554aa66be367454e0a81806722 Mon Sep 17 00:00:00 2001 From: FiniteLooper Date: Sat, 29 Jul 2023 20:43:11 -0400 Subject: [PATCH] Adding controls for lighting - not totally working yet though --- src/index.html | 102 +++++++++++++++++++++++++++++++++++++++++++++---- src/script.js | 17 +++++++++ 2 files changed, 111 insertions(+), 8 deletions(-) diff --git a/src/index.html b/src/index.html index e8027e3..b3c29fb 100644 --- a/src/index.html +++ b/src/index.html @@ -198,9 +198,101 @@
Lighting
+ -->
@@ -425,14 +517,8 @@
- - + + { const isChecked = $enableInput.checked; $enableTargets.forEach((t) => (t.disabled = !isChecked)); + if ($enableInput.id === 'ctrl-enable-lighting') { + //special condition when enabling/disabling lighting + const $svgFilter = $('#noise-filter'); + if (isChecked) { + $svgFilter.appendChild(createLightingElement()); + } else { + $svgFilter.querySelector('feDiffuseLighting').remove(); + } + } + $enableTargets.forEach((t) => updateTexture(t, $outputDisplay, false)); }); @@ -128,6 +138,13 @@ function getPropsAsCssString(obj) { .join(' '); } +function createLightingElement() { + const diffuseLightingEl = document.createElement('feDiffuseLighting'); + diffuseLightingEl.setAttribute('in', 'noise'); //needs to match the `result` property on the `feTurbulence` element + diffuseLightingEl.appendChild(document.createElement('feDistantLight')); + return diffuseLightingEl; +} + //================================================ // Buttons //================================================