Merge pull request #1380 from chme/web-next

Update web interface

web-src/package-lock.json

@@ -1,18 +1,19 @@
 {
   "name": "owntone-web",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "owntone-web",
-      "version": "1.1.1",
+      "version": "1.2.0",
       "license": "GPL-2.0",
       "dependencies": {
         "axios": "^0.24.0",
         "bulma": "^0.9.3",
         "bulma-switch": "^2.0.0",
         "core-js": "^3.15.2",
+        "follow-redirects": "^1.14.7",
         "mdi": "^2.2.43",
         "moment": "^2.29.1",
         "moment-duration-format": "^2.3.2",
@@ -8912,9 +8913,9 @@
       }
     },
     "node_modules/follow-redirects": {
-      "version": "1.14.6",
+      "version": "1.14.7",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.6.tgz",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.7.tgz",
-      "integrity": "sha512-fhUl5EwSJbbl8AR+uYL2KQDxLkdSjZGR36xy46AO7cOMTrCMON6Sa28FmAnC2tRTDbd/Uuzz3aJBv7EBN7JH8A==",
+      "integrity": "sha512-+hbxoLbFMbRKDwohX8GkTataGqO6Jb7jGwpAlwgy2bIz25XtRm7KEzJM76R1WiNT5SwZkX4Y75SwBolkpmE7iQ==",
       "funding": [
         {
           "type": "individual",
@@ -27221,9 +27222,9 @@
       }
     },
     "follow-redirects": {
-      "version": "1.14.6",
+      "version": "1.14.7",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.6.tgz",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.7.tgz",
-      "integrity": "sha512-fhUl5EwSJbbl8AR+uYL2KQDxLkdSjZGR36xy46AO7cOMTrCMON6Sa28FmAnC2tRTDbd/Uuzz3aJBv7EBN7JH8A=="
+      "integrity": "sha512-+hbxoLbFMbRKDwohX8GkTataGqO6Jb7jGwpAlwgy2bIz25XtRm7KEzJM76R1WiNT5SwZkX4Y75SwBolkpmE7iQ=="
     },
     "for-in": {
       "version": "1.0.2",

web-src/package.json

@@ -1,6 +1,6 @@
 {
   "name": "owntone-web",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "private": true,
   "description": "OwnTone web interface",
   "author": "chme <christian.meffert@googlemail.com>",
@@ -15,6 +15,7 @@
     "bulma": "^0.9.3",
     "bulma-switch": "^2.0.0",
     "core-js": "^3.15.2",
+    "follow-redirects": "^1.14.7",
     "mdi": "^2.2.43",
     "moment": "^2.29.1",
     "moment-duration-format": "^2.3.2",

web-src/src/components/SpotifyListItemTrack.vue

@@ -1,10 +1,10 @@
 <template>
   <div class="media">
     <div class="media-content fd-has-action is-clipped" v-on:click="play">
-      <h1 class="title is-6" :class="{ 'has-text-grey-light': !track.is_playable }">{{ track.name }}</h1>
+      <h1 class="title is-6" :class="{ 'has-text-grey-light': track.is_playable === false }">{{ track.name }}</h1>
-      <h2 class="subtitle is-7" :class="{ 'has-text-grey': track.is_playable, 'has-text-grey-light': !track.is_playable }"><b>{{ track.artists[0].name }}</b></h2>
+      <h2 class="subtitle is-7" :class="{ 'has-text-grey': track.is_playable, 'has-text-grey-light': track.is_playable === false }"><b>{{ track.artists[0].name }}</b></h2>
-      <h2 class="subtitle is-7" v-if="!track.is_playable">
+      <h2 class="subtitle is-7" v-if="track.is_playable === false">
-        (Track is not playable, restriction reason: {{ track.restrictions.reason }})
+        (Track is not playable<span v-if="track.restrictions && track.restrictions.reason">, restriction reason: {{ track.restrictions.reason }}</span>)
       </h2>
     </div>
     <div class="media-right">

web-src/src/pages/PageAbout.vue

@@ -95,7 +95,7 @@
           <div class="column is-four-fifths">
             <div class="content has-text-centered-mobile">
               <p class="is-size-7">Compiled with support for {{ config.buildoptions | join }}.</p>
-              <p class="is-size-7">Web interface built with <a href="http://bulma.io">Bulma</a>, <a href="https://materialdesignicons.com/">Material Design Icons</a>, <a href="https://vuejs.org/">Vue.js</a>, <a href="https://github.com/mzabriskie/axios">axios</a> and <a href="https://github.com/ejurgensen/OwnTone/network/dependencies">more</a>.</p>
+              <p class="is-size-7">Web interface built with <a href="http://bulma.io">Bulma</a>, <a href="https://materialdesignicons.com/">Material Design Icons</a>, <a href="https://vuejs.org/">Vue.js</a>, <a href="https://github.com/mzabriskie/axios">axios</a> and <a href="https://github.com/owntone/owntone-server/network/dependencies">more</a>.</p>
             </div>
           </div>
         </div>

web-src/src/pages/PageSearch.vue

@@ -13,7 +13,7 @@
                     <i class="mdi mdi-magnify"></i>
                   </span>
                 </p>
-                <p class="help has-text-centered">Tip: you can search by a smart playlist query language <a href="https://github.com/ejurgensen/OwnTone/blob/master/README_SMARTPL.md" target="_blank">expression</a> if you prefix it
+                <p class="help has-text-centered">Tip: you can search by a smart playlist query language <a href="https://github.com/owntone/owntone-server/blob/master/README_SMARTPL.md" target="_blank">expression</a> if you prefix it
                   with <code>query:</code>.
                 </p>
               </div>