61 lines
2.7 KiB
JavaScript
61 lines
2.7 KiB
JavaScript
const {remote} = require('electron');
|
|
const {dialog,Menu,MenuItem} = remote;
|
|
|
|
module.exports = function(Cat) {
|
|
return {
|
|
init: function(dom) {
|
|
let treeView = document.querySelector('#element-selector');
|
|
treeView.addEventListener('click-row', evt => {
|
|
if (!evt.detail.targetNode) return;
|
|
Cat.focusedProject.view.focusedElement = evt.detail.targetNode;
|
|
});
|
|
treeView.parentNode.addEventListener('contextmenu', evt => {
|
|
var target = evt.target;
|
|
if (target.tagName === 'CAT-TREE-CELL') {
|
|
target = target.parentNode;
|
|
}
|
|
const treeMenu = new Menu();
|
|
if (target !== null && target !== undefined && target === treeView.selectedRow) {
|
|
treeMenu.append(new MenuItem({label: 'Insert Element Before', enabled: (Cat.focusedProject ? true : false), click() {
|
|
}}));
|
|
treeMenu.append(new MenuItem({label: 'Insert Element Into', enabled: (Cat.focusedProject ? true : false), click() {
|
|
}}));
|
|
treeMenu.append(new MenuItem({label: 'Insert Element After', enabled: (Cat.focusedProject ? true : false), click() {
|
|
}}));
|
|
} else {
|
|
treeMenu.append(new MenuItem({label: 'Insert Element', enabled: (Cat.focusedProject ? true : false), click() {
|
|
}}));
|
|
}
|
|
if (target.tagName !== 'CAT-TREE-ROW') {
|
|
target = treeView.selectedRow;
|
|
}
|
|
|
|
treeMenu.append(new MenuItem({type: 'separator'}));
|
|
treeMenu.append(new MenuItem({label: 'Delete', enabled: (target ? true : false), click() {
|
|
treeView.removeRow(target);
|
|
}}));
|
|
treeMenu.popup({async: true});
|
|
});
|
|
treeView.addEventListener('remove-row', evt => {
|
|
console.log(evt.detail.row);
|
|
if (evt.detail.row.targetNode && evt.detail.row.targetNode.parentNode) evt.detail.row.targetNode.parentNode.removeChild(evt.detail.row.targetNode);
|
|
});
|
|
|
|
},
|
|
on: {
|
|
// Add hook for when an element is selected on the project view, we select the given row in our elements tree
|
|
'project-loaded': e => {
|
|
e.detail.proj.view.addEventListener('selected-element', evt => {
|
|
var el = this.elementsView.getMatchingRow(evt.detail);
|
|
if (el) this.elementsView.selectedRow = el;
|
|
});
|
|
},
|
|
// Add hook for when a project is focused, we rebuild the elements tree to correspond to the target DOM
|
|
'project-focused': e => {
|
|
this.elementsView = document.querySelector('#element-selector');
|
|
this.elementsView.cloneDomToRows(Cat.focusedProject.view.querySelector('iframe').contentDocument.querySelector('body'), ["tagName", "class", "id"]);
|
|
}
|
|
}
|
|
}
|
|
};
|