import{loadModule}from"@3ddv/dvm";// ---- LOADING MODULE ----loadModule("map_viewer",{container:"viewer-container",// Container where the viewer will be appended}).then(function(viewer){console.log(`Module '${viewer.getModuleName()}' initialized:`,viewer);start(viewer);}).catch(function(err){console.error(err);});functionstart(viewer){// ---- SUBSCRIPTIONS ----// "first_seen" will be called the first time a section is painted on the map at level 1 (close enough to show seats)viewer.subscribe("first_seen",onFirstSeen);// Called when user clicks the mapviewer.subscribe("click",onClick);// Called when cursor enters a nodeviewer.subscribe("enter",onEnter);// Called when cursor leaves a nodeviewer.subscribe("leave",onLeave);// Called when a node change its state to selectedviewer.subscribe("select",onSelect);// Called when a node leaves its state from selectedviewer.subscribe("onUnselect",onUnselect);// ---- LOADING MAP ----viewer.loadMap({venue_id:"eu-es-00008-default"// Venue to be loaded. 3ddigitalvenue will provide these IDs}).then(function(obj){// Successfully loaded// We disable automatic selection because we are going to manage it with some viewer callbacksviewer.flags.automatic_selection=false;// Node selection is limited to 1viewer.max_selection=1;// Get sections availabilityvaravailable_sections=getSectionAvailability();// Apply sections availabilityviewer.setAvailability("section",available_sections);console.log("LOADED!");}).catch(function(err){// Error while loadingconsole.error(err);});// ---- AVAILABILITY FUNCTIONS ----// Get sections availability. For the purpose, we generate a RANDOM availability.functiongetSectionAvailability(){varsections=viewer.getNodesByType("section");varavailable_sections=[];for(vari=0;i<sections.length;++i){varsection=sections[i];if(Math.random()<0.7){available_sections.push(section.id);}}returnavailable_sections;}}// ---- VIEWER CALLBACKS ----functiononClick(obj){varviewer=obj.instance;varnode=obj.nodes[0];// First, check if the click was made on a node (it can be triggered on empty space)if(node){console.log("Click:",node.id);// Check if is a seatif(node.type==="seat"){if(node.state==="available"){// If is available, unselect previous elements and select the new oneviewer.unselectAll();viewer.select(node);}elseif(node.state==="selected"){// If is already selected, unselect itviewer.unselect(node);}}}}functiononEnter(obj){varnode=obj.nodes[0];if(node){varlabel=document.getElementById("hover-text");if(label){label.innerText=node.id;}}}functiononLeave(obj){varlabel=document.getElementById("hover-text");if(label){label.innerText="none";}}functiononSelect(obj){varnode=obj.nodes[0];if(node){varlabel=document.getElementById("selected-text");if(label){label.innerText=node.id;}}}functiononUnselect(obj){varnode=obj.nodes[0];if(node){varlabel=document.getElementById("selected-text");if(label){label.innerText="none";}}}// Called when the viewer emits "first_seen"functiononFirstSeen(obj){varviewer=obj.instance;// Get the node or nodes affectedvarnodes=obj.nodes;for(vari=0;i<nodes.length;++i){varnode=nodes[i];console.log("first seen:",node.id);// Check if the node is available and is a sectionif(node&&node.state==="available"&&node.type==="section"){// Get all seats with this section as a parentvarseats=viewer.getNodesByParent(node);varavailable=[];// SET RANDOM SEAT AVAILABILITYfor(varj=0;j<seats.length;++j){varseat=seats[j];if(Math.random()<0.6){available.push(seat.id);}}delayAvailability(available,node.id);}}// Add a random timeout to see the effect on the map. This also simulates getting availability asynchronously on demand.functiondelayAvailability(availability,node_id){setTimeout(function(){viewer.setAvailability("seat",availability,node_id);},rand(250,1000));}}// ---- HELPERS ----functionrand(min,max){returnMath.floor(Math.random()*(max-min+1)+min);}