From c414f096cfc4731cea4deefe0b9e6846e70e5b6a Mon Sep 17 00:00:00 2001
From: Adam Goldsmith <adam@adamgoldsmith.name>
Date: Sun, 6 Jan 2019 09:54:04 -0500
Subject: [PATCH] Clean up Editor controls, add button to download deck png

---
 src/Editor.vue | 36 +++++++++++++++++++-----------------
 1 file changed, 19 insertions(+), 17 deletions(-)

diff --git a/src/Editor.vue b/src/Editor.vue
index b4a80c5..2a796f8 100644
--- a/src/Editor.vue
+++ b/src/Editor.vue
@@ -4,13 +4,19 @@
     <div id="controls">
       <div>
         <button type="button" @click="upload"> Save Deck </button>
+        Download:
         <button type="button" @click="jsonInputDownload">
-          Download Input JSON
+          Input JSON
         </button>
 
         <button type="button"
-                @click="downloadFile('/decks/' + deckID + '.tts.json', deckInfo.meta.name + '.tts.json')">
-          Download Tabletop Output JSON
+                @click="downloadFile(`/decks/${deckID}.tts.json`, deckInfo.meta.name + '.tts.json')">
+          Tabletop Output JSON
+        </button>
+
+        <button type="button"
+                @click="downloadFile(`/decks/${deckID}.png`, deckInfo.meta.name + '.png')">
+          Deck PNG
         </button>
       </div>
 
@@ -20,20 +26,16 @@
         </label>
       </div>
 
-      <form>
-        <div>
-          <label> Deck Name: <input type="text" v-model="deckInfo.meta.name"> </label>
-        </div>
-        <div>
-          <label> Deck Type:
-            <select v-model="deckInfo.meta.type">
-              <option value="hero">hero</option>
-              <option value="villain">villain</option>
-              <option value="environment">environment</option>
-            </select>
-          </label>
-        </div>
-      </form>
+      <div>
+        <label> Deck Name: <input type="text" v-model="deckInfo.meta.name"> </label>
+        <label> Deck Type:
+          <select v-model="deckInfo.meta.type">
+            <option value="hero">hero</option>
+            <option value="villain">villain</option>
+            <option value="environment">environment</option>
+          </select>
+        </label>
+      </div>
     </div>
 
     <div id="cardEditor" v-if="selected">