Map / scene transition logic + config

js/main.js

@@ -1,4 +1,5 @@
 import Map from "./map.js";
+import Scene from "./scene.js";
 /*
 	Main js entry for ATON web-app
 
@@ -6,91 +7,14 @@ import Map from "./map.js";
 // Realize our app
 let APP = ATON.App.realize();
 
-const material = {
-    color: "#e6f2ff",
-    emissive: true,
-};
-
-APP.showEdges = function(object) {
-    const edgeMaterial = new THREE.MeshBasicMaterial({color: "#333"});
-    if (object.isMesh) {
-        let edges = new THREE.EdgesGeometry(object.geometry, 45);
-        let line = new THREE.LineSegments(edges, edgeMaterial);
-        object.add(line);
-
-        console.log(object);
-    }
-}
-
-/**
- * @param {String} id - The settings button id
- */
-APP.toggleSettingsPanel = function(id) {
-    const btn = document.querySelector(`#${id}`);
-
-    btn.addEventListener('click', () => {
-        ATON.UI.showSidePanel({header: '<i class="bi bi-gear-fill me-1"></i> Impostazioni'});
-    })
-}
-
-/**
- * @param {String} id - The back-to-map button id
- */
-APP.toggleScene = function(id) {
-    const btn = document.querySelector(`#${id}`);
-    const scene = document.querySelector('canvas');
-
-    btn.addEventListener('click', () => {
-        scene.classList.toggle('d-none');
-        document.querySelector('#map').classList.toggle('d-none');
-        Map.init('map');
-    });
-}
-
 // You can require here flares (plugins) if needed by the app
 //APP.requireFlares(["myFlare","anotherFlare"]);
 
 // APP.setup() is required for web-app initialization
 // You can place here UI setup (HTML), events handling, etc.
 APP.setup = ()=>{
-
-	// Realize base ATON and add base UI events
-    ATON.realize();
-    ATON.UI.addBasicEvents();
-    ATON.UI.init();
-    ATON.UI.setSidePanelLeft();
-
-    // Open settings side panel when clicking on btn
-    APP.toggleSettingsPanel('settings');
-    APP.toggleScene('back');
-
-    // All assets for this app are stored here
-    ATON.setPathCollection('./assets/');
-    // Light direction should be dynamic / user-defined
-    ATON.setMainLightDirection(new THREE.Vector3(0.2,-0.3,-0.7));
-
-    const rootUI = ATON.getRootUI();
-    rootUI.traverse(object => APP.showEdges(object));
-
-	// Load 3D model
-	let mainNode = ATON.createSceneNode("teatro").load("teatro_san_salvador_20250926.gltf");
-    // Panorama should be configurable and / or user-defined
-    const pano = "defsky-grass.jpg";
-    ATON.setMainPanorama(pano);
-    mainNode.setMaterial(new THREE.MeshPhongMaterial(material));
-    mainNode.setRotation(0, 1.5, 0)
-
-    //showEdges(mainNode.children[0]);
-    mainNode.attachToRoot();
-
-    ATON.toggleShadows(true);
-    ATON.setExposure(1.3);
-    
-    // If our app required ore or more flares (plugins), we can also wait for them to be ready for specific setups
-    ATON.on("AllFlaresReady",()=>{
-		// Do stuff
-		console.log("All flares ready");
-	});
+    Map.init('map');
+    Scene.toggleScene('back');
 };
 
 /* If you plan to use an update routine (executed continuously), you can place its logic here.