Bring highlighting back.

Fix backgroundMagic using output result instead of dish value
This commit is contained in:
j433866 2019-05-07 14:20:18 +01:00
parent f1a2cf7efc
commit 35d6c7d79e
5 changed files with 86 additions and 23 deletions

View File

@ -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 = "";

View File

@ -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({

View File

@ -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));

View File

@ -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;

View File

@ -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;