Skeleton side panel and toolbar
This commit is contained in:
parent
ae85cf281c
commit
dd18fdce3d
@ -51,7 +51,9 @@
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="toolbar" class="aton-toolbar-top"></div>
|
||||
<div id="toolbar" class="aton-toolbar-top">
|
||||
<a class="btn aton-btn" id="settings">Settings</a>
|
||||
</div>
|
||||
|
||||
<div class="aton-poweredby" >
|
||||
<a href="https://aton.ispc.cnr.it/site/" target="_blank"><img src="/res/aton-logo.png"></a>
|
||||
|
||||
19
js/main.js
19
js/main.js
@ -10,7 +10,7 @@ const material = {
|
||||
emissive: true,
|
||||
};
|
||||
|
||||
function showEdges (object) {
|
||||
APP.showEdges = function(object) {
|
||||
if (object.isMesh) {
|
||||
let edges = new THREE.EdgesGeometry(child.geometry, 45);
|
||||
let line = new THREE.LineSegments(edges, edgeMaterial);
|
||||
@ -18,6 +18,17 @@ function showEdges (object) {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {String} id - The settings button id
|
||||
*/
|
||||
APP.toggleSettingsPanel = function(id) {
|
||||
const btn = document.querySelector(`#${id}`);
|
||||
|
||||
btn.addEventListener('click', () => {
|
||||
ATON.UI.showSidePanel({header: 'Settings'});
|
||||
})
|
||||
}
|
||||
|
||||
// You can require here flares (plugins) if needed by the app
|
||||
//APP.requireFlares(["myFlare","anotherFlare"]);
|
||||
|
||||
@ -28,6 +39,12 @@ 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');
|
||||
|
||||
// All assets for this app are stored here
|
||||
ATON.setPathCollection('./assets/');
|
||||
ATON.setMainLightDirection(new THREE.Vector3(0.2,-0.3,-0.7));
|
||||
|
||||
Loading…
Reference in New Issue
Block a user