changes:

+ closes #136
+ display player errors in ui

src/assets/version.json

@@ -1,3 +1,3 @@
 {
-  "date": "2023-08-12"
+  "date": "2023-08-30"
 }

src/components/Charts.vue

@@ -4,6 +4,7 @@ import { ref, reactive, watch, onMounted } from 'vue';
 import AlbumItem from '@/components/AlbumItem.vue';
 import SongItem from '@/components/SongItem.vue';
 
+import { useStore } from '@/scripts/util.js';
 import { getJsonHyp } from '@/scripts/fetch.js';
 
 import { useResults, useArtist } from '@/stores/results.js';
@@ -13,6 +14,7 @@ defineEmits(['play-urls']);
 
 const { getArtist } = useArtist(),
   results = useResults(),
+  store = useStore(),
   { t } = useI18n();
 
 const id = ref(''),
@@ -30,7 +32,7 @@ async function getCharts() {
   console.log(json);
 
   if (!id.value)
-    id.value = json.options.all.find(i => i.title == json.options.default).id;
+    id.value = json.options.all.find(i => store.cc ? i.id == store.cc : i.title == json.options.default).id;
 
   for (const country of json.options.all) {
     const locId = `countries.${country.id}`,

src/components/Player.vue

@@ -1,12 +1,12 @@
 <script setup>
 import { ref, watch, onMounted, onBeforeUnmount, onUnmounted } from 'vue';
-import { useManifest } from '@/scripts/util.js';
 
 import muxjs from 'mux.js';
 window.muxjs = muxjs;
 
-import { useStore, useRoute } from '@/scripts/util.js';
+import { useStore, useRoute, useManifest } from '@/scripts/util.js';
 import { useData, usePlayer } from '@/stores/player.js';
+import { useAlert } from '@/stores/misc';
 
 const player = usePlayer(),
   data = useData(),
@@ -108,7 +108,8 @@ async function Stream() {
         }
       })
       .catch(err => {
-        console.error('Code: ' + err.code, err);
+        console.error(err);
+        useAlert.add('error: ' + e.code)
       });
   }
 }

src/components/Prefs.vue

@@ -23,7 +23,8 @@ const { t, setupLocale } = useI18n(),
   hypInstances = ref([]),
   next = ref(false),
   compact = ref(false),
-  prm = ref(false);
+  prm = ref(false),
+  cc = ref(false);
 
 getJson('https://piped-instances.kavin.rocks')
   .then(i => i || getJson('https://instances.tokhmi.xyz'))
@@ -116,6 +117,7 @@ onMounted(() => {
   getStoreBool('next', next, true);
   getStoreBool('compact', compact, false);
   getStoreBool('prm', prm, false);
+  getStoreBool('cc', cc, false);
 });
 </script>
 
@@ -168,6 +170,17 @@ onMounted(() => {
     </option>
   </select>
 
+  <div class="left">
+    <input
+      type="checkbox"
+      name="pref-chk-cc"
+      id="pref-chk-cc"
+      class="input"
+      @change="setStore('to_cc', $event.target.checked)"
+      v-model="cc" />
+    <label for="pref-chk-cc">{{ t('pref.cc') }}</label>
+  </div>
+
   <h2>{{ t('pref.tab') }}</h2>
 
   <select

src/components/SongItem.vue

@@ -157,6 +157,9 @@ onMounted(() => {
   margin: 1rem 0;
   justify-content: initial;
 }
+.song h4 {
+  overflow-wrap: anywhere;
+}
 span.content {
   padding: 1rem;
   flex-direction: column;

src/stores/misc.js

@@ -15,6 +15,7 @@ export const SUPPORTED_LOCALES = [
   {
     code: 'bn',
     name: 'বাংলা',
+    cc: 'IN',
   },
   {
     code: 'bs',
@@ -27,6 +28,7 @@ export const SUPPORTED_LOCALES = [
   {
     code: 'de',
     name: 'Deutsch',
+    cc: 'DE',
   },
   {
     code: 'en',
@@ -43,6 +45,7 @@ export const SUPPORTED_LOCALES = [
   {
     code: 'fr',
     name: 'Français',
+    cc: 'FR',
   },
   {
     code: 'gl',
@@ -55,50 +58,62 @@ export const SUPPORTED_LOCALES = [
   {
     code: 'id',
     name: 'Bahasa Indonesia',
+    cc: 'ID',
   },
   {
     code: 'it',
     name: 'Italiano',
+    cc: 'IT',
   },
   {
     code: 'ja',
     name: '日本語',
+    cc: 'JP',
   },
   {
     code: 'ko',
     name: '한국어',
+    cc: 'KR',
   },
   {
     code: 'nl',
     name: 'Nederlands',
+    cc: 'NL'
   },
   {
     code: 'pt',
     name: 'Português',
+    cc: 'PT',
   },
   {
     code: 'pt_br',
     name: 'Português Brasileiro',
+    cc: 'BR',
   },
   {
     code: 'ro',
     name: 'Română',
+    cc: 'RO',
   },
   {
     code: 'ru',
     name: 'Pyccкий',
+    cc: 'RU',
   },
   {
     code: 'sr',
     name: 'Српски',
+    cc: 'RS',
   },
   {
     code: 'tr',
     name: 'Türkçe',
+    cc: 'TR',
   },
   {
     code: 'uk',
     name: 'Yкраїнська',
+    cc: 'UA',
   },
   {
     code: 'vi',
@@ -107,6 +122,7 @@ export const SUPPORTED_LOCALES = [
   {
     code: 'zh_Hans',
     name: '中文 (简体)',
+    cc: 'CN',
   },
   {
     code: 'zh_Hant',
@@ -145,6 +161,11 @@ export const useI18n = defineStore('i18n', () => {
           map.value[code] = mod;
           locale.value = code;
           localStorage.locale ??= code;
+          if (localStorage.to_cc == 'true') {
+            const cc = SUPPORTED_LOCALES.find(i => i.code == code).cc
+            if (cc) localStorage.cc = cc
+            else localStorage.cc = ''
+          } else localStorage.cc = ''
         });
   }