Styling changes + tooltips and defaults
This commit is contained in:
@@ -1,3 +1,5 @@
|
||||
/** @import { Vector3 } from 'three' */
|
||||
|
||||
// Global ATON and THREE
|
||||
|
||||
import AppState from "../state.js";
|
||||
@@ -7,8 +9,7 @@ import AppState from "../state.js";
|
||||
*/
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {THREE.Vector3} vector - An object with x,y,z coordinates
|
||||
* @param {Vector3} vector - An object with x,y,z coordinates
|
||||
*/
|
||||
export function changeLightDirection(vector) {
|
||||
ATON.setMainLightDirection(vector);
|
||||
@@ -26,14 +27,12 @@ export function toggleAmbientOcclusion(isEnabled) {
|
||||
* 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, 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,
|
||||
@@ -48,19 +47,20 @@ export function createLightSlider(direction, label, range, step) {
|
||||
},
|
||||
});
|
||||
|
||||
lightSlider.classList.add('ms-4');
|
||||
lightSlider.querySelector('input').step = step;
|
||||
lightSlider.classList.add('ms-1');
|
||||
const input = lightSlider.querySelector('input');
|
||||
if (input) 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, number]} range - The slider's range
|
||||
* @param {Number} step - The slider's step
|
||||
*/
|
||||
export function createExposureSlider(label, range, step = 0.05) {
|
||||
const currentVal = AppState.exposure;
|
||||
const currentVal = String(AppState.exposure);
|
||||
|
||||
const exposureSlider = ATON.UI.createSlider({
|
||||
range,
|
||||
@@ -74,8 +74,9 @@ export function createExposureSlider(label, range, step = 0.05) {
|
||||
},
|
||||
});
|
||||
|
||||
exposureSlider.classList.add('ms-4');
|
||||
exposureSlider.querySelector('input').step = step;
|
||||
exposureSlider.classList.add('ms-1');
|
||||
let input = exposureSlider.querySelector('input');
|
||||
if (input) input.step = step;
|
||||
|
||||
return exposureSlider;
|
||||
}
|
||||
Reference in New Issue
Block a user