.gitignore

@@ -1,3 +1,2 @@
 **/node_modules
 **/fftcg.db
-**/org.vue.*.json

frontend/.vue-cli-ui/db.json

@@ -6,7 +6,7 @@
       "favorite": 0,
       "type": "vue",
       "name": "frontend",
-      "openDate": 1556789720710,
+      "openDate": 1556529929207,
       "widgets": [
         {
           "id": "5sGiztidd",

frontend/src/App.vue

@@ -1,11 +1,37 @@
 <template>
   <v-app>
-    <router-view />
+    <v-toolbar app>
+      <v-toolbar-title class="headline text-uppercase">
+        <span>Vuetify</span>
+        <span class="font-weight-light">MATERIAL DESIGN</span>
+      </v-toolbar-title>
+      <v-spacer></v-spacer>
+      <v-btn flat :to="{ path: '/' }">Home</v-btn>
+      <v-btn flat :to="{ path: '/about' }">About</v-btn>
+      <v-btn flat :to="{ path: '/game' }">Game</v-btn>
+      <v-btn
+        flat
+        href="https://github.com/vuetifyjs/vuetify/releases/latest"
+        target="_blank"
+      >
+        <span class="mr-2">Latest Release</span>
+        <v-icon>open_in_new</v-icon>
+      </v-btn>
+    </v-toolbar>
+
+    <v-content>
+      <router-view />
+    </v-content>
   </v-app>
 </template>
 
 <script>
 export default {
-  name: 'App'
+  name: 'App',
+  data() {
+    return {
+      //
+    }
+  }
 }
 </script>

frontend/src/ExampleApp.vue

@@ -1,36 +0,0 @@
-<template>
-  <v-app>
-    <v-toolbar app>
-      <v-toolbar-title class="headline text-uppercase">
-        <span>Vuetify</span>
-        <span class="font-weight-light">MATERIAL DESIGN</span>
-      </v-toolbar-title>
-      <v-spacer></v-spacer>
-      <v-btn flat :to="{ path: '/' }">Home</v-btn>
-      <v-btn flat :to="{ path: '/about' }">About</v-btn>
-      <v-btn
-        flat
-        href="https://github.com/vuetifyjs/vuetify/releases/latest"
-        target="_blank"
-      >
-        <span class="mr-2">Latest Release</span>
-        <v-icon>open_in_new</v-icon>
-      </v-btn>
-    </v-toolbar>
-
-    <v-content>
-      <router-view />
-    </v-content>
-  </v-app>
-</template>
-
-<script>
-export default {
-  name: 'ExampleApp',
-  data() {
-    return {
-      //
-    }
-  }
-}
-</script>

frontend/src/components/forms/Login.vue

@@ -1,35 +0,0 @@
-<template>
-  <v-dialog v-model="dialog" width="500">
-    <v-btn slot="activator" color="red lighten-2" dark>
-      Login
-    </v-btn>
-
-    <v-card>
-      <v-card-title class="headline grey lighten-2" primary-title>
-        Log In
-      </v-card-title>
-
-      <v-card-text>
-        Some form
-      </v-card-text>
-
-      <v-divider></v-divider>
-
-      <v-card-actions>
-        <v-spacer></v-spacer>
-        <v-btn color="primary" flat @click="dialog = false">
-          Login
-        </v-btn>
-      </v-card-actions>
-    </v-card>
-  </v-dialog>
-</template>
-
-<script>
-export default {
-  name: "LoginForm"
-}
-</script>
-
-<style lang="css" scoped>
-</style>

frontend/src/views/Game.vue

@@ -1,32 +1,21 @@
 <template lang="html">
-  <div ref="game" />
+  <div ref="game"></div>
 </template>
 
 <script>
 export default {
   name: 'Game',
-
   mounted() {
     this.$nextTick(function() {
-      try {
+      // framework
-        // framework
+      require('craftyjs/dist/crafty')
-        require('craftyjs/dist/crafty')
 
-        // initialize on ref="game"
+      // initialize on ref="game"
-        window.Crafty.init(this.$refs.game)
+      window.Crafty.init(this.$refs.game)
-        window.Crafty.stage.fullscreen = true
 
-        // load fftcg
+      // load fftcg
-        require('@/crafty/Game.coffee')
+      require('@/crafty/Game.coffee')
-      } catch (e) {
-        window.location.reload()
-      }
     })
-  },
-
-  beforeDestroy() {
-    window.Crafty.stop(true)
-    delete window.Crafty
   }
 }
 </script>

frontend/src/views/Home.vue

@@ -1,31 +1,14 @@
 <template>
-  <v-container>
+  <HelloWorld />
-    <v-flex mb-4>
-      <h1 class="display-2 font-weight-bold mb-3">
-        Hello World!
-      </h1>
-      <p class="subheading font-weight-regular">
-        App under development, please don't submit any valuable data!
-      </p>
-    </v-flex>
-
-    <LoginForm />
-
-  </v-container>
 </template>
 
 <script>
-import LoginForm from '@/components/forms/Login.vue'
+// @ is an alias to /src
+import HelloWorld from '@/components/HelloWorld.vue'
 
 export default {
-  name: 'Home',
-  data() {
-    return {
-      dialog: false
-    }
-  },
   components: {
-    LoginForm
+    HelloWorld
   }
 }
 </script>