mirror of
https://github.com/gchq/CyberChef.git
synced 2025-05-08 15:25:01 -04:00
restore recipe on refresh
This commit is contained in:
parent
21ed26e104
commit
4a07d52230
11 changed files with 215 additions and 217 deletions
|
@ -37,7 +37,7 @@ export class COperationList extends HTMLElement {
|
|||
ul.classList.add("op-list");
|
||||
|
||||
this.opNames.forEach((opName => {
|
||||
const li = new COperationLi(
|
||||
const cOpLi = new COperationLi(
|
||||
this.app,
|
||||
opName,
|
||||
{
|
||||
|
@ -47,41 +47,91 @@ export class COperationList extends HTMLElement {
|
|||
this.includeStarIcon
|
||||
);
|
||||
|
||||
ul.appendChild(li);
|
||||
ul.appendChild(cOpLi);
|
||||
}))
|
||||
|
||||
if (this.isSortable) {
|
||||
const sortableList = Sortable.create(ul, {
|
||||
group: "sorting",
|
||||
sort: true,
|
||||
draggable: "c-operation-li",
|
||||
onFilter: function (e) {
|
||||
const el = sortableList.closest(e.item);
|
||||
if (el && el.parentNode) {
|
||||
$(el).popover("dispose");
|
||||
el.parentNode.removeChild(el);
|
||||
}
|
||||
},
|
||||
onEnd: function(e) {
|
||||
if (this.removeIntent) {
|
||||
$(e.item).popover("dispose");
|
||||
e.item.remove();
|
||||
}
|
||||
}.bind(this),
|
||||
});
|
||||
this.createSortableList(ul);
|
||||
} else if (!this.app.isMobileView() && this.isCloneable) {
|
||||
const cloneableList = Sortable.create(ul, {
|
||||
group: {
|
||||
name: "recipe",
|
||||
pull: "clone",
|
||||
},
|
||||
draggable: "c-operation-li",
|
||||
sort: false
|
||||
})
|
||||
this.createCloneableList(ul, "recipe", "rec-list"); // target name and id can be component params if needed to make it reusable
|
||||
}
|
||||
|
||||
this.append(ul);
|
||||
}
|
||||
|
||||
/**
|
||||
* Create a sortable ( not cloneable ) list
|
||||
*
|
||||
* @param { HTMLElement } ul
|
||||
* */
|
||||
createSortableList(ul) {
|
||||
const sortableList = Sortable.create(ul, {
|
||||
group: "sorting",
|
||||
sort: true,
|
||||
draggable: "c-operation-li",
|
||||
onFilter: function (e) {
|
||||
const el = sortableList.closest(e.item);
|
||||
if (el && el.parentNode) {
|
||||
$(el).popover("dispose");
|
||||
el.parentNode.removeChild(el);
|
||||
}
|
||||
},
|
||||
onEnd: function(e) {
|
||||
if (this.app.manager.recipe.removeIntent) {
|
||||
$(e.item).popover("dispose");
|
||||
e.item.remove();
|
||||
}
|
||||
}.bind(this),
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Create a cloneable ( not sortable ) list
|
||||
*
|
||||
* @param { HTMLElement } ul
|
||||
* @param { string } targetListName
|
||||
* @param { string } targetListId
|
||||
* */
|
||||
createCloneableList(ul, targetListName, targetListId) {
|
||||
Sortable.create(ul, {
|
||||
group: {
|
||||
name: targetListName,
|
||||
pull: "clone",
|
||||
put: false,
|
||||
},
|
||||
draggable: "c-operation-li",
|
||||
sort: false,
|
||||
setData: function(dataTransfer, dragEl) {
|
||||
dataTransfer.setData("Text", dragEl.querySelector("li").getAttribute("data-name"));
|
||||
},
|
||||
onStart: function(e) {
|
||||
// Removes popover element and event bindings from the dragged operation but not the
|
||||
// event bindings from the one left in the operations list. Without manually removing
|
||||
// these bindings, we cannot re-initialise the popover on the stub operation.
|
||||
$(e.item)
|
||||
.popover("dispose")
|
||||
.removeData("bs.popover")
|
||||
.off("mouseenter")
|
||||
.off("mouseleave")
|
||||
.attr("data-toggle", "popover-disabled");
|
||||
$(e.clone)
|
||||
.off(".popover")
|
||||
.removeData("bs.popover");
|
||||
},
|
||||
// @todo: popovers dont display anymore after dragging into recipe list and then hovering the op
|
||||
onEnd: ({item}) => {
|
||||
if (item.parentNode.id === targetListId) {
|
||||
this.app.manager.recipe.addOperation(item.name);
|
||||
item.remove();
|
||||
return;
|
||||
}
|
||||
|
||||
if (item.parentNode.id !== targetListId) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
customElements.define("c-operation-list", COperationList);
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue