Add support for 'name' to edit.js

examples/edit.js

@@ -1213,6 +1213,9 @@ PropertiesTool = function(opts) {
                     data.properties.rotation = Quat.fromPitchYawRollDegrees(rotation.x, rotation.y, rotation.z);
                 }
                 Entities.editEntity(selectionManager.selections[0], data.properties);
+                if (data.properties.name != undefined) {
+                    entityListTool.sendUpdate();
+                }
             }
             pushCommandForSelections();
             selectionManager._update();

examples/html/entityList.html

@@ -13,7 +13,7 @@
         var DESC_STRING = ' ▴';
 
         function loaded() {
-            entityList = new List('entity-list', { valueNames: ['type', 'url']});
+            entityList = new List('entity-list', { valueNames: ['name', 'type', 'url']});
             entityList.clear();
             elEntityTable = document.getElementById("entity-table");
             elEntityTableBody = document.getElementById("entity-table-body");
@@ -22,6 +22,9 @@
             elTeleport = document.getElementById("teleport");
             elNoEntitiesMessage = document.getElementById("no-entities");
 
+            document.getElementById("entity-name").onclick = function() {
+                setSortColumn('name');
+            };
             document.getElementById("entity-type").onclick = function() {
                 setSortColumn('type');
             };
@@ -56,31 +59,34 @@
                 }));
             }
 
-            function addEntity(id, type, url) {
+            function addEntity(id, name, type, url) {
                 if (entities[id] === undefined) {
                     var urlParts = url.split('/');
                     var filename = urlParts[urlParts.length - 1];
 
-                    entityList.add([{ id: id, type: type, url: filename }], function(items) {
+                    entityList.add([{ id: id, name: name, type: type, url: filename }], function(items) {
                             var el = items[0].elm;
                             var id = items[0]._values.id;
                             entities[id] = {
                                 id: id,
-                                name: id,
+                                name: name,
                                 el: el,
+                                item: items[0],
                             };
                             el.setAttribute('id', 'entity_' + id);
                             el.setAttribute('title', url);
                             el.dataset.entityId = id;
                             el.onclick = onRowClicked;
                             el.ondblclick = onRowDoubleClicked;
-                            el.innerHTML
                     });
 
                     if (refreshEntityListTimer) {
                         clearTimeout(refreshEntityListTimer);
                     }
                     refreshEntityListTimer = setTimeout(refreshEntityListObject, 50);
+                } else {
+                    var item = entities[id].item;
+                    item.values({ name: name, url: url });
                 }
             }
 
@@ -90,6 +96,7 @@
             }
 
             var elSortOrder = {
+                name: document.querySelector('#entity-name .sort-order'),
                 type: document.querySelector('#entity-type .sort-order'),
                 url: document.querySelector('#entity-url .sort-order'),
             }
@@ -164,7 +171,7 @@
                             elNoEntitiesMessage.style.display = "none";
                             for (var i = 0; i < newEntities.length; i++) {
                                 var id = newEntities[i].id;
-                                addEntity(id, newEntities[i].type, newEntities[i].url);
+                                addEntity(id, newEntities[i].name, newEntities[i].type, newEntities[i].url);
                             }
                             updateSelectedEntities(data.selectedIDs);
                         }
@@ -190,6 +197,7 @@
             <thead>
                 <tr>
                     <th id="entity-type" data-sort="type">Type <span class="sort-order" style="display: inline">&nbsp;&#x25BE;</span></th>
+                    <th id="entity-name" data-sort="type">Name <span class="sort-order" style="display: inline">&nbsp;&#x25BE;</span></th>
                     <th id="entity-url" data-sort="url">URL <span class="sort-order" style="display: none">&nbsp;&#x25BE;</span></th>
                 </tr>
             </thead>
@@ -197,6 +205,7 @@
                 <tr>
                     <td class="id" style="display: none">Type</td>
                     <td class="type">Type</td>
+                    <td class="name">Name</td>
                     <td class="url"><div class='outer'><div class='inner'>URL</div></div></td>
                 </tr>
             </tbody>

examples/html/entityProperties.html

@@ -98,6 +98,7 @@
             var allSections = [];
             var elID = document.getElementById("property-id");
             var elType = document.getElementById("property-type");
+            var elName = document.getElementById("property-name");
             var elLocked = document.getElementById("property-locked");
             var elVisible = document.getElementById("property-visible");
             var elPositionX = document.getElementById("property-pos-x");
@@ -262,6 +263,8 @@
                                 enableChildren(document.getElementById("properties-list"), 'input');
                             }
 
+                            elName.value = properties.name;
+
                             elVisible.checked = properties.visible;
 
                             elPositionX.value = properties.position.x.toFixed(2);
@@ -395,6 +398,7 @@
             }
 
             elLocked.addEventListener('change', createEmitCheckedPropertyUpdateFunction('locked'));
+            elName.addEventListener('change', createEmitTextPropertyUpdateFunction('name'));
             elVisible.addEventListener('change', createEmitCheckedPropertyUpdateFunction('visible'));
 
             var positionChangeFunction = createEmitVec3PropertyUpdateFunction(
@@ -590,6 +594,12 @@
                 <label id="property-id" class="selectable"></label>
             </div>
         </div>
+        <div class="property">
+            <span class="label" style="float: left; margin-right: 6px">Name</span>
+            <div class="value" style="overflow: hidden;">
+                <input type="text" id="property-name"></input>
+            </div>
+        </div>
         <div class="property">
             <span class="label">Locked</span>
             <span class="value">

examples/html/style.css

@@ -301,3 +301,7 @@ input[type="number"]::-webkit-inner-spin-button:hover,
 input[type="number"]::-webkit-inner-spin-button:active{
     opacity: .8;
 }
+
+input#property-name {
+    width: 100%;
+}

examples/libraries/entityList.js

@@ -31,7 +31,7 @@ EntityListTool = function(opts) {
         webView.eventBridge.emitScriptEvent(JSON.stringify(data));
     });
 
-    function sendUpdate() {
+    that.sendUpdate = function() {
         var entities = [];
         var ids = Entities.findEntities(MyAvatar.position, 100);
         for (var i = 0; i < ids.length; i++) {
@@ -39,6 +39,7 @@ EntityListTool = function(opts) {
             var properties = Entities.getEntityProperties(id);
             entities.push({
                 id: id.id,
+                name: properties.name,
                 type: properties.type,
                 url: properties.type == "Model" ? properties.modelURL : "",
             });
@@ -76,7 +77,7 @@ EntityListTool = function(opts) {
                                     Menu.isOptionChecked(MENU_EASE_ON_FOCUS));
             }
         } else if (data.type == "refresh") {
-            sendUpdate();
+            that.sendUpdate();
         } else if (data.type == "teleport") {
             if (selectionManager.hasSelection()) {
                 MyAvatar.position = selectionManager.worldPosition;