Merge pull request #19 from Colbydude/v1.2.1

Add request ID share button. Tidy up auth.
Colbydude · Jan 30, 2020 · 4841820 · 4841820
2 parents 17b21f7 + b4b4d45
commit 4841820
Show file tree

Hide file tree

Showing 9 changed files with 1,965 additions and 848 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,14 @@
 # Changelog
 
+## v1.2.1
+- Async/await on Twitch authentication for consistency.
+- Added request ID share button to request auth.
+
+## v1.2.0
+- Update to new Video Component UI.
+- Localization Support (just EN and ES for now).
+- Panel Extension Support.
+
 ## v1.1.0
 - Convert extension from Video Overlay to Video Component.
 - UI Redesign.

diff --git a/resources/js/components/Viewer.vue b/resources/js/components/Viewer.vue
@@ -5,9 +5,14 @@
             :rate-limit="this.rateLimit"
             v-if="auth.user_id"
         />
-        <p class="p-4 text-white text-center" v-else>
-            {{ $t('viewer.grant_permissions_1') }} <i class="fas fa-cog"></i> {{ $t('viewer.grant_permissions_2') }}
-        </p>
+        <div class="text-center" v-else>
+            <p class="p-4 text-white">
+                {{ $t('viewer.grant_permissions') }}
+            </p>
+            <p>
+                <button class="btn btn-blue-dark" @click="askForAuth">{{ $t('common.click_here') }}</button>
+            </p>
+        </div>
         <queue-panel style="overflow: auto;" />
     </div>
 </template>
@@ -25,6 +30,10 @@
         },
 
         props: {
+            askForAuth: {
+                type: Function,
+                required: true
+            },
             auth: {
                 type: Object,
                 required: true

diff --git a/resources/js/mixins/Twitch.js b/resources/js/mixins/Twitch.js
@@ -9,14 +9,14 @@ export default {
         };
     },
 
-    mounted () {
+    async beforeMount () {
         if (this.twitch) {
             if (this.twitch.rig) {
                 window.logger = this.twitch.rig.log.bind(this.twitch);
             }
 
             // Setup our auth and API and ready the extension for use.
-            this.twitch.onAuthorized(async (auth) => {
+            await this.twitch.onAuthorized(async (auth) => {
                 this.auth.setToken(auth.token, auth.userId);
                 this.$api.Ebs.setChannelId(auth.channelId);
                 this.$api.Ebs.setToken(auth.token);
@@ -41,6 +41,20 @@ export default {
     },
 
     methods: {
+        /**
+         * Prompt to ask for authentication.
+         *
+         * @return {void}
+         */
+        askForAuth() {
+            this.twitch.actions.requestIdShare();
+        },
+
+        /**
+         * Auth has been verified, finish "booting"
+         *
+         * @return {void}
+         */
         boot() {
             this.finishedLoading = true;
         },

diff --git a/resources/js/utils/Authentication.js b/resources/js/utils/Authentication.js
@@ -13,12 +13,12 @@ export default class Authentication {
      * @constructor
      */
     constructor(token, opaque_id) {
-        this.channel_id = false;
+        this.channel_id;
         this.opaque_id = opaque_id;
-        this.role = "";
+        this.role;
         this.token = token;
-        this.username = false;
-        this.user_id = false;
+        this.username;
+        this.user_id;
     }
 
     /**

diff --git a/resources/js/views/Config.vue b/resources/js/views/Config.vue
@@ -158,7 +158,7 @@
              * @return {Void}
              */
             register() {
-                return this.$api.Ebs.postSettings()
+                return this.$api.Ebs.postSettings(this.auth.username)
                 .then(response => {
                     this.settings = { ...this.settings, ...response.data.settings };
                 })

diff --git a/resources/js/views/VideoComponent.vue b/resources/js/views/VideoComponent.vue
@@ -1,6 +1,7 @@
 <template>
     <div class="viewer-wrapper">
         <viewer
+            :askForAuth="askForAuth"
             :auth="auth"
             :finished-loading="finishedLoading"
             :settings="settings"

diff --git a/resources/lang/en.json b/resources/lang/en.json
@@ -3,6 +3,7 @@
         "actions": "Actions",
         "add": "Add",
         "clear": "Clear",
+        "click_here": "Click Here",
         "queue": "Queue",
         "requested_by": "Requested by",
         "song": "Song",
@@ -44,8 +45,7 @@
         "too_many_requests_text": "You must wait at least {time} {units} until you can request again."
     },
     "viewer": {
-        "grant_permissions_1": "Grant access in",
-        "grant_permissions_2": "to make requests!",
+        "grant_permissions": "To request a song, you need to share your Twitch ID with us.",
 
         "queue_panel": {
             "current_queue": "Current Queue",

diff --git a/resources/lang/es.json b/resources/lang/es.json
@@ -3,6 +3,7 @@
         "actions": "Acciones",
         "add": "Añadir",
         "clear": "Borrar",
+        "click_here": "Haga Clic Aquí",
         "queue": "Cola",
         "requested_by": "Pedido de",
         "song": "Canción",
@@ -44,8 +45,7 @@
         "too_many_requests_text": "Por favor espere por {time} {units} antes de que puede mandar más pedidos."
     },
     "viewer": {
-        "grant_permissions_1": "Autorizará el acceso a",
-        "grant_permissions_2": "para mandar pedidos musicales!",
+        "grant_permissions": "Para pedir una canción, tiene que escribir su Twitch ID por favor.",
 
         "queue_panel": {
             "current_queue": "Cola Actual",