Doni/ModelHandle
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add side bar skeleton.

Browse Source
This commit is contained in:
kovacsv 2021-06-19 23:09:04 +02:00
parent 7b8cdb79a6
commit 50d733eba3
6 changed files with 38 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
tools/config.json
View File

@ -76,6 +76,7 @@
"website/o3dv/cookiedialog.js",
"website/o3dv/modeldata.js",
"website/o3dv/navigator.js",
"website/o3dv/sidebar.js",
"website/o3dv/hashhandler.js",
"website/o3dv/website.css",
"website/o3dv/loader.js",

1
website/embed.html
View File

@ -90,6 +90,7 @@
<script type="text/javascript" src="o3dv/cookiedialog.js"></script>
<script type="text/javascript" src="o3dv/modeldata.js"></script>
<script type="text/javascript" src="o3dv/navigator.js"></script>
<script type="text/javascript" src="o3dv/sidebar.js"></script>
<script type="text/javascript" src="o3dv/hashhandler.js"></script>
<link rel="stylesheet" type="text/css" href="o3dv/website.css">
<script type="text/javascript" src="o3dv/loader.js"></script>

4
website/index.html
View File

@ -90,6 +90,7 @@
<script type="text/javascript" src="o3dv/cookiedialog.js"></script>
<script type="text/javascript" src="o3dv/modeldata.js"></script>
<script type="text/javascript" src="o3dv/navigator.js"></script>
<script type="text/javascript" src="o3dv/sidebar.js"></script>
<script type="text/javascript" src="o3dv/hashhandler.js"></script>
<link rel="stylesheet" type="text/css" href="o3dv/website.css">
<script type="text/javascript" src="o3dv/loader.js"></script>
@ -111,6 +112,7 @@
mainDiv : $('#main'),
introDiv : $('#intro'),
navigatorDiv : $('#main_navigator'),
sidebarDiv : $('#main_sidebar'),
viewerDiv : $('#main_viewer'),
fileInput : $('#open_file')
});
@ -144,6 +146,8 @@
</div>
<div class="main_viewer" id="main_viewer">
</div>
<div class="main_sidebar only_full_width" id="main_sidebar">
</div>
</div>
<div class="intro ov_thin_scrollbar" id="intro">
<div class="intro_section only_full_width only_full_height"><img src="assets/images/3dviewer_net_logo.svg" class="intro_logo"></img></div>

9
website/o3dv/sidebar.js Normal file
View File

@ -0,0 +1,9 @@
OV.Sidebar = class
{
constructor (parentDiv)
{
this.parentDiv = parentDiv;
this.titleDiv = $('<div>').addClass ('ov_sidebar_title').addClass ('ov_thin_scrollbar').appendTo (parentDiv);
this.titleDiv.html ('Details');
}
};

19
website/o3dv/website.css
View File

@ -129,6 +129,14 @@ div.main_viewer
float: left;
}
div.main_sidebar
{
width: 240px;
margin: 10px 10px 10px 0px;
overflow: none;
float: right;
}
div.main_viewer canvas
{
margin: 10px;
@ -240,6 +248,17 @@ div.ov_navigator_info_panel img.ov_navigator_info_button_icon
float: right;
}
div.ov_sidebar_title
{
font-weight: bold;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
padding-bottom: 10px;
margin-bottom: 10px;
border-bottom: 1px solid #dddddd;
}
div.ov_tree_view
{
user-select: none;

5
website/o3dv/website.js
View File

@ -8,6 +8,7 @@ OV.Website = class
this.cookieHandler = new OV.CookieHandler ();
this.toolbar = new OV.Toolbar (this.parameters.toolbarDiv);
this.navigator = new OV.Navigator (this.parameters.navigatorDiv);
this.sidebar = new OV.Sidebar (this.parameters.sidebarDiv);
this.importSettings = new OV.ImportSettings ();
this.modelLoader = new OV.ThreeModelLoader ();
this.highlightMaterial = new THREE.MeshPhongMaterial ({
@ -49,13 +50,15 @@ OV.Website = class
let headerHeight = parseInt (this.parameters.headerDiv.outerHeight (true), 10);
let navigatorWidth = 0;
let sidebarWidth = 0;
let safetyMargin = 0;
if (!OV.IsSmallWidth ()) {
navigatorWidth = parseInt (this.parameters.navigatorDiv.outerWidth (true), 10);
sidebarWidth = parseInt (this.parameters.sidebarDiv.outerWidth (true), 10);
safetyMargin = 1;
}
let contentWidth = windowWidth - navigatorWidth - safetyMargin;
let contentWidth = windowWidth - navigatorWidth - sidebarWidth - safetyMargin;
let contentHeight = windowHeight - headerHeight - safetyMargin;
this.parameters.navigatorDiv.outerHeight (contentHeight, true);
this.parameters.introDiv.outerHeight (contentHeight, true);