more version info

config/env.js

@@ -77,7 +77,7 @@ function getClientEnvironment(publicUrl) {
         // This should only be used as an escape hatch. Normally you would put
         // images into the `src` and `import` them in code to get their paths.
         PUBLIC_URL: publicUrl,
-        VERSION: JSON.stringify(process.env.npm_package_version),
+        VERSION: process.env.npm_package_version,
       }
     );
   // Stringify all values so we can feed into Webpack DefinePlugin

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "diabloweb",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "diabloweb",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "private": true,
   "dependencies": {
     "@babel/core": "7.4.3",
@@ -63,7 +63,7 @@
   },
   "scripts": {
     "start": "node scripts/start.js",
-    "build": "npm version --no-git-tag-version && node scripts/build.js",
+    "build": "npm version patch --no-git-tag-version && node scripts/build.js",
     "test": "node scripts/test.js",
     "deploy": "gh-pages -d build"
   },

src/App.js

@@ -6,10 +6,20 @@ import create_fs from './fs';
 import load_game from './api/loader';
 import { SpawnSize } from './api/load_spawn';
 
-function reportLink(e) {
+function reportLink(e, retail) {
   const message = e.stack || e.message;
   const url = new URL("https://github.com/d07RiV/diabloweb/issues/new");
-  url.searchParams.set("body", `**Error message:**\n\n${message.split("\n").map(line => "    " + line).join("\n")}`);
+  url.searchParams.set("body",
+`**Description:**
+[Please describe what you were doing before the error occurred]
+
+**App version:**
+DiabloWeb ${process.env.VERSION} (${retail ? 'Retail' : 'Shareware'})
+
+**Error message:**
+    
+${message.split("\n").map(line => "    " + line).join("\n")}
+`);
   return url.toString();
 }
 
@@ -135,7 +145,21 @@ class App extends React.Component {
     this.setState({progress});
   }
 
+  onExit() {
+    window.location = window.location;
+  }
+
+  setCurrentSave(name) {
+    this.saveName = name;
+  }
+  downloadSave = e => {
+    this.fs.then(fs => this.saveName && fs.download(this.saveName));
+    e.stopPropagation();
+    e.preventDefault();
+  }
+
   drawBelt(idx, slot) {
+    if (!this.canvas) return;
     if (!this.touchButtons[idx]) {
       return;
     }
@@ -180,7 +204,7 @@ class App extends React.Component {
     document.removeEventListener("dragleave", this.onDragLeave, true);
     this.setState({dropping: 0});
 
-    this.setState({loading: true});
+    this.setState({loading: true, retail: !!(file && file.name.match(/^diabdat\.mpq$/i))});
 
     load_game(this, file).then(game => {
       this.game = game;
@@ -500,10 +524,11 @@ class App extends React.Component {
         </div>
         <div className="BodyV">
           {!!error && (
-            <Link className="error" href={reportLink(error)}>
+            <Link className="error" href={reportLink(error, this.state.retail)}>
               <p className="header">The following error has occurred:</p>
               <p className="body">{error.message}</p>
-              <p className="footer">Click to go to GitHub issues</p>
+              <p className="footer">Click to create an issue on GitHub</p>
+              {this.saveName != null && <p className="link" onClick={this.downloadSave}>Download save file</p>}
             </Link>
           )}
           {!!loading && !started && !error && (

src/api/game.worker.js

@@ -4,8 +4,8 @@ import SpawnBinary from './DiabloSpawn.wasm';
 import SpawnModule from './DiabloSpawn.jscc';
 import axios from 'axios';
 
-const DiabloSize = 1288845;
+const DiabloSize = 1316452;
-const SpawnSize = 1160682;
+const SpawnSize = 1196648;
 
 /* eslint-disable-next-line no-restricted-globals */
 const worker = self;
@@ -15,12 +15,20 @@ let imageData = null;
 let files = null;
 let renderBatch = null;
 let drawBelt = null;
+let is_spawn = false;
 
 const DApi = {
   exit_error(error) {
     worker.postMessage({action: "error", error});
   },
 
+  exit_game() {
+    worker.postMessage({action: "exit"});
+  },
+  current_save_id(id) {
+    worker.postMessage({action: "current_save", name: id >= 0 ? (is_spawn ? `spawn${id}.sv` : `single_${id}.sv`) : null});
+  },
+
   get_file_size(path) {
     const data = files.get(path.toLowerCase());
     return data ? data.byteLength : 0;
@@ -219,6 +227,7 @@ async function initWasm(spawn, progress) {
 }
 
 async function init_game(mpq, spawn, offscreen) {
+  is_spawn = spawn;
   if (offscreen) {
     canvas = new OffscreenCanvas(640, 480);
     context = canvas.getContext("2d");

src/api/loader.js

@@ -102,6 +102,12 @@ async function do_load_game(api, audio, mpq) {
         case "progress":
           api.onProgress({text: data.text, loaded: data.loaded, total: data.total});
           break;
+        case "exit":
+          api.onExit();
+          break;
+        case "current_save":
+          api.setCurrentSave(data.name);
+          break;
         default:
         }
       });

src/fs.js

@@ -91,6 +91,7 @@ export default async function create_fs(load) {
       update: (name, data) => store.set(name, data),
       delete: name => store.remove(name),
       clear: () => store.clear(),
+      download: name => downloadFile(store, name),
       upload: file => uploadFile(store, files, file),
     };
   } catch (e) {
@@ -101,6 +102,7 @@ export default async function create_fs(load) {
       update: () => Promise.resolve(),
       delete: () => Promise.resolve(),
       clear: () => Promise.resolve(),
+      download: () => Promise.resolve(),
       upload: () => Promise.resolve(),
     };
   }