Merge pull request #14149 from thoys/feat/create/entityList-autoScroll

MS19054: [CreateApp/EntityList] auto scroll
This commit is contained in:
Ryan Huffman 2018-10-24 10:36:21 -07:00 committed by GitHub
commit 6221b9ee59
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 116 additions and 67 deletions

View file

@ -602,7 +602,7 @@ var toolBar = (function () {
Entities.editEntity(entityID, {
position: position
});
selectionManager._update();
selectionManager._update(false, this);
} else if (dimensionsCheckCount < MAX_DIMENSIONS_CHECKS) {
Script.setTimeout(dimensionsCheckFunction, DIMENSIONS_CHECK_INTERVAL);
}
@ -614,9 +614,9 @@ var toolBar = (function () {
properties.type + " would be out of bounds.");
}
selectionManager.clearSelections();
selectionManager.clearSelections(this);
entityListTool.sendUpdate();
selectionManager.setSelections([entityID]);
selectionManager.setSelections([entityID], this);
Window.setFocus();
@ -767,7 +767,7 @@ var toolBar = (function () {
}
deletedEntityTimer = Script.setTimeout(function () {
if (entitiesToDelete.length > 0) {
selectionManager.removeEntities(entitiesToDelete);
selectionManager.removeEntities(entitiesToDelete, this);
}
entityListTool.removeEntities(entitiesToDelete, selectionManager.selections);
entitiesToDelete = [];
@ -995,7 +995,7 @@ var toolBar = (function () {
gridTool.setVisible(false);
grid.setEnabled(false);
propertiesTool.setVisible(false);
selectionManager.clearSelections();
selectionManager.clearSelections(this);
cameraManager.disable();
selectionDisplay.disableTriggerMapping();
tablet.landscape = false;
@ -1123,7 +1123,7 @@ function handleOverlaySelectionToolUpdates(channel, message, sender) {
var entity = entityIconOverlayManager.findEntity(data.overlayID);
if (entity !== null) {
selectionManager.setSelections([entity]);
selectionManager.setSelections([entity], this);
}
}
}
@ -1270,7 +1270,7 @@ function mouseClickEvent(event) {
if (result === null || result === undefined) {
if (!event.isShifted) {
selectionManager.clearSelections();
selectionManager.clearSelections(this);
}
return;
}
@ -1322,9 +1322,9 @@ function mouseClickEvent(event) {
}
if (!event.isShifted) {
selectionManager.setSelections([foundEntity]);
selectionManager.setSelections([foundEntity], this);
} else {
selectionManager.addEntity(foundEntity, true);
selectionManager.addEntity(foundEntity, true, this);
}
if (wantDebug) {
@ -1622,7 +1622,7 @@ function selectAllEtitiesInCurrentSelectionBox(keepIfTouching) {
}
}
}
selectionManager.setSelections(entities);
selectionManager.setSelections(entities, this);
}
}
@ -1762,7 +1762,7 @@ function deleteSelectedEntities() {
}
if (savedProperties.length > 0) {
SelectionManager.clearSelections();
SelectionManager.clearSelections(this);
pushCommandForSelections([], savedProperties);
entityListTool.deleteEntities(deletedIDs);
}
@ -1779,7 +1779,7 @@ function toggleSelectedEntitiesLocked() {
});
}
entityListTool.sendUpdate();
selectionManager._update();
selectionManager._update(false, this);
}
}
@ -1793,7 +1793,7 @@ function toggleSelectedEntitiesVisible() {
});
}
entityListTool.sendUpdate();
selectionManager._update();
selectionManager._update(false, this);
}
}
@ -1990,7 +1990,7 @@ function importSVO(importURL) {
}
if (isActive) {
selectionManager.setSelections(pastedEntityIDs);
selectionManager.setSelections(pastedEntityIDs, this);
}
} else {
Window.notifyEditError("Can't import entities: entities would be out of bounds.");
@ -2038,7 +2038,7 @@ function deleteKey(value) {
}
function deselectKey(value) {
if (value === 0) { // on release
selectionManager.clearSelections();
selectionManager.clearSelections(this);
}
}
function toggleKey(value) {
@ -2198,7 +2198,7 @@ function applyEntityProperties(data) {
// We might be getting an undo while edit.js is disabled. If that is the case, don't set
// our selections, causing the edit widgets to display.
if (isActive) {
selectionManager.setSelections(selectedEntityIDs);
selectionManager.setSelections(selectedEntityIDs, this);
}
}
@ -2401,7 +2401,7 @@ var PropertiesTool = function (opts) {
}
}
pushCommandForSelections();
selectionManager._update();
selectionManager._update(false, this);
} else if (data.type === 'parent') {
parentSelectedEntities();
} else if (data.type === 'unparent') {
@ -2430,7 +2430,7 @@ var PropertiesTool = function (opts) {
});
}
pushCommandForSelections();
selectionManager._update();
selectionManager._update(false, this);
}
} else if (data.action === "moveAllToGrid") {
if (selectionManager.hasSelection()) {
@ -2450,7 +2450,7 @@ var PropertiesTool = function (opts) {
});
}
pushCommandForSelections();
selectionManager._update();
selectionManager._update(false, this);
}
} else if (data.action === "resetToNaturalDimensions") {
if (selectionManager.hasSelection()) {
@ -2471,7 +2471,7 @@ var PropertiesTool = function (opts) {
}
}
pushCommandForSelections();
selectionManager._update();
selectionManager._update(false, this);
}
} else if (data.action === "previewCamera") {
if (selectionManager.hasSelection()) {
@ -2489,7 +2489,7 @@ var PropertiesTool = function (opts) {
});
}
pushCommandForSelections();
selectionManager._update();
selectionManager._update(false, this);
}
} else if (data.action === "reloadClientScripts") {
if (selectionManager.hasSelection()) {

View file

@ -13,7 +13,7 @@ const DESCENDING_STRING = '&#x25BE;';
const LOCKED_GLYPH = "&#xe006;";
const VISIBLE_GLYPH = "&#xe007;";
const TRANSPARENCY_GLYPH = "&#xe00b;";
const BAKED_GLYPH = "&#xe01a;"
const BAKED_GLYPH = "&#xe01a;";
const SCRIPT_GLYPH = "k";
const BYTES_PER_MEGABYTE = 1024 * 1024;
const IMAGE_MODEL_NAME = 'default-image-model.fbx';
@ -54,10 +54,10 @@ const COMPARE_ASCENDING = function(a, b) {
}
return 1;
}
};
const COMPARE_DESCENDING = function(a, b) {
return COMPARE_ASCENDING(b, a);
}
};
// List of all entities
var entities = [];
@ -161,22 +161,22 @@ function loaded() {
};
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' }));
}
};
elFilter.onkeyup = refreshEntityList;
elFilter.onpaste = refreshEntityList;
elFilter.onchange = onFilterChange;
@ -287,7 +287,7 @@ function loaded() {
if (selectedIndex >= 0) {
selection = [];
selection = selection.concat(selectedEntities);
selection.splice(selectedIndex, 1)
selection.splice(selectedIndex, 1);
} else {
selection = selection.concat(selectedEntities);
}
@ -320,22 +320,23 @@ function loaded() {
}
}
updateSelectedEntities(selection);
updateSelectedEntities(selection, false);
EventBridge.emitWebEvent(JSON.stringify({
type: "selectionUpdate",
focus: false,
entityIds: selection,
}));
refreshFooter();
}
function onRowDoubleClicked() {
let selection = [this.dataset.entityID];
updateSelectedEntities(selection, false);
EventBridge.emitWebEvent(JSON.stringify({
type: "selectionUpdate",
focus: true,
entityIds: [this.dataset.entityID],
entityIds: selection,
}));
}
@ -382,7 +383,7 @@ function loaded() {
hasScript: entity.hasScript,
elRow: null, // if this entity has a visible row element assigned to it
selected: false // if this entity is selected for edit regardless of having a visible row
}
};
entities.push(entityData);
entitiesByID[entityData.id] = entityData;
@ -511,7 +512,7 @@ function loaded() {
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) {
@ -546,7 +547,7 @@ function loaded() {
}
}
function updateSelectedEntities(selectedIDs) {
function updateSelectedEntities(selectedIDs, autoScroll) {
let notFound = false;
// reset all currently selected entities and their rows first
@ -575,6 +576,26 @@ function loaded() {
}
});
if (autoScroll && selectedIDs.length > 0) {
let firstItem = Number.MAX_VALUE;
let lastItem = -1;
let itemFound = false;
visibleEntities.forEach(function(entity, index) {
if (selectedIDs.indexOf(entity.id) !== -1) {
if (firstItem > index) {
firstItem = index;
}
if (lastItem < index) {
lastItem = index;
}
itemFound = true;
}
});
if (itemFound) {
entityList.scrollToRow(firstItem, lastItem);
}
}
refreshFooter();
return notFound;
@ -735,7 +756,7 @@ function loaded() {
if (data.type === "clearEntityList") {
clearEntities();
} else if (data.type === "selectionUpdate") {
let notFound = updateSelectedEntities(data.selectedIDs);
let notFound = updateSelectedEntities(data.selectedIDs, true);
if (notFound) {
refreshEntities();
}
@ -747,13 +768,13 @@ function loaded() {
clearEntities();
} else {
updateEntityData(newEntities);
updateSelectedEntities(data.selectedIDs);
updateSelectedEntities(data.selectedIDs, true);
}
}
});
} else if (data.type === "removeEntities" && data.deletedIDs !== undefined && data.selectedIDs !== undefined) {
removeEntities(data.deletedIDs);
updateSelectedEntities(data.selectedIDs);
updateSelectedEntities(data.selectedIDs, true);
} else if (data.type === "deleted" && data.ids) {
removeEntities(data.ids);
}

View file

@ -38,7 +38,7 @@ function ListView(elTableBody, elTableScroll, elTableHeaderRow, createRowFunctio
this.lastRowShiftScrollTop = 0;
this.initialize();
};
}
ListView.prototype = {
getNumRows: function() {
@ -152,6 +152,30 @@ ListView.prototype = {
this.refresh();
}
},
/**
* Scrolls firstRowIndex with least effort, also tries to make the window include the other selections in case lastRowIndex is set.
* In the case that firstRowIndex and lastRowIndex are already within the visible bounds then nothing will happen.
* @param {number} firstRowIndex - The row that will be scrolled to.
* @param {number} lastRowIndex - The last index of the bound.
*/
scrollToRow: function (firstRowIndex, lastRowIndex) {
lastRowIndex = lastRowIndex ? lastRowIndex : firstRowIndex;
let boundingTop = firstRowIndex * this.rowHeight;
let boundingBottom = (lastRowIndex * this.rowHeight) + this.rowHeight;
if ((boundingBottom - boundingTop) > this.elTableScroll.clientHeight) {
boundingBottom = boundingTop + this.elTableScroll.clientHeight;
}
let currentVisibleAreaTop = this.elTableScroll.scrollTop;
let currentVisibleAreaBottom = currentVisibleAreaTop + this.elTableScroll.clientHeight;
if (boundingTop < currentVisibleAreaTop) {
this.elTableScroll.scrollTop = boundingTop;
} else if (boundingBottom > currentVisibleAreaBottom) {
this.elTableScroll.scrollTop = boundingBottom - (this.elTableScroll.clientHeight);
}
},
refresh: function() {
// block refreshing before rows are initialized

View file

@ -98,7 +98,11 @@ EntityListTool = function(shouldUseEditTabletApp) {
that.setVisible(!visible);
};
selectionManager.addEventListener(function() {
selectionManager.addEventListener(function(isSelectionUpdate, caller) {
if (caller === that) {
// ignore events that we emitted from the entity list itself
return;
}
var selectedIDs = [];
for (var i = 0; i < selectionManager.selections.length; i++) {
@ -224,7 +228,7 @@ EntityListTool = function(shouldUseEditTabletApp) {
for (var i = 0; i < ids.length; i++) {
entityIDs.push(ids[i]);
}
selectionManager.setSelections(entityIDs);
selectionManager.setSelections(entityIDs, that);
if (data.focus) {
cameraManager.enable();
cameraManager.focus(selectionManager.worldPosition,

View file

@ -40,7 +40,7 @@ SelectionManager = (function() {
Messages.messageReceived.connect(handleEntitySelectionToolUpdates);
}
// FUNCTION: HANDLE ENTITY SELECTION TOOL UDPATES
// FUNCTION: HANDLE ENTITY SELECTION TOOL UPDATES
function handleEntitySelectionToolUpdates(channel, message, sender) {
if (channel !== 'entityToolUpdates') {
return;
@ -63,7 +63,7 @@ SelectionManager = (function() {
if (wantDebug) {
print("setting selection to " + messageParsed.entityID);
}
that.setSelections([messageParsed.entityID]);
that.setSelections([messageParsed.entityID], that);
}
} else if (messageParsed.method === "clearSelection") {
if (!SelectionDisplay.triggered() || SelectionDisplay.triggeredHand === messageParsed.hand) {
@ -136,7 +136,7 @@ SelectionManager = (function() {
return that.selections.length > 0;
};
that.setSelections = function(entityIDs) {
that.setSelections = function(entityIDs, caller) {
that.selections = [];
for (var i = 0; i < entityIDs.length; i++) {
var entityID = entityIDs[i];
@ -144,10 +144,10 @@ SelectionManager = (function() {
Selection.addToSelectedItemsList(HIGHLIGHT_LIST_NAME, "entity", entityID);
}
that._update(true);
that._update(true, caller);
};
that.addEntity = function(entityID, toggleSelection) {
that.addEntity = function(entityID, toggleSelection, caller) {
if (entityID) {
var idx = -1;
for (var i = 0; i < that.selections.length; i++) {
@ -165,7 +165,7 @@ SelectionManager = (function() {
}
}
that._update(true);
that._update(true, caller);
};
function removeEntityByID(entityID) {
@ -176,21 +176,21 @@ SelectionManager = (function() {
}
}
that.removeEntity = function (entityID) {
that.removeEntity = function (entityID, caller) {
removeEntityByID(entityID);
that._update(true);
that._update(true, caller);
};
that.removeEntities = function(entityIDs) {
that.removeEntities = function(entityIDs, caller) {
for (var i = 0, length = entityIDs.length; i < length; i++) {
removeEntityByID(entityIDs[i]);
}
that._update(true);
that._update(true, caller);
};
that.clearSelections = function() {
that.clearSelections = function(caller) {
that.selections = [];
that._update(true);
that._update(true, caller);
};
that.addChildrenEntities = function(parentEntityID, entityList) {
@ -477,7 +477,7 @@ SelectionManager = (function() {
undoHistory.pushCommand(undo, copiedProperties, redo, copiedProperties);
};
that._update = function(selectionUpdated) {
that._update = function(selectionUpdated, caller) {
var properties = null;
if (that.selections.length === 0) {
that.localDimensions = null;
@ -542,7 +542,7 @@ SelectionManager = (function() {
for (var j = 0; j < listeners.length; j++) {
try {
listeners[j](selectionUpdated === true);
listeners[j](selectionUpdated === true, caller);
} catch (e) {
print("ERROR: entitySelectionTool.update got exception: " + JSON.stringify(e));
}
@ -985,7 +985,7 @@ SelectionDisplay = (function() {
that.pressedHand = NO_HAND;
that.triggered = function() {
return that.triggeredHand !== NO_HAND;
}
};
function pointingAtDesktopWindowOrTablet(hand) {
var pointingAtDesktopWindow = (hand === Controller.Standard.RightHand &&
SelectionManager.pointingAtDesktopWindowRight) ||
@ -1032,7 +1032,7 @@ SelectionDisplay = (function() {
that.disableTriggerMapping = function() {
that.triggerClickMapping.disable();
that.triggerPressMapping.disable();
}
};
Script.scriptEnding.connect(that.disableTriggerMapping);
// FUNCTION DEF(s): Intersection Check Helpers
@ -1234,7 +1234,7 @@ SelectionDisplay = (function() {
if (wantDebug) {
print(" Trigger SelectionManager::update");
}
SelectionManager._update();
SelectionManager._update(false, that);
if (wantDebug) {
print("=============== eST::MouseMoveEvent END =======================");
@ -1299,7 +1299,7 @@ SelectionDisplay = (function() {
lastMouseEvent.isControl = event.isControl;
lastMouseEvent.isAlt = event.isAlt;
activeTool.onMove(lastMouseEvent);
SelectionManager._update();
SelectionManager._update(false, this);
}
};
@ -1315,7 +1315,7 @@ SelectionDisplay = (function() {
lastMouseEvent.isControl = event.isControl;
lastMouseEvent.isAlt = event.isAlt;
activeTool.onMove(lastMouseEvent);
SelectionManager._update();
SelectionManager._update(false, this);
}
};
@ -2179,7 +2179,7 @@ SelectionDisplay = (function() {
}
}
SelectionManager._update();
SelectionManager._update(false, this);
}
});
}
@ -2301,7 +2301,7 @@ SelectionDisplay = (function() {
previousPickRay = pickRay;
SelectionManager._update();
SelectionManager._update(false, this);
}
});
}
@ -2488,7 +2488,7 @@ SelectionDisplay = (function() {
previousPickRay = pickRay;
SelectionManager._update();
SelectionManager._update(false, this);
}
});
}
@ -2599,7 +2599,7 @@ SelectionDisplay = (function() {
previousPickRay = pickRay;
SelectionManager._update();
SelectionManager._update(false, this);
}
});
}