Show or hide thumbnail when the option is changed.

This commit is contained in:
j433866 2019-07-03 11:41:22 +01:00
parent cf500b7296
commit 4312d39624
2 changed files with 31 additions and 17 deletions

View file

@ -231,6 +231,7 @@ class Manager {
this.addDynamicListener(".option-item select", "change", this.options.selectChange, this.options); this.addDynamicListener(".option-item select", "change", this.options.selectChange, this.options);
document.getElementById("theme").addEventListener("change", this.options.themeChange.bind(this.options)); document.getElementById("theme").addEventListener("change", this.options.themeChange.bind(this.options));
document.getElementById("logLevel").addEventListener("change", this.options.logLevelChange.bind(this.options)); document.getElementById("logLevel").addEventListener("change", this.options.logLevelChange.bind(this.options));
document.getElementById("imagePreview").addEventListener("change", this.input.renderFileThumb.bind(this.input));
// Misc // Misc
window.addEventListener("keydown", this.bindings.parseInput.bind(this.bindings)); window.addEventListener("keydown", this.bindings.parseInput.bind(this.bindings));

View file

@ -415,6 +415,34 @@ class InputWaiter {
this.displayFilePreview(inputData); this.displayFilePreview(inputData);
} }
/**
* Render the input thumbnail
*/
async renderFileThumb() {
const activeTab = this.manager.tabs.getActiveInputTab(),
input = await this.getInputValue(activeTab),
fileThumb = document.getElementById("input-file-thumbnail");
if (typeof input === "string" ||
!this.app.options.imagePreview) {
this.resetFileThumb();
return;
}
const inputArr = new Uint8Array(input),
type = isImage(inputArr);
if (type && type !== "image/tiff" && inputArr.byteLength <= 512000) {
// Most browsers don't support displaying TIFFs, so ignore them
// Don't render images over 512000 bytes
const blob = new Blob([inputArr], {type: type}),
url = URL.createObjectURL(blob);
fileThumb.src = url;
} else {
this.resetFileThumb();
}
}
/** /**
* Reset the input thumbnail to the default icon * Reset the input thumbnail to the default icon
@ -434,28 +462,13 @@ class InputWaiter {
displayFilePreview(inputData) { displayFilePreview(inputData) {
const activeTab = this.manager.tabs.getActiveInputTab(), const activeTab = this.manager.tabs.getActiveInputTab(),
input = inputData.input, input = inputData.input,
inputText = document.getElementById("input-text"), inputText = document.getElementById("input-text");
fileThumb = document.getElementById("input-file-thumbnail");
if (inputData.inputNum !== activeTab) return; if (inputData.inputNum !== activeTab) return;
inputText.style.overflow = "hidden"; inputText.style.overflow = "hidden";
inputText.classList.add("blur"); inputText.classList.add("blur");
inputText.value = Utils.printable(Utils.arrayBufferToStr(input.slice(0, 4096))); inputText.value = Utils.printable(Utils.arrayBufferToStr(input.slice(0, 4096)));
if (this.app.options.imagePreview) { this.renderFileThumb();
const inputArr = new Uint8Array(input),
type = isImage(inputArr);
if (type && type !== "image/tiff" && inputArr.byteLength <= 512000) {
// Most browsers don't support displaying TIFFs, so ignore them
// Assume anything over 512000 bytes is truncated
const blob = new Blob([inputArr], {type: type}),
url = URL.createObjectURL(blob);
fileThumb.src = url;
} else {
this.resetFileThumb();
}
} else {
this.resetFileThumb();
}
} }