discord auth bad version

src/App.vue

@@ -23,6 +23,7 @@ import MdSnackbar from "vue-material/dist/components/MdSnackbar";
 import MdMenu from "vue-material/dist/components/MdMenu";
 import MdList from "vue-material/dist/components/MdList";
 import MdField from "vue-material/dist/components/MdField";
+import MdSteppers from "vue-material/dist/components/MdSteppers";
 
 Vue.use(MdTabs);
 Vue.use(MdIcon);
@@ -35,6 +36,7 @@ Vue.use(MdSnackbar);
 Vue.use(MdMenu);
 Vue.use(MdList);
 Vue.use(MdField);
+Vue.use(MdSteppers);
 
 import TabsMenu from "@/components/TabsMenu.vue";
 import LoaderPage from "@/components/Others/Loader/LoaderPage.vue";

src/api/PlayerApi.js

@@ -91,7 +91,7 @@ export default class PlayerApi {
     }
 
     async loadDiscord() {
-        return axios.get(`https://tf2.pblr-nyk.pro/api/auth/discord`)
+        return axios.get(`api/auth/discord`)
             .then(response => {
                 if (response.status === 200) this.discord = response.data;
             })

src/components/Others/Auth/AuthWindow.vue

@@ -15,7 +15,7 @@
       <div style="max-width: 40%; float: left;" v-if="this.$API.player.auth('discord')" v-on:click="moveTo('logout', 'discord')" class="clickable">
         <DiscordSvg class="img-server"/>
         <p class="p-auth" style="margin-bottom: -5%">Выйти</p>
-        <p class="p-auth-logout">{{this.$API.player.discord.username}}</p>
+        <p class="p-auth-logout">{{this.$API.player.discord!==null?this.$API.player.discord.username:''}}</p>
       </div>
       <div style="max-width: 40%; float: left;" v-else v-on:click="moveTo('login', 'discord')" class="clickable">
         <DiscordSvg class="img-server"/>

src/components/Others/Auth/DiscordWindow.vue

@@ -0,0 +1,175 @@
+<template>
+  <md-dialog :md-active.sync="showDiscordWindow" @close="showDiscordWindow=false">
+    <div class="md-layout md-alignment-bottom-center">
+      <div class="md-layout-item md-size-70 md-small-size-100 md-alignment-bottom-center rounded-only">
+        <md-steppers :md-active-step.sync="currentMove" md-linear>
+          <md-step id="steamAuth" md-label="Steam" :md-done.sync="steamAuth">
+            <p>Заранее извиняемся за данную жопу боль, но чтоб предостеречь рейды на сервер дискорда и залет мимоходов, мы сделали авторизацию. Не пройдя ее и зайдя на наш сервер дискорда тебе можно будет лишь читать канал с аннонсами. Так что быстро ты давай пальчик в попу себе вставляй.</p>
+            <md-button v-if="this.$API.player.success_auth" style="color: #ffffff; font-family: tf2build; background: #000000" v-on:click="moveTo('logout', 'steam')">Выйти из Steam</md-button>
+            <md-button v-else style="color: #ffffff; font-family: tf2build; background: #000000" v-on:click="moveTo('login', 'steam')">Войти в Steam</md-button>
+          </md-step>
+
+          <md-step id="discordAuth" md-label="Discord" :md-error="steamAlreadyAttachment" :md-done.sync="discordAuth">
+            <div v-if="discord.id!==''">
+              <p>У тебя уже есть привязанный аккаунт дискорда с ид: {{discord.id}}!<br> Поэтому зайти к нам на сервер тебе не составляет больших проблем.<br>Конечно ты можешь отвязать свой дискорд от стима если желаешь)</p>
+              <md-button v-if="discord.id!==''" style="color: #fdfde1; font-family: tf2build; background: #4679e7" v-on:click="openDiscord()">Перейти на сервер</md-button>
+              <md-button v-if="discord.id!==''" style="color: #fdfde1; font-family: tf2build; background: #ff2828" v-on:click="unregisterDiscord()">Отвязать Discord от Steam</md-button>
+            </div>
+            <div v-else>
+              <div v-if="discord.nickname===''">
+                <p>Теперь надо зайти в дискорд, иначе как мы узнаем твои данные?</p>
+                <md-button style="color: #ffffff; font-family: tf2build; background: #505050" v-on:click="moveTo('login', 'discord')">Войти в Discord</md-button>
+              </div>
+              <div v-else>
+                <p>Вот теперь мы узнали что тебя зовут {{discord.nickname}}, пока привязывать одно к другому, так что давай быстрее иди к следующему шагу</p>
+                <md-button style="color: #ffffff; font-family: tf2build; background: #505050" v-on:click="moveTo('logout', 'discord')">Выйти из Discord</md-button>
+              </div>
+
+            </div>
+          </md-step>
+
+          <md-step id="connectAuth" md-label="Связать аккаунты" :md-done.sync="connectAuth">
+            <div v-if="discord.id.length>0">
+              <p>Вот теперь ты точно можешь общаться со всеми у нас на сервере дискорда, но если ты вдруг передумал и хочешь отвязать свой дискорд от стима, перейди на второй шаг и нажми на отвязать дискорд.</p>
+              <md-button v-if="discord.id!==''" style="color: #fdfde1; font-family: tf2build; background: #4679e7" v-on:click="openDiscord()">Открыть Discord</md-button>
+            </div>
+            <div v-else>
+              <p>Поздравляю друг и почти на финешной прямой, осталось лишь их только связать и зайти уже в нашу клоаку!</p>
+              <p v-if="discord.reg_msg.length > 0">{{discord.reg_msg}}</p>
+              <md-button style="color: #000000; font-family: tf2build; background: #fd8846" v-on:click="registerDiscord()">Связать аккаунты!</md-button>
+            </div>
+          </md-step>
+        </md-steppers>
+      </div>
+    </div>
+  </md-dialog>
+</template>
+
+<script>
+import axios from "axios";
+export default {
+  name: "DiscordWindow",
+  data: () => ({
+    showDiscordWindow: false,
+    currentMove: "steamAuth",
+    steamAuth: false,
+    discordAuth: false,
+    connectAuth: false,
+    steamAlreadyAttachment: '',
+    discord: {
+      nickname: "",
+      id: "",
+      reg_msg: ""
+    }
+  }),
+  methods: {
+    setDone (id, index) {
+      this[id] = true
+
+      this.steamAlreadyAttachment = ''
+
+      if (index) {
+        this.currentMove = index
+      }
+    },
+    openDW(){this.getMove();this.showDiscordWindow = true;},
+    closeDW(){this.showDiscordWindow = false},
+    moveTo(action, service) {
+      let subdomain = "tf2";
+      if (location.host.indexOf("pblr-nyk.pro") !== -1) {
+        subdomain = location.host.split(".")[0]
+      }
+
+      if (service === 'steam') {
+        return window.open(`/api/auth/${action}?subdomain=${subdomain}`, '_self');
+      }
+      return window.open(`/api/auth/${service}/${action}`, '_self');
+    },
+    getMove(){
+      console.log("[DiscordWindow] next stage: steam")
+      if (this.$API.player.success_auth) {
+        this.steamAuth = true;
+        //
+        console.log("[DiscordWindow] next stage: discord")
+        if (!this.discordAuth) {
+          this.currentMove = "discordAuth";
+        } else {
+          console.log("[DiscordWindow] next stage: connect")
+          this.currentMove = "connectAuth";
+        }
+        //
+      } else {
+        this.currentMove = "steamAuth";
+      }
+      console.log("[DiscordWindow]", this.steamAuth, this.discordAuth, this.connectAuth);
+      console.log("[DiscordWindow]", this.currentMove)
+      return this.currentMove;
+    },
+    openDiscord(){
+      if (this.url !== null) window.open("https://tf2.pblr-nyk.pro/discord", '_blank');
+    },
+    registerDiscord(){
+      axios.post("api/auth/discord").then(
+          (response) => {
+            switch (response.status) {
+              case 201: {this.discord.reg_msg = "Аккаунт привязан!";this.updateDiscordId();this.openDiscord();break;}
+            }
+          }
+      ).catch((r) => {
+        switch (r.response.status) {
+          case 409: {this.discord.reg_msg = "увы к твоему стиму уже как-то подвязался другой дискорд аккаунт";break;}
+          case 413: {this.discord.reg_msg = "увы к твоему дискорду уже как-то подвязался другой стим аккаунт, или ты жмешь зачемто второй раз...";break;}
+          default: {this.discord.reg_msg = "привязка закончилась с неизвестной ошибкой, иди нахуй...";break;}
+        }
+      })
+    },
+    unregisterDiscord() {
+      axios.delete("api/auth/steam/discord")
+          .then((response) => {
+            if (response.status === 200) {
+              this.discordAuth = true;
+              this.discord.id = '';
+              this.currentMove = "connectAuth";
+            } else {
+              window.reload();
+            }
+          }).catch(()=>{})
+    },
+    updateDiscordId() {
+      if (this.$API.player.auth("steam")) {
+        console.log("[DiscordWindow] found steam cookie");
+        axios.get("api/auth/steam/discord").then(
+            (response) => {
+              if (response.status === 200) {
+                this.discordAuth = false;
+                this.discord.id = response.data;
+              } else {
+                this.discordAuth = true;
+              }
+            }
+        ).catch(() => {this.discordAuth = true;})
+      }
+    }
+  },
+  mounted() {
+    this.updateDiscordId()
+    if (this.$API.player.auth("discord")) {
+      console.log("[DiscordWindow] found discord cookie");
+      axios.get("api/auth/discord").then(
+          (response) => {
+            if (response.status === 200) {
+              this.discord.nickname = response.data.username;
+            }
+          }
+      ).catch(()=>{});
+    }
+  }
+}
+</script>
+
+<style>
+.md-steppers {
+  background-color: #5764f1;
+  border-radius: 5px;
+}
+</style>

src/components/TabsMenuElements/BackendStatus/BackendStatus.vue

@@ -13,6 +13,8 @@
         <md-button v-else v-on:click="showFP()" style="color: #131213; font-family: tf2build; background: lightgreen">Найти игрока</md-button>
         <FindPlayer ref="fp"/>
         <AuthWindow ref="aw" />
+        <md-button v-on:click="openDW()" style="color: #131213; font-family: tf2build; background: #5764f1">Привязать стим к дискорду</md-button>
+        <DiscordWindow ref="dw"/>
       </div>
     </div>
   </md-tab>
@@ -21,10 +23,11 @@
 <script>
 import FindPlayer from "@/components/TabsMenuElements/BackendStatus/Components/FindPlayer.vue";
 import AuthWindow from "@/components/Others/Auth/AuthWindow.vue";
+import DiscordWindow from "@/components/Others/Auth/DiscordWindow.vue";
 
 export default {
   name: "BackendStatus",
-  components: {AuthWindow, FindPlayer},
+  components: {DiscordWindow, AuthWindow, FindPlayer},
   props: {
     s_icon: {
       type: String,
@@ -37,7 +40,8 @@ export default {
     },
     openAW() {
       this.$refs.aw.openAW();
-    }
+    },
+    openDW() {this.$refs.dw.openDW();}
   }
 }
 </script>