mirror of
https://github.com/gchq/CyberChef.git
synced 2024-11-16 08:58:30 +01:00
Bring highlighting back.
Fix backgroundMagic using output result instead of dish value
This commit is contained in:
j433866
parent
f1a2cf7efc
commit
35d6c7d79e
5 changed files with 86 additions and 23 deletions
|
|
@ -126,8 +126,8 @@ class HighlighterWaiter {
|
|||
*/
|
||||
inputScroll(e) {
|
||||
const el = e.target;
|
||||
// document.getElementById("input-highlighter").scrollTop = el.scrollTop;
|
||||
// document.getElementById("input-highlighter").scrollLeft = el.scrollLeft;
|
||||
document.getElementById("input-highlighter").scrollTop = el.scrollTop;
|
||||
document.getElementById("input-highlighter").scrollLeft = el.scrollLeft;
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -326,7 +326,7 @@ class HighlighterWaiter {
|
|||
* Removes highlighting and selection information.
|
||||
*/
|
||||
removeHighlights() {
|
||||
// document.getElementById("input-highlighter").innerHTML = "";
|
||||
document.getElementById("input-highlighter").innerHTML = "";
|
||||
document.getElementById("output-highlighter").innerHTML = "";
|
||||
document.getElementById("input-selection-info").innerHTML = "";
|
||||
document.getElementById("output-selection-info").innerHTML = "";
|
||||
|
|
|
|||
|
|
@ -504,6 +504,9 @@ class InputWaiter {
|
|||
const fileOverlay = document.getElementById("input-file");
|
||||
if (fileOverlay.style.display === "block") return;
|
||||
|
||||
// Remove highlighting from input and output panes as the offsets might be different now
|
||||
this.manager.highlighter.removeHighlights();
|
||||
|
||||
const textArea = document.getElementById("input-text");
|
||||
const value = (textArea.value !== undefined) ? textArea.value : "";
|
||||
const activeTab = this.getActiveTab();
|
||||
|
|
@ -857,6 +860,10 @@ class InputWaiter {
|
|||
*/
|
||||
changeTab(inputNum, changeOutput) {
|
||||
const tabsList = document.getElementById("input-tabs");
|
||||
|
||||
this.manager.highlighter.removeHighlights();
|
||||
getSelection().removeAllRanges();
|
||||
|
||||
let found = false;
|
||||
let minNum = Number.MAX_SAFE_INTEGER;
|
||||
for (let i = 0; i < tabsList.children.length; i++) {
|
||||
|
|
@ -985,6 +992,9 @@ class InputWaiter {
|
|||
this.manager.worker.cancelBake();
|
||||
this.manager.output.removeAllOutputs();
|
||||
|
||||
this.manager.highlighter.removeHighlights();
|
||||
getSelection().removeAllRanges();
|
||||
|
||||
const tabsList = document.getElementById("input-tabs").children;
|
||||
for (let i = tabsList.length - 1; i >= 0; i--) {
|
||||
tabsList.item(i).remove();
|
||||
|
|
@ -1002,6 +1012,9 @@ class InputWaiter {
|
|||
const inputNum = this.getActiveTab();
|
||||
if (inputNum === -1) return;
|
||||
|
||||
this.manager.highlighter.removeHighlights();
|
||||
getSelection().removeAllRanges();
|
||||
|
||||
this.updateInputValue(inputNum, "");
|
||||
|
||||
this.set({
|
||||
|
|
|
|||
|
|
@ -152,10 +152,10 @@ class Manager {
|
|||
this.addListeners("#input-text,#input-file", "dragover", this.input.inputDragover, this.input);
|
||||
this.addListeners("#input-text,#input-file", "dragleave", this.input.inputDragleave, this.input);
|
||||
this.addListeners("#input-text,#input-file", "drop", this.input.inputDrop, this.input);
|
||||
// document.getElementById("input-text").addEventListener("scroll", this.highlighter.inputScroll.bind(this.highlighter));
|
||||
// document.getElementById("input-text").addEventListener("mouseup", this.highlighter.inputMouseup.bind(this.highlighter));
|
||||
// document.getElementById("input-text").addEventListener("mousemove", this.highlighter.inputMousemove.bind(this.highlighter));
|
||||
// this.addMultiEventListener("#input-text", "mousedown dblclick select", this.highlighter.inputMousedown, this.highlighter);
|
||||
document.getElementById("input-text").addEventListener("scroll", this.highlighter.inputScroll.bind(this.highlighter));
|
||||
document.getElementById("input-text").addEventListener("mouseup", this.highlighter.inputMouseup.bind(this.highlighter));
|
||||
document.getElementById("input-text").addEventListener("mousemove", this.highlighter.inputMousemove.bind(this.highlighter));
|
||||
this.addMultiEventListener("#input-text", "mousedown dblclick select", this.highlighter.inputMousedown, this.highlighter);
|
||||
document.querySelector("#input-file .close").addEventListener("click", this.input.clearIoClick.bind(this.input));
|
||||
document.getElementById("btn-new-tab").addEventListener("click", this.input.addInputClick.bind(this.input));
|
||||
document.getElementById("btn-previous-input-tab").addEventListener("click", this.input.changeTabLeft.bind(this.input));
|
||||
|
|
@ -187,13 +187,13 @@ class Manager {
|
|||
// document.getElementById("undo-switch").addEventListener("click", this.output.undoSwitchClick.bind(this.output));
|
||||
// document.getElementById("maximise-output").addEventListener("click", this.output.maximiseOutputClick.bind(this.output));
|
||||
document.getElementById("magic").addEventListener("click", this.output.magicClick.bind(this.output));
|
||||
// document.getElementById("output-text").addEventListener("scroll", this.highlighter.outputScroll.bind(this.highlighter));
|
||||
// document.getElementById("output-text").addEventListener("mouseup", this.highlighter.outputMouseup.bind(this.highlighter));
|
||||
// document.getElementById("output-text").addEventListener("mousemove", this.highlighter.outputMousemove.bind(this.highlighter));
|
||||
// document.getElementById("output-html").addEventListener("mouseup", this.highlighter.outputHtmlMouseup.bind(this.highlighter));
|
||||
// document.getElementById("output-html").addEventListener("mousemove", this.highlighter.outputHtmlMousemove.bind(this.highlighter));
|
||||
// this.addMultiEventListener("#output-text", "mousedown dblclick select", this.highlighter.outputMousedown, this.highlighter);
|
||||
// this.addMultiEventListener("#output-html", "mousedown dblclick select", this.highlighter.outputHtmlMousedown, this.highlighter);
|
||||
document.getElementById("output-text").addEventListener("scroll", this.highlighter.outputScroll.bind(this.highlighter));
|
||||
document.getElementById("output-text").addEventListener("mouseup", this.highlighter.outputMouseup.bind(this.highlighter));
|
||||
document.getElementById("output-text").addEventListener("mousemove", this.highlighter.outputMousemove.bind(this.highlighter));
|
||||
document.getElementById("output-html").addEventListener("mouseup", this.highlighter.outputHtmlMouseup.bind(this.highlighter));
|
||||
document.getElementById("output-html").addEventListener("mousemove", this.highlighter.outputHtmlMousemove.bind(this.highlighter));
|
||||
this.addMultiEventListener("#output-text", "mousedown dblclick select", this.highlighter.outputMousedown, this.highlighter);
|
||||
this.addMultiEventListener("#output-html", "mousedown dblclick select", this.highlighter.outputHtmlMousedown, this.highlighter);
|
||||
this.addDynamicListener("#output-file-download", "click", this.output.downloadFile, this.output);
|
||||
this.addDynamicListener("#output-file-slice i", "click", this.output.displayFileSlice, this.output);
|
||||
// document.getElementById("show-file-overlay").addEventListener("click", this.output.showFileOverlayClick.bind(this.output));
|
||||
|
|
|
|||
|
|
@ -47,14 +47,27 @@ class OutputWaiter {
|
|||
* Gets the output for the specified input number
|
||||
*
|
||||
* @param {number} inputNum
|
||||
* @param {boolean} raw
|
||||
* @returns {string | ArrayBuffer}
|
||||
*/
|
||||
getOutput(inputNum) {
|
||||
getOutput(inputNum, raw=true) {
|
||||
if (this.outputs[inputNum] === undefined || this.outputs[inputNum] === null) return -1;
|
||||
|
||||
if (this.outputs[inputNum].data === null) return "";
|
||||
|
||||
if (typeof this.outputs[inputNum].data.result === "string") {
|
||||
if (raw) {
|
||||
let data = this.outputs[inputNum].data.dish.value;
|
||||
if (Array.isArray(data)) {
|
||||
data = new Uint8Array(data.length);
|
||||
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
data[i] = this.outputs[inputNum].data.dish.value[i];
|
||||
}
|
||||
|
||||
data = data.buffer;
|
||||
}
|
||||
return data;
|
||||
} else if (typeof this.outputs[inputNum].data.result === "string") {
|
||||
return this.outputs[inputNum].data.result;
|
||||
} else {
|
||||
return this.outputs[inputNum].data.result || "";
|
||||
|
|
@ -64,10 +77,11 @@ class OutputWaiter {
|
|||
/**
|
||||
* Gets the output string or FileBuffer for the active input
|
||||
*
|
||||
* @param {boolean} [raw=true]
|
||||
* @returns {string | ArrayBuffer}
|
||||
*/
|
||||
getActive() {
|
||||
return this.getOutput(this.getActiveTab());
|
||||
getActive(raw=true) {
|
||||
return this.getOutput(this.getActiveTab(), raw);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -426,7 +440,7 @@ class OutputWaiter {
|
|||
*/
|
||||
async downloadFile() {
|
||||
const fileName = window.prompt("Please enter a filename: ", "download.dat");
|
||||
const file = new File([this.getActive()], fileName);
|
||||
const file = new File([this.getActive(true)], fileName);
|
||||
FileSaver.saveAs(file, fileName, false);
|
||||
}
|
||||
|
||||
|
|
@ -624,8 +638,12 @@ class OutputWaiter {
|
|||
changeTab(inputNum, changeInput = false) {
|
||||
const currentNum = this.getActiveTab();
|
||||
if (this.getOutput(inputNum) === -1) return;
|
||||
|
||||
this.hideMagicButton();
|
||||
|
||||
this.manager.highlighter.removeHighlights();
|
||||
getSelection().removeAllRanges();
|
||||
|
||||
const tabsWrapper = document.getElementById("output-tabs");
|
||||
const tabs = tabsWrapper.children;
|
||||
|
||||
|
|
@ -974,8 +992,9 @@ class OutputWaiter {
|
|||
*/
|
||||
backgroundMagic() {
|
||||
this.hideMagicButton();
|
||||
if (!this.app.options.autoMagic || !this.getActive()) return;
|
||||
const sample = this.getActive().slice(0, 1000) || "";
|
||||
if (!this.app.options.autoMagic || !this.getActive(true)) return;
|
||||
const sample = this.getActive(true).slice(0, 1000) || "";
|
||||
|
||||
if (sample.length || sample.byteLength) {
|
||||
this.manager.background.magic(sample);
|
||||
}
|
||||
|
|
@ -1048,7 +1067,7 @@ class OutputWaiter {
|
|||
sliceToEl = document.getElementById("output-file-slice-to"),
|
||||
sliceFrom = parseInt(sliceFromEl.value, 10),
|
||||
sliceTo = parseInt(sliceToEl.value, 10),
|
||||
str = Utils.arrayBufferToStr(this.getActive().slice(sliceFrom, sliceTo));
|
||||
str = Utils.arrayBufferToStr(this.getActive(true).slice(sliceFrom, sliceTo));
|
||||
|
||||
document.getElementById("output-text").classList.remove("blur");
|
||||
showFileOverlay.style.display = "block";
|
||||
|
|
@ -1061,7 +1080,7 @@ class OutputWaiter {
|
|||
* Copies the output to the clipboard
|
||||
*/
|
||||
copyClick() {
|
||||
let output = this.getActive();
|
||||
let output = this.getActive(true);
|
||||
|
||||
if (typeof output !== "string") {
|
||||
output = Utils.arrayBufferToStr(output);
|
||||
|
|
@ -1097,6 +1116,15 @@ class OutputWaiter {
|
|||
// Clean up
|
||||
document.body.removeChild(textarea);
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns true if the output contains carriage returns
|
||||
*
|
||||
* @returns {boolean}
|
||||
*/
|
||||
containsCR() {
|
||||
return this.getActive(true).indexOf("\r") >= 0;
|
||||
}
|
||||
}
|
||||
|
||||
export default OutputWaiter;
|
||||
|
|
|
|||
|
|
@ -519,6 +519,28 @@ class WorkerWaiter {
|
|||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Asks the ChefWorker to calculate highlight offsets if possible.
|
||||
*
|
||||
* @param {Object[]} recipeConfig
|
||||
* @param {string} direction
|
||||
* @param {Object} pos - The position object for the highlight.
|
||||
* @param {number} pos.start - The start offset.
|
||||
* @param {number} pos.end - The end offset.
|
||||
*/
|
||||
highlight(recipeConfig, direction, pos) {
|
||||
const workerIdx = this.addChefWorker();
|
||||
if (workerIdx === -1) return;
|
||||
this.chefWorkers[workerIdx].worker.postMessage({
|
||||
action: "highlight",
|
||||
data: {
|
||||
recipeConfig: recipeConfig,
|
||||
direction: direction,
|
||||
pos: pos
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export default WorkerWaiter;
|
||||
|
|
|
|||
Loading…
Reference in a new issue