Add exposure slider (not working?)

js/utils/environment.js

@@ -23,10 +23,10 @@ export function toggleAmbientOcclusion(isEnabled) {
     console.log('Ambient occlusion', isEnabled ? 'ON' : 'OFF');
 }
 /**
- * 
+ * Slider to change light direction, based on ATON.UI
  * @param {String} direction - The axis direction, one of 'x','y','z'
  * @param {String} label - The slider label
- * @param {Number[]} range - The slider's range
+ * @param {Array<Number>} range - The slider's range
  * @param {Number} step - The slider's step
  */
 export function createLightSlider(direction, label, range, step) {
@@ -52,4 +52,30 @@ export function createLightSlider(direction, label, range, step) {
     lightSlider.querySelector('input').step = step;
 
     return lightSlider;
+}
+/**
+ * Slider to change the env exposure level, based on ATON.UI
+ * @param {String} label - The slider label
+ * @param {Array<Number>} range - The slider's range
+ * @param {Number} step - The slider's step
+ */
+export function createExposureSlider(label, range, step = 0.2) {
+    const currentVal = AppState.exposure;
+
+    const exposureSlider = ATON.UI.createSlider({
+        range,
+        label,
+        value: Number.parseFloat(currentVal).toPrecision(2),
+        oninput: val => {
+            ATON.setExposure(val);
+            AppState.exposure = val;
+
+            console.debug(ATON.getExposure());
+        },
+    });
+
+    exposureSlider.classList.add('ms-4');
+    exposureSlider.querySelector('input').step = step;
+
+    return exposureSlider;
 }