Initial commit, we're very tired

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",

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 {

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");

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;
+    }
+}

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;
+    }
+}

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);
     },
   });
 }

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"),
     },
   ],
 });

src/shims-tsx.d.ts

@@ -1,4 +1,4 @@
-import Vue, { VNode } from 'vue';
+import Vue, { VNode } from "vue";
 
 declare global {
   namespace JSX {

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;
 }

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);
+
+        });
+    }
+}

src/views/About.vue

@@ -1,5 +1,5 @@
 <template>
   <div class="about">
-    <h1>This is an about page</h1>
+    <h1>yeet</h1>
   </div>
 </template>

src/views/Home.vue

@@ -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>

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>

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,

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"