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 -------------------------- */
|
||||
|
||||
// Populate HTML at load (before img and css)
|
||||
|
|
@ -1808,16 +1771,6 @@ document.addEventListener("DOMContentLoaded", () => {
|
|||
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
|
||||
document.getElementById("save-area-read").addEventListener("click", () => {
|
||||
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 -------------------------- */
|
||||
|
||||
document.addEventListener("scroll", () => {
|
||||
|
|
@ -1010,6 +1047,16 @@ SCROLL_BUTTON.addEventListener("click", () => {
|
|||
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
|
||||
document.getElementById("checkbox-hints").addEventListener("click", CheckboxHintsToggle, false);
|
||||
document.getElementById("checkbox-spoilers").addEventListener("click", CheckboxSpoilersToggle, false);
|
||||
|
|
|
|||
Loading…
Reference in a new issue