Change default clipper config

This commit is contained in:
Nicolò P 2025-03-31 16:45:30 +02:00
parent ce3b17b683
commit aab30f48d4
3 changed files with 19 additions and 3 deletions

View File

@ -53,6 +53,8 @@ BIM.activateClipper = function () {
clipper.enabled = true; clipper.enabled = true;
clipper.create(this.world); clipper.create(this.world);
clipper.visible = true; clipper.visible = true;
clipper.config.color = new THREE.Color('#eaeaea');
clipper.config.size = 10;
BIM.clipper = clipper; BIM.clipper = clipper;
} }
/** /**

View File

@ -5,12 +5,18 @@ import BIM from '../bim.js';
export default class extends Controller { export default class extends Controller {
static targets = ['hex']; static targets = ['hex'];
/**
* @param {Event} event
*/
color(event) { color(event) {
let color = event.target.value; let color = event.target.value;
this.hexTarget.querySelector('span').textContent = color; this.hexTarget.querySelector('span').textContent = color;
BIM.clipper.config.color = new THREE.Color(color); BIM.clipper.config.color = new THREE.Color(color);
} }
/**
* @param {Event} event
*/
size(event) { size(event) {
BIM.clipper.config.size = event.target.value BIM.clipper.config.size = event.target.value
} }
@ -18,5 +24,13 @@ export default class extends Controller {
deleteAll() { deleteAll() {
BIM.clipper.deleteAll(); BIM.clipper.deleteAll();
} }
/**
* @todo Doesn't work...
* @param {Event} event
*/
toggle(event) {
BIM.clipper.enabled = event.target.value;
}
} }

View File

@ -62,13 +62,13 @@
<li class="menu-item"> <li class="menu-item">
Clipper Clipper
<ul class="menu-list"> <ul class="menu-list">
<li class="menu-item"><label class="checkbox">Attivo <input class="checkbox ml-2" id="clip-en" type="checkbox" checked></label></li> <li class="menu-item"><label class="checkbox">Attivo <input class="checkbox ml-2" data-action="change->clipper#toggle" type="checkbox" checked></label></li>
<li class="menu-item"> <li class="menu-item">
Colore piani Colore piani
<div class="mt-2 p-2 input is-small" data-clipper-target="hex"> <div class="mt-2 p-2 input is-small" data-clipper-target="hex">
<input type="color" data-action="input->clipper#color change->clipper#color" <input type="color" data-action="input->clipper#color change->clipper#color"
class="is-small is-clickable mr-2" aria-label="Colore clipper" value="#202932" style="border: none"> class="is-small is-clickable mr-2" aria-label="Colore clipper" value="#eaeaea" style="border: none">
<span>#202932</span> <span>#eaeaea</span>
</div> </div>
</li> </li>
<li class="menu-item"> <li class="menu-item">