update for new version (doesn't really matter though)

Cargo.toml

@@ -1,8 +1,11 @@
 [package]
-name = "bitsy-merge"
-version = "0.71.0"
+name = "mixsy"
+description = "combine Bitsy games"
+version = "0.710.0"
 authors = ["Max Bradbury <max@tinybird.info>"]
 edition = "2018"
+license = "MIT"
+repository = "https://tinybird.dev/max/mixsy"
 
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
 
@@ -10,5 +13,6 @@ edition = "2018"
 crate-type = ["cdylib"]
 
 [dependencies]
-"bitsy-parser" = "^0.71.1"
-"wasm-bindgen" = "^0.2.64"
+"bitsy-parser" = "^0.710.0"
+"lazy_static"  = "^1.4.0"
+"wasm-bindgen" = "^0.2.78"

build.sh

@@ -1,5 +1,5 @@
-#!/bin/sh
+#!/usr/bin/env bash
 
+cargo build
 pug index.pug
-set -ex
 wasm-pack build --target web

deploy.sh

@@ -1,6 +1,4 @@
 #!/bin/sh
 
-./build.sh
-
 zip -r mixsy.zip README.md index.html merge.png pkg
 butler push mixsy.zip ruin/mixsy:html

index.js

@@ -1,13 +1,39 @@
-import init, {merge} from './pkg/bitsy_merge.js';
+import init, {load_main, load_additional, merge} from './pkg/mixsy.js';
 
 async function run() {
     await init();
 
-    document.getElementById('merge').addEventListener('click', () => {
-        let a = document.getElementById('a').value;
-        let b = document.getElementById('b').value;
-        document.getElementById('c').value = merge(a, b);
-    })
+    const main         = document.getElementById('a');
+    const additional   = document.getElementById('b');
+    const output       = document.getElementById('c');
+    const merge_button = document.getElementById('merge');
+
+    function handleResult(inputElement, message) {
+        console.log(message);
+        let messageBox = inputElement.nextSibling;
+        messageBox.innerText = message;
+        messageBox.style.display = "block"
+        setTimeout(() => {messageBox.style.display = "none"}, 4000);
+    }
+
+    main.addEventListener('change', () => {
+        if (main.value) {
+            handleResult(main, load_main(main.value));
+        }
+    });
+
+    additional.addEventListener('change', () => {
+        if (additional.value) {
+            handleResult(additional, load_additional(additional.value));
+        }
+    });
+
+    function mix() {
+        output.value = merge();
+    }
+
+    merge_button.addEventListener('click',    mix);
+    merge_button.addEventListener('touchend', mix);
 }
 
 run();

index.pug

@@ -3,6 +3,8 @@ html(lang="en-gb")
     head
         meta(content="text/html;charset=utf-8" http-equiv="Content-Type")
         title mixsy
+        //- no favicon!! taken from: https://k1ss.org/blog/20191004a
+        <link href=data:, rel=icon>
         style
             include style.css
     body
@@ -13,9 +15,11 @@ html(lang="en-gb")
                 #main.square.left
                     h2 main
                     textarea#a(placeholder="Paste your main game data here...")
+                    p.result
                 #additional.square.left
                     h2 additional
                     textarea#b(placeholder="Paste additional game data here...")
+                    p.result
             .row.middle
                 img.centre(src="merge.png" alt="")
                 button#merge.centre mix!
@@ -23,6 +27,5 @@ html(lang="en-gb")
                 .square.centre
                     h2 output
                     textarea#c
-        //- Note the usage of `type=module` here as this is an ES6 module -->
         script(type="module")
             include index.js

src/lib.rs

@@ -1,21 +1,55 @@
-use wasm_bindgen::prelude::*;
 use bitsy_parser::game::Game;
+use lazy_static::lazy_static;
+use std::sync::Mutex;
+use wasm_bindgen::prelude::*;
+
+struct State {
+    main:       Option<Game>,
+    additional: Option<Game>,
+}
+
+lazy_static! {
+    static ref STATE: Mutex<State> = Mutex::new(State { main: None, additional: None});
+}
+
+// TODO DEDUPE
 
 #[wasm_bindgen]
-pub fn merge(a: String, b: String) -> String {
-    let main = Game::from(a);
-    let additional = Game::from(b);
+pub fn load_main(game_data: String) -> String {
+    let result = Game::from(game_data);
 
-    if main.is_err() {
-        return "Couldn't parse main game.".to_string();
+    if result.is_ok() {
+        let (game, _errors) = result.unwrap();
+        STATE.lock().unwrap().main = Some(game);
+        "OK!"
+    } else {
+        "Could not parse game data"
+    }.to_string()
+}
+
+#[wasm_bindgen]
+pub fn load_additional(game_data: String) -> String {
+    let result = Game::from(game_data);
+
+    if result.is_ok() {
+        let (game, _errors) = result.unwrap();
+        STATE.lock().unwrap().additional = Some(game);
+        "OK!"
+    } else {
+        "Could not parse game data"
+    }.to_string()
+}
+
+#[wasm_bindgen]
+pub fn merge() -> String {
+    let state = STATE.lock().unwrap();
+
+    if state.main.is_none() || state.additional.is_none() {
+        return "".to_string();
     }
 
-    if additional.is_err() {
-        return "Couldn't parse additional game.".to_string();
-    }
-
-    let mut main = main.unwrap();
-    let additional = additional.unwrap();
+    let mut main = state.main.clone().unwrap();
+    let additional = state.additional.as_ref().unwrap();
 
     main.merge(additional);
     main.dedupe_tiles();

style.css

@@ -72,6 +72,12 @@ textarea {
     float: left;
 }
 
+.result {
+    position: relative;
+    background: var(--bg);
+    color: var(--inverse);
+}
+
 .row {
     width: 100%;
     height: calc(82vmin / 3);
@@ -81,4 +87,4 @@ textarea {
     width: 50vmin;
     height: 100%;
     padding: 0.5em;
-}
+}