Rename menu to navigator.

This commit is contained in:
Viktor Kovacs 2021-06-10 07:38:15 +02:00
parent 0000c59fcd
commit cca1b44096
7 changed files with 67 additions and 67 deletions

View File

@ -74,7 +74,7 @@
"website/o3dv/quantitiesdialog.js",
"website/o3dv/modeldata.js",
"website/o3dv/info.js",
"website/o3dv/menu.js",
"website/o3dv/navigator.js",
"website/o3dv/hashhandler.js",
"website/o3dv/website.css",
"website/o3dv/loader.js",

View File

@ -88,7 +88,7 @@
<script type="text/javascript" src="o3dv/quantitiesdialog.js"></script>
<script type="text/javascript" src="o3dv/modeldata.js"></script>
<script type="text/javascript" src="o3dv/info.js"></script>
<script type="text/javascript" src="o3dv/menu.js"></script>
<script type="text/javascript" src="o3dv/navigator.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>

View File

@ -88,7 +88,7 @@
<script type="text/javascript" src="o3dv/quantitiesdialog.js"></script>
<script type="text/javascript" src="o3dv/modeldata.js"></script>
<script type="text/javascript" src="o3dv/info.js"></script>
<script type="text/javascript" src="o3dv/menu.js"></script>
<script type="text/javascript" src="o3dv/navigator.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>
@ -103,7 +103,7 @@
toolbarDiv : $('#toolbar'),
mainDiv : $('#main'),
introDiv : $('#intro'),
menuDiv : $('#main_menu'),
navigatorDiv : $('#main_navigator'),
viewerDiv : $('#main_viewer'),
fileInput : $('#open_file')
});
@ -133,7 +133,7 @@
<div class="toolbar" id="toolbar"></div>
</div>
<div class="main" id="main">
<div class="main_menu only_full_width" id="main_menu">
<div class="main_navigator only_full_width" id="main_navigator">
</div>
<div class="main_viewer" id="main_viewer">
</div>

View File

@ -13,15 +13,15 @@ OV.Selection = class
}
};
OV.Menu = class
OV.Navigator = class
{
constructor (parentDiv)
{
this.parentDiv = parentDiv;
this.callbacks = null;
this.titleDiv = $('<div>').addClass ('ov_menu_tree_title').addClass ('ov_thin_scrollbar').appendTo (parentDiv);
this.treeDiv = $('<div>').addClass ('ov_menu_tree_panel').addClass ('ov_thin_scrollbar').appendTo (parentDiv);
this.infoDiv = $('<div>').addClass ('ov_menu_info_panel').addClass ('ov_thin_scrollbar').appendTo (parentDiv);
this.titleDiv = $('<div>').addClass ('ov_navigator_tree_title').addClass ('ov_thin_scrollbar').appendTo (parentDiv);
this.treeDiv = $('<div>').addClass ('ov_navigator_tree_panel').addClass ('ov_thin_scrollbar').appendTo (parentDiv);
this.infoDiv = $('<div>').addClass ('ov_navigator_info_panel').addClass ('ov_thin_scrollbar').appendTo (parentDiv);
this.treeView = new OV.TreeView (this.treeDiv);
this.infoPanel = new OV.InfoPanel (this.infoDiv);
this.modelData = new OV.ModelData ();

View File

@ -28,7 +28,7 @@ OV.TreeViewButton = class
CreateDomElement (parentDiv)
{
this.domElement = $('<img>').addClass ('ov_tree_menu_item_button').appendTo (parentDiv);
this.domElement = $('<img>').addClass ('ov_tree_item_button').appendTo (parentDiv);
this.domElement.attr ('src', this.imagePath);
if (this.clickHandler !== null) {
this.domElement.click (this.clickHandler);
@ -57,12 +57,12 @@ OV.TreeViewItem = class
CreateMainElement (parentDiv)
{
this.mainElement = $('<div>').addClass ('ov_tree_menu_item').attr ('title', this.name).appendTo (parentDiv);
this.mainElement = $('<div>').addClass ('ov_tree_item').attr ('title', this.name).appendTo (parentDiv);
}
CreateNameElement ()
{
this.nameElement = $('<div>').addClass ('ov_tree_menu_item_name').html (this.name).appendTo (this.mainElement);
this.nameElement = $('<div>').addClass ('ov_tree_item_name').html (this.name).appendTo (this.mainElement);
}
};
@ -124,7 +124,7 @@ OV.TreeViewButtonItem = class extends OV.TreeViewSingleItem
{
this.CreateMainElement (parentDiv);
this.mainElement.addClass ('clickable');
let buttonContainer = $('<div>').addClass ('ov_tree_menu_item_button_container').appendTo (this.mainElement);
let buttonContainer = $('<div>').addClass ('ov_tree_item_button_container').appendTo (this.mainElement);
for (let i = 0; i < this.buttons.length; i++) {
let button = this.buttons[i];
button.CreateDomElement (buttonContainer);
@ -208,7 +208,7 @@ OV.TreeViewGroupItem = class extends OV.TreeViewItem
{
if (this.childrenDiv === null) {
let obj = this;
this.childrenDiv = $('<div>').addClass ('ov_tree_menu_children').insertAfter (this.mainElement);
this.childrenDiv = $('<div>').addClass ('ov_tree_view_children').insertAfter (this.mainElement);
this.mainElement.addClass ('clickable');
this.ShowChildren (this.showChildren, null);
this.mainElement.click (function (ev) {
@ -237,9 +237,9 @@ OV.TreeViewGroupItem = class extends OV.TreeViewItem
CreateDomElement (parentDiv)
{
this.CreateMainElement (parentDiv);
$('<img>').addClass ('ov_tree_menu_item_icon').attr ('src', this.iconPath).appendTo (this.mainElement);
let buttonContainer = $('<div>').addClass ('ov_tree_menu_item_button_container').appendTo (this.mainElement);
this.openCloseButton = $('<img>').addClass ('ov_tree_menu_item_button').attr ('src', this.openButtonPath).appendTo (buttonContainer);
$('<img>').addClass ('ov_tree_item_icon').attr ('src', this.iconPath).appendTo (this.mainElement);
let buttonContainer = $('<div>').addClass ('ov_tree_item_button_container').appendTo (this.mainElement);
this.openCloseButton = $('<img>').addClass ('ov_tree_item_button').attr ('src', this.openButtonPath).appendTo (buttonContainer);
this.CreateNameElement ();
}
};
@ -248,7 +248,7 @@ OV.TreeView = class
{
constructor (parentDiv)
{
this.mainDiv = $('<div>').addClass ('ov_tree_menu').appendTo (parentDiv);
this.mainDiv = $('<div>').addClass ('ov_tree_view').appendTo (parentDiv);
}
AddItem (item)

View File

@ -116,7 +116,7 @@ div.main
}
div.main_menu
div.main_navigator
{
width: 240px;
margin: 10px 0px 10px 10px;
@ -194,7 +194,7 @@ div.ov_toolbar div.ov_toolbar_separator
float: left;
}
div.ov_menu_tree_title
div.ov_navigator_tree_title
{
font-weight: bold;
white-space: nowrap;
@ -205,45 +205,45 @@ div.ov_menu_tree_title
border-bottom: 1px solid #dddddd;
}
div.ov_menu_tree_panel
div.ov_navigator_tree_panel
{
overflow: auto;
margin-bottom: 10px;
}
div.ov_menu_info_panel
div.ov_navigator_info_panel
{
overflow: auto;
border-top: 1px solid #dddddd;
}
div.ov_menu_info_panel div.ov_info_panel_main
div.ov_navigator_info_panel div.ov_info_panel_main
{
margin-top: 5px;
}
div.ov_menu_info_panel div.ov_info_panel_content
div.ov_navigator_info_panel div.ov_info_panel_content
{
padding: 5px 0px 0px 5px;
}
div.ov_menu_info_panel div.ov_info_box
div.ov_navigator_info_panel div.ov_info_box
{
margin-bottom: 10px;
overflow: auto;
}
div.ov_menu_info_panel div.ov_info_box_column
div.ov_navigator_info_panel div.ov_info_box_column
{
float: left;
}
div.ov_menu_info_panel div.ov_info_box_title
div.ov_navigator_info_panel div.ov_info_box_title
{
margin-bottom: 3px;
}
div.ov_menu_info_panel div.ov_info_box_content
div.ov_navigator_info_panel div.ov_info_box_content
{
font-weight: bold;
overflow: hidden;
@ -251,31 +251,31 @@ div.ov_menu_info_panel div.ov_info_box_content
white-space: nowrap;
}
div.ov_menu_info_panel div.ov_info_box_content_big
div.ov_navigator_info_panel div.ov_info_box_content_big
{
font-size: 21px;
font-weight: bold;
}
div.ov_menu_info_panel div.ov_info_box_details
div.ov_navigator_info_panel div.ov_info_box_details
{
font-size: 14px;
padding-left: 10px;
}
div.ov_menu_info_panel div.ov_info_box_row
div.ov_navigator_info_panel div.ov_info_box_row
{
padding: 2px 0px;
overflow: auto;
}
div.ov_menu_info_panel div.ov_info_box_row_name
div.ov_navigator_info_panel div.ov_info_box_row_name
{
width: 40%;
float: left;
}
div.ov_menu_info_panel div.ov_info_box_row_value
div.ov_navigator_info_panel div.ov_info_box_row_value
{
font-weight: bold;
overflow: hidden;
@ -283,7 +283,7 @@ div.ov_menu_info_panel div.ov_info_box_row_value
white-space: nowrap;
}
div.ov_menu_info_panel div.ov_info_box_rgbbox
div.ov_navigator_info_panel div.ov_info_box_rgbbox
{
width : 32px;
height: 16px;
@ -293,12 +293,12 @@ div.ov_menu_info_panel div.ov_info_box_rgbbox
float: left;
}
div.ov_menu_info_panel div.ov_info_box_rgbtext
div.ov_navigator_info_panel div.ov_info_box_rgbtext
{
font-size: 14px;
}
div.ov_menu_info_panel div.ov_info_box_button
div.ov_navigator_info_panel div.ov_info_box_button
{
cursor: pointer;
margin-top: 10px;
@ -307,13 +307,13 @@ div.ov_menu_info_panel div.ov_info_box_button
overflow: auto;
}
div.ov_menu_info_panel div.ov_info_box_button_text
div.ov_navigator_info_panel div.ov_info_box_button_text
{
padding: 5px;
float: left;
}
div.ov_menu_info_panel img.ov_info_box_button_icon
div.ov_navigator_info_panel img.ov_info_box_button_icon
{
width: 18px;
height: 18px;
@ -321,36 +321,36 @@ div.ov_menu_info_panel img.ov_info_box_button_icon
float: right;
}
div.ov_tree_menu
div.ov_tree_view
{
user-select: none;
}
div.ov_tree_menu div.ov_tree_menu_item
div.ov_tree_view div.ov_tree_item
{
overflow: auto;
border-radius: 5px;
padding-right: 5px;
}
div.ov_tree_menu div.ov_tree_menu_item.selected
div.ov_tree_view div.ov_tree_item.selected
{
background: #eeeeee;
font-weight: bold;;
}
div.ov_tree_menu div.ov_tree_menu_item.clickable
div.ov_tree_view div.ov_tree_item.clickable
{
cursor: pointer;
border-radius: 5px;
}
div.ov_tree_menu div.ov_tree_menu_item_button_container
div.ov_tree_view div.ov_tree_item_button_container
{
float: right;
}
div.ov_tree_menu img.ov_tree_menu_item_button
div.ov_tree_view img.ov_tree_item_button
{
width: 18px;
height: 18px;
@ -359,7 +359,7 @@ div.ov_tree_menu img.ov_tree_menu_item_button
cursor: pointer;
}
div.ov_tree_menu img.ov_tree_menu_item_icon
div.ov_tree_view img.ov_tree_item_icon
{
width: 18px;
height: 18px;
@ -367,7 +367,7 @@ div.ov_tree_menu img.ov_tree_menu_item_icon
float: left;
}
div.ov_tree_menu div.ov_tree_menu_item_name
div.ov_tree_view div.ov_tree_item_name
{
padding: 4px 5px;
overflow: hidden;
@ -375,7 +375,7 @@ div.ov_tree_menu div.ov_tree_menu_item_name
white-space: nowrap;
}
div.ov_tree_menu div.ov_tree_menu_children
div.ov_tree_view div.ov_tree_view_children
{
margin-left: 28px;
}
@ -727,12 +727,12 @@ div.ov_toolbar div.ov_toolbar_button_div:hover
background: #c9e5f8;
}
div.ov_tree_menu div.ov_tree_menu_item.clickable:hover
div.ov_tree_view div.ov_tree_item.clickable:hover
{
background: #e4f4ff;
}
div.ov_menu_info_panel div.ov_menu_info_panel_title:hover
div.ov_navigator_info_panel div.ov_navigator_info_panel_title:hover
{
background: #e4f4ff;
}
@ -747,7 +747,7 @@ div.ov_popup div.ov_popup_list_item:hover
background: #e4f4ff;
}
div.ov_menu_info_panel div.ov_info_box_button:hover
div.ov_navigator_info_panel div.ov_info_box_button:hover
{
background: #e4f4ff;
}

View File

@ -6,7 +6,7 @@ OV.Website = class
this.viewer = new OV.Viewer ();
this.hashHandler = new OV.HashHandler ();
this.toolbar = new OV.Toolbar (this.parameters.toolbarDiv);
this.menu = new OV.Menu (this.parameters.menuDiv);
this.navigator = new OV.Navigator (this.parameters.navigatorDiv);
this.importSettings = new OV.ImportSettings ();
this.modelLoader = new OV.ThreeModelLoader ();
this.highlightMaterial = new THREE.MeshPhongMaterial ({
@ -27,7 +27,7 @@ OV.Website = class
this.InitToolbar ();
this.InitDragAndDrop ();
this.InitModelLoader ();
this.InitMenu ();
this.InitNavigator ();
this.viewer.SetClickHandler (this.OnModelClicked.bind (this));
this.Resize ();
@ -46,19 +46,19 @@ OV.Website = class
let windowHeight = $(window).outerHeight ();
let headerHeight = parseInt (this.parameters.headerDiv.outerHeight (true), 10);
let menuWidth = 0;
let navigatorWidth = 0;
let safetyMargin = 0;
if (!OV.IsSmallWidth ()) {
menuWidth = parseInt (this.parameters.menuDiv.outerWidth (true), 10);
navigatorWidth = parseInt (this.parameters.navigatorDiv.outerWidth (true), 10);
safetyMargin = 1;
}
let contentWidth = windowWidth - menuWidth - safetyMargin;
let contentWidth = windowWidth - navigatorWidth - safetyMargin;
let contentHeight = windowHeight - headerHeight - safetyMargin;
this.parameters.menuDiv.outerHeight (contentHeight, true);
this.parameters.navigatorDiv.outerHeight (contentHeight, true);
this.parameters.introDiv.outerHeight (contentHeight, true);
this.menu.Resize ();
this.navigator.Resize ();
this.viewer.Resize (contentWidth, contentHeight);
}
@ -81,7 +81,7 @@ OV.Website = class
this.parameters.introDiv.hide ();
this.ShowViewer (false);
this.viewer.Clear ();
this.menu.Clear ();
this.navigator.Clear ();
}
OnModelFinished (importResult, threeMeshes)
@ -90,7 +90,7 @@ OV.Website = class
this.ShowViewer (true);
this.viewer.AddMeshes (threeMeshes);
this.viewer.SetUpVector (importResult.upVector, false);
this.menu.FillTree (importResult);
this.navigator.FillTree (importResult);
this.FitModelToWindow (true);
}
@ -99,12 +99,12 @@ OV.Website = class
if (button === 1) {
let meshUserData = this.viewer.GetMeshUserDataUnderMouse (mouseCoordinates);
if (meshUserData === null) {
this.menu.SetSelection (null);
this.navigator.SetSelection (null);
} else {
if (isCtrlPressed) {
this.menu.IsolateMesh (meshUserData.originalMeshIndex);
this.navigator.IsolateMesh (meshUserData.originalMeshIndex);
} else {
this.menu.SetSelection (new OV.Selection (OV.SelectionType.Mesh, meshUserData.originalMeshIndex));
this.navigator.SetSelection (new OV.Selection (OV.SelectionType.Mesh, meshUserData.originalMeshIndex));
}
}
}
@ -120,7 +120,7 @@ OV.Website = class
let obj = this;
let animation = !onLoad;
let boundingSphere = this.viewer.GetBoundingSphere (function (meshUserData) {
return obj.menu.IsMeshVisible (meshUserData.originalMeshIndex);
return obj.navigator.IsMeshVisible (meshUserData.originalMeshIndex);
});
if (onLoad) {
this.viewer.AdjustClippingPlanes (boundingSphere);
@ -140,13 +140,13 @@ OV.Website = class
{
let obj = this;
this.viewer.SetMeshesVisibility (function (meshUserData) {
return obj.menu.IsMeshVisible (meshUserData.originalMeshIndex);
return obj.navigator.IsMeshVisible (meshUserData.originalMeshIndex);
});
}
UpdateMeshesSelection ()
{
let selectedMeshIndex = this.menu.GetSelectedMeshIndex ();
let selectedMeshIndex = this.navigator.GetSelectedMeshIndex ();
this.viewer.SetMeshesHighlight (this.highlightMaterial, function (meshUserData) {
if (meshUserData.originalMeshIndex === selectedMeshIndex) {
return true;
@ -354,7 +354,7 @@ OV.Website = class
});
}
InitMenu ()
InitNavigator ()
{
function GetMeshUserData (viewer, meshIndex)
{
@ -478,7 +478,7 @@ OV.Website = class
}
let obj = this;
this.menu.Init ({
this.navigator.Init ({
openFileBrowserDialog : function () {
obj.OpenFileBrowserDialog ();
},