nicolo/ifc-web-app
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Some UI nonsense...

Browse Source
This commit is contained in:
Nicolò P 2024-05-27 22:24:07 +02:00
parent ca78ad8e8b
commit e019d1d419
3 changed files with 26 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
index.html
View File

@ -11,13 +11,15 @@
"three": "./vendor/three/build/three.module.js", "three": "./vendor/three/build/three.module.js",
"@thatopen/fragments": "./vendor/@thatopen/fragments/dist/index.mjs", "@thatopen/fragments": "./vendor/@thatopen/fragments/dist/index.mjs",
"web-ifc": "./vendor/web-ifc/web-ifc-api.js", "web-ifc": "./vendor/web-ifc/web-ifc-api.js",
"openbim-components": "./vendor/@thatopen/components/dist/index.mjs" "openbim-components": "./vendor/@thatopen/components/dist/index.mjs",
"lit": "./vendor/@lit-labs/ssr-dom-shim/index.js"
} }
} }
</script> </script>
<script src='main.js' type="module"></script> <script src='main.js' type="module"></script>
</head> </head>
<body> <body>
<div id="scene"></div> <div id="scene" style="min-height: 100vh;"></div>
<div id="ui" style="position: absolute; top: 2rem; min-width: 100vw; z-index: 5;"></div>
</body> </body>
</html> </html>

4
main.js
View File

@ -1,5 +1,6 @@
import * as THREE from 'three'; import * as THREE from 'three';
import * as OBC from 'openbim-components'; import * as OBC from 'openbim-components';
import UI from './ui.js';
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
const container = document.querySelector('#scene'); const container = document.querySelector('#scene');
@ -25,4 +26,7 @@ document.addEventListener('DOMContentLoaded', () => {
world.scene.setup(); world.scene.setup();
world.camera.controls.setLookAt(3, 3, 3, 0, 0, 0); world.camera.controls.setLookAt(3, 3, 3, 0, 0, 0);
UI.ifcLoader('ui');
}); });

18
ui.js Normal file
View File

@ -0,0 +1,18 @@
/**
* @namespace UI
*/
const UI = {};
/**
* @param {string} uiContainer The UI div's id
*/
UI.ifcLoader = function (uiContainer) {
const ui = document.querySelector(`#${uiContainer}`);
const loadBtn = `
<button style="padding: 10px; cursor: pointer; position: absolute; top: 0; right: 4rem">Apri IFC</button>
`;
ui.innerHTML += loadBtn;
};
export default UI;