81 lines
2.2 KiB
JavaScript
81 lines
2.2 KiB
JavaScript
// Global ATON and THREE
|
|
|
|
import AppState from "../state.js";
|
|
|
|
/**
|
|
* @module Environment
|
|
*/
|
|
|
|
/**
|
|
*
|
|
* @param {THREE.Vector3} vector - An object with x,y,z coordinates
|
|
*/
|
|
export function changeLightDirection(vector) {
|
|
ATON.setMainLightDirection(vector);
|
|
}
|
|
|
|
/**
|
|
*
|
|
* @param {Boolean} isEnabled
|
|
*/
|
|
export function toggleAmbientOcclusion(isEnabled) {
|
|
ATON.FX.togglePass(ATON.FX.PASS_AO, 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 {Array<Number>} range - The slider's range
|
|
* @param {Number} step - The slider's step
|
|
*/
|
|
export function createLightSlider(direction, label, range, step) {
|
|
const currentVal = AppState.lightDirection[direction];
|
|
|
|
console.debug(currentVal);
|
|
|
|
const lightSlider = ATON.UI.createSlider({
|
|
range,
|
|
label,
|
|
value: Number.parseFloat(currentVal).toPrecision(2),
|
|
oninput: val => {
|
|
const lightDir = AppState.lightDirection;
|
|
|
|
// Keep existing direction values for the other axes
|
|
lightDir[direction] = Number.parseFloat(val);
|
|
changeLightDirection(lightDir);
|
|
AppState.lightDirection = lightDir;
|
|
},
|
|
});
|
|
|
|
lightSlider.classList.add('ms-4');
|
|
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;
|
|
} |