diff --git a/scripts/system/html/css/edit-style.css b/scripts/system/html/css/edit-style.css
index e7e577a13b..956ae529ab 100644
--- a/scripts/system/html/css/edit-style.css
+++ b/scripts/system/html/css/edit-style.css
@@ -1812,7 +1812,7 @@ body#entity-list-body {
}
.context-menu li {
list-style-type: none;
- padding: 0 5px 0 5px;
+ padding: 4px 18px 4px 18px;
margin: 0;
white-space: nowrap;
}
@@ -1820,8 +1820,9 @@ body#entity-list-body {
background-color: #e3e3e3;
}
.context-menu li.separator {
- border-top: 1px solid #000000;
+ border-top: 1px solid #333333;
margin: 5px 5px;
+ padding: 0 0;
}
.context-menu li.disabled {
color: #333333;
diff --git a/scripts/system/html/js/entityList.js b/scripts/system/html/js/entityList.js
index 67187e6a3e..749f750ecb 100644
--- a/scripts/system/html/js/entityList.js
+++ b/scripts/system/html/js/entityList.js
@@ -70,7 +70,10 @@ var selectedEntities = [];
var entityList = null; // The ListView
-var entityListContextMenu = new EntityListContextMenu();
+/**
+ * @type EntityListContextMenu
+ */
+var entityListContextMenu = null;
var currentSortColumn = 'type';
var currentSortOrder = ASCENDING_SORT;
@@ -187,21 +190,24 @@ function loaded() {
entityList = new ListView(elEntityTableBody, elEntityTableScroll, elEntityTableHeaderRow,
createRow, updateRow, clearRow, WINDOW_NONVARIABLE_HEIGHT);
- entityListContextMenu.initialize();
+ entityListContextMenu = new EntityListContextMenu();
function startRenamingEntity(entityID) {
- if (!entitiesByID[entityID] || !entitiesByID[entityID].elRow) {
+ let entity = entitiesByID[entityID];
+ if (!entity || entity.locked || !entity.elRow) {
return;
}
- let elCell = entitiesByID[entityID].elRow.childNodes[COLUMN_INDEX.NAME];
+ let elCell = entity.elRow.childNodes[COLUMN_INDEX.NAME];
let elRenameInput = document.createElement("input");
elRenameInput.setAttribute('class', 'rename-entity');
- elRenameInput.value = entitiesByID[entityID].name;
- elRenameInput.onclick = function(event) {
+ elRenameInput.value = entity.name;
+ let ignoreClicks = function(event) {
event.stopPropagation();
};
+ elRenameInput.onclick = ignoreClicks;
+ elRenameInput.ondblclick = ignoreClicks;
elRenameInput.onkeyup = function(keyEvent) {
if (keyEvent.key === "Enter") {
elRenameInput.blur();
@@ -215,7 +221,7 @@ function loaded() {
entityID: entityID,
name: value
}));
- entitiesByID[entityID].name = value;
+ entity.name = value;
elCell.innerText = value;
};
@@ -260,13 +266,20 @@ function loaded() {
refreshFooter();
}
- entityListContextMenu.open(clickEvent, entityID);
+
+ let enabledContextMenuItems = [];
+ if (entitiesByID[entityID] && !entitiesByID[entityID].locked) {
+ enabledContextMenuItems.push('Rename');
+ enabledContextMenuItems.push('Delete');
+ }
+
+ entityListContextMenu.open(clickEvent, entityID, enabledContextMenuItems);
}
function onRowClicked(clickEvent) {
let entityID = this.dataset.entityID;
let selection = [entityID];
-
+
if (clickEvent.ctrlKey) {
let selectedIndex = selectedEntities.indexOf(entityID);
if (selectedIndex >= 0) {
@@ -759,7 +772,7 @@ function loaded() {
}, false);
// close context menu when switching focus to another window
- $(window).blur(function(){
+ $(window).blur(function() {
entityListContextMenu.close.call(entityListContextMenu);
});
}
diff --git a/scripts/system/html/js/entityListContextMenu.js b/scripts/system/html/js/entityListContextMenu.js
index 59ae2f1f73..62fe951ebe 100644
--- a/scripts/system/html/js/entityListContextMenu.js
+++ b/scripts/system/html/js/entityListContextMenu.js
@@ -19,6 +19,8 @@ const CONTEXT_MENU_CLASS = "context-menu";
function EntityListContextMenu() {
this._elContextMenu = null;
this._callback = null;
+ this._listItems = [];
+ this._initialize();
}
EntityListContextMenu.prototype = {
@@ -38,6 +40,11 @@ EntityListContextMenu.prototype = {
*/
_selectedEntityID: null,
+ /**
+ * @private
+ */
+ _listItems: null,
+
/**
* Close the context menu
*/
@@ -55,10 +62,17 @@ EntityListContextMenu.prototype = {
* Open the context menu
* @param clickEvent
* @param selectedEntityID
+ * @param enabledOptions
*/
- open: function(clickEvent, selectedEntityID) {
+ open: function(clickEvent, selectedEntityID, enabledOptions) {
this._selectedEntityID = selectedEntityID;
- // If the right-clicked item has a context menu open it.
+
+ this._listItems.forEach(function(listItem) {
+ let enabled = enabledOptions.includes(listItem.label);
+ listItem.enabled = enabled;
+ listItem.element.setAttribute('class', enabled ? '' : 'disabled');
+ });
+
this._elContextMenu.style.display = "block";
this._elContextMenu.style.left
= Math.min(clickEvent.pageX, document.body.offsetWidth - this._elContextMenu.offsetWidth).toString() + "px";
@@ -85,15 +99,21 @@ EntityListContextMenu.prototype = {
let elListItem = document.createElement("li");
elListItem.innerText = itemLabel;
- if (isEnabled === undefined || isEnabled) {
- elListItem.addEventListener("click", function () {
- if (this._callback) {
- this._callback.call(this, itemLabel, this._selectedEntityID);
- }
- }.bind(this), false);
- } else {
- elListItem.setAttribute('class', 'disabled');
- }
+ let listItem = {
+ label: itemLabel,
+ element: elListItem,
+ enabled: false
+ };
+
+ elListItem.addEventListener("click", function () {
+ if (listItem.enabled && this._callback) {
+ this._callback.call(this, itemLabel, this._selectedEntityID);
+ }
+ }.bind(this), false);
+
+ elListItem.setAttribute('class', 'disabled');
+
+ this._listItems.push(listItem);
this._elContextMenu.appendChild(elListItem);
},
@@ -109,8 +129,9 @@ EntityListContextMenu.prototype = {
/**
* Initialize the context menu.
+ * @private
*/
- initialize: function() {
+ _initialize: function() {
this._elContextMenu = document.createElement("ul");
this._elContextMenu.setAttribute("class", CONTEXT_MENU_CLASS);
document.body.appendChild(this._elContextMenu);