move page functions code to page-functions.js
This commit is contained in:
parent
a43a72977d
commit
4581de1132
2 changed files with 47 additions and 47 deletions
|
|
@ -1764,43 +1764,6 @@ function ResetCompletion(db) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* Focuses, selects and copies to clipboard contents inside a clicked element. Includes optional tooltip update after the copying is done.
|
|
||||||
* @param {MouseEvent} mouseEvent from the clicked element (AddEventListener)
|
|
||||||
* @param {string} tooltipId Element ID of the tooltip to update
|
|
||||||
* @param {string} tooltipFill Updated contents of the tooltip
|
|
||||||
*/
|
|
||||||
function SelectCopyInputText(mouseEvent, tooltipId = "", tooltipFill = "") {
|
|
||||||
|
|
||||||
const element = document.getElementById(mouseEvent.target.id);
|
|
||||||
|
|
||||||
// this prevents the un-selected effect after clicking the second time (clears all selection first)
|
|
||||||
if (window.getSelection) {
|
|
||||||
window.getSelection().removeAllRanges();
|
|
||||||
}
|
|
||||||
|
|
||||||
element.focus(); // best to focus the element first before selecting
|
|
||||||
element.select();
|
|
||||||
element.setSelectionRange(0, 99999); // for mobile devices
|
|
||||||
|
|
||||||
// Copy the text inside the text field to clipboard
|
|
||||||
document.execCommand("copy");
|
|
||||||
|
|
||||||
// optional tooltip showing
|
|
||||||
if (tooltipFill.length && tooltipId.length) FillInnerHTML(tooltipId, tooltipFill);
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Fills the innerHTML of a given HTML Element with provided contents
|
|
||||||
* @param {string} elementId Element ID to update
|
|
||||||
* @param {string} textFill Updated contents (innerHTML)
|
|
||||||
*/
|
|
||||||
function FillInnerHTML(elementId, textFill) {
|
|
||||||
|
|
||||||
const element = document.getElementById(elementId);
|
|
||||||
element.innerHTML = textFill;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ----------------------- Event Listeners -------------------------- */
|
/* ----------------------- Event Listeners -------------------------- */
|
||||||
|
|
||||||
// Populate HTML at load (before img and css)
|
// Populate HTML at load (before img and css)
|
||||||
|
|
@ -1808,16 +1771,6 @@ document.addEventListener("DOMContentLoaded", () => {
|
||||||
InitializeHTMLPopulation(HK);
|
InitializeHTMLPopulation(HK);
|
||||||
});
|
});
|
||||||
|
|
||||||
// Does an action when the save file location input text is clicked once (auto select & copy to clipboard)
|
|
||||||
document.getElementById("save-location-input").addEventListener("click", (e) => {
|
|
||||||
SelectCopyInputText(e, "save-location-input-tooltip", "Copied save file location to clipboard");
|
|
||||||
}, false);
|
|
||||||
|
|
||||||
// Choose File input field
|
|
||||||
document.getElementById("save-location-input").addEventListener("mouseout", () => {
|
|
||||||
FillInnerHTML("save-location-input-tooltip", "Click once to copy to clipboard");
|
|
||||||
}, false);
|
|
||||||
|
|
||||||
// Analyze Text button
|
// Analyze Text button
|
||||||
document.getElementById("save-area-read").addEventListener("click", () => {
|
document.getElementById("save-area-read").addEventListener("click", () => {
|
||||||
HKReadTextArea("save-area");
|
HKReadTextArea("save-area");
|
||||||
|
|
|
||||||
|
|
@ -994,6 +994,43 @@ function StorageAvailable(type) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Fills the innerHTML of a given HTML Element with provided contents
|
||||||
|
* @param {string} elementId Element ID to update
|
||||||
|
* @param {string} textFill Updated contents (innerHTML)
|
||||||
|
*/
|
||||||
|
function FillInnerHTML(elementId, textFill) {
|
||||||
|
|
||||||
|
const element = document.getElementById(elementId);
|
||||||
|
element.innerHTML = textFill;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Focuses, selects and copies to clipboard contents inside a clicked element. Includes optional tooltip update after the copying is done.
|
||||||
|
* @param {MouseEvent} mouseEvent from the clicked element (AddEventListener)
|
||||||
|
* @param {string} tooltipId Element ID of the tooltip to update
|
||||||
|
* @param {string} tooltipFill Updated contents of the tooltip
|
||||||
|
*/
|
||||||
|
function SelectCopyInputText(mouseEvent, tooltipId = "", tooltipFill = "") {
|
||||||
|
|
||||||
|
const element = document.getElementById(mouseEvent.target.id);
|
||||||
|
|
||||||
|
// this prevents the un-selected effect after clicking the second time (clears all selection first)
|
||||||
|
if (window.getSelection) {
|
||||||
|
window.getSelection().removeAllRanges();
|
||||||
|
}
|
||||||
|
|
||||||
|
element.focus(); // best to focus the element first before selecting
|
||||||
|
element.select();
|
||||||
|
element.setSelectionRange(0, 99999); // for mobile devices
|
||||||
|
|
||||||
|
// Copy the text inside the text field to clipboard
|
||||||
|
document.execCommand("copy");
|
||||||
|
|
||||||
|
// optional tooltip showing
|
||||||
|
if (tooltipFill.length && tooltipId.length) FillInnerHTML(tooltipId, tooltipFill);
|
||||||
|
}
|
||||||
|
|
||||||
/* ----------------------- Event Listeners -------------------------- */
|
/* ----------------------- Event Listeners -------------------------- */
|
||||||
|
|
||||||
document.addEventListener("scroll", () => {
|
document.addEventListener("scroll", () => {
|
||||||
|
|
@ -1010,6 +1047,16 @@ SCROLL_BUTTON.addEventListener("click", () => {
|
||||||
ScrollToElement(ROOT);
|
ScrollToElement(ROOT);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Auto select & copy to clipboard when the save file location input text is clicked once
|
||||||
|
document.getElementById("save-location-input").addEventListener("click", (e) => {
|
||||||
|
SelectCopyInputText(e, "save-location-input-tooltip", "Copied save file location to clipboard");
|
||||||
|
}, false);
|
||||||
|
|
||||||
|
// Switch text back to the default on mouse out
|
||||||
|
document.getElementById("save-location-input").addEventListener("mouseout", () => {
|
||||||
|
FillInnerHTML("save-location-input-tooltip", "Click once to copy to clipboard");
|
||||||
|
}, false);
|
||||||
|
|
||||||
// Checkboxes functions
|
// Checkboxes functions
|
||||||
document.getElementById("checkbox-hints").addEventListener("click", CheckboxHintsToggle, false);
|
document.getElementById("checkbox-hints").addEventListener("click", CheckboxHintsToggle, false);
|
||||||
document.getElementById("checkbox-spoilers").addEventListener("click", CheckboxSpoilersToggle, false);
|
document.getElementById("checkbox-spoilers").addEventListener("click", CheckboxSpoilersToggle, false);
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue