mirror of
https://github.com/gchq/CyberChef.git
synced 2025-05-07 06:57:12 -04:00
move breakpoint icon functionality into c-recipe-li, upgrade code a bit for className consistency and replacing 'parentNode.parentNode' with this.queryselector
This commit is contained in:
parent
5d876fb09a
commit
4947f809a9
6 changed files with 20 additions and 28 deletions
|
@ -627,7 +627,7 @@ class App {
|
|||
item.querySelector(".disable-icon").click();
|
||||
}
|
||||
if (recipeConfig[i].breakpoint) {
|
||||
item.querySelector(".breakpoint").click();
|
||||
item.querySelector(".breakpoint-icon").click();
|
||||
}
|
||||
|
||||
this.manager.recipe.triggerArgEvents(item);
|
||||
|
|
|
@ -153,7 +153,6 @@ class Manager {
|
|||
// Recipe
|
||||
this.addDynamicListener(".arg:not(select)", "input", this.recipe.ingChange, this.recipe);
|
||||
this.addDynamicListener(".arg[type=checkbox], .arg[type=radio], select.arg", "change", this.recipe.ingChange, this.recipe);
|
||||
this.addDynamicListener(".breakpoint", "click", this.recipe.breakpointClick, this.recipe);
|
||||
this.addDynamicListener("#rec-list .dropdown-menu.toggle-dropdown a", "click", this.recipe.dropdownToggleClick, this.recipe);
|
||||
this.addDynamicListener("textarea.arg", "dragover", this.recipe.textArgDragover, this.recipe);
|
||||
this.addDynamicListener("textarea.arg", "dragleave", this.recipe.textArgDragLeave, this.recipe);
|
||||
|
|
|
@ -50,7 +50,9 @@ export class CRecipeLi extends HTMLElement {
|
|||
*/
|
||||
handleClick(e) {
|
||||
const disableIcon = this.querySelector("i.disable-icon");
|
||||
const breakpointIcon = this.querySelector("i.breakpoint-icon");
|
||||
|
||||
// handle click on 'disable-icon'
|
||||
if (e.target === disableIcon) {
|
||||
if (disableIcon.getAttribute("disabled") === "false") {
|
||||
disableIcon.setAttribute("disabled", "true");
|
||||
|
@ -65,6 +67,19 @@ export class CRecipeLi extends HTMLElement {
|
|||
this.app.progress = 0;
|
||||
window.dispatchEvent(this.app.manager.statechange);
|
||||
}
|
||||
|
||||
// handle click on 'breakpoint-icon'
|
||||
if (e.target === breakpointIcon) {
|
||||
if (breakpointIcon.getAttribute("break") === "false") {
|
||||
breakpointIcon.setAttribute("break", "true");
|
||||
breakpointIcon.classList.add("breakpoint-selected");
|
||||
} else {
|
||||
breakpointIcon.setAttribute("break", "false");
|
||||
breakpointIcon.classList.remove("breakpoint-selected");
|
||||
}
|
||||
|
||||
window.dispatchEvent(this.app.manager.statechange);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -132,7 +147,7 @@ export class CRecipeLi extends HTMLElement {
|
|||
|
||||
const breakPointIcon = document.createElement("i");
|
||||
breakPointIcon.classList.add("material-icons");
|
||||
breakPointIcon.classList.add("breakpoint");
|
||||
breakPointIcon.classList.add("breakpoint-icon");
|
||||
breakPointIcon.setAttribute("title", "Set breakpoint");
|
||||
breakPointIcon.setAttribute("break", "false");
|
||||
breakPointIcon.setAttribute("data-help-title", "Setting breakpoints");
|
||||
|
|
|
@ -301,7 +301,7 @@ input.toggle-string {
|
|||
color: var(--disable-icon-selected-colour);
|
||||
}
|
||||
|
||||
.breakpoint {
|
||||
.breakpoint-icon {
|
||||
color: var(--breakpoint-icon-colour);
|
||||
}
|
||||
|
||||
|
|
|
@ -64,7 +64,7 @@ class BindingsWaiter {
|
|||
case "KeyB": // Set breakpoint
|
||||
e.preventDefault();
|
||||
try {
|
||||
elem = document.activeElement.closest(".operation").querySelectorAll(".breakpoint")[0];
|
||||
elem = document.activeElement.closest(".operation").querySelectorAll(".breakpoint-icon")[0];
|
||||
if (elem.getAttribute("break") === "false") {
|
||||
elem.setAttribute("break", "true"); // add break point if not already enabled
|
||||
elem.classList.add("breakpoint-selected");
|
||||
|
|
|
@ -161,28 +161,6 @@ class RecipeWaiter {
|
|||
}
|
||||
|
||||
|
||||
/**
|
||||
* Handler for breakpoint click events.
|
||||
* Updates the icon status.
|
||||
*
|
||||
* @fires Manager#statechange
|
||||
* @param {Event} e
|
||||
*/
|
||||
breakpointClick(e) {
|
||||
const bp = e.target;
|
||||
|
||||
if (bp.getAttribute("break") === "false") {
|
||||
bp.setAttribute("break", "true");
|
||||
bp.classList.add("breakpoint-selected");
|
||||
} else {
|
||||
bp.setAttribute("break", "false");
|
||||
bp.classList.remove("breakpoint-selected");
|
||||
}
|
||||
|
||||
window.dispatchEvent(this.manager.statechange);
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Generates a configuration object to represent the current recipe.
|
||||
*
|
||||
|
@ -196,7 +174,7 @@ class RecipeWaiter {
|
|||
for (let i = 0; i < operations.length; i++) {
|
||||
ingredients = [];
|
||||
disabled = operations[i].querySelector(".disable-icon");
|
||||
bp = operations[i].querySelector(".breakpoint");
|
||||
bp = operations[i].querySelector(".breakpoint-icon");
|
||||
ingList = operations[i].querySelectorAll(".arg");
|
||||
|
||||
for (let j = 0; j < ingList.length; j++) {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue