Prettier deck editor

frontend/src/classes/Deck.js

@@ -161,6 +161,9 @@ export default class {
   }
 
   deckList() {
+    // empty deck is empty
+    if (this.count() == 0) return ''
+
     let lines = []
 
     // begin with deck name and note

frontend/src/components/forms/DeckEditor.vue

@@ -11,9 +11,15 @@
 
       <v-textarea
         ref="deckList"
-        label="Edit Deck"
+        :label="
+          `${
+            typeof deck !== 'undefined' && deck !== null ? 'Edit' : 'Paste'
+          } Decklist`
+        "
         rows="35"
-        hint="Change card counts and/or serial numbers. Names will be updated accordingly!"
+        :hint="
+          `ffdecks.com format – One card per line – Include quantity and serial (e.g. ${format_sample})`
+        "
         style="font-family: monospace"
         :value="new_deck.deckList()"
         @input="check.checked = false"
@@ -40,6 +46,7 @@
 
 <script>
 import Deck from '@/classes/Deck'
+import CardsDB from '@/plugins/ffdecks'
 
 export default {
   name: 'DeckEditor',
@@ -53,6 +60,21 @@ export default {
     new_deck: null
   }),
 
+  computed: {
+    format_sample() {
+      let serials = []
+      for (let tmp_key in CardsDB) {
+        if (CardsDB.hasOwnProperty(tmp_key)) {
+          serials.push(tmp_key)
+        }
+      }
+
+      let quantity = Math.floor(Math.random() * 3) + 1
+      let serial = serials[Math.floor(Math.random() * serials.length)]
+      return `${quantity}x ${serial}`
+    }
+  },
+
   created() {
     this.clear()
   },