display file name in the input button

This commit is contained in:
ReznoRMichael 2021-07-20 15:11:34 +02:00
parent f7480e0f41
commit 22f799770a
3 changed files with 36 additions and 1 deletions

View file

@ -5181,6 +5181,8 @@ var SYMBOL_TRUE = "<i class='icon-ok-squared'></i>"; // "✅ "
var SYMBOL_CLOCK = "<i class='icon-clock'></i>"; // "🕑 "
var SYMBOL_FILE = "<i class='icon-doc-text-inv'></i>"; // "📁"
var SYMBOL_EMPTY = "<span class='padding-left'></span>";
var FLEUR_DIVIDE = "<div class='horizontal-line'></div>";
var WIKI_LINK = "https://hollowknight.fandom.com/wiki/";
@ -6137,6 +6139,19 @@ window.addEventListener('drop', function (event) {
(0,_LoadSaveFile_js__WEBPACK_IMPORTED_MODULE_1__.LoadSaveFile)(dt, new Date());
});
/* Monitor file input change and show the file name when file is loaded */
document.getElementById("save-area-file").addEventListener("change", function (event) {
var label = document.getElementById("save-area-file").nextElementSibling;
var labelInitialText = label.innerHTML;
var fileName = event.target.files[0].name;
if (fileName) {
label.innerHTML = "".concat(SYMBOL_FILE).concat(fileName);
} else {
label.innerHTML = labelInitialText;
}
});
/* ------------------------- Exports ------------------------------- */

File diff suppressed because one or more lines are too long

View file

@ -24,6 +24,7 @@ const SYMBOL_FALSE = "<i class='icon-cancel'></i>"; // "❌ "
const SYMBOL_TRUE = "<i class='icon-ok-squared'></i>"; // "✅ "
// const SYMBOL_INFO = "<i class='icon-info-circled'></i>"; // " "
const SYMBOL_CLOCK = "<i class='icon-clock'></i>"; // "🕑 "
const SYMBOL_FILE = "<i class='icon-doc-text-inv'></i>"; // "📁"
const SYMBOL_EMPTY = "<span class='padding-left'></span>";
const FLEUR_DIVIDE = "<div class='horizontal-line'></div>";
const WIKI_LINK = "https://hollowknight.fandom.com/wiki/";
@ -1061,6 +1062,7 @@ function SelectCopyInputText(mouseEvent, tooltipId = "", tooltipFill = "") {
/* ----------------------- Event Listeners -------------------------- */
document.addEventListener("scroll", () => {
TogglePageScrollElement(
/* the document element root (<html>) */
ROOT,
@ -1076,11 +1078,13 @@ SCROLL_BUTTON.addEventListener("click", () => {
// 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);
@ -1090,6 +1094,7 @@ document.getElementById("checkbox-spoilers").addEventListener("click", CheckboxS
/* Drag & drop file to the window */
window.addEventListener('dragover', (event) => {
event.stopPropagation();
event.preventDefault();
@ -1098,6 +1103,7 @@ window.addEventListener('dragover', (event) => {
});
window.addEventListener('drop', (event) => {
event.stopPropagation();
event.preventDefault();
@ -1107,6 +1113,20 @@ window.addEventListener('drop', (event) => {
LoadSaveFile(dt, new Date());
});
/* Monitor file input change and show the file name when file is loaded */
document.getElementById("save-area-file").addEventListener("change", (event) => {
var label = document.getElementById("save-area-file").nextElementSibling;
var labelInitialText = label.innerHTML;
var fileName = event.target.files[0].name;
if (fileName) {
label.innerHTML = `${SYMBOL_FILE}${fileName}`;
} else {
label.innerHTML = labelInitialText;
}
});
/* ------------------------- Exports ------------------------------- */
export {