Minor adjustments

WIP ontology tree in menu
Rename js to src
2026-06-10 09:24:42 +02:00 · 2026-06-10 09:18:03 +02:00 · 2026-05-21 13:25:17 +02:00 · 2026-05-21 13:19:11 +02:00
22 changed files with 3042 additions and 70 deletions
--- a/index.html
+++ b/index.html
@@ -51,7 +51,7 @@
    <script type="text/javascript" src="./vendor/leaflet/dist/leaflet-src.js"></script>

 	<!-- Main js entry -->
-	<script type="module" src="js/main.js"></script>
+	<script type="module" src="src/main.js"></script>
 </head>

 <body data-bs-theme="light">
--- a/js/ontology.js
+++ b/js/ontology.js
@@ -1,43 +0,0 @@
-/**
- * @module Ontology
- */
-
-/**
- * @todo Temporarily returns domains and ontology labels only
- * Traverse an ontology from its JSON description
- * @param {String} jsonPath The path (URI) of the ontology JSON file
- * @returns {Object}
- */
-export async function traverseOntology(jsonPath) {
-    const ontology = await loadOntology(jsonPath);
-    const domains = [];
-
-    for (const k of Object.keys(ontology)) {
-        if (k === 'domains') {
-            for (const domainKey of Object.keys(ontology[k])) {
-                domains.push({
-                    label: domainKey,
-                    child: ontology[k][domainKey][0].label,
-                });
-            }
-        }
-    }
-
-    return {
-        ontology: ontology.ontology,
-        domains
-    };
-}
-
-/**
- * Load an ontology from its JSON description
- * @param {String} jsonPath The path (URI) of the ontology JSON file
- * @returns {Object}
- */
-export async function loadOntology(jsonPath) {
-    const ontology = await fetch(jsonPath)
-        .then(res => res.json())
-        .catch(err => console.error(err));
-
-    return ontology;
-}
--- a/scenes/BaroqueTheatreOntology_BT_EN_v1_7_UI_by_domain_v3.json
+++ b/scenes/BaroqueTheatreOntology_BT_EN_v1_7_UI_by_domain_v3.json
--- a/scenes/salvador/index.js
+++ b/scenes/salvador/index.js
@@ -1,8 +1,8 @@
-import { openScene } from "../../js/scene.js";
+import { openScene } from "../../src/scene.js";
 import { config } from "../../config.js";
-import AppState from "../../js/state.js";
-import { normalizeNodes } from "../../js/utils/nodeUtils.js";
-import { initStimulus } from "../../js/utils/stimulus.js";
+import AppState from "../../src/state.js";
+import { normalizeNodes } from "../../src/utils/nodeUtils.js";
+import { initStimulus } from "../../src/utils/stimulus.js";

 initStimulus();

--- a/scenes/ssgp/index.html
+++ b/scenes/ssgp/index.html
@@ -73,6 +73,10 @@
                data-clipper-target="trigger" data-action="clipper#toggleClipper">
                <i class="bi bi-scissors"></i>
            </a>
+            <a class="btn aton-btn fs-5 p-1 text-white" title="Attiva schermo intero" data-toolbar-target="fullscreen"
+                data-action="toolbar#toggleFullscreen">
+                <i class="bi bi-fullscreen"></i>
+            </a>
        </div>
        <div class="d-none w-25
            position-absolute
--- a/scenes/ssgp/index.js
+++ b/scenes/ssgp/index.js
@@ -1,9 +1,9 @@
-import { openScene } from "../../js/scene.js";
+import { openScene } from "../../src/scene.js";
 import { config } from "../../config.js";
-import AppState from "../../js/state.js";
-import { normalizeNodes } from "../../js/utils/nodeUtils.js";
-import { initStimulus } from "../../js/utils/stimulus.js";
-import { initAtonEvents } from "../../js/utils/aton.js";
+import AppState from "../../src/state.js";
+import { normalizeNodes } from "../../src/utils/nodeUtils.js";
+import { initStimulus } from "../../src/utils/stimulus.js";
+import { initAtonEvents } from "../../src/utils/aton.js";

 initStimulus();

--- a/src/controllers/clipper_controller.js
+++ b/src/controllers/clipper_controller.js
--- a/src/controllers/menu_controller.js
+++ b/src/controllers/menu_controller.js
@@ -6,7 +6,7 @@ import { traverseOntology } from "../ontology.js";
 const html = String.raw;
 const domParser = new DOMParser;
 // TODO: hard-coded, but follows a convention...
-const ontologyJsonPath = location.pathname + 'ontology.json';
+const ontologyJsonPath = '/a/scaenae/scenes/BaroqueTheatreOntology_BT_EN_v1_7_UI_by_domain_v3.json';

 export default class extends Controller {
    static targets = ['trigger', 'layers', 'ontology'];
@@ -229,24 +229,26 @@ export default class extends Controller {
     * @param {HTMLElement} tab Tab content element
     */
    #buildOntologyMenu(ontology, tab) {
-        console.debug(ontology);
-
        const mainNode = tab.querySelector('#ontology-list');
-        mainNode.textContent = ontology.ontology;
-
-        let domainList = html`
-            <ul class="list-group mt-2" id="domains-list"></ul>
+        mainNode.innerHTML = html`
+            <span class="fs-5 fw-bold">${ontology.ontology}</span>
        `;
+        mainNode.classList.add('pb-3');

-        // Very fragile and ugly!!
-        mainNode.innerHTML += domainList;
-        domainList = tab.querySelector('#domains-list');
+        let domainList = document.createElement('div');

        for (let domain of ontology.domains) {
-            const domainItem = html`
-                <li class="list-group-item">${domain.label}</li>
-            `;
-            domainList.innerHTML += domainItem;
-        }
+            const domainItem = document.createElement('div');
+            domainItem.className = 'border-start border-bottom rounded';
+            domainItem.textContent = domain.label;
+            // Indentation...
+            domainItem.classList.add(`ms-${domain.depth}`, `ps-${domain.depth}`, 'py-2');
+
+            if (domain.depth === 1) domainItem.classList.add('fw-bold');
+
+            domainList.appendChild(domainItem);
+        }
+
+        mainNode.appendChild(domainList);
    }
 }
--- a/src/controllers/modal_controller.js
+++ b/src/controllers/modal_controller.js
--- a/src/controllers/settings_controller.js
+++ b/src/controllers/settings_controller.js
--- a/src/controllers/tabs_controller.js
+++ b/src/controllers/tabs_controller.js
--- a/src/controllers/toolbar_controller.js
+++ b/src/controllers/toolbar_controller.js
@@ -9,7 +9,7 @@ const panelHeader = html`
 `;

 export default class extends Controller {
-    static targets = ['settings'];
+    static targets = ['settings', 'fullscreen'];

    connect() {
        console.log('#toolbar controller connected');
@@ -23,6 +23,24 @@ export default class extends Controller {
        ATON.UI.showSidePanel({header: panelHeader});
        this.#buildSettingsPanel(ATON.UI.elSidePanel);
    }
+    toggleFullscreen() {
+        /**
+         * @type {HTMLAnchorElement}
+         */
+        const target = this.fullscreenTarget;
+        const icon = target.querySelector('i');
+        if (!document.fullscreenElement) {
+            document.body.requestFullscreen();
+            icon.classList.remove('bi-fullscreen');
+            icon.classList.add('bi-fullscreen-exit');
+            target.title = 'Esci da schermo intero';
+        } else {
+            document.exitFullscreen();
+            icon.classList.remove('bi-fullscreen-exit');
+            icon.classList.add('bi-fullscreen');
+            target.title = 'Attiva schermo intero';
+        }
+    }
    /**
     * Clone a <template> by id
     * @param {String} id
--- a/src/main.js
+++ b/src/main.js
--- a/src/map.js
+++ b/src/map.js
--- a/src/ontology.js
+++ b/src/ontology.js
@@ -0,0 +1,69 @@
+/**
+ * @module Ontology
+ */
+
+/**
+ * @todo Temporarily returns domains and ontology labels only
+ * Traverse an ontology from its JSON description
+ * @param {String} jsonPath The path (URI) of the ontology JSON file
+ * @returns {Object}
+ */
+export async function traverseOntology(jsonPath) {
+    const ontology = await loadOntology(jsonPath);
+    const modules = ontology.modules;
+
+    let tree = [];
+
+    for (const module of modules) {
+        if (module.id === 'Architecture') {
+            console.debug(module.classTrees);
+            for (const classTree of module.classTrees) {
+                traverseClasses(classTree, tree);
+            }
+        }
+    }
+
+    return {
+        ontology: "Architecture",
+        domains: tree
+    };
+}
+
+/**
+ * 
+ * @param {Object} ontologyClass 
+ * @param {Array<Object>} tree 
+ * @param {Number} depth
+ */
+function traverseClasses(ontologyClass, tree, depth = 1) {
+    const ontologyNode = {
+        id: ontologyClass.id,
+        label: ontologyClass.label,
+        depth,
+        children: [],
+    };
+
+    tree.push(ontologyNode);
+
+    if (ontologyClass.children && Array.isArray(ontologyClass.children)) {
+        for(const child of ontologyClass.children) {
+            ontologyNode.children.push(
+                traverseClasses(child, tree, depth + 1)
+            );
+        }
+    }
+
+}
+
+/**
+ * Load an ontology from its JSON description
+ * @param {String} jsonPath The path (URI) of the ontology JSON file
+ * @returns {Object}
+ */
+export async function loadOntology(jsonPath) {
+    const ontology = await fetch(jsonPath)
+        .then(res => res.json())
+        .catch(err => console.error(err));
+
+    return ontology;
+}
--- a/src/scene.js
+++ b/src/scene.js
--- a/src/state.js
+++ b/src/state.js
--- a/src/utils/aton.js
+++ b/src/utils/aton.js
--- a/src/utils/clipping.js
+++ b/src/utils/clipping.js
--- a/src/utils/environment.js
+++ b/src/utils/environment.js
--- a/src/utils/nodeUtils.js
+++ b/src/utils/nodeUtils.js
--- a/src/utils/stimulus.js
+++ b/src/utils/stimulus.js
Author	SHA1	Message	Date
Nicolò P.	28a34905c7	Minor adjustments	2026-06-10 09:24:42 +02:00
Nicolò P.	8aa3f7cde8	WIP ontology tree in menu	2026-06-10 09:18:03 +02:00
Nicolò P.	0c3a049d12	Rename js to src	2026-05-21 13:25:17 +02:00
Nicolò P.	3305e74776	Add fullscreen option	2026-05-21 13:19:11 +02:00