mirror of
https://github.com/HifiExperiments/overte.git
synced 2025-05-06 21:18:36 +02:00
remove separate new entity list with option, fix row clicking
This commit is contained in:
David Back
parent
729e857aa2
commit
0a67c49ef9
7 changed files with 356 additions and 967 deletions
|
|
@ -1,15 +0,0 @@
|
||||||
import QtQuick 2.7
|
|
||||||
import QtQuick.Controls 2.2
|
|
||||||
import QtWebChannel 1.0
|
|
||||||
import "../../controls"
|
|
||||||
import "../toolbars"
|
|
||||||
import QtGraphicalEffects 1.0
|
|
||||||
import "../../controls-uit" as HifiControls
|
|
||||||
import "../../styles-uit"
|
|
||||||
|
|
||||||
|
|
||||||
WebView {
|
|
||||||
id: entityListToolWebView
|
|
||||||
url: Paths.defaultScripts + "/system/html/entityListNew.html"
|
|
||||||
enabled: true
|
|
||||||
}
|
|
||||||
|
|
@ -156,7 +156,6 @@ var MENU_AUTO_FOCUS_ON_SELECT = "Auto Focus on Select";
|
||||||
var MENU_EASE_ON_FOCUS = "Ease Orientation on Focus";
|
var MENU_EASE_ON_FOCUS = "Ease Orientation on Focus";
|
||||||
var MENU_SHOW_LIGHTS_AND_PARTICLES_IN_EDIT_MODE = "Show Lights and Particle Systems in Create Mode";
|
var MENU_SHOW_LIGHTS_AND_PARTICLES_IN_EDIT_MODE = "Show Lights and Particle Systems in Create Mode";
|
||||||
var MENU_SHOW_ZONES_IN_EDIT_MODE = "Show Zones in Create Mode";
|
var MENU_SHOW_ZONES_IN_EDIT_MODE = "Show Zones in Create Mode";
|
||||||
var MENU_USE_NEW_ENTITY_LIST = "Use New Entity List";
|
|
||||||
|
|
||||||
var MENU_CREATE_ENTITIES_GRABBABLE = "Create Entities As Grabbable (except Zones, Particles, and Lights)";
|
var MENU_CREATE_ENTITIES_GRABBABLE = "Create Entities As Grabbable (except Zones, Particles, and Lights)";
|
||||||
var MENU_ALLOW_SELECTION_LARGE = "Allow Selecting of Large Models";
|
var MENU_ALLOW_SELECTION_LARGE = "Allow Selecting of Large Models";
|
||||||
|
|
@ -167,7 +166,6 @@ var SETTING_AUTO_FOCUS_ON_SELECT = "autoFocusOnSelect";
|
||||||
var SETTING_EASE_ON_FOCUS = "cameraEaseOnFocus";
|
var SETTING_EASE_ON_FOCUS = "cameraEaseOnFocus";
|
||||||
var SETTING_SHOW_LIGHTS_AND_PARTICLES_IN_EDIT_MODE = "showLightsAndParticlesInEditMode";
|
var SETTING_SHOW_LIGHTS_AND_PARTICLES_IN_EDIT_MODE = "showLightsAndParticlesInEditMode";
|
||||||
var SETTING_SHOW_ZONES_IN_EDIT_MODE = "showZonesInEditMode";
|
var SETTING_SHOW_ZONES_IN_EDIT_MODE = "showZonesInEditMode";
|
||||||
var SETTING_USE_NEW_ENTITY_LIST = "useNewEntityList";
|
|
||||||
|
|
||||||
var SETTING_EDIT_PREFIX = "Edit/";
|
var SETTING_EDIT_PREFIX = "Edit/";
|
||||||
|
|
||||||
|
|
@ -873,11 +871,8 @@ var toolBar = (function () {
|
||||||
tablet.gotoHomeScreen();
|
tablet.gotoHomeScreen();
|
||||||
}
|
}
|
||||||
UserActivityLogger.enabledEdit();
|
UserActivityLogger.enabledEdit();
|
||||||
entityListTool.setUseNewEntityList(Menu.isOptionChecked(MENU_USE_NEW_ENTITY_LIST));
|
|
||||||
entityListTool.setVisible(true);
|
entityListTool.setVisible(true);
|
||||||
if (!Menu.isOptionChecked(MENU_USE_NEW_ENTITY_LIST)) {
|
|
||||||
entityListTool.sendUpdate();
|
entityListTool.sendUpdate();
|
||||||
}
|
|
||||||
gridTool.setVisible(true);
|
gridTool.setVisible(true);
|
||||||
grid.setEnabled(true);
|
grid.setEnabled(true);
|
||||||
propertiesTool.setVisible(true);
|
propertiesTool.setVisible(true);
|
||||||
|
|
@ -1354,13 +1349,6 @@ function setupModelMenus() {
|
||||||
isCheckable: true,
|
isCheckable: true,
|
||||||
isChecked: Settings.getValue(SETTING_SHOW_ZONES_IN_EDIT_MODE) !== "false"
|
isChecked: Settings.getValue(SETTING_SHOW_ZONES_IN_EDIT_MODE) !== "false"
|
||||||
});
|
});
|
||||||
Menu.addMenuItem({
|
|
||||||
menuName: "Edit",
|
|
||||||
menuItemName: MENU_USE_NEW_ENTITY_LIST,
|
|
||||||
afterItem: MENU_SHOW_ZONES_IN_EDIT_MODE,
|
|
||||||
isCheckable: true,
|
|
||||||
isChecked: Settings.getValue(SETTING_USE_NEW_ENTITY_LIST, false)
|
|
||||||
});
|
|
||||||
|
|
||||||
Entities.setLightsArePickable(false);
|
Entities.setLightsArePickable(false);
|
||||||
}
|
}
|
||||||
|
|
@ -1399,7 +1387,6 @@ Script.scriptEnding.connect(function () {
|
||||||
Settings.setValue(SETTING_EASE_ON_FOCUS, Menu.isOptionChecked(MENU_EASE_ON_FOCUS));
|
Settings.setValue(SETTING_EASE_ON_FOCUS, Menu.isOptionChecked(MENU_EASE_ON_FOCUS));
|
||||||
Settings.setValue(SETTING_SHOW_LIGHTS_AND_PARTICLES_IN_EDIT_MODE, Menu.isOptionChecked(MENU_SHOW_LIGHTS_AND_PARTICLES_IN_EDIT_MODE));
|
Settings.setValue(SETTING_SHOW_LIGHTS_AND_PARTICLES_IN_EDIT_MODE, Menu.isOptionChecked(MENU_SHOW_LIGHTS_AND_PARTICLES_IN_EDIT_MODE));
|
||||||
Settings.setValue(SETTING_SHOW_ZONES_IN_EDIT_MODE, Menu.isOptionChecked(MENU_SHOW_ZONES_IN_EDIT_MODE));
|
Settings.setValue(SETTING_SHOW_ZONES_IN_EDIT_MODE, Menu.isOptionChecked(MENU_SHOW_ZONES_IN_EDIT_MODE));
|
||||||
Settings.setValue(SETTING_USE_NEW_ENTITY_LIST, Menu.isOptionChecked(MENU_USE_NEW_ENTITY_LIST));
|
|
||||||
|
|
||||||
Settings.setValue(SETTING_EDIT_PREFIX + MENU_CREATE_ENTITIES_GRABBABLE, Menu.isOptionChecked(MENU_CREATE_ENTITIES_GRABBABLE));
|
Settings.setValue(SETTING_EDIT_PREFIX + MENU_CREATE_ENTITIES_GRABBABLE, Menu.isOptionChecked(MENU_CREATE_ENTITIES_GRABBABLE));
|
||||||
Settings.setValue(SETTING_EDIT_PREFIX + MENU_ALLOW_SELECTION_LARGE, Menu.isOptionChecked(MENU_ALLOW_SELECTION_LARGE));
|
Settings.setValue(SETTING_EDIT_PREFIX + MENU_ALLOW_SELECTION_LARGE, Menu.isOptionChecked(MENU_ALLOW_SELECTION_LARGE));
|
||||||
|
|
|
||||||
|
|
@ -14,6 +14,7 @@
|
||||||
<script type="text/javascript" src="qrc:///qtwebchannel/qwebchannel.js"></script>
|
<script type="text/javascript" src="qrc:///qtwebchannel/qwebchannel.js"></script>
|
||||||
<script type="text/javascript" src="js/eventBridgeLoader.js"></script>
|
<script type="text/javascript" src="js/eventBridgeLoader.js"></script>
|
||||||
<script type="text/javascript" src="js/spinButtons.js"></script>
|
<script type="text/javascript" src="js/spinButtons.js"></script>
|
||||||
|
<script type="text/javascript" src="js/listView.js"></script>
|
||||||
<script type="text/javascript" src="js/entityList.js"></script>
|
<script type="text/javascript" src="js/entityList.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body onload='loaded();'>
|
<body onload='loaded();'>
|
||||||
|
|
|
||||||
|
|
@ -1,102 +0,0 @@
|
||||||
<!--
|
|
||||||
// entityList.html
|
|
||||||
//
|
|
||||||
// Created by Ryan Huffman on 19 Nov 2014
|
|
||||||
// Copyright 2014 High Fidelity, Inc.
|
|
||||||
//
|
|
||||||
// Distributed under the Apache License, Version 2.0.
|
|
||||||
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
|
|
||||||
-->
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<link rel="stylesheet" type="text/css" href="css/edit-style.css">
|
|
||||||
<script src="js/list.min.js"></script>
|
|
||||||
<script type="text/javascript" src="qrc:///qtwebchannel/qwebchannel.js"></script>
|
|
||||||
<script type="text/javascript" src="js/eventBridgeLoader.js"></script>
|
|
||||||
<script type="text/javascript" src="js/spinButtons.js"></script>
|
|
||||||
<script type="text/javascript" src="js/listView.js"></script>
|
|
||||||
<script type="text/javascript" src="js/entityListNew.js"></script>
|
|
||||||
</head>
|
|
||||||
<body onload='loaded();'>
|
|
||||||
<div id="entity-list-header">
|
|
||||||
<input type="button" class="glyph" id="refresh" value="F" />
|
|
||||||
<div>
|
|
||||||
<input type="button" id="locked" class="glyph" value="" />
|
|
||||||
<input type="button" id="visible" class="glyph" value="" />
|
|
||||||
</div>
|
|
||||||
<input type="button" id="export" value="Export Selection" />
|
|
||||||
<input type="button" id="pal" class="glyph" value="" />
|
|
||||||
<input type="button" class="red" id="delete" value="Delete" />
|
|
||||||
</div>
|
|
||||||
<div id="entity-list">
|
|
||||||
<div id="search-area">
|
|
||||||
<span class="icon-input"><input type="text" class="search" id="filter" placeholder="Filter" /><span>Y</span></span>
|
|
||||||
<input type="button" id="in-view" class="glyph" value="" />
|
|
||||||
<div id="radius-and-unit" class="number">
|
|
||||||
<label for="radius">Search radius <span class="unit">m</span></label>
|
|
||||||
<input type="number" id="radius" value="100" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div id="entity-table-scroll">
|
|
||||||
<table id="entity-table">
|
|
||||||
<colgroup>
|
|
||||||
<col span="1" id="col-type" />
|
|
||||||
<col span="1" id="col-name" />
|
|
||||||
<col span="1" id="col-url" />
|
|
||||||
<col span="1" id="col-locked" />
|
|
||||||
<col span="1" id="col-visible" />
|
|
||||||
<col span="1" id="col-verticesCount" />
|
|
||||||
<col span="1" id="col-texturesCount" />
|
|
||||||
<col span="1" id="col-texturesSize" />
|
|
||||||
<col span="1" id="col-hasTransparent" />
|
|
||||||
<col span="1" id="col-isBaked" />
|
|
||||||
<col span="1" id="col-drawCalls" />
|
|
||||||
<col span="1" id="col-hasScript" />
|
|
||||||
</colgroup>
|
|
||||||
<thead id="entity-table-header">
|
|
||||||
<tr>
|
|
||||||
<th id="entity-type">Type<span class="sort-order"></span><span id="info-toggle"><span class="glyph">D</span></span></th>
|
|
||||||
<th id="entity-name">Name<span class="sort-order"></span></th>
|
|
||||||
<th id="entity-url">File<span class="sort-order"></span></th>
|
|
||||||
<th id="entity-locked"><span class="glyph"></span><span class="sort-order"></span></th>
|
|
||||||
<th id="entity-visible"><span class="glyph"></span><span class="sort-order"></span></th>
|
|
||||||
<th id="entity-verticesCount">Verts<span class="sort-order"></span></th>
|
|
||||||
<th id="entity-texturesCount">Texts<span class="sort-order"></span></th>
|
|
||||||
<th id="entity-texturesSize">Text MB<span class="sort-order"></span></th>
|
|
||||||
<th id="entity-hasTransparent"><span class="glyph"></span><span class="sort-order"></span></th>
|
|
||||||
<th id="entity-isBaked">Baked<span class="sort-order"></span></th>
|
|
||||||
<th id="entity-drawCalls">Draws<span class="sort-order"></span></th>
|
|
||||||
<th colspan="1" id="entity-hasScript"><span class="glyph">k</span><span class="sort-order"></span></th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody class="list" id="entity-table-body">
|
|
||||||
<tr>
|
|
||||||
<td class="type"></td>
|
|
||||||
<td class="name"></td>
|
|
||||||
<td class="url"><div class='outer'><div class='inner'></div></div></td>
|
|
||||||
<td class="locked glyph"></td>
|
|
||||||
<td class="visible glyph"></td>
|
|
||||||
<td class="verticesCount"></td>
|
|
||||||
<td class="texturesCount"></td>
|
|
||||||
<td class="texturesSize"></td>
|
|
||||||
<td class="hasTransparent glyph"></td>
|
|
||||||
<td class="isBaked glyph"></td>
|
|
||||||
<td class="drawCalls"></td>
|
|
||||||
<td class="hasScript glyph"></td>
|
|
||||||
<td class="id" style="display: none"></td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
<tfoot id="entity-table-footer">
|
|
||||||
<tr>
|
|
||||||
<td id="footer-text" colspan="12"> </td>
|
|
||||||
</tr>
|
|
||||||
</tfoot>
|
|
||||||
</table>
|
|
||||||
|
|
||||||
<div id="no-entities">
|
|
||||||
No entities found <span id="no-entities-in-view">in view</span> within a <span id="no-entities-radius">100</span> meter radius. Try moving to a different location and refreshing.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
@ -1,27 +1,61 @@
|
||||||
// entityList.js
|
// entityListNew.js
|
||||||
//
|
//
|
||||||
// Created by Ryan Huffman on 19 Nov 2014
|
// Created by David Back on 27 Aug 2018
|
||||||
// Copyright 2014 High Fidelity, Inc.
|
// Copyright 2018 High Fidelity, Inc.
|
||||||
//
|
//
|
||||||
// Distributed under the Apache License, Version 2.0.
|
// Distributed under the Apache License, Version 2.0.
|
||||||
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
|
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
|
||||||
|
|
||||||
var entities = {};
|
const ASCENDING_SORT = 1;
|
||||||
var selectedEntities = [];
|
const DESCENDING_SORT = -1;
|
||||||
var currentSortColumn = 'type';
|
|
||||||
var currentSortOrder = 'des';
|
|
||||||
var entityList = null;
|
|
||||||
var refreshEntityListTimer = null;
|
|
||||||
const ASCENDING_STRING = '▴';
|
const ASCENDING_STRING = '▴';
|
||||||
const DESCENDING_STRING = '▾';
|
const DESCENDING_STRING = '▾';
|
||||||
|
const COMPARE_ASCENDING = function(a, b) {
|
||||||
|
let va = a[currentSortColumn];
|
||||||
|
let vb = b[currentSortColumn];
|
||||||
|
|
||||||
|
if (va < vb) {
|
||||||
|
return -1;
|
||||||
|
} else if (va > vb) {
|
||||||
|
return 1;
|
||||||
|
}
|
||||||
|
return 0;
|
||||||
|
}
|
||||||
|
const COMPARE_DESCENDING = function(a, b) {
|
||||||
|
return COMPARE_ASCENDING(b, a);
|
||||||
|
}
|
||||||
const LOCKED_GLYPH = "";
|
const LOCKED_GLYPH = "";
|
||||||
const VISIBLE_GLYPH = "";
|
const VISIBLE_GLYPH = "";
|
||||||
const TRANSPARENCY_GLYPH = "";
|
const TRANSPARENCY_GLYPH = "";
|
||||||
const BAKED_GLYPH = ""
|
const BAKED_GLYPH = ""
|
||||||
const SCRIPT_GLYPH = "k";
|
const SCRIPT_GLYPH = "k";
|
||||||
const DELETE = 46; // Key code for the delete key.
|
const BYTES_PER_MEGABYTE = 1024 * 1024;
|
||||||
const KEY_P = 80; // Key code for letter p used for Parenting hotkey.
|
const IMAGE_MODEL_NAME = 'default-image-model.fbx';
|
||||||
const MAX_ITEMS = Number.MAX_VALUE; // Used to set the max length of the list of discovered entities.
|
const NUM_COLUMNS = 12;
|
||||||
|
|
||||||
|
var entities = [];
|
||||||
|
var entitiesByID = {};
|
||||||
|
var visibleEntities = [];
|
||||||
|
|
||||||
|
var selectedEntities = [];
|
||||||
|
|
||||||
|
var currentSortColumn = 'type';
|
||||||
|
var currentSortOrder = 'des';
|
||||||
|
|
||||||
|
var entityList = null;
|
||||||
|
|
||||||
|
const ENABLE_PROFILING = true;
|
||||||
|
var profileIndent = '';
|
||||||
|
const PROFILE = !ENABLE_PROFILING ? function() { } : function(name, fn, args) {
|
||||||
|
console.log("PROFILE-Web " + profileIndent + "(" + name + ") Begin");
|
||||||
|
var previousIndent = profileIndent;
|
||||||
|
profileIndent += ' ';
|
||||||
|
var before = Date.now();
|
||||||
|
fn.apply(this, args);
|
||||||
|
var delta = Date.now() - before;
|
||||||
|
profileIndent = previousIndent;
|
||||||
|
console.log("PROFILE-Web " + profileIndent + "(" + name + ") End " + delta + "ms");
|
||||||
|
};
|
||||||
|
|
||||||
debugPrint = function (message) {
|
debugPrint = function (message) {
|
||||||
console.log(message);
|
console.log(message);
|
||||||
|
|
@ -29,10 +63,11 @@ debugPrint = function (message) {
|
||||||
|
|
||||||
function loaded() {
|
function loaded() {
|
||||||
openEventBridge(function() {
|
openEventBridge(function() {
|
||||||
entityList = new List('entity-list', { valueNames: ['name', 'type', 'url', 'locked', 'visible'], page: MAX_ITEMS});
|
|
||||||
entityList.clear();
|
|
||||||
elEntityTable = document.getElementById("entity-table");
|
elEntityTable = document.getElementById("entity-table");
|
||||||
elEntityTableBody = document.getElementById("entity-table-body");
|
elEntityTableBody = document.getElementById("entity-table-body");
|
||||||
|
elEntityTableScroll = document.getElementById("entity-table-scroll");
|
||||||
|
elEntityTableHeader = document.getElementById("entity-table-header");
|
||||||
|
elEntityTableFooter = document.getElementById("entity-table-footer");
|
||||||
elRefresh = document.getElementById("refresh");
|
elRefresh = document.getElementById("refresh");
|
||||||
elToggleLocked = document.getElementById("locked");
|
elToggleLocked = document.getElementById("locked");
|
||||||
elToggleVisible = document.getElementById("visible");
|
elToggleVisible = document.getElementById("visible");
|
||||||
|
|
@ -48,7 +83,8 @@ function loaded() {
|
||||||
elNoEntitiesMessage = document.getElementById("no-entities");
|
elNoEntitiesMessage = document.getElementById("no-entities");
|
||||||
elNoEntitiesInView = document.getElementById("no-entities-in-view");
|
elNoEntitiesInView = document.getElementById("no-entities-in-view");
|
||||||
elNoEntitiesRadius = document.getElementById("no-entities-radius");
|
elNoEntitiesRadius = document.getElementById("no-entities-radius");
|
||||||
elEntityTableScroll = document.getElementById("entity-table-scroll");
|
|
||||||
|
entityList = new ListView("entity-table", "entity-table-body", "entity-table-scroll", createRowFunction, updateRowFunction, clearRowFunction);
|
||||||
|
|
||||||
document.getElementById("entity-name").onclick = function() {
|
document.getElementById("entity-name").onclick = function() {
|
||||||
setSortColumn('name');
|
setSortColumn('name');
|
||||||
|
|
@ -87,11 +123,96 @@ function loaded() {
|
||||||
setSortColumn('hasScript');
|
setSortColumn('hasScript');
|
||||||
};
|
};
|
||||||
|
|
||||||
|
elRefresh.onclick = function() {
|
||||||
|
refreshEntities();
|
||||||
|
}
|
||||||
|
elToggleLocked.onclick = function() {
|
||||||
|
EventBridge.emitWebEvent(JSON.stringify({ type: 'toggleLocked' }));
|
||||||
|
}
|
||||||
|
elToggleVisible.onclick = function() {
|
||||||
|
EventBridge.emitWebEvent(JSON.stringify({ type: 'toggleVisible' }));
|
||||||
|
}
|
||||||
|
elExport.onclick = function() {
|
||||||
|
EventBridge.emitWebEvent(JSON.stringify({ type: 'export'}));
|
||||||
|
}
|
||||||
|
elPal.onclick = function() {
|
||||||
|
EventBridge.emitWebEvent(JSON.stringify({ type: 'pal' }));
|
||||||
|
}
|
||||||
|
elDelete.onclick = function() {
|
||||||
|
EventBridge.emitWebEvent(JSON.stringify({ type: 'delete' }));
|
||||||
|
}
|
||||||
|
|
||||||
|
function createRowFunction(elBottomBuffer) {
|
||||||
|
var row = document.createElement("tr");
|
||||||
|
for (var i = 0; i < NUM_COLUMNS; i++) {
|
||||||
|
var column = document.createElement("td");
|
||||||
|
// locked, visible, hasTransparent, isBaked glyph columns
|
||||||
|
if (i === 3 || i === 4 || i === 8 || i === 9) {
|
||||||
|
column.className = 'glyph';
|
||||||
|
}
|
||||||
|
row.appendChild(column);
|
||||||
|
}
|
||||||
|
row.onclick = onRowClicked;
|
||||||
|
row.ondblclick = onRowDoubleClicked;
|
||||||
|
elEntityTableBody.insertBefore(row, elBottomBuffer);
|
||||||
|
return row;
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateRowFunction(elRow, itemData) {
|
||||||
|
var typeCell = elRow.childNodes[0];
|
||||||
|
typeCell.innerText = itemData.type;
|
||||||
|
var nameCell = elRow.childNodes[1];
|
||||||
|
nameCell.innerText = itemData.name;
|
||||||
|
var urlCell = elRow.childNodes[2];
|
||||||
|
urlCell.innerText = itemData.url;
|
||||||
|
var lockedCell = elRow.childNodes[3];
|
||||||
|
lockedCell.innerHTML = itemData.locked;
|
||||||
|
var visibleCell = elRow.childNodes[4];
|
||||||
|
visibleCell.innerHTML = itemData.visible;
|
||||||
|
var verticesCountCell = elRow.childNodes[5];
|
||||||
|
verticesCountCell.innerText = itemData.verticesCount;
|
||||||
|
var texturesCountCell = elRow.childNodes[6];
|
||||||
|
texturesCountCell.innerText = itemData.texturesCount;
|
||||||
|
var texturesSizeCell = elRow.childNodes[7];
|
||||||
|
texturesSizeCell.innerText = itemData.texturesSize;
|
||||||
|
var hasTransparentCell = elRow.childNodes[8];
|
||||||
|
hasTransparentCell.innerHTML = itemData.hasTransparent;
|
||||||
|
var isBakedCell = elRow.childNodes[9];
|
||||||
|
isBakedCell.innerHTML = itemData.isBaked;
|
||||||
|
var drawCallsCell = elRow.childNodes[10];
|
||||||
|
drawCallsCell.innerText = itemData.drawCalls;
|
||||||
|
var hasScriptCell = elRow.childNodes[11];
|
||||||
|
hasScriptCell.innerText = itemData.hasScript;
|
||||||
|
|
||||||
|
var prevItemId = elRow.getAttribute("id");
|
||||||
|
var newItemId = itemData.id;
|
||||||
|
if (prevItemId && prevItemId !== newItemId) {
|
||||||
|
entitiesByID[prevItemId].elRow = null;
|
||||||
|
}
|
||||||
|
if (!prevItemId || prevItemId !== newItemId) {
|
||||||
|
elRow.setAttribute("id", newItemId);
|
||||||
|
entitiesByID[newItemId].elRow = elRow;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function clearRowFunction(elRow) {
|
||||||
|
for (var i = 0; i < NUM_COLUMNS; i++) {
|
||||||
|
var cell = elRow.childNodes[i];
|
||||||
|
cell.innerHTML = "";
|
||||||
|
}
|
||||||
|
|
||||||
|
var id = elRow.getAttribute("id");
|
||||||
|
if (id && entitiesByID[id]) {
|
||||||
|
entitiesByID[id].elRow = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function onRowClicked(clickEvent) {
|
function onRowClicked(clickEvent) {
|
||||||
var id = this.dataset.entityId;
|
var entityID = this.getAttribute("id");
|
||||||
var selection = [this.dataset.entityId];
|
var selection = [entityID];
|
||||||
|
|
||||||
if (clickEvent.ctrlKey) {
|
if (clickEvent.ctrlKey) {
|
||||||
var selectedIndex = selectedEntities.indexOf(id);
|
var selectedIndex = selectedEntities.indexOf(entityID);
|
||||||
if (selectedIndex >= 0) {
|
if (selectedIndex >= 0) {
|
||||||
selection = selectedEntities;
|
selection = selectedEntities;
|
||||||
selection.splice(selectedIndex, 1)
|
selection.splice(selectedIndex, 1)
|
||||||
|
|
@ -101,11 +222,12 @@ function loaded() {
|
||||||
} else if (clickEvent.shiftKey && selectedEntities.length > 0) {
|
} else if (clickEvent.shiftKey && selectedEntities.length > 0) {
|
||||||
var previousItemFound = -1;
|
var previousItemFound = -1;
|
||||||
var clickedItemFound = -1;
|
var clickedItemFound = -1;
|
||||||
for (var entity in entityList.visibleItems) {
|
for (var i = 0; i < visibleEntities.length; i++) {
|
||||||
if (clickedItemFound === -1 && this.dataset.entityId == entityList.visibleItems[entity].values().id) {
|
var entity = visibleEntities[i];
|
||||||
clickedItemFound = entity;
|
if (clickedItemFound === -1 && entityID == entity.id) {
|
||||||
} else if(previousItemFound === -1 && selectedEntities[0] == entityList.visibleItems[entity].values().id) {
|
clickedItemFound = i;
|
||||||
previousItemFound = entity;
|
} else if(previousItemFound === -1 && selectedEntities[0] == entity.id) {
|
||||||
|
previousItemFound = i;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if (previousItemFound !== -1 && clickedItemFound !== -1) {
|
if (previousItemFound !== -1 && clickedItemFound !== -1) {
|
||||||
|
|
@ -113,8 +235,8 @@ function loaded() {
|
||||||
var toItem = Math.max(previousItemFound, clickedItemFound);
|
var toItem = Math.max(previousItemFound, clickedItemFound);
|
||||||
// skip first and last item in this loop, we add them to selection after the loop
|
// skip first and last item in this loop, we add them to selection after the loop
|
||||||
for (var i = (Math.min(previousItemFound, clickedItemFound) + 1); i < toItem; i++) {
|
for (var i = (Math.min(previousItemFound, clickedItemFound) + 1); i < toItem; i++) {
|
||||||
entityList.visibleItems[i].elm.className = 'selected';
|
visibleEntities[i].elRow.className = 'selected';
|
||||||
betweenItems.push(entityList.visibleItems[i].values().id);
|
betweenItems.push(visibleEntities[i].id);
|
||||||
}
|
}
|
||||||
if (previousItemFound > clickedItemFound) {
|
if (previousItemFound > clickedItemFound) {
|
||||||
// always make sure that we add the items in the right order
|
// always make sure that we add the items in the right order
|
||||||
|
|
@ -138,84 +260,14 @@ function loaded() {
|
||||||
}
|
}
|
||||||
|
|
||||||
function onRowDoubleClicked() {
|
function onRowDoubleClicked() {
|
||||||
|
var entityID = this.getAttribute("id");
|
||||||
EventBridge.emitWebEvent(JSON.stringify({
|
EventBridge.emitWebEvent(JSON.stringify({
|
||||||
type: "selectionUpdate",
|
type: "selectionUpdate",
|
||||||
focus: true,
|
focus: true,
|
||||||
entityIds: [this.dataset.entityId],
|
entityIds: [entityID],
|
||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
|
|
||||||
const BYTES_PER_MEGABYTE = 1024 * 1024;
|
|
||||||
|
|
||||||
function decimalMegabytes(number) {
|
|
||||||
return number ? (number / BYTES_PER_MEGABYTE).toFixed(1) : "";
|
|
||||||
}
|
|
||||||
|
|
||||||
function displayIfNonZero(number) {
|
|
||||||
return number ? number : "";
|
|
||||||
}
|
|
||||||
|
|
||||||
function addEntity(id, name, type, url, locked, visible, verticesCount, texturesCount, texturesSize, hasTransparent,
|
|
||||||
isBaked, drawCalls, hasScript) {
|
|
||||||
|
|
||||||
var urlParts = url.split('/');
|
|
||||||
var filename = urlParts[urlParts.length - 1];
|
|
||||||
|
|
||||||
var IMAGE_MODEL_NAME = 'default-image-model.fbx';
|
|
||||||
|
|
||||||
if (filename === IMAGE_MODEL_NAME) {
|
|
||||||
type = "Image";
|
|
||||||
}
|
|
||||||
|
|
||||||
if (entities[id] === undefined) {
|
|
||||||
entityList.add([{
|
|
||||||
id: id, name: name, type: type, url: filename, locked: locked, visible: visible,
|
|
||||||
verticesCount: displayIfNonZero(verticesCount), texturesCount: displayIfNonZero(texturesCount),
|
|
||||||
texturesSize: decimalMegabytes(texturesSize), hasTransparent: hasTransparent,
|
|
||||||
isBaked: isBaked, drawCalls: displayIfNonZero(drawCalls), hasScript: hasScript
|
|
||||||
}],
|
|
||||||
function (items) {
|
|
||||||
var currentElement = items[0].elm;
|
|
||||||
var id = items[0]._values.id;
|
|
||||||
entities[id] = {
|
|
||||||
id: id,
|
|
||||||
name: name,
|
|
||||||
el: currentElement,
|
|
||||||
item: items[0]
|
|
||||||
};
|
|
||||||
currentElement.setAttribute('id', 'entity_' + id);
|
|
||||||
currentElement.setAttribute('title', url);
|
|
||||||
currentElement.dataset.entityId = id;
|
|
||||||
currentElement.onclick = onRowClicked;
|
|
||||||
currentElement.ondblclick = onRowDoubleClicked;
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
var item = entities[id].item;
|
|
||||||
item.values({ name: name, url: filename, locked: locked, visible: visible });
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function removeEntities(deletedIDs) {
|
|
||||||
for (i = 0, length = deletedIDs.length; i < length; i++) {
|
|
||||||
delete entities[deletedIDs[i]];
|
|
||||||
entityList.remove("id", deletedIDs[i]);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function scheduleRefreshEntityList() {
|
|
||||||
var REFRESH_DELAY = 50;
|
|
||||||
if (refreshEntityListTimer) {
|
|
||||||
clearTimeout(refreshEntityListTimer);
|
|
||||||
}
|
|
||||||
refreshEntityListTimer = setTimeout(refreshEntityListObject, REFRESH_DELAY);
|
|
||||||
}
|
|
||||||
|
|
||||||
function clearEntities() {
|
|
||||||
entities = {};
|
|
||||||
entityList.clear();
|
|
||||||
refreshFooter();
|
|
||||||
}
|
|
||||||
|
|
||||||
var elSortOrder = {
|
var elSortOrder = {
|
||||||
name: document.querySelector('#entity-name .sort-order'),
|
name: document.querySelector('#entity-name .sort-order'),
|
||||||
type: document.querySelector('#entity-type .sort-order'),
|
type: document.querySelector('#entity-type .sort-order'),
|
||||||
|
|
@ -231,21 +283,22 @@ function loaded() {
|
||||||
hasScript: document.querySelector('#entity-hasScript .sort-order'),
|
hasScript: document.querySelector('#entity-hasScript .sort-order'),
|
||||||
}
|
}
|
||||||
function setSortColumn(column) {
|
function setSortColumn(column) {
|
||||||
if (currentSortColumn == column) {
|
PROFILE("set-sort-column", function() {
|
||||||
currentSortOrder = currentSortOrder == "asc" ? "desc" : "asc";
|
if (currentSortColumn === column) {
|
||||||
|
currentSortOrder *= -1;
|
||||||
} else {
|
} else {
|
||||||
elSortOrder[currentSortColumn].innerHTML = "";
|
elSortOrder[currentSortColumn].innerHTML = "";
|
||||||
currentSortColumn = column;
|
currentSortColumn = column;
|
||||||
currentSortOrder = "asc";
|
currentSortOrder = ASCENDING_SORT;
|
||||||
}
|
}
|
||||||
elSortOrder[column].innerHTML = currentSortOrder == "asc" ? ASCENDING_STRING : DESCENDING_STRING;
|
elSortOrder[column].innerHTML = currentSortOrder == ASCENDING_SORT ? ASCENDING_STRING : DESCENDING_STRING;
|
||||||
entityList.sort(currentSortColumn, { order: currentSortOrder });
|
refreshEntityList();
|
||||||
|
});
|
||||||
}
|
}
|
||||||
setSortColumn('type');
|
|
||||||
|
|
||||||
function refreshEntities() {
|
function clearEntities() {
|
||||||
clearEntities();
|
entities = {};
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'refresh' }));
|
refreshFooter();
|
||||||
}
|
}
|
||||||
|
|
||||||
function refreshFooter() {
|
function refreshFooter() {
|
||||||
|
|
@ -253,33 +306,112 @@ function loaded() {
|
||||||
elFooter.firstChild.nodeValue = selectedEntities.length + " entities selected";
|
elFooter.firstChild.nodeValue = selectedEntities.length + " entities selected";
|
||||||
} else if (selectedEntities.length === 1) {
|
} else if (selectedEntities.length === 1) {
|
||||||
elFooter.firstChild.nodeValue = "1 entity selected";
|
elFooter.firstChild.nodeValue = "1 entity selected";
|
||||||
} else if (entityList.visibleItems.length === 1) {
|
} else if (visibleEntities.length === 1) {
|
||||||
elFooter.firstChild.nodeValue = "1 entity found";
|
elFooter.firstChild.nodeValue = "1 entity found";
|
||||||
} else {
|
} else {
|
||||||
elFooter.firstChild.nodeValue = entityList.visibleItems.length + " entities found";
|
elFooter.firstChild.nodeValue = visibleEntities.length + " entities found";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function refreshEntityListObject() {
|
function refreshEntities() {
|
||||||
refreshEntityListTimer = null;
|
clearEntities();
|
||||||
entityList.sort(currentSortColumn, { order: currentSortOrder });
|
EventBridge.emitWebEvent(JSON.stringify({ type: 'refresh' }));
|
||||||
entityList.search(elFilter.value);
|
}
|
||||||
|
|
||||||
|
function refreshEntityList() {
|
||||||
|
PROFILE("refresh-entity-list", function() {
|
||||||
|
PROFILE("filter", function() {
|
||||||
|
var searchTerm = elFilter.value;
|
||||||
|
if (searchTerm === '') {
|
||||||
|
visibleEntities = entities.slice(0);
|
||||||
|
} else {
|
||||||
|
visibleEntities = entities.filter(function(e) {
|
||||||
|
return e.name.indexOf(searchTerm) > -1
|
||||||
|
|| e.type.indexOf(searchTerm) > -1
|
||||||
|
|| e.fullUrl.indexOf(searchTerm) > -1;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
PROFILE("sort", function() {
|
||||||
|
var cmp = currentSortOrder === ASCENDING_SORT ? COMPARE_ASCENDING : COMPARE_DESCENDING;
|
||||||
|
visibleEntities.sort(cmp);
|
||||||
|
});
|
||||||
|
|
||||||
|
PROFILE("update-dom", function() {
|
||||||
|
entityList.setVisibleItemData(visibleEntities);
|
||||||
|
entityList.refresh();
|
||||||
|
});
|
||||||
|
|
||||||
refreshFooter();
|
refreshFooter();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function decimalMegabytes(number) {
|
||||||
|
return number ? (number / BYTES_PER_MEGABYTE).toFixed(1) : "";
|
||||||
|
}
|
||||||
|
|
||||||
|
function displayIfNonZero(number) {
|
||||||
|
return number ? number : "";
|
||||||
|
}
|
||||||
|
|
||||||
|
function getFilename(url) {
|
||||||
|
var urlParts = url.split('/');
|
||||||
|
return urlParts[urlParts.length - 1];
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateEntityData(entityData) {
|
||||||
|
entities = [];
|
||||||
|
entitiesByID = {};
|
||||||
|
visibleEntities = [];
|
||||||
|
|
||||||
|
PROFILE("map-data", function() {
|
||||||
|
entityData.forEach(function(entity) {
|
||||||
|
var type = entity.type
|
||||||
|
var filename = getFilename(entity.url);
|
||||||
|
if (filename === IMAGE_MODEL_NAME) {
|
||||||
|
type = "Image";
|
||||||
|
}
|
||||||
|
|
||||||
|
var entityData = {
|
||||||
|
id: entity.id,
|
||||||
|
name: entity.name,
|
||||||
|
type: type,
|
||||||
|
url: filename,
|
||||||
|
fullUrl: entity.url,
|
||||||
|
locked: entity.locked ? LOCKED_GLYPH : null,
|
||||||
|
visible: entity.visible ? VISIBLE_GLYPH : null,
|
||||||
|
verticesCount: displayIfNonZero(entity.verticesCount),
|
||||||
|
texturesCount: displayIfNonZero(entity.texturesCount),
|
||||||
|
texturesSize: decimalMegabytes(entity.texturesSize),
|
||||||
|
hasTransparent: entity.hasTransparent ? TRANSPARENCY_GLYPH : null,
|
||||||
|
isBaked: entity.isBaked ? BAKED_GLYPH : null,
|
||||||
|
drawCalls: displayIfNonZero(entity.drawCalls),
|
||||||
|
hasScript: entity.hasScript ? SCRIPT_GLYPH : null,
|
||||||
|
elRow : null
|
||||||
|
}
|
||||||
|
|
||||||
|
entities.push(entityData);
|
||||||
|
entitiesByID[entityData.id] = entityData;
|
||||||
|
});
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function updateSelectedEntities(selectedIDs) {
|
function updateSelectedEntities(selectedIDs) {
|
||||||
var notFound = false;
|
var notFound = false;
|
||||||
for (var id in entities) {
|
for (var id in entitiesByID) {
|
||||||
entities[id].el.className = '';
|
if (entitiesByID[id].elRow) {
|
||||||
|
entitiesByID[id].elRow.className = '';
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
selectedEntities = [];
|
selectedEntities = [];
|
||||||
for (var i = 0; i < selectedIDs.length; i++) {
|
for (var i = 0; i < selectedIDs.length; i++) {
|
||||||
var id = selectedIDs[i];
|
var id = selectedIDs[i];
|
||||||
selectedEntities.push(id);
|
selectedEntities.push(id);
|
||||||
if (id in entities) {
|
if (id in entitiesByID) {
|
||||||
var entity = entities[id];
|
var entity = entitiesByID[id];
|
||||||
entity.el.className = 'selected';
|
entity.elRow.className = 'selected';
|
||||||
} else {
|
} else {
|
||||||
notFound = true;
|
notFound = true;
|
||||||
}
|
}
|
||||||
|
|
@ -290,24 +422,67 @@ function loaded() {
|
||||||
return notFound;
|
return notFound;
|
||||||
}
|
}
|
||||||
|
|
||||||
elRefresh.onclick = function() {
|
function removeEntities(deletedIDs) {
|
||||||
refreshEntities();
|
for (var i = 0, length = deletedIDs.length; i < length; i++) {
|
||||||
|
var deleteID = deletedIDs[i];
|
||||||
|
delete entitiesByID[deleteID];
|
||||||
}
|
}
|
||||||
elToggleLocked.onclick = function () {
|
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'toggleLocked' }));
|
|
||||||
}
|
}
|
||||||
elToggleVisible.onclick = function () {
|
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'toggleVisible' }));
|
function resize() {
|
||||||
|
// Take up available window space
|
||||||
|
elEntityTableScroll.style.height = window.innerHeight - 207;
|
||||||
|
|
||||||
|
var SCROLLABAR_WIDTH = 21;
|
||||||
|
var tds = document.querySelectorAll("#entity-table-body tr:first-child td");
|
||||||
|
var ths = document.querySelectorAll("#entity-table thead th");
|
||||||
|
if (tds.length >= ths.length) {
|
||||||
|
// Update the widths of the header cells to match the body
|
||||||
|
for (var i = 0; i < ths.length; i++) {
|
||||||
|
ths[i].width = tds[i].offsetWidth;
|
||||||
}
|
}
|
||||||
elExport.onclick = function() {
|
} else {
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'export'}));
|
// Reasonable widths if nothing is displayed
|
||||||
|
var tableWidth = document.getElementById("entity-table").offsetWidth - SCROLLABAR_WIDTH;
|
||||||
|
if (showExtraInfo) {
|
||||||
|
ths[0].width = 0.10 * tableWidth;
|
||||||
|
ths[1].width = 0.20 * tableWidth;
|
||||||
|
ths[2].width = 0.20 * tableWidth;
|
||||||
|
ths[3].width = 0.04 * tableWidth;
|
||||||
|
ths[4].width = 0.04 * tableWidth;
|
||||||
|
ths[5].width = 0.08 * tableWidth;
|
||||||
|
ths[6].width = 0.08 * tableWidth;
|
||||||
|
ths[7].width = 0.10 * tableWidth;
|
||||||
|
ths[8].width = 0.04 * tableWidth;
|
||||||
|
ths[9].width = 0.08 * tableWidth;
|
||||||
|
ths[10].width = 0.04 * tableWidth + SCROLLABAR_WIDTH;
|
||||||
|
} else {
|
||||||
|
ths[0].width = 0.16 * tableWidth;
|
||||||
|
ths[1].width = 0.34 * tableWidth;
|
||||||
|
ths[2].width = 0.34 * tableWidth;
|
||||||
|
ths[3].width = 0.08 * tableWidth;
|
||||||
|
ths[4].width = 0.08 * tableWidth;
|
||||||
}
|
}
|
||||||
elPal.onclick = function () {
|
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'pal' }));
|
|
||||||
}
|
}
|
||||||
elDelete.onclick = function() {
|
};
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'delete' }));
|
|
||||||
|
var showExtraInfo = false;
|
||||||
|
var COLLAPSE_EXTRA_INFO = "E";
|
||||||
|
var EXPAND_EXTRA_INFO = "D";
|
||||||
|
|
||||||
|
function toggleInfo(event) {
|
||||||
|
showExtraInfo = !showExtraInfo;
|
||||||
|
if (showExtraInfo) {
|
||||||
|
elEntityTable.className = "showExtraInfo";
|
||||||
|
elInfoToggleGlyph.innerHTML = COLLAPSE_EXTRA_INFO;
|
||||||
|
} else {
|
||||||
|
elEntityTable.className = "";
|
||||||
|
elInfoToggleGlyph.innerHTML = EXPAND_EXTRA_INFO;
|
||||||
}
|
}
|
||||||
|
resize();
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
elInfoToggle.addEventListener("click", toggleInfo, true);
|
||||||
|
|
||||||
document.addEventListener("keydown", function (keyDownEvent) {
|
document.addEventListener("keydown", function (keyDownEvent) {
|
||||||
if (keyDownEvent.target.nodeName === "INPUT") {
|
if (keyDownEvent.target.nodeName === "INPUT") {
|
||||||
|
|
@ -353,7 +528,6 @@ function loaded() {
|
||||||
if (window.EventBridge !== undefined) {
|
if (window.EventBridge !== undefined) {
|
||||||
EventBridge.scriptEventReceived.connect(function(data) {
|
EventBridge.scriptEventReceived.connect(function(data) {
|
||||||
data = JSON.parse(data);
|
data = JSON.parse(data);
|
||||||
|
|
||||||
if (data.type === "clearEntityList") {
|
if (data.type === "clearEntityList") {
|
||||||
clearEntities();
|
clearEntities();
|
||||||
} else if (data.type == "selectionUpdate") {
|
} else if (data.type == "selectionUpdate") {
|
||||||
|
|
@ -362,105 +536,34 @@ function loaded() {
|
||||||
refreshEntities();
|
refreshEntities();
|
||||||
}
|
}
|
||||||
} else if (data.type === "update" && data.selectedIDs !== undefined) {
|
} else if (data.type === "update" && data.selectedIDs !== undefined) {
|
||||||
|
PROFILE("update", function() {
|
||||||
var newEntities = data.entities;
|
var newEntities = data.entities;
|
||||||
if (newEntities && newEntities.length == 0) {
|
if (newEntities && newEntities.length == 0) {
|
||||||
elNoEntitiesMessage.style.display = "block";
|
elNoEntitiesMessage.style.display = "block";
|
||||||
elFooter.firstChild.nodeValue = "0 entities found";
|
elFooter.firstChild.nodeValue = "0 entities found";
|
||||||
} else if (newEntities) {
|
} else if (newEntities) {
|
||||||
elNoEntitiesMessage.style.display = "none";
|
elNoEntitiesMessage.style.display = "none";
|
||||||
for (var i = 0; i < newEntities.length; i++) {
|
updateEntityData(newEntities);
|
||||||
var id = newEntities[i].id;
|
refreshEntityList();
|
||||||
addEntity(id, newEntities[i].name, newEntities[i].type, newEntities[i].url,
|
|
||||||
newEntities[i].locked ? LOCKED_GLYPH : null,
|
|
||||||
newEntities[i].visible ? VISIBLE_GLYPH : null,
|
|
||||||
newEntities[i].verticesCount, newEntities[i].texturesCount, newEntities[i].texturesSize,
|
|
||||||
newEntities[i].hasTransparent ? TRANSPARENCY_GLYPH : null,
|
|
||||||
newEntities[i].isBaked ? BAKED_GLYPH : null,
|
|
||||||
newEntities[i].drawCalls,
|
|
||||||
newEntities[i].hasScript ? SCRIPT_GLYPH : null);
|
|
||||||
}
|
|
||||||
updateSelectedEntities(data.selectedIDs);
|
updateSelectedEntities(data.selectedIDs);
|
||||||
scheduleRefreshEntityList();
|
|
||||||
resize();
|
|
||||||
}
|
}
|
||||||
|
});
|
||||||
} else if (data.type === "removeEntities" && data.deletedIDs !== undefined && data.selectedIDs !== undefined) {
|
} else if (data.type === "removeEntities" && data.deletedIDs !== undefined && data.selectedIDs !== undefined) {
|
||||||
removeEntities(data.deletedIDs);
|
removeEntities(data.deletedIDs);
|
||||||
updateSelectedEntities(data.selectedIDs);
|
updateSelectedEntities(data.selectedIDs);
|
||||||
scheduleRefreshEntityList();
|
|
||||||
} else if (data.type === "deleted" && data.ids) {
|
} else if (data.type === "deleted" && data.ids) {
|
||||||
removeEntities(data.ids);
|
removeEntities(data.ids);
|
||||||
refreshFooter();
|
refreshFooter();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
setTimeout(refreshEntities, 1000);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function resize() {
|
setSortColumn('type');
|
||||||
// Take up available window space
|
|
||||||
elEntityTableScroll.style.height = window.innerHeight - 207;
|
|
||||||
|
|
||||||
var SCROLLABAR_WIDTH = 21;
|
|
||||||
var tds = document.querySelectorAll("#entity-table-body tr:first-child td");
|
|
||||||
var ths = document.querySelectorAll("#entity-table thead th");
|
|
||||||
if (tds.length >= ths.length) {
|
|
||||||
// Update the widths of the header cells to match the body
|
|
||||||
for (var i = 0; i < ths.length; i++) {
|
|
||||||
ths[i].width = tds[i].offsetWidth;
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
// Reasonable widths if nothing is displayed
|
|
||||||
var tableWidth = document.getElementById("entity-table").offsetWidth - SCROLLABAR_WIDTH;
|
|
||||||
if (showExtraInfo) {
|
|
||||||
ths[0].width = 0.10 * tableWidth;
|
|
||||||
ths[1].width = 0.20 * tableWidth;
|
|
||||||
ths[2].width = 0.20 * tableWidth;
|
|
||||||
ths[3].width = 0.04 * tableWidth;
|
|
||||||
ths[4].width = 0.04 * tableWidth;
|
|
||||||
ths[5].width = 0.08 * tableWidth;
|
|
||||||
ths[6].width = 0.08 * tableWidth;
|
|
||||||
ths[7].width = 0.10 * tableWidth;
|
|
||||||
ths[8].width = 0.04 * tableWidth;
|
|
||||||
ths[9].width = 0.08 * tableWidth;
|
|
||||||
ths[10].width = 0.04 * tableWidth + SCROLLABAR_WIDTH;
|
|
||||||
} else {
|
|
||||||
ths[0].width = 0.16 * tableWidth;
|
|
||||||
ths[1].width = 0.34 * tableWidth;
|
|
||||||
ths[2].width = 0.34 * tableWidth;
|
|
||||||
ths[3].width = 0.08 * tableWidth;
|
|
||||||
ths[4].width = 0.08 * tableWidth;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
window.onresize = resize;
|
|
||||||
elFilter.onchange = resize;
|
|
||||||
elFilter.onblur = refreshFooter;
|
|
||||||
|
|
||||||
|
|
||||||
var showExtraInfo = false;
|
|
||||||
var COLLAPSE_EXTRA_INFO = "E";
|
|
||||||
var EXPAND_EXTRA_INFO = "D";
|
|
||||||
|
|
||||||
function toggleInfo(event) {
|
|
||||||
showExtraInfo = !showExtraInfo;
|
|
||||||
if (showExtraInfo) {
|
|
||||||
elEntityTable.className = "showExtraInfo";
|
|
||||||
elInfoToggleGlyph.innerHTML = COLLAPSE_EXTRA_INFO;
|
|
||||||
} else {
|
|
||||||
elEntityTable.className = "";
|
|
||||||
elInfoToggleGlyph.innerHTML = EXPAND_EXTRA_INFO;
|
|
||||||
}
|
|
||||||
resize();
|
|
||||||
event.stopPropagation();
|
|
||||||
}
|
|
||||||
elInfoToggle.addEventListener("click", toggleInfo, true);
|
|
||||||
|
|
||||||
|
|
||||||
resize();
|
resize();
|
||||||
|
entityList.initialize(572);
|
||||||
|
refreshEntities();
|
||||||
});
|
});
|
||||||
|
|
||||||
augmentSpinButtons();
|
|
||||||
|
|
||||||
// Disable right-click context menu which is not visible in the HMD and makes it seem like the app has locked
|
// Disable right-click context menu which is not visible in the HMD and makes it seem like the app has locked
|
||||||
document.addEventListener("contextmenu", function (event) {
|
document.addEventListener("contextmenu", function (event) {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
|
|
|
||||||
|
|
@ -1,571 +0,0 @@
|
||||||
// entityListNew.js
|
|
||||||
//
|
|
||||||
// Created by David Back on 27 Aug 2018
|
|
||||||
// Copyright 2018 High Fidelity, Inc.
|
|
||||||
//
|
|
||||||
// Distributed under the Apache License, Version 2.0.
|
|
||||||
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
|
|
||||||
|
|
||||||
const ASCENDING_SORT = 1;
|
|
||||||
const DESCENDING_SORT = -1;
|
|
||||||
const ASCENDING_STRING = '▴';
|
|
||||||
const DESCENDING_STRING = '▾';
|
|
||||||
const COMPARE_ASCENDING = function(a, b) {
|
|
||||||
let va = a[currentSortColumn];
|
|
||||||
let vb = b[currentSortColumn];
|
|
||||||
|
|
||||||
if (va < vb) {
|
|
||||||
return -1;
|
|
||||||
} else if (va > vb) {
|
|
||||||
return 1;
|
|
||||||
}
|
|
||||||
return 0;
|
|
||||||
}
|
|
||||||
const COMPARE_DESCENDING = function(a, b) {
|
|
||||||
return COMPARE_ASCENDING(b, a);
|
|
||||||
}
|
|
||||||
const LOCKED_GLYPH = "";
|
|
||||||
const VISIBLE_GLYPH = "";
|
|
||||||
const TRANSPARENCY_GLYPH = "";
|
|
||||||
const BAKED_GLYPH = ""
|
|
||||||
const SCRIPT_GLYPH = "k";
|
|
||||||
const BYTES_PER_MEGABYTE = 1024 * 1024;
|
|
||||||
const IMAGE_MODEL_NAME = 'default-image-model.fbx';
|
|
||||||
const NUM_COLUMNS = 12;
|
|
||||||
|
|
||||||
var entities = [];
|
|
||||||
var entitiesByID = {};
|
|
||||||
var visibleEntities = [];
|
|
||||||
|
|
||||||
var selectedEntities = [];
|
|
||||||
|
|
||||||
var currentSortColumn = 'type';
|
|
||||||
var currentSortOrder = 'des';
|
|
||||||
|
|
||||||
var entityList = null;
|
|
||||||
|
|
||||||
const ENABLE_PROFILING = true;
|
|
||||||
var profileIndent = '';
|
|
||||||
const PROFILE = !ENABLE_PROFILING ? function() { } : function(name, fn, args) {
|
|
||||||
console.log("PROFILE-Web " + profileIndent + "(" + name + ") Begin");
|
|
||||||
var previousIndent = profileIndent;
|
|
||||||
profileIndent += ' ';
|
|
||||||
var before = Date.now();
|
|
||||||
fn.apply(this, args);
|
|
||||||
var delta = Date.now() - before;
|
|
||||||
profileIndent = previousIndent;
|
|
||||||
console.log("PROFILE-Web " + profileIndent + "(" + name + ") End " + delta + "ms");
|
|
||||||
};
|
|
||||||
|
|
||||||
debugPrint = function (message) {
|
|
||||||
console.log(message);
|
|
||||||
};
|
|
||||||
|
|
||||||
function loaded() {
|
|
||||||
openEventBridge(function() {
|
|
||||||
elEntityTable = document.getElementById("entity-table");
|
|
||||||
elEntityTableBody = document.getElementById("entity-table-body");
|
|
||||||
elEntityTableScroll = document.getElementById("entity-table-scroll");
|
|
||||||
elEntityTableHeader = document.getElementById("entity-table-header");
|
|
||||||
elEntityTableFooter = document.getElementById("entity-table-footer");
|
|
||||||
elRefresh = document.getElementById("refresh");
|
|
||||||
elToggleLocked = document.getElementById("locked");
|
|
||||||
elToggleVisible = document.getElementById("visible");
|
|
||||||
elDelete = document.getElementById("delete");
|
|
||||||
elFilter = document.getElementById("filter");
|
|
||||||
elInView = document.getElementById("in-view")
|
|
||||||
elRadius = document.getElementById("radius");
|
|
||||||
elExport = document.getElementById("export");
|
|
||||||
elPal = document.getElementById("pal");
|
|
||||||
elInfoToggle = document.getElementById("info-toggle");
|
|
||||||
elInfoToggleGlyph = elInfoToggle.firstChild;
|
|
||||||
elFooter = document.getElementById("footer-text");
|
|
||||||
elNoEntitiesMessage = document.getElementById("no-entities");
|
|
||||||
elNoEntitiesInView = document.getElementById("no-entities-in-view");
|
|
||||||
elNoEntitiesRadius = document.getElementById("no-entities-radius");
|
|
||||||
|
|
||||||
entityList = new ListView("entity-table", "entity-table-body", "entity-table-scroll", createRowFunction, updateRowFunction, clearRowFunction);
|
|
||||||
|
|
||||||
document.getElementById("entity-name").onclick = function() {
|
|
||||||
setSortColumn('name');
|
|
||||||
};
|
|
||||||
document.getElementById("entity-type").onclick = function() {
|
|
||||||
setSortColumn('type');
|
|
||||||
};
|
|
||||||
document.getElementById("entity-url").onclick = function() {
|
|
||||||
setSortColumn('url');
|
|
||||||
};
|
|
||||||
document.getElementById("entity-locked").onclick = function () {
|
|
||||||
setSortColumn('locked');
|
|
||||||
};
|
|
||||||
document.getElementById("entity-visible").onclick = function () {
|
|
||||||
setSortColumn('visible');
|
|
||||||
};
|
|
||||||
document.getElementById("entity-verticesCount").onclick = function () {
|
|
||||||
setSortColumn('verticesCount');
|
|
||||||
};
|
|
||||||
document.getElementById("entity-texturesCount").onclick = function () {
|
|
||||||
setSortColumn('texturesCount');
|
|
||||||
};
|
|
||||||
document.getElementById("entity-texturesSize").onclick = function () {
|
|
||||||
setSortColumn('texturesSize');
|
|
||||||
};
|
|
||||||
document.getElementById("entity-hasTransparent").onclick = function () {
|
|
||||||
setSortColumn('hasTransparent');
|
|
||||||
};
|
|
||||||
document.getElementById("entity-isBaked").onclick = function () {
|
|
||||||
setSortColumn('isBaked');
|
|
||||||
};
|
|
||||||
document.getElementById("entity-drawCalls").onclick = function () {
|
|
||||||
setSortColumn('drawCalls');
|
|
||||||
};
|
|
||||||
document.getElementById("entity-hasScript").onclick = function () {
|
|
||||||
setSortColumn('hasScript');
|
|
||||||
};
|
|
||||||
|
|
||||||
elRefresh.onclick = function() {
|
|
||||||
refreshEntities();
|
|
||||||
}
|
|
||||||
elToggleLocked.onclick = function() {
|
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'toggleLocked' }));
|
|
||||||
}
|
|
||||||
elToggleVisible.onclick = function() {
|
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'toggleVisible' }));
|
|
||||||
}
|
|
||||||
elExport.onclick = function() {
|
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'export'}));
|
|
||||||
}
|
|
||||||
elPal.onclick = function() {
|
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'pal' }));
|
|
||||||
}
|
|
||||||
elDelete.onclick = function() {
|
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'delete' }));
|
|
||||||
}
|
|
||||||
|
|
||||||
function createRowFunction(elBottomBuffer) {
|
|
||||||
var row = document.createElement("tr");
|
|
||||||
for (var i = 0; i < NUM_COLUMNS; i++) {
|
|
||||||
var column = document.createElement("td");
|
|
||||||
// locked, visible, hasTransparent, isBaked glyph columns
|
|
||||||
if (i === 3 || i === 4 || i === 8 || i === 9) {
|
|
||||||
column.className = 'glyph';
|
|
||||||
}
|
|
||||||
row.appendChild(column);
|
|
||||||
}
|
|
||||||
row.onclick = onRowClicked;
|
|
||||||
row.ondblclick = onRowDoubleClicked;
|
|
||||||
elEntityTableBody.insertBefore(row, elBottomBuffer);
|
|
||||||
return row;
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateRowFunction(elRow, itemData) {
|
|
||||||
var typeCell = elRow.childNodes[0];
|
|
||||||
typeCell.innerText = itemData.type;
|
|
||||||
var nameCell = elRow.childNodes[1];
|
|
||||||
nameCell.innerText = itemData.name;
|
|
||||||
var urlCell = elRow.childNodes[2];
|
|
||||||
urlCell.innerText = itemData.url;
|
|
||||||
var lockedCell = elRow.childNodes[3];
|
|
||||||
lockedCell.innerHTML = itemData.locked;
|
|
||||||
var visibleCell = elRow.childNodes[4];
|
|
||||||
visibleCell.innerHTML = itemData.visible;
|
|
||||||
var verticesCountCell = elRow.childNodes[5];
|
|
||||||
verticesCountCell.innerText = itemData.verticesCount;
|
|
||||||
var texturesCountCell = elRow.childNodes[6];
|
|
||||||
texturesCountCell.innerText = itemData.texturesCount;
|
|
||||||
var texturesSizeCell = elRow.childNodes[7];
|
|
||||||
texturesSizeCell.innerText = itemData.texturesSize;
|
|
||||||
var hasTransparentCell = elRow.childNodes[8];
|
|
||||||
hasTransparentCell.innerHTML = itemData.hasTransparent;
|
|
||||||
var isBakedCell = elRow.childNodes[9];
|
|
||||||
isBakedCell.innerHTML = itemData.isBaked;
|
|
||||||
var drawCallsCell = elRow.childNodes[10];
|
|
||||||
drawCallsCell.innerText = itemData.drawCalls;
|
|
||||||
var hasScriptCell = elRow.childNodes[11];
|
|
||||||
hasScriptCell.innerText = itemData.hasScript;
|
|
||||||
|
|
||||||
var prevItemId = elRow.getAttribute("id");
|
|
||||||
var newItemId = itemData.id;
|
|
||||||
if (prevItemId && prevItemId !== newItemId) {
|
|
||||||
entitiesByID[prevItemId].elRow = null;
|
|
||||||
}
|
|
||||||
if (!prevItemId || prevItemId !== newItemId) {
|
|
||||||
elRow.setAttribute("id", newItemId);
|
|
||||||
entitiesByID[newItemId].elRow = elRow;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function clearRowFunction(elRow) {
|
|
||||||
for (var i = 0; i < NUM_COLUMNS; i++) {
|
|
||||||
var cell = elRow.childNodes[i];
|
|
||||||
cell.innerHTML = "";
|
|
||||||
}
|
|
||||||
|
|
||||||
var id = elRow.getAttribute("id");
|
|
||||||
if (id && entitiesByID[id]) {
|
|
||||||
entitiesByID[id].elRow = null;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function onRowClicked(clickEvent) {
|
|
||||||
var entityID = this.getAttribute("id");
|
|
||||||
var selection = [entityID];
|
|
||||||
|
|
||||||
if (clickEvent.ctrlKey) {
|
|
||||||
var selectedIndex = selectedEntities.indexOf(entityID);
|
|
||||||
if (selectedIndex >= 0) {
|
|
||||||
selection = selectedEntities;
|
|
||||||
selection.splice(selectedIndex, 1)
|
|
||||||
} else {
|
|
||||||
selection = selection.concat(selectedEntities);
|
|
||||||
}
|
|
||||||
} else if (clickEvent.shiftKey && selectedEntities.length > 0) {
|
|
||||||
var previousItemFound = -1;
|
|
||||||
var clickedItemFound = -1;
|
|
||||||
for (var i = 0; i < visibleEntities.length; i++) {
|
|
||||||
var entity = visibleEntities[i];
|
|
||||||
if (clickedItemFound === -1 && entityID == entity.id) {
|
|
||||||
clickedItemFound = i;
|
|
||||||
} else if(previousItemFound === -1 && selectedEntities[0] == entity.id) {
|
|
||||||
previousItemFound = i;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if (previousItemFound !== -1 && clickedItemFound !== -1) {
|
|
||||||
var betweenItems = [];
|
|
||||||
var toItem = Math.max(previousItemFound, clickedItemFound);
|
|
||||||
// skip first and last item in this loop, we add them to selection after the loop
|
|
||||||
for (var i = (Math.min(previousItemFound, clickedItemFound) + 1); i < toItem; i++) {
|
|
||||||
visibleEntities[i].elRow.className = 'selected';
|
|
||||||
betweenItems.push(visibleEntities[i].id);
|
|
||||||
}
|
|
||||||
if (previousItemFound > clickedItemFound) {
|
|
||||||
// always make sure that we add the items in the right order
|
|
||||||
betweenItems.reverse();
|
|
||||||
}
|
|
||||||
selection = selection.concat(betweenItems, selectedEntities);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
selectedEntities = selection;
|
|
||||||
|
|
||||||
this.className = 'selected';
|
|
||||||
|
|
||||||
EventBridge.emitWebEvent(JSON.stringify({
|
|
||||||
type: "selectionUpdate",
|
|
||||||
focus: false,
|
|
||||||
entityIds: selection,
|
|
||||||
}));
|
|
||||||
|
|
||||||
refreshFooter();
|
|
||||||
}
|
|
||||||
|
|
||||||
function onRowDoubleClicked() {
|
|
||||||
var entityID = this.getAttribute("id");
|
|
||||||
EventBridge.emitWebEvent(JSON.stringify({
|
|
||||||
type: "selectionUpdate",
|
|
||||||
focus: true,
|
|
||||||
entityIds: [entityID],
|
|
||||||
}));
|
|
||||||
}
|
|
||||||
|
|
||||||
var elSortOrder = {
|
|
||||||
name: document.querySelector('#entity-name .sort-order'),
|
|
||||||
type: document.querySelector('#entity-type .sort-order'),
|
|
||||||
url: document.querySelector('#entity-url .sort-order'),
|
|
||||||
locked: document.querySelector('#entity-locked .sort-order'),
|
|
||||||
visible: document.querySelector('#entity-visible .sort-order'),
|
|
||||||
verticesCount: document.querySelector('#entity-verticesCount .sort-order'),
|
|
||||||
texturesCount: document.querySelector('#entity-texturesCount .sort-order'),
|
|
||||||
texturesSize: document.querySelector('#entity-texturesSize .sort-order'),
|
|
||||||
hasTransparent: document.querySelector('#entity-hasTransparent .sort-order'),
|
|
||||||
isBaked: document.querySelector('#entity-isBaked .sort-order'),
|
|
||||||
drawCalls: document.querySelector('#entity-drawCalls .sort-order'),
|
|
||||||
hasScript: document.querySelector('#entity-hasScript .sort-order'),
|
|
||||||
}
|
|
||||||
function setSortColumn(column) {
|
|
||||||
PROFILE("set-sort-column", function() {
|
|
||||||
if (currentSortColumn === column) {
|
|
||||||
currentSortOrder *= -1;
|
|
||||||
} else {
|
|
||||||
elSortOrder[currentSortColumn].innerHTML = "";
|
|
||||||
currentSortColumn = column;
|
|
||||||
currentSortOrder = ASCENDING_SORT;
|
|
||||||
}
|
|
||||||
elSortOrder[column].innerHTML = currentSortOrder == ASCENDING_SORT ? ASCENDING_STRING : DESCENDING_STRING;
|
|
||||||
refreshEntityList();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function clearEntities() {
|
|
||||||
entities = {};
|
|
||||||
refreshFooter();
|
|
||||||
}
|
|
||||||
|
|
||||||
function refreshFooter() {
|
|
||||||
if (selectedEntities.length > 1) {
|
|
||||||
elFooter.firstChild.nodeValue = selectedEntities.length + " entities selected";
|
|
||||||
} else if (selectedEntities.length === 1) {
|
|
||||||
elFooter.firstChild.nodeValue = "1 entity selected";
|
|
||||||
} else if (visibleEntities.length === 1) {
|
|
||||||
elFooter.firstChild.nodeValue = "1 entity found";
|
|
||||||
} else {
|
|
||||||
elFooter.firstChild.nodeValue = visibleEntities.length + " entities found";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function refreshEntities() {
|
|
||||||
clearEntities();
|
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'refresh' }));
|
|
||||||
}
|
|
||||||
|
|
||||||
function refreshEntityList() {
|
|
||||||
PROFILE("refresh-entity-list", function() {
|
|
||||||
PROFILE("filter", function() {
|
|
||||||
var searchTerm = elFilter.value;
|
|
||||||
if (searchTerm === '') {
|
|
||||||
visibleEntities = entities.slice(0);
|
|
||||||
} else {
|
|
||||||
visibleEntities = entities.filter(function(e) {
|
|
||||||
return e.name.indexOf(searchTerm) > -1
|
|
||||||
|| e.type.indexOf(searchTerm) > -1
|
|
||||||
|| e.fullUrl.indexOf(searchTerm) > -1;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
PROFILE("sort", function() {
|
|
||||||
var cmp = currentSortOrder === ASCENDING_SORT ? COMPARE_ASCENDING : COMPARE_DESCENDING;
|
|
||||||
visibleEntities.sort(cmp);
|
|
||||||
});
|
|
||||||
|
|
||||||
PROFILE("update-dom", function() {
|
|
||||||
entityList.setVisibleItemData(visibleEntities);
|
|
||||||
entityList.refresh();
|
|
||||||
});
|
|
||||||
|
|
||||||
refreshFooter();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function decimalMegabytes(number) {
|
|
||||||
return number ? (number / BYTES_PER_MEGABYTE).toFixed(1) : "";
|
|
||||||
}
|
|
||||||
|
|
||||||
function displayIfNonZero(number) {
|
|
||||||
return number ? number : "";
|
|
||||||
}
|
|
||||||
|
|
||||||
function getFilename(url) {
|
|
||||||
var urlParts = url.split('/');
|
|
||||||
return urlParts[urlParts.length - 1];
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateEntityData(entityData) {
|
|
||||||
entities = [];
|
|
||||||
entitiesByID = {};
|
|
||||||
visibleEntities = [];
|
|
||||||
|
|
||||||
PROFILE("map-data", function() {
|
|
||||||
entityData.forEach(function(entity) {
|
|
||||||
var type = entity.type
|
|
||||||
var filename = getFilename(entity.url);
|
|
||||||
if (filename === IMAGE_MODEL_NAME) {
|
|
||||||
type = "Image";
|
|
||||||
}
|
|
||||||
|
|
||||||
var entityData = {
|
|
||||||
id: entity.id,
|
|
||||||
name: entity.name,
|
|
||||||
type: type,
|
|
||||||
url: filename,
|
|
||||||
fullUrl: entity.url,
|
|
||||||
locked: entity.locked ? LOCKED_GLYPH : null,
|
|
||||||
visible: entity.visible ? VISIBLE_GLYPH : null,
|
|
||||||
verticesCount: displayIfNonZero(entity.verticesCount),
|
|
||||||
texturesCount: displayIfNonZero(entity.texturesCount),
|
|
||||||
texturesSize: decimalMegabytes(entity.texturesSize),
|
|
||||||
hasTransparent: entity.hasTransparent ? TRANSPARENCY_GLYPH : null,
|
|
||||||
isBaked: entity.isBaked ? BAKED_GLYPH : null,
|
|
||||||
drawCalls: displayIfNonZero(entity.drawCalls),
|
|
||||||
hasScript: entity.hasScript ? SCRIPT_GLYPH : null,
|
|
||||||
elRow : null
|
|
||||||
}
|
|
||||||
|
|
||||||
entities.push(entityData);
|
|
||||||
entitiesByID[entityData.id] = entityData;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateSelectedEntities(selectedIDs) {
|
|
||||||
var notFound = false;
|
|
||||||
for (var id in entitiesByID) {
|
|
||||||
if (entitiesByID[id].elRow) {
|
|
||||||
entitiesByID[id].elRow.className = '';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
selectedEntities = [];
|
|
||||||
for (var i = 0; i < selectedIDs.length; i++) {
|
|
||||||
var id = selectedIDs[i];
|
|
||||||
selectedEntities.push(id);
|
|
||||||
if (id in entities) {
|
|
||||||
var entity = entitiesByID[id];
|
|
||||||
entity.elRow.className = 'selected';
|
|
||||||
} else {
|
|
||||||
notFound = true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
refreshFooter();
|
|
||||||
|
|
||||||
return notFound;
|
|
||||||
}
|
|
||||||
|
|
||||||
function removeEntities(deletedIDs) {
|
|
||||||
for (var i = 0, length = deletedIDs.length; i < length; i++) {
|
|
||||||
var deleteID = deletedIDs[i];
|
|
||||||
delete entitiesByID[deleteID];
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function resize() {
|
|
||||||
// Take up available window space
|
|
||||||
elEntityTableScroll.style.height = window.innerHeight - 207;
|
|
||||||
|
|
||||||
var SCROLLABAR_WIDTH = 21;
|
|
||||||
var tds = document.querySelectorAll("#entity-table-body tr:first-child td");
|
|
||||||
var ths = document.querySelectorAll("#entity-table thead th");
|
|
||||||
if (tds.length >= ths.length) {
|
|
||||||
// Update the widths of the header cells to match the body
|
|
||||||
for (var i = 0; i < ths.length; i++) {
|
|
||||||
ths[i].width = tds[i].offsetWidth;
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
// Reasonable widths if nothing is displayed
|
|
||||||
var tableWidth = document.getElementById("entity-table").offsetWidth - SCROLLABAR_WIDTH;
|
|
||||||
if (showExtraInfo) {
|
|
||||||
ths[0].width = 0.10 * tableWidth;
|
|
||||||
ths[1].width = 0.20 * tableWidth;
|
|
||||||
ths[2].width = 0.20 * tableWidth;
|
|
||||||
ths[3].width = 0.04 * tableWidth;
|
|
||||||
ths[4].width = 0.04 * tableWidth;
|
|
||||||
ths[5].width = 0.08 * tableWidth;
|
|
||||||
ths[6].width = 0.08 * tableWidth;
|
|
||||||
ths[7].width = 0.10 * tableWidth;
|
|
||||||
ths[8].width = 0.04 * tableWidth;
|
|
||||||
ths[9].width = 0.08 * tableWidth;
|
|
||||||
ths[10].width = 0.04 * tableWidth + SCROLLABAR_WIDTH;
|
|
||||||
} else {
|
|
||||||
ths[0].width = 0.16 * tableWidth;
|
|
||||||
ths[1].width = 0.34 * tableWidth;
|
|
||||||
ths[2].width = 0.34 * tableWidth;
|
|
||||||
ths[3].width = 0.08 * tableWidth;
|
|
||||||
ths[4].width = 0.08 * tableWidth;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
var showExtraInfo = false;
|
|
||||||
var COLLAPSE_EXTRA_INFO = "E";
|
|
||||||
var EXPAND_EXTRA_INFO = "D";
|
|
||||||
|
|
||||||
function toggleInfo(event) {
|
|
||||||
showExtraInfo = !showExtraInfo;
|
|
||||||
if (showExtraInfo) {
|
|
||||||
elEntityTable.className = "showExtraInfo";
|
|
||||||
elInfoToggleGlyph.innerHTML = COLLAPSE_EXTRA_INFO;
|
|
||||||
} else {
|
|
||||||
elEntityTable.className = "";
|
|
||||||
elInfoToggleGlyph.innerHTML = EXPAND_EXTRA_INFO;
|
|
||||||
}
|
|
||||||
resize();
|
|
||||||
event.stopPropagation();
|
|
||||||
}
|
|
||||||
elInfoToggle.addEventListener("click", toggleInfo, true);
|
|
||||||
|
|
||||||
document.addEventListener("keydown", function (keyDownEvent) {
|
|
||||||
if (keyDownEvent.target.nodeName === "INPUT") {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
var keyCode = keyDownEvent.keyCode;
|
|
||||||
if (keyCode === DELETE) {
|
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'delete' }));
|
|
||||||
refreshEntities();
|
|
||||||
}
|
|
||||||
if (keyDownEvent.keyCode === KEY_P && keyDownEvent.ctrlKey) {
|
|
||||||
if (keyDownEvent.shiftKey) {
|
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'unparent' }));
|
|
||||||
} else {
|
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'parent' }));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}, false);
|
|
||||||
|
|
||||||
var isFilterInView = false;
|
|
||||||
var FILTER_IN_VIEW_ATTRIBUTE = "pressed";
|
|
||||||
elNoEntitiesInView.style.display = "none";
|
|
||||||
elInView.onclick = function () {
|
|
||||||
isFilterInView = !isFilterInView;
|
|
||||||
if (isFilterInView) {
|
|
||||||
elInView.setAttribute(FILTER_IN_VIEW_ATTRIBUTE, FILTER_IN_VIEW_ATTRIBUTE);
|
|
||||||
elNoEntitiesInView.style.display = "inline";
|
|
||||||
} else {
|
|
||||||
elInView.removeAttribute(FILTER_IN_VIEW_ATTRIBUTE);
|
|
||||||
elNoEntitiesInView.style.display = "none";
|
|
||||||
}
|
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: "filterInView", filterInView: isFilterInView }));
|
|
||||||
refreshEntities();
|
|
||||||
}
|
|
||||||
|
|
||||||
elRadius.onchange = function () {
|
|
||||||
elRadius.value = Math.max(elRadius.value, 0);
|
|
||||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'radius', radius: elRadius.value }));
|
|
||||||
refreshEntities();
|
|
||||||
elNoEntitiesRadius.firstChild.nodeValue = elRadius.value;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (window.EventBridge !== undefined) {
|
|
||||||
EventBridge.scriptEventReceived.connect(function(data) {
|
|
||||||
data = JSON.parse(data);
|
|
||||||
if (data.type === "clearEntityList") {
|
|
||||||
clearEntities();
|
|
||||||
} else if (data.type == "selectionUpdate") {
|
|
||||||
var notFound = updateSelectedEntities(data.selectedIDs);
|
|
||||||
if (notFound) {
|
|
||||||
refreshEntities();
|
|
||||||
}
|
|
||||||
} else if (data.type === "update" && data.selectedIDs !== undefined) {
|
|
||||||
PROFILE("update", function() {
|
|
||||||
var newEntities = data.entities;
|
|
||||||
if (newEntities && newEntities.length == 0) {
|
|
||||||
elNoEntitiesMessage.style.display = "block";
|
|
||||||
elFooter.firstChild.nodeValue = "0 entities found";
|
|
||||||
} else if (newEntities) {
|
|
||||||
elNoEntitiesMessage.style.display = "none";
|
|
||||||
updateEntityData(newEntities);
|
|
||||||
refreshEntityList();
|
|
||||||
updateSelectedEntities(data.selectedIDs);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
} else if (data.type === "removeEntities" && data.deletedIDs !== undefined && data.selectedIDs !== undefined) {
|
|
||||||
removeEntities(data.deletedIDs);
|
|
||||||
updateSelectedEntities(data.selectedIDs);
|
|
||||||
} else if (data.type === "deleted" && data.ids) {
|
|
||||||
removeEntities(data.ids);
|
|
||||||
refreshFooter();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
setSortColumn('type');
|
|
||||||
resize();
|
|
||||||
entityList.initialize(572);
|
|
||||||
refreshEntities();
|
|
||||||
});
|
|
||||||
|
|
||||||
// Disable right-click context menu which is not visible in the HMD and makes it seem like the app has locked
|
|
||||||
document.addEventListener("contextmenu", function (event) {
|
|
||||||
event.preventDefault();
|
|
||||||
}, false);
|
|
||||||
}
|
|
||||||
|
|
@ -20,27 +20,9 @@ EntityListTool = function(shouldUseEditTabletApp) {
|
||||||
var ENTITY_LIST_WIDTH = 495;
|
var ENTITY_LIST_WIDTH = 495;
|
||||||
var MAX_DEFAULT_CREATE_TOOLS_HEIGHT = 778;
|
var MAX_DEFAULT_CREATE_TOOLS_HEIGHT = 778;
|
||||||
|
|
||||||
var defaultEntityListWindow = createEntityListWindow(Script.resourcesPath() + "qml/hifi/tablet/EditEntityList.qml",
|
var entityListWindow = new CreateWindow(
|
||||||
'Entity List');
|
Script.resourcesPath() + "qml/hifi/tablet/EditEntityList.qml",
|
||||||
var newEntityListWindow = createEntityListWindow(Script.resourcesPath() + "qml/hifi/tablet/EditEntityListNew.qml",
|
'Entity List',
|
||||||
'Entity List (New)');
|
|
||||||
var entityListWindow = defaultEntityListWindow;
|
|
||||||
|
|
||||||
var webView = null;
|
|
||||||
webView = Tablet.getTablet("com.highfidelity.interface.tablet.system");
|
|
||||||
webView.setVisible = function(value){ };
|
|
||||||
|
|
||||||
var filterInView = false;
|
|
||||||
var searchRadius = 100;
|
|
||||||
|
|
||||||
var visible = false;
|
|
||||||
|
|
||||||
that.webView = webView;
|
|
||||||
|
|
||||||
function createEntityListWindow(entityListPath, windowName) {
|
|
||||||
var listWindow = new CreateWindow(
|
|
||||||
entityListPath,
|
|
||||||
windowName,
|
|
||||||
'com.highfidelity.create.entityListWindow',
|
'com.highfidelity.create.entityListWindow',
|
||||||
function () {
|
function () {
|
||||||
var windowHeight = Window.innerHeight - TITLE_OFFSET;
|
var windowHeight = Window.innerHeight - TITLE_OFFSET;
|
||||||
|
|
@ -60,12 +42,17 @@ EntityListTool = function(shouldUseEditTabletApp) {
|
||||||
},
|
},
|
||||||
false
|
false
|
||||||
);
|
);
|
||||||
return listWindow;
|
|
||||||
}
|
|
||||||
|
|
||||||
that.setUseNewEntityList = function(useNewEntityList) {
|
var webView = null;
|
||||||
entityListWindow = useNewEntityList ? newEntityListWindow : defaultEntityListWindow;
|
webView = Tablet.getTablet("com.highfidelity.interface.tablet.system");
|
||||||
};
|
webView.setVisible = function(value){ };
|
||||||
|
|
||||||
|
var filterInView = false;
|
||||||
|
var searchRadius = 100;
|
||||||
|
|
||||||
|
var visible = false;
|
||||||
|
|
||||||
|
that.webView = webView;
|
||||||
|
|
||||||
that.setVisible = function(newVisible) {
|
that.setVisible = function(newVisible) {
|
||||||
visible = newVisible;
|
visible = newVisible;
|
||||||
|
|
@ -261,8 +248,7 @@ EntityListTool = function(shouldUseEditTabletApp) {
|
||||||
};
|
};
|
||||||
|
|
||||||
webView.webEventReceived.connect(onWebEventReceived);
|
webView.webEventReceived.connect(onWebEventReceived);
|
||||||
defaultEntityListWindow.webEventReceived.addListener(onWebEventReceived);
|
entityListWindow.webEventReceived.addListener(onWebEventReceived);
|
||||||
newEntityListWindow.webEventReceived.addListener(onWebEventReceived);
|
|
||||||
that.interactiveWindowHidden = entityListWindow.interactiveWindowHidden;
|
that.interactiveWindowHidden = entityListWindow.interactiveWindowHidden;
|
||||||
|
|
||||||
return that;
|
return that;
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue