diff --git a/README.md b/README.md index 655ae4ee..4aad3e13 100755 --- a/README.md +++ b/README.md @@ -71,14 +71,12 @@ You can use as many operations as you like in simple or complex ways. Some examp - It should be noted that none of your recipe configuration or input (either text or files) is ever sent to the CyberChef web server - all processing is carried out within your browser, on your own computer. - Due to this feature, CyberChef can be downloaded and run locally. You can use the link in the top left corner of the app to download a full copy of CyberChef and drop it into a virtual machine, share it with other people, or host it in a closed network. - ## Deep linking By manipulation of CyberChef's URL hash, you can change the initial settings with which the page opens. The format is `https://gchq.github.io/CyberChef/#recipe=Operation()&input=...` -Supported arguments are `recipe`, `input` (encoded in Base64), and `theme`. - +Supported arguments are `recipe`, `input` (encoded in Base64), `theme`, and `embed`. All options except `embed` (which if present will render CyberChef with fewer frames so it's more easily embedded) take a single argument. ## Browser support diff --git a/src/web/App.mjs b/src/web/App.mjs index 1039b7b2..aa9736b3 100755 --- a/src/web/App.mjs +++ b/src/web/App.mjs @@ -41,6 +41,7 @@ class App { this.autoBakePause = false; this.progress = 0; this.ingId = 0; + this.embed = false; } @@ -454,6 +455,7 @@ class App { * If recipe is present, replaces the current recipe with the recipe provided in the URI. * If input is present, decodes and sets the input to the one provided in the URI. * If theme is present, uses the theme. + * If embed mode is set, hides UI elements to increase space. * * @fires Manager#statechange */ @@ -497,6 +499,17 @@ class App { this.manager.options.changeTheme(Utils.escapeHtml(this.uriParams.theme)); } + if (this.uriParams.embed) { + this.embed = true; + this.columnSplitter.destroy(); + document.getElementById("operations").style.display = "none"; + document.getElementById("recipe").style.display = "none"; + document.getElementById("IO").style.width = "100%"; + + document.getElementById("options").style.display = "none"; + document.getElementById("edit").style.display = "inline"; + } + this.autoBakePause = false; window.dispatchEvent(this.manager.statechange); } @@ -579,7 +592,9 @@ class App { * Resets the splitter positions to default. */ resetLayout() { - this.columnSplitter.setSizes([20, 30, 50]); + if (!this.embed) { + this.columnSplitter.setSizes([20, 30, 50]); + } this.ioSplitter.setSizes([50, 50]); this.manager.recipe.adjustWidth(); this.manager.input.calcMaxTabs(); diff --git a/src/web/Manager.mjs b/src/web/Manager.mjs index cb579721..e0e119a8 100755 --- a/src/web/Manager.mjs +++ b/src/web/Manager.mjs @@ -121,6 +121,7 @@ class Manager { document.getElementById("load-name").addEventListener("change", this.controls.loadNameChange.bind(this.controls)); document.getElementById("load-button").addEventListener("click", this.controls.loadButtonClick.bind(this.controls)); document.getElementById("support").addEventListener("click", this.controls.supportButtonClick.bind(this.controls)); + document.getElementById("edit").addEventListener("click", this.controls.editButtonClick.bind(this.controls)); this.addMultiEventListeners("#save-texts textarea", "keyup paste", this.controls.saveTextChange, this.controls); // Operations diff --git a/src/web/html/index.html b/src/web/html/index.html index c15c673a..1012e75b 100755 --- a/src/web/html/index.html +++ b/src/web/html/index.html @@ -162,6 +162,7 @@
diff --git a/src/web/waiters/ControlsWaiter.mjs b/src/web/waiters/ControlsWaiter.mjs index 2f2705aa..c953b064 100755 --- a/src/web/waiters/ControlsWaiter.mjs +++ b/src/web/waiters/ControlsWaiter.mjs @@ -355,6 +355,17 @@ ${navigator.userAgent} } } + /** + * Open the page in a new window. + * + * @param {event} e + */ + editButtonClick(e) { + e.preventDefault(); + const saveLink = this.generateStateUrl(true, true, null, null, "https://gchq.github.io/CyberChef/"); + window.open(saveLink, "_blank"); + } + /** * Shows the stale indicator to show that the input or recipe has changed