Merge pull request #675 from HolodexNet/dev

Deploy 2.31

Author: sphinxrave

docs/CHANGELOG.md

@@ -4,7 +4,12 @@
 
 - Development of Vue3 Holodex (release 3.0 ?!?!) is underway... If you like to influence how it looks, now is the best time to let us know.
 
-### 2.30 Holodex [*January 19th, 2022*]
+### 2.31 Holodex [*Feb 6th, 2023*]
+
+- Twitter Login may be at risk and we added a notification for that. Sorry if you find it annoying. It goes away after you link another login method.
+- Some minor changes have been added, such as wrapping Live Viewer / Subscriber Count info into id'd spans so you can hide it with adblockers. (Thanks Livia)
+
+### 2.30 Holodex [*January 19th, 2023*]
 
 This release puts out several community contributed changes.
 

src/App.vue

@@ -16,6 +16,38 @@
     <PWAUpdate />
     <ReportDialog />
     <InstallPrompt v-if="$store.state.isMobile" />
+    <v-snackbar
+      v-model="showTwitter"
+      color="warning"
+      top
+      transition="scroll-y-transition"
+      timeout="25000"
+    >
+      <b>{{ $t("views.login.twitterMsg.0") }}</b>
+      <template #action="{ attrs }">
+        <div class="flex flex-col">
+          <v-btn
+            color="blue"
+            class="mt-2 mb-2"
+            v-bind="attrs"
+            to="/login"
+            @click="showTwitter = false"
+          >
+            {{ $t("views.login.linkAcc") }}
+          </v-btn>
+
+          <v-btn
+            color="red"
+            v-bind="attrs"
+            block
+            class="mb-2"
+            @click="showTwitter = false"
+          >
+            {{ $t("views.app.close_btn") }}
+          </v-btn>
+        </div>
+      </template>
+    </v-snackbar>
   </v-app>
 </template>
 
@@ -45,6 +77,7 @@ export default {
         return {
             needRefresh: false,
             favoritesUpdateTask: null,
+            showTwitter: false,
         };
     },
     computed: {
@@ -93,6 +126,13 @@ export default {
             this.syncThemeColor();
         },
     },
+    mounted() {
+        if (this.$store.state.userdata?.user?.twitter_id
+            && !this.$store.state.userdata?.user?.discord_id
+            && !this.$store.state.userdata?.user?.google_id) {
+            this.showTwitter = true;
+        }
+    },
     async created() {
         this.$store.commit("setVisiblityState", document.visibilityState);
         document.addEventListener("visibilitychange", () => {
@@ -132,7 +172,10 @@ export default {
     },
     methods: {
         updateIsMobile() {
-            this.$store.commit("setIsMobile", ["xs", "sm"].includes(this.$vuetify.breakpoint.name));
+            this.$store.commit(
+                "setIsMobile",
+                ["xs", "sm"].includes(this.$vuetify.breakpoint.name),
+            );
         },
         interceptError(error) {
             // Any status codes that falls outside the range of 2xx cause this function to trigger
@@ -174,7 +217,9 @@ export default {
         },
         syncThemeColor() {
             const themeColor = this.$vuetify.theme.themes.dark.secondary;
-            window.document.head.querySelector<HTMLMetaElement>("meta[name=theme-color]").content = themeColor;
+            window.document.head.querySelector<HTMLMetaElement>(
+                "meta[name=theme-color]",
+            ).content = themeColor;
         },
     },
 };

src/components/channel/ChannelInfo.vue

@@ -35,9 +35,12 @@
       </span>
     </v-list-item-title>
     <v-list-item-subtitle>
-      <template v-if="!noSubscriberCount">
+      <span
+        v-if="!noSubscriberCount"
+        class="subscriber-count"
+      >
         {{ subscriberCount }}
-      </template>
+      </span>
       <template v-if="includeVideoCount">
         •
         {{ $t("component.channelInfo.videoCount", [channel.video_count]) }}

src/components/video/VideoCard.vue

@@ -220,7 +220,10 @@
               }}
             </span>
           </template>
-          <template v-else-if="data.status === 'live' && data.live_viewers > 0">
+          <span
+            v-else-if="data.status === 'live' && data.live_viewers > 0"
+            class="live-viewers"
+          >
             •
             {{
               $tc(
@@ -229,7 +232,7 @@
                 [formatCount(data.live_viewers, lang)]
               )
             }}
-          </template>
+          </span>
         </div>
       </div>
       <!-- Vertical dots menu -->

src/components/watch/WatchInfo.vue

@@ -23,15 +23,18 @@
     </v-card-title>
     <v-card-subtitle>
       {{ formattedTime }}
-      <template v-if="video.status === 'live' && liveViewers">
+      <span
+        v-if="video.status === 'live' && liveViewers"
+        class="live-viewers"
+      >
         • {{ $t("component.videoCard.watching", [liveViewers]) }}
         <span
           v-if="liveViewerChange"
           :class="liveViewerChange > 0 ? 'green--text' : 'red--text'"
         >
           ({{ (liveViewerChange > 0 ? "+ " : "") + liveViewerChange }})
         </span>
-      </template>
+      </span>
       <span
         v-if="video.topic_id"
         class="mx-1"

src/locales/de-DE/ui.yml

@@ -16,6 +16,7 @@ component:
     subscriberCount: '{n} Abonnenten'
     subscriberNA: Abonnentenzahl nicht verfügbar
     totalViews: Aufrufe insgesamt
+    inactiveChannel: Dieser Kanal ist nicht mehr aktiv.
   channelSocials:
     addToFavorites: Zu Favoriten hinzufügen
     removeFromFavorites: Aus Favoriten entfernen
@@ -48,14 +49,18 @@ component:
     googleCalendar: Zu Google Kalender hinzufügen
     totalTLs: Anzahl an Übersetzungen im Live-Chat
     tlPresence: Aktiver Übersetzer in den letzten 30 Minuten
+    uncertainPlaceholder: Diese Startzeit ist nicht offiziell bestätigt, die tatsächliche Startzeit kann variieren.
     typeScheduledYT: Geplanter Stream
     typeExternalStream: Externer Stream
     typeEventPlaceholder: Geplantes Event
     openClient: TL-Client öffnen
     openScriptEditor: Skript-Editor öffnen
+    popoutChat: YouTube-Chat rauslösen
     uploadScript: TL-Skript hochladen
   videoDescription:
     description: Beschreibung
+  video:
+    comment: { }
   description:
     showLess: Weniger anzeigen
     showMore: Mehr anzeigen
@@ -73,6 +78,7 @@ component:
       org: Organisation
       titledesc: Titel/Beschreibung
       title: titel
+      description: beschreibung
       comments: Kommentare
       videourl: Video-URL
   relatedVideo:
@@ -267,6 +273,9 @@ views:
     update_btn: Update
     close_btn: Schließen
     check_about_page: Besuche die Info-Seite um neue Änderungen zu sehen
+    nowSupportsMultiOrg: >-
+      Tipp: Hier kannst du die Organisation ändern!
+    loginCallToAction: Melde dich an, um deine eigenen Favoriten festzulegen.
   about:
     add_my_channel: Kanalanfrage
   watch:
@@ -347,6 +356,10 @@ views:
       - Mit Google anmelden
       - Mit Discord anmelden
       - Mit Twitter anmelden
+    twitterMsg:
+      - Aufgrund von Änderungen an den Twitter-API-Richtlinien funktioniert die Twitter-Anmeldung nach dem 9. Februar wahrscheinlich nicht mehr.
+      - Du verwendest derzeit nur die Twitter-Anmeldung. Wir empfehlen dringend, jetzt eine andere Anmeldemethode zu verknüpfen, um zu verhindern, dass du dich künftig aussperrst. (Auf einem neuen Gerät oder nachdem du deinen Browserverlauf löschst).
+      - Wenn du Probleme bei der Twitter-Anmeldung hast (und noch keine andere Login-Methode verknüpft hast), dann bitte uns in unseren Twitter-DMs oder auf Discord um Hilfe.
     username: Benutzername
     usernameBtn:
       - Ändern

src/locales/en/ui.yml

@@ -383,6 +383,10 @@ views:
       - Login with Google
       - Login with Discord
       - Login with Twitter
+    twitterMsg:
+      - Due to Twitter API policy change, Twitter Login is likely to no longer work after Feb 9th.
+      - You are only using Twitter Login at the moment. We strongly recommend linking a different login method now to prevent lockout. (on different devices or after a browser wipe).
+      - If you are failing to log into Holodex user via Twitter account (and have not bound any other login methods), please contact us on Twitter DMs or Discord for support.
     username: Username
     usernameBtn:
       - Change

src/locales/hu-HU/ui.yml

@@ -16,6 +16,7 @@ component:
     subscriberCount: '{n} Feliratkozó'
     subscriberNA: Feliratkozók száma nem elérhető
     totalViews: Megtekintések
+    inactiveChannel: Ez a csatorna már nem aktív.
   channelSocials:
     addToFavorites: Hozzáadás kedvencekhez
     removeFromFavorites: Eltávolítás kedvencek közül
@@ -48,14 +49,18 @@ component:
     googleCalendar: Hozzáadás a Google naptárhoz
     totalTLs: Összes élő chat fordítás
     tlPresence: Aktív fordító az utolsó 30 percben
+    uncertainPlaceholder: A kezdés időpontja nincs hivatalosan megerősítve, eltérhet a valóságtól.
     typeScheduledYT: Beütemezett stream
     typeExternalStream: Külső Stream
     typeEventPlaceholder: Beütemezett esemény
     openClient: Fordító kliens megnyitása
     openScriptEditor: Script szerkesztő megnyitása
+    popoutChat: Felugró ablak YouTube chat
     uploadScript: Fordítás script feltöltése
   videoDescription:
     description: Leírás
+  video:
+    comment: { }
   description:
     showLess: Kevesebb megjelenítése
     showMore: Továbbiak megjelenítése
@@ -73,6 +78,7 @@ component:
       org: org
       titledesc: cím/leírás
       title: cím
+      description: leírás
       comments: hozzászólások
       videourl: videó URL-címe
   relatedVideo:
@@ -267,6 +273,9 @@ views:
     update_btn: Frissítés
     close_btn: Bezárás
     check_about_page: Látogasd meg az Információ oldalt, hogy lásd a változásokat
+    nowSupportsMultiOrg: >-
+      Tipp: Itt tudod megváltoztatni az ügynökséget!
+    loginCallToAction: Jelentkezz be, hogy kedvenceket állíts.
   about:
     add_my_channel: Csatorna igénylés
   watch:
@@ -347,6 +356,10 @@ views:
       - Bejelentkezés Google fiókkal
       - Bejelentkezés Discorddal
       - Bejelentkezés Twitter fiókkal
+    twitterMsg:
+      - A Twitter API irányelvek változások miatt a bejelentkezés Twitterrel előreláthatólag nem fog működni február 9.-e után.
+      - Jelenleg csak Twitter bejelentkezést használsz. Erősen ajánljuk, hogy más bejelentkezési módot is állíts, hogy megelőzzük a fiókból való kizárást. (Más eszközökön vagy böngésző törlés után)
+      - Ha nem tudsz belépni Holodex fiókodba Twitter felhasználóval (valamint nincs más bejelentkezési módot beállítva) kérlek keress minket Twitteren privát üzenetben vagy Discordon segítségért.
     username: Felhasználónév
     usernameBtn:
       - Megváltoztatás

src/locales/id-ID/ui.yml

@@ -16,6 +16,7 @@ component:
     subscriberCount: '{n} Subscriber'
     subscriberNA: Jumlah Subscriber tidak tersedia
     totalViews: Jumlah Ditonton
+    inactiveChannel: Channel ini sudah tidak aktif.
   channelSocials:
     addToFavorites: Tambahkan ke Favorit
     removeFromFavorites: Hapus dari Favorit
@@ -48,14 +49,18 @@ component:
     googleCalendar: Tambahkan ke Kalender Google
     totalTLs: Jumlah Terjemahan Obrolan
     tlPresence: Penerjemah aktif dalam 30 menit terakhir
+    uncertainPlaceholder: Waktu mulai tidak terkonfirmasi secara resmi, waktu mulai sebenarnya bisa saja berbeda.
     typeScheduledYT: Stream Terjadwal
     typeExternalStream: Stream Eksternal
     typeEventPlaceholder: Acara Terjadwal
     openClient: Buka Klien TL
     openScriptEditor: Buka Editor Naskah
+    popoutChat: Pindahkan YouTube Chat
     uploadScript: Unggah Naskah TL
   videoDescription:
     description: Deskripsi
+  video:
+    comment: { }
   description:
     showLess: Tampilkan lebih sedikit
     showMore: Tampilkan lebih banyak
@@ -73,6 +78,7 @@ component:
       org: org
       titledesc: judul/desk
       title: judul
+      description: deskripsi
       comments: Komen
       videourl: url video
   relatedVideo:
@@ -267,6 +273,9 @@ views:
     update_btn: Perbarui
     close_btn: Tutup
     check_about_page: Kunjungi halaman Tentang untuk melihat pembaharuan
+    nowSupportsMultiOrg: >-
+      Tip: Kamu dapat mengubah organisasi disini!
+    loginCallToAction: Masuk untuk mengatur favoritmu.
   about:
     add_my_channel: Mengajukan Channel
   watch:
@@ -347,6 +356,10 @@ views:
       - Masuk dengan Google
       - Masuk dengan Discord
       - Masuk dengan Twitter
+    twitterMsg:
+      - Karena perubahan kebijakan API Twitter, Masuk dengan Twitter kemungkinan tidak lagi berfungsi setelah 9 Februari.
+      - Kamu hanya memakai Twitter sebagai sarana masuk. Kami sarankan untuk mengkaitkan metode masuk lain sekarang untuk mencegah penguncian. (pada perangkat lain atau setelah penghapusan browser).
+      - Jika kamu gagal masuk ke dalam Holodex via akun Twitter (dan tidak mengkaitkan akun dengan metode masuk lainnya), mohon hubungi kami untuk mendapatkan bantuan melalui DM Twitter atau Discord.
     username: Nama Pengguna
     usernameBtn:
       - Ubah

src/locales/ja-JP/ui.yml

@@ -356,6 +356,10 @@ views:
       - Googleでログイン
       - Discordでログイン
       - Twitterでログイン
+    twitterMsg:
+      - Twitter APIポリシーの変更により、2月9日以降、Twitterログインは機能しなくなる可能性があります。
+      - 現時点であなたはTwitterログインのみを使用しています。(異なるデバイスからログインする場合、またはブラウザのサイト情報を消去した後の) ロックアウトを防ぐため、今すぐ別のログイン方法をリンクすることを強くお勧めします。
+      - Twitterアカウント経由でHolodex ユーザーにログインできない場合 (また、他のログイン方法を紐付けていない場合) TwitterのDMまたはDiscordからお問い合わせください。
     username: ユーザー名
     usernameBtn:
       - 更新