From 1040f980a0a96ca0193ce893c3495d388c5da25d Mon Sep 17 00:00:00 2001
From: Julius de Jeu <julius@voidcorp.nl>
Date: Sat, 6 Jul 2019 22:04:33 +0200
Subject: [PATCH] Initial commit, we're very tired

---
 package.json                  |  1 +
 src/components/HelloWorld.vue |  2 +-
 src/main.ts                   | 10 +++----
 src/models/Card.ts            | 13 +++++++++
 src/models/Player.ts          |  9 ++++++
 src/registerServiceWorker.ts  | 20 ++++++-------
 src/router.ts                 | 20 ++++++-------
 src/shims-tsx.d.ts            |  2 +-
 src/shims-vue.d.ts            |  4 +--
 src/util/api.ts               | 31 ++++++++++++++++++++
 src/views/About.vue           |  2 +-
 src/views/Home.vue            | 18 ------------
 src/views/JoinRoom.vue        | 53 +++++++++++++++++++++++++++++++++++
 tslint.json                   |  4 +--
 yarn.lock                     | 27 ++++++++++++++++++
 15 files changed, 166 insertions(+), 50 deletions(-)
 create mode 100644 src/models/Card.ts
 create mode 100644 src/models/Player.ts
 create mode 100644 src/util/api.ts
 delete mode 100644 src/views/Home.vue
 create mode 100644 src/views/JoinRoom.vue

diff --git a/package.json b/package.json
index 221f5eb..2ea9070 100644
--- a/package.json
+++ b/package.json
@@ -8,6 +8,7 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
+    "axios": "^0.19.0",
     "core-js": "^2.6.5",
     "register-service-worker": "^1.6.2",
     "vue": "^2.6.10",
diff --git a/src/components/HelloWorld.vue b/src/components/HelloWorld.vue
index 1118079..5998a85 100644
--- a/src/components/HelloWorld.vue
+++ b/src/components/HelloWorld.vue
@@ -32,7 +32,7 @@
 </template>
 
 <script lang="ts">
-import { Component, Prop, Vue } from 'vue-property-decorator';
+import { Component, Prop, Vue } from "vue-property-decorator";
 
 @Component
 export default class HelloWorld extends Vue {
diff --git a/src/main.ts b/src/main.ts
index 43c2ece..5d774bb 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,11 +1,11 @@
-import Vue from 'vue';
-import App from './App.vue';
-import router from './router';
-import './registerServiceWorker';
+import Vue from "vue";
+import App from "./App.vue";
+import router from "./router";
+import "./registerServiceWorker";
 
 Vue.config.productionTip = false;
 
 new Vue({
   router,
   render: (h) => h(App),
-}).$mount('#app');
+}).$mount("#app");
diff --git a/src/models/Card.ts b/src/models/Card.ts
new file mode 100644
index 0000000..1ba0db5
--- /dev/null
+++ b/src/models/Card.ts
@@ -0,0 +1,13 @@
+export class Card {
+    public text: string;
+    public pick: number;
+    public deck: string;
+    public icon: string;
+
+    public constructor(text: string, pick: number, deck: string, icon: string) {
+        this.deck = deck;
+        this.icon = icon;
+        this.pick = pick;
+        this.text = text;
+    }
+}
diff --git a/src/models/Player.ts b/src/models/Player.ts
new file mode 100644
index 0000000..b9ec200
--- /dev/null
+++ b/src/models/Player.ts
@@ -0,0 +1,9 @@
+export class Player {
+    public name: string;
+    public points: number;
+
+    public constructor(name: string, points: number) {
+        this.name = name;
+        this.points = points;
+    }
+}
diff --git a/src/registerServiceWorker.ts b/src/registerServiceWorker.ts
index ef87577..7c049be 100644
--- a/src/registerServiceWorker.ts
+++ b/src/registerServiceWorker.ts
@@ -1,32 +1,32 @@
 /* tslint:disable:no-console */
 
-import { register } from 'register-service-worker';
+import { register } from "register-service-worker";
 
-if (process.env.NODE_ENV === 'production') {
+if (process.env.NODE_ENV === "production") {
   register(`${process.env.BASE_URL}service-worker.js`, {
     ready() {
       console.log(
-        'App is being served from cache by a service worker.\n' +
-        'For more details, visit https://goo.gl/AFskqB',
+        "App is being served from cache by a service worker.\n" +
+        "For more details, visit https://goo.gl/AFskqB",
       );
     },
     registered() {
-      console.log('Service worker has been registered.');
+      console.log("Service worker has been registered.");
     },
     cached() {
-      console.log('Content has been cached for offline use.');
+      console.log("Content has been cached for offline use.");
     },
     updatefound() {
-      console.log('New content is downloading.');
+      console.log("New content is downloading.");
     },
     updated() {
-      console.log('New content is available; please refresh.');
+      console.log("New content is available; please refresh.");
     },
     offline() {
-      console.log('No internet connection found. App is running in offline mode.');
+      console.log("No internet connection found. App is running in offline mode.");
     },
     error(error) {
-      console.error('Error during service worker registration:', error);
+      console.error("Error during service worker registration:", error);
     },
   });
 }
diff --git a/src/router.ts b/src/router.ts
index 834a22b..3814069 100644
--- a/src/router.ts
+++ b/src/router.ts
@@ -1,25 +1,25 @@
-import Vue from 'vue';
-import Router from 'vue-router';
-import Home from './views/Home.vue';
+import Vue from "vue";
+import Router from "vue-router";
+import JoinRoom from "./views/JoinRoom.vue";
 
 Vue.use(Router);
 
 export default new Router({
-  mode: 'history',
+  mode: "history",
   base: process.env.BASE_URL,
   routes: [
     {
-      path: '/',
-      name: 'home',
-      component: Home,
+      path: "/",
+      name: "home",
+      component: JoinRoom,
     },
     {
-      path: '/about',
-      name: 'about',
+      path: "/about",
+      name: "about",
       // route level code-splitting
       // this generates a separate chunk (about.[hash].js) for this route
       // which is lazy-loaded when the route is visited.
-      component: () => import(/* webpackChunkName: "about" */ './views/About.vue'),
+      component: () => import(/* webpackChunkName: "about" */ "./views/About.vue"),
     },
   ],
 });
diff --git a/src/shims-tsx.d.ts b/src/shims-tsx.d.ts
index 3b88b58..2bcdf9f 100644
--- a/src/shims-tsx.d.ts
+++ b/src/shims-tsx.d.ts
@@ -1,4 +1,4 @@
-import Vue, { VNode } from 'vue';
+import Vue, { VNode } from "vue";
 
 declare global {
   namespace JSX {
diff --git a/src/shims-vue.d.ts b/src/shims-vue.d.ts
index 8f6f410..0660bd6 100644
--- a/src/shims-vue.d.ts
+++ b/src/shims-vue.d.ts
@@ -1,4 +1,4 @@
-declare module '*.vue' {
-  import Vue from 'vue';
+declare module "*.vue" {
+  import Vue from "vue";
   export default Vue;
 }
diff --git a/src/util/api.ts b/src/util/api.ts
new file mode 100644
index 0000000..8dfec75
--- /dev/null
+++ b/src/util/api.ts
@@ -0,0 +1,31 @@
+import axios from "axios";
+
+const baseURL = "localhost:8000";
+
+const axios_api = axios.create({
+    baseURL,
+    headers: {
+        "Accept": "application/json",
+        "Content-Type": "application/json",
+    },
+});
+
+export class Game {
+    private pub: WebSocket;
+    private sub: WebSocket;
+    private uuid: string;
+
+    constructor(code: string, name: string) {
+        this.pub = new WebSocket(`://localhost:8000/ws/room/${code}/pub`);
+        this.sub = new WebSocket(`://localhost:8000/ws/room/${code}/sub`);
+
+        this.pub.addEventListener("open", (event) => {
+            // JOIN
+        });
+
+        this.pub.addEventListener("message", (event) => {
+            const data: Player = JSON.parse(event.data);
+
+        });
+    }
+}
diff --git a/src/views/About.vue b/src/views/About.vue
index 3fa2807..378183c 100644
--- a/src/views/About.vue
+++ b/src/views/About.vue
@@ -1,5 +1,5 @@
 <template>
   <div class="about">
-    <h1>This is an about page</h1>
+    <h1>yeet</h1>
   </div>
 </template>
diff --git a/src/views/Home.vue b/src/views/Home.vue
deleted file mode 100644
index 2187e5c..0000000
--- a/src/views/Home.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-<template>
-  <div class="home">
-    <img alt="Vue logo" src="../assets/logo.png">
-    <HelloWorld msg="Welcome to Your Vue.js + TypeScript App"/>
-  </div>
-</template>
-
-<script lang="ts">
-import { Component, Vue } from 'vue-property-decorator';
-import HelloWorld from '@/components/HelloWorld.vue'; // @ is an alias to /src
-
-@Component({
-  components: {
-    HelloWorld,
-  },
-})
-export default class Home extends Vue {}
-</script>
diff --git a/src/views/JoinRoom.vue b/src/views/JoinRoom.vue
new file mode 100644
index 0000000..230084b
--- /dev/null
+++ b/src/views/JoinRoom.vue
@@ -0,0 +1,53 @@
+<template>
+  <div id="joinroom">
+    <label class="code-label" for="code">Room Code:</label>
+    <input id="code" type="text" v-model="code" placeholder="Enter code here" minlength="4" />
+    <label class="name-label" for>Name:</label>
+    <input id="name" type="text" placeholder="Enter a username" maxlength="25" />
+
+    <button id="join">Join!</button>
+  </div>
+</template>
+<script lang="ts">
+import { Component, Vue } from "vue-property-decorator";
+
+@Component({
+  name: "JoinRoom",
+})
+export default class JoinRoom extends Vue {
+  private code: string = "";
+  private name: string = "";
+}
+</script>
+<style lang="scss">
+#joinroom {
+  display: grid;
+  grid-template-columns: 2fr 1fr 1fr 2fr;
+  grid-row-gap: 15px;
+}
+
+.code-label {
+  grid-row: 1;
+  grid-column: 2;
+  min-width: 100px;
+}
+#code {
+  grid-row: 1;
+  grid-column: 3;
+}
+.name-label {
+  grid-row: 2;
+  grid-column: 2;
+}
+#name {
+  grid-row: 2;
+  grid-column: 3;
+}
+
+#join {
+  grid-row-start: 3;
+  grid-row-end: 5;
+  grid-column-start: 2;
+  grid-column-end: 4;
+}
+</style>
diff --git a/tslint.json b/tslint.json
index 2b37e40..97021cb 100644
--- a/tslint.json
+++ b/tslint.json
@@ -9,8 +9,8 @@
     ]
   },
   "rules": {
-    "quotemark": [true, "single"],
-    "indent": [true, "spaces", 2],
+    "quotemark": [true, "double"],
+    "indent": [true, "spaces", 4],
     "interface-name": false,
     "ordered-imports": false,
     "object-literal-sort-keys": false,
diff --git a/yarn.lock b/yarn.lock
index 12be06e..be37d0c 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1466,6 +1466,14 @@ aws4@^1.8.0:
   resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.8.0.tgz#f0e003d9ca9e7f59c7a508945d7b2ef9a04a542f"
   integrity sha512-ReZxvNHIOv88FlT7rxcXIIC0fPt4KZqZbOlivyWtXLt8ESx84zd3kMC6iK5jVeS2qt+g7ftS7ye4fi06X5rtRQ==
 
+axios@^0.19.0:
+  version "0.19.0"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-0.19.0.tgz#8e09bff3d9122e133f7b8101c8fbdd00ed3d2ab8"
+  integrity sha512-1uvKqKQta3KBxIz14F2v06AEHZ/dIoeKfbTRkK1E5oqjDnuEerLmYTgJB5AiQZHJcljpg1TuRzdjDR06qNk0DQ==
+  dependencies:
+    follow-redirects "1.5.10"
+    is-buffer "^2.0.2"
+
 babel-code-frame@^6.22.0, babel-code-frame@^6.26.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-code-frame/-/babel-code-frame-6.26.0.tgz#63fd43f7dc1e3bb7ce35947db8fe369a3f58c74b"
@@ -2617,6 +2625,13 @@ debug@2.6.9, debug@^2.2.0, debug@^2.3.3:
   dependencies:
     ms "2.0.0"
 
+debug@=3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261"
+  integrity sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==
+  dependencies:
+    ms "2.0.0"
+
 debug@^3.1.0, debug@^3.2.5, debug@^3.2.6:
   version "3.2.6"
   resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.6.tgz#e83d17de16d8a7efb7717edbe5fb10135eee629b"
@@ -3372,6 +3387,13 @@ fn-name@~2.0.1:
   resolved "https://registry.yarnpkg.com/fn-name/-/fn-name-2.0.1.tgz#5214d7537a4d06a4a301c0cc262feb84188002e7"
   integrity sha1-UhTXU3pNBqSjAcDMJi/rhBiAAuc=
 
+follow-redirects@1.5.10:
+  version "1.5.10"
+  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.5.10.tgz#7b7a9f9aea2fdff36786a94ff643ed07f4ff5e2a"
+  integrity sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==
+  dependencies:
+    debug "=3.1.0"
+
 follow-redirects@^1.0.0:
   version "1.7.0"
   resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.7.0.tgz#489ebc198dc0e7f64167bd23b03c4c19b5784c76"
@@ -4142,6 +4164,11 @@ is-buffer@^1.1.5:
   resolved "https://registry.yarnpkg.com/is-buffer/-/is-buffer-1.1.6.tgz#efaa2ea9daa0d7ab2ea13a97b2b8ad51fefbe8be"
   integrity sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==
 
+is-buffer@^2.0.2:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/is-buffer/-/is-buffer-2.0.3.tgz#4ecf3fcf749cbd1e472689e109ac66261a25e725"
+  integrity sha512-U15Q7MXTuZlrbymiz95PJpZxu8IlipAp4dtS3wOdgPXx3mqBnslrWU14kxfHB+Py/+2PVKSr37dMAgM2A4uArw==
+
 is-callable@^1.1.4:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.1.4.tgz#1e1adf219e1eeb684d691f9d6a05ff0d30a24d75"