From 96f73cf31d44d1ae0668c554d84bde8c6ef905b1 Mon Sep 17 00:00:00 2001
From: Hykilpikonna <admin@moecraft.cc>
Date: Wed, 21 Aug 2019 14:52:39 +0800
Subject: [PATCH 1/4] [+] Add login button loading switch

---
 src/components/login/login.ts  | 2 ++
 src/components/login/login.vue | 2 +-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/login/login.ts b/src/components/login/login.ts
index 06fc654..4e50b89 100644
--- a/src/components/login/login.ts
+++ b/src/components/login/login.ts
@@ -12,6 +12,8 @@ export default class Login extends Vue
     public username: any = '';
     public password: any = '';
 
+    public loading: boolean = false;
+
     /**
      * On click, sends username and password to the server.
      */
diff --git a/src/components/login/login.vue b/src/components/login/login.vue
index 82e9bf0..8fa4f18 100644
--- a/src/components/login/login.vue
+++ b/src/components/login/login.vue
@@ -5,7 +5,7 @@
             <h1>Veracross Analyzer</h1>
             <el-input v-model="username" placeholder="School Username"></el-input>
             <el-input v-model="password" placeholder="Veracross Password" show-password=""></el-input>
-            <el-button plain type="primary" @click="onLoginClick">Login</el-button>
+            <el-button plain type="primary" @click="onLoginClick" loading="{{loading}}">Login</el-button>
         </div>
     </div>
 </template>

From 6b15b617cfd713bbf5fa4cfda5140ea4e56b871d Mon Sep 17 00:00:00 2001
From: Hykilpikonna <admin@moecraft.cc>
Date: Wed, 21 Aug 2019 14:55:59 +0800
Subject: [PATCH 2/4] [F] Fix "Interpolation inside attributes has been
 removed"

---
 src/components/login/login.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/login/login.vue b/src/components/login/login.vue
index 8fa4f18..fbc940e 100644
--- a/src/components/login/login.vue
+++ b/src/components/login/login.vue
@@ -5,7 +5,7 @@
             <h1>Veracross Analyzer</h1>
             <el-input v-model="username" placeholder="School Username"></el-input>
             <el-input v-model="password" placeholder="Veracross Password" show-password=""></el-input>
-            <el-button plain type="primary" @click="onLoginClick" loading="{{loading}}">Login</el-button>
+            <el-button plain type="primary" @click="onLoginClick" :loading="loading">Login</el-button>
         </div>
     </div>
 </template>

From e7daac738d415ceb4300bda1632f71ba26c4d965 Mon Sep 17 00:00:00 2001
From: Hykilpikonna <admin@moecraft.cc>
Date: Wed, 21 Aug 2019 14:56:50 +0800
Subject: [PATCH 3/4] [+] Enable and disable loading at appropriate time

---
 src/components/login/login.ts | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/components/login/login.ts b/src/components/login/login.ts
index 4e50b89..7d48821 100644
--- a/src/components/login/login.ts
+++ b/src/components/login/login.ts
@@ -22,12 +22,18 @@ export default class Login extends Vue
         // Call custom event
         this.$emit('login:click', this.username, this.password);
 
+        // Make login button loading
+        this.loading = true;
+
         // Fetch request TODO: Add username and password when the https server is ready.
         fetch(`${Constants.API_URL}/veracross/courses`).then(res =>
         {
             // Get response body text
             res.text().then(text =>
             {
+                // Disable loading
+                this.loading = false;
+
                 // Call custom event with courses info
                 this.$emit('login:courses', JSON.parse(text));
             })

From aa64b2b4cd917493e72de976eacc845446d8647c Mon Sep 17 00:00:00 2001
From: Hykilpikonna <admin@moecraft.cc>
Date: Wed, 21 Aug 2019 14:57:38 +0800
Subject: [PATCH 4/4] [-] Remove disable loading because it is useless

---
 src/components/login/login.ts | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/src/components/login/login.ts b/src/components/login/login.ts
index 7d48821..114fa0a 100644
--- a/src/components/login/login.ts
+++ b/src/components/login/login.ts
@@ -31,9 +31,6 @@ export default class Login extends Vue
             // Get response body text
             res.text().then(text =>
             {
-                // Disable loading
-                this.loading = false;
-
                 // Call custom event with courses info
                 this.$emit('login:courses', JSON.parse(text));
             })