From 4c5af75d66cb3132b28c50c2209e77f76815ebf7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nicol=C3=B2=20P=2E?= <nicolo.paraciani@cnr.it>
Date: Wed, 4 Dec 2024 09:21:40 +0100
Subject: [PATCH] Messing with the clipper

---
 bim.js     | 13 ++++++++++++-
 index.html |  4 ++--
 main.js    |  7 +++++--
 ui.js      |  3 ++-
 4 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/bim.js b/bim.js
index 3b97eda..7b81347 100644
--- a/bim.js
+++ b/bim.js
@@ -30,7 +30,6 @@ BIM.init = function (container) {
 }
 /**
  * @param {HTMLElement} container The scene container element
- * @returns {OBC.Components}
  */
 BIM.createScene = function (container) {
     this.init(container);
@@ -42,6 +41,18 @@ BIM.createScene = function (container) {
     // (zoom_level, position)
     this.world.camera.controls.setLookAt(15, 15, 15, 0, 0, 0);
 }
+/**
+ * @param {HTMLElement} container The scene container element
+ */
+BIM.activateClipper = function () {
+    const casters = this.components.get(OBC.Raycasters);
+    casters.get(this.world);
+    // Enable plane clipper
+    const clipper = this.components.get(OBC.Clipper);
+    clipper.enabled = true;
+    clipper.create(this.world);
+    clipper.visible = true;
+}
 /**
  * @todo Serve web-ifc.wasm locally via AJAX
  * @param {ArrayBuffer} buffer The uploaded IFC file 
diff --git a/index.html b/index.html
index f051a49..df2c0b7 100644
--- a/index.html
+++ b/index.html
@@ -35,7 +35,7 @@
 		<div class="column is-full">
 			<div id="scene"></div>
 			<div id="ui" data-theme="light">
-				<div class="file ml-4">
+				<div class="file ml-4 mt-4 is-link">
 					<label class="file-label">
 						<input class="file-input"
 							type="file"
@@ -51,7 +51,7 @@
 					</label>
 				</div>
 				<aside class="menu ml-4">
-					<p class="menu-label">Proprietà IFC (selezione)</p>
+					<p class="menu-label is-size-6">Proprietà IFC (selezione)</p>
 					<ul class="menu-list">
 						<li id="selected-prop"></li>
 					</ul>
diff --git a/main.js b/main.js
index 7daf832..eed3e31 100644
--- a/main.js
+++ b/main.js
@@ -1,8 +1,11 @@
 'use strict';
 
 import UI from './ui.js';
+import BIM from './bim.js';
 
 document.addEventListener('DOMContentLoaded', () => {
-    UI.setScene(document.querySelector('#scene'));
-    const model = UI.ifcLoader();
+    const container = document.querySelector('#scene');
+    UI.setScene(container);
+    const model = UI.ifcLoader(container);
+    container.ondblclick = () => BIM.activateClipper();
 });
\ No newline at end of file
diff --git a/ui.js b/ui.js
index 38dd062..50584fe 100644
--- a/ui.js
+++ b/ui.js
@@ -15,9 +15,10 @@ UI.setScene = function (container) {
 }
 /**
  * Returns the loaded model
+ * @param {HTMLElement} container The container element
  * @param {string} btnId The loading button's id
  */
-UI.ifcLoader = function (btnId = 'load-ifc') {
+UI.ifcLoader = function (container, btnId = 'load-ifc') {
     const loadBtn = document.querySelector(`#${btnId}`);
     let model = null;
     loadBtn.onchange = async function () {