mirror of
https://github.com/overte-org/overte.git
synced 2025-04-17 04:06:43 +02:00
style
This commit is contained in:
parent
4c3f5b3bbc
commit
e5ef589a3c
3 changed files with 59 additions and 24 deletions
|
@ -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;
|
||||
|
|
|
@ -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);
|
||||
});
|
||||
}
|
||||
|
|
|
@ -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);
|
||||
|
|
Loading…
Reference in a new issue