diff --git a/web/.eslintrc.yaml b/web/.eslintrc.yaml index 5b5c539d9..ebed971c0 100644 --- a/web/.eslintrc.yaml +++ b/web/.eslintrc.yaml @@ -23,7 +23,6 @@ overrides: - plugin:@typescript-eslint/recommended rules: '@typescript-eslint/no-non-null-assertion': 'off' - 'no-control-regex': 0 '@typescript-eslint/no-unused-vars': - error - argsIgnorePattern: ^_ diff --git a/web/packages/core/src/ruffle-player.ts b/web/packages/core/src/ruffle-player.ts index a8387707b..257ce951f 100644 --- a/web/packages/core/src/ruffle-player.ts +++ b/web/packages/core/src/ruffle-player.ts @@ -243,10 +243,6 @@ export class RufflePlayer extends HTMLElement { if (backupSaves) { backupSaves.addEventListener("click", this.backupSaves.bind(this)); } - const restoreSave = this.saveManager.querySelector("#restore-save"); - if (restoreSave) { - restoreSave.addEventListener("change", this.restoreSave.bind(this)); - } this.contextMenuElement = this.shadow.getElementById("context-menu")!; window.addEventListener("pointerdown", this.pointerDown.bind(this)); @@ -874,40 +870,20 @@ export class RufflePlayer extends HTMLElement { } /** - * Restore save from SOL file. + * Replace save from SOL file. * * @param event The change event fired + * @param solKey The localStorage save file key */ - async restoreSave(event: Event): Promise { + async replaceSOL(event: Event, solKey: string): Promise { const fileInput = event.target; const reader = new FileReader(); reader.addEventListener("load", () => { if (reader.result && typeof reader.result === "string") { const b64Regex = new RegExp("data:.*;base64,"); - const unprintable = new RegExp("[\u0000-\u001f]*"); - const nullChar = "\u0000"; const b64SolData = reader.result.replace(b64Regex, ""); - const solDataNamePlus = atob(b64SolData) - .slice(10) - .replace(unprintable, ""); - const solName = solDataNamePlus.substring( - 0, - solDataNamePlus.indexOf(nullChar) - ); - const solKey = this.swfUrl - ? this.swfUrl.hostname + - this.swfUrl.pathname + - "/" + - solName - : document.location.hostname + "//" + solName; if (this.isB64SOL(b64SolData)) { if (localStorage[solKey]) { - alert( - "Save data with key " + - solKey + - " already exists. Delete it first." - ); - } else { this.saveManager.close(); localStorage.setItem(solKey, b64SolData); this.populateSaves(); @@ -962,12 +938,31 @@ export class RufflePlayer extends HTMLElement { solName + ".sol" ) ); + const replaceCol = document.createElement("TD"); + const replaceInput = ( + document.createElement("INPUT") + ); + replaceInput.type = "file"; + replaceInput.className = "replace-save"; + replaceInput.id = "replace-save-" + key; + const replaceLabel = ( + document.createElement("LABEL") + ); + replaceLabel.htmlFor = "replace-save-" + key; + replaceLabel.textContent = "Replace"; + replaceLabel.className = "save-option"; + replaceInput.addEventListener("change", (event) => + this.replaceSOL(event, key) + ); + replaceCol.appendChild(replaceInput); + replaceCol.appendChild(replaceLabel); const deleteCol = document.createElement("TD"); deleteCol.textContent = "Delete"; deleteCol.className = "save-option"; deleteCol.addEventListener("click", () => this.deleteSave(key)); row.appendChild(keyCol); row.appendChild(downloadCol); + row.appendChild(replaceCol); row.appendChild(deleteCol); saveTable.appendChild(row); } diff --git a/web/packages/core/src/shadow-template.ts b/web/packages/core/src/shadow-template.ts index 621d46c27..3e2e3fb58 100644 --- a/web/packages/core/src/shadow-template.ts +++ b/web/packages/core/src/shadow-template.ts @@ -285,6 +285,9 @@ ruffleShadowTemplate.innerHTML = ` #restore-save { display: none; } + .replace-save { + display: none; + } .save-option { display: inline-block; padding: 3px 10px; @@ -324,10 +327,6 @@ ruffleShadowTemplate.innerHTML = ` ×
Backup all saves (download all sols) - - - -