|
|
@@ -1,174 +1,180 @@
|
|
|
/**
|
|
|
- * Waiter to handle events related to the CyberChef options.
|
|
|
- *
|
|
|
* @author n1474335 [n1474335@gmail.com]
|
|
|
* @copyright Crown Copyright 2016
|
|
|
* @license Apache-2.0
|
|
|
- *
|
|
|
- * @constructor
|
|
|
- * @param {App} app - The main view object for CyberChef.
|
|
|
*/
|
|
|
-const OptionsWaiter = function(app, manager) {
|
|
|
- this.app = app;
|
|
|
- this.manager = manager;
|
|
|
-};
|
|
|
-
|
|
|
|
|
|
/**
|
|
|
- * Loads options and sets values of switches and inputs to match them.
|
|
|
- *
|
|
|
- * @param {Object} options
|
|
|
+ * Waiter to handle events related to the CyberChef options.
|
|
|
*/
|
|
|
-OptionsWaiter.prototype.load = function(options) {
|
|
|
- for (const option in options) {
|
|
|
- this.app.options[option] = options[option];
|
|
|
- }
|
|
|
-
|
|
|
- // Set options to match object
|
|
|
- const cboxes = document.querySelectorAll("#options-body input[type=checkbox]");
|
|
|
- let i;
|
|
|
- for (i = 0; i < cboxes.length; i++) {
|
|
|
- cboxes[i].checked = this.app.options[cboxes[i].getAttribute("option")];
|
|
|
+class OptionsWaiter {
|
|
|
+
|
|
|
+ /**
|
|
|
+ * OptionsWaiter constructor.
|
|
|
+ *
|
|
|
+ * @param {App} app - The main view object for CyberChef.
|
|
|
+ * @param {Manager} manager - The CyberChef event manager.
|
|
|
+ */
|
|
|
+ constructor(app, manager) {
|
|
|
+ this.app = app;
|
|
|
+ this.manager = manager;
|
|
|
}
|
|
|
|
|
|
- const nboxes = document.querySelectorAll("#options-body input[type=number]");
|
|
|
- for (i = 0; i < nboxes.length; i++) {
|
|
|
- nboxes[i].value = this.app.options[nboxes[i].getAttribute("option")];
|
|
|
- nboxes[i].dispatchEvent(new CustomEvent("change", {bubbles: true}));
|
|
|
- }
|
|
|
+ /**
|
|
|
+ * Loads options and sets values of switches and inputs to match them.
|
|
|
+ *
|
|
|
+ * @param {Object} options
|
|
|
+ */
|
|
|
+ load(options) {
|
|
|
+ for (const option in options) {
|
|
|
+ this.app.options[option] = options[option];
|
|
|
+ }
|
|
|
|
|
|
- const selects = document.querySelectorAll("#options-body select");
|
|
|
- for (i = 0; i < selects.length; i++) {
|
|
|
- const val = this.app.options[selects[i].getAttribute("option")];
|
|
|
- if (val) {
|
|
|
- selects[i].value = val;
|
|
|
- selects[i].dispatchEvent(new CustomEvent("change", {bubbles: true}));
|
|
|
- } else {
|
|
|
- selects[i].selectedIndex = 0;
|
|
|
+ // Set options to match object
|
|
|
+ const cboxes = document.querySelectorAll("#options-body input[type=checkbox]");
|
|
|
+ let i;
|
|
|
+ for (i = 0; i < cboxes.length; i++) {
|
|
|
+ cboxes[i].checked = this.app.options[cboxes[i].getAttribute("option")];
|
|
|
}
|
|
|
- }
|
|
|
-};
|
|
|
|
|
|
+ const nboxes = document.querySelectorAll("#options-body input[type=number]");
|
|
|
+ for (i = 0; i < nboxes.length; i++) {
|
|
|
+ nboxes[i].value = this.app.options[nboxes[i].getAttribute("option")];
|
|
|
+ nboxes[i].dispatchEvent(new CustomEvent("change", {bubbles: true}));
|
|
|
+ }
|
|
|
|
|
|
-/**
|
|
|
- * Handler for options click events.
|
|
|
- * Dispays the options pane.
|
|
|
- *
|
|
|
- * @param {event} e
|
|
|
- */
|
|
|
-OptionsWaiter.prototype.optionsClick = function(e) {
|
|
|
- e.preventDefault();
|
|
|
- $("#options-modal").modal();
|
|
|
-};
|
|
|
+ const selects = document.querySelectorAll("#options-body select");
|
|
|
+ for (i = 0; i < selects.length; i++) {
|
|
|
+ const val = this.app.options[selects[i].getAttribute("option")];
|
|
|
+ if (val) {
|
|
|
+ selects[i].value = val;
|
|
|
+ selects[i].dispatchEvent(new CustomEvent("change", {bubbles: true}));
|
|
|
+ } else {
|
|
|
+ selects[i].selectedIndex = 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
|
|
|
-/**
|
|
|
- * Handler for reset options click events.
|
|
|
- * Resets options back to their default values.
|
|
|
- */
|
|
|
-OptionsWaiter.prototype.resetOptionsClick = function() {
|
|
|
- this.load(this.app.doptions);
|
|
|
-};
|
|
|
+ /**
|
|
|
+ * Handler for options click events.
|
|
|
+ * Dispays the options pane.
|
|
|
+ *
|
|
|
+ * @param {event} e
|
|
|
+ */
|
|
|
+ optionsClick(e) {
|
|
|
+ e.preventDefault();
|
|
|
+ $("#options-modal").modal();
|
|
|
+ }
|
|
|
|
|
|
|
|
|
-/**
|
|
|
- * Handler for switch change events.
|
|
|
- * Modifies the option state and saves it to local storage.
|
|
|
- *
|
|
|
- * @param {event} e
|
|
|
- */
|
|
|
-OptionsWaiter.prototype.switchChange = function(e) {
|
|
|
- const el = e.target;
|
|
|
- const option = el.getAttribute("option");
|
|
|
- const state = el.checked;
|
|
|
+ /**
|
|
|
+ * Handler for reset options click events.
|
|
|
+ * Resets options back to their default values.
|
|
|
+ */
|
|
|
+ resetOptionsClick() {
|
|
|
+ this.load(this.app.doptions);
|
|
|
+ }
|
|
|
|
|
|
- log.debug(`Setting ${option} to ${state}`);
|
|
|
- this.app.options[option] = state;
|
|
|
|
|
|
- if (this.app.isLocalStorageAvailable())
|
|
|
- localStorage.setItem("options", JSON.stringify(this.app.options));
|
|
|
-};
|
|
|
+ /**
|
|
|
+ * Handler for switch change events.
|
|
|
+ *
|
|
|
+ * @param {event} e
|
|
|
+ */
|
|
|
+ switchChange(e) {
|
|
|
+ const el = e.target;
|
|
|
+ const option = el.getAttribute("option");
|
|
|
+ const state = el.checked;
|
|
|
|
|
|
+ this.updateOption(option, state);
|
|
|
+ }
|
|
|
|
|
|
-/**
|
|
|
- * Handler for number change events.
|
|
|
- * Modifies the option value and saves it to local storage.
|
|
|
- *
|
|
|
- * @param {event} e
|
|
|
- */
|
|
|
-OptionsWaiter.prototype.numberChange = function(e) {
|
|
|
- const el = e.target;
|
|
|
- const option = el.getAttribute("option");
|
|
|
- const val = parseInt(el.value, 10);
|
|
|
|
|
|
- log.debug(`Setting ${option} to ${val}`);
|
|
|
- this.app.options[option] = val;
|
|
|
+ /**
|
|
|
+ * Handler for number change events.
|
|
|
+ *
|
|
|
+ * @param {event} e
|
|
|
+ */
|
|
|
+ numberChange(e) {
|
|
|
+ const el = e.target;
|
|
|
+ const option = el.getAttribute("option");
|
|
|
+ const val = parseInt(el.value, 10);
|
|
|
|
|
|
- if (this.app.isLocalStorageAvailable())
|
|
|
- localStorage.setItem("options", JSON.stringify(this.app.options));
|
|
|
-};
|
|
|
+ this.updateOption(option, val);
|
|
|
+ }
|
|
|
|
|
|
|
|
|
-/**
|
|
|
- * Handler for select change events.
|
|
|
- * Modifies the option value and saves it to local storage.
|
|
|
- *
|
|
|
- * @param {event} e
|
|
|
- */
|
|
|
-OptionsWaiter.prototype.selectChange = function(e) {
|
|
|
- const el = e.target;
|
|
|
- const option = el.getAttribute("option");
|
|
|
+ /**
|
|
|
+ * Handler for select change events.
|
|
|
+ *
|
|
|
+ * @param {event} e
|
|
|
+ */
|
|
|
+ selectChange(e) {
|
|
|
+ const el = e.target;
|
|
|
+ const option = el.getAttribute("option");
|
|
|
|
|
|
- log.debug(`Setting ${option} to ${el.value}`);
|
|
|
- this.app.options[option] = el.value;
|
|
|
+ this.updateOption(option, el.value);
|
|
|
+ }
|
|
|
|
|
|
- if (this.app.isLocalStorageAvailable())
|
|
|
- localStorage.setItem("options", JSON.stringify(this.app.options));
|
|
|
-};
|
|
|
+ /**
|
|
|
+ * Modifies an option value and saves it to local storage.
|
|
|
+ *
|
|
|
+ * @param {string} option - The option to be updated
|
|
|
+ * @param {string|number|boolean} value - The new value of the option
|
|
|
+ */
|
|
|
+ updateOption(option, value) {
|
|
|
+ log.debug(`Setting ${option} to ${value}`);
|
|
|
+ this.app.options[option] = value;
|
|
|
+
|
|
|
+ if (this.app.isLocalStorageAvailable())
|
|
|
+ localStorage.setItem("options", JSON.stringify(this.app.options));
|
|
|
+ }
|
|
|
|
|
|
|
|
|
-/**
|
|
|
- * Sets or unsets word wrap on the input and output depending on the wordWrap option value.
|
|
|
- */
|
|
|
-OptionsWaiter.prototype.setWordWrap = function() {
|
|
|
- document.getElementById("input-text").classList.remove("word-wrap");
|
|
|
- document.getElementById("output-text").classList.remove("word-wrap");
|
|
|
- document.getElementById("output-html").classList.remove("word-wrap");
|
|
|
- document.getElementById("input-highlighter").classList.remove("word-wrap");
|
|
|
- document.getElementById("output-highlighter").classList.remove("word-wrap");
|
|
|
-
|
|
|
- if (!this.app.options.wordWrap) {
|
|
|
- document.getElementById("input-text").classList.add("word-wrap");
|
|
|
- document.getElementById("output-text").classList.add("word-wrap");
|
|
|
- document.getElementById("output-html").classList.add("word-wrap");
|
|
|
- document.getElementById("input-highlighter").classList.add("word-wrap");
|
|
|
- document.getElementById("output-highlighter").classList.add("word-wrap");
|
|
|
+ /**
|
|
|
+ * Sets or unsets word wrap on the input and output depending on the wordWrap option value.
|
|
|
+ */
|
|
|
+ setWordWrap() {
|
|
|
+ document.getElementById("input-text").classList.remove("word-wrap");
|
|
|
+ document.getElementById("output-text").classList.remove("word-wrap");
|
|
|
+ document.getElementById("output-html").classList.remove("word-wrap");
|
|
|
+ document.getElementById("input-highlighter").classList.remove("word-wrap");
|
|
|
+ document.getElementById("output-highlighter").classList.remove("word-wrap");
|
|
|
+
|
|
|
+ if (!this.app.options.wordWrap) {
|
|
|
+ document.getElementById("input-text").classList.add("word-wrap");
|
|
|
+ document.getElementById("output-text").classList.add("word-wrap");
|
|
|
+ document.getElementById("output-html").classList.add("word-wrap");
|
|
|
+ document.getElementById("input-highlighter").classList.add("word-wrap");
|
|
|
+ document.getElementById("output-highlighter").classList.add("word-wrap");
|
|
|
+ }
|
|
|
}
|
|
|
-};
|
|
|
|
|
|
|
|
|
-/**
|
|
|
- * Changes the theme by setting the class of the <html> element.
|
|
|
- *
|
|
|
- * @param {Event} e
|
|
|
- */
|
|
|
-OptionsWaiter.prototype.themeChange = function (e) {
|
|
|
- const themeClass = e.target.value;
|
|
|
+ /**
|
|
|
+ * Changes the theme by setting the class of the <html> element.
|
|
|
+ *
|
|
|
+ * @param {Event} e
|
|
|
+ */
|
|
|
+ themeChange(e) {
|
|
|
+ const themeClass = e.target.value;
|
|
|
|
|
|
- document.querySelector(":root").className = themeClass;
|
|
|
-};
|
|
|
+ document.querySelector(":root").className = themeClass;
|
|
|
+ }
|
|
|
|
|
|
|
|
|
-/**
|
|
|
- * Changes the console logging level.
|
|
|
- *
|
|
|
- * @param {Event} e
|
|
|
- */
|
|
|
-OptionsWaiter.prototype.logLevelChange = function (e) {
|
|
|
- const level = e.target.value;
|
|
|
- log.setLevel(level, false);
|
|
|
- this.manager.worker.setLogLevel();
|
|
|
- this.manager.input.setLogLevel();
|
|
|
-};
|
|
|
+ /**
|
|
|
+ * Changes the console logging level.
|
|
|
+ *
|
|
|
+ * @param {Event} e
|
|
|
+ */
|
|
|
+ logLevelChange(e) {
|
|
|
+ const level = e.target.value;
|
|
|
+ log.setLevel(level, false);
|
|
|
+ this.manager.worker.setLogLevel();
|
|
|
+ this.manager.input.setLogLevel();
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
export default OptionsWaiter;
|
n1474335