Update fastforward/rewind icons and show on lock screen, move logout btn, fix fallback cover art

2025-07-22 11:44:33 +02:00 · 2021-09-05 10:37:08 -05:00 · 2021-09-05 10:37:08 -05:00 · 811fc91fa7
commit 811fc91fa7
parent b0d1f51678
22 changed files with 101 additions and 38 deletions
--- a/Server.js
+++ b/Server.js
@ -33,8 +33,8 @@ class Server extends EventEmitter {
  setUser(user) {
    this.user = user
    this.store.commit('user/setUser', user)
-    this.store.commit('user/setSettings', user.settings)
    if (user) {
+      this.store.commit('user/setSettings', user.settings)
      localStorage.setItem('userToken', user.token)
    } else {
      localStorage.removeItem('userToken')
--- a/android/app/build.gradle
+++ b/android/app/build.gradle
@ -10,8 +10,8 @@ android {
        applicationId "com.audiobookshelf.app"
        minSdkVersion rootProject.ext.minSdkVersion
        targetSdkVersion rootProject.ext.targetSdkVersion
-        versionCode 4
-        versionName "0.2.0-beta"
+        versionCode 5
+        versionName "0.2.1-beta"
        testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
        aaptOptions {
             // Files and dirs to omit from the packaged assets dir, modified to accommodate modern web apps.
--- a/android/app/src/main/java/com/audiobookshelf/app/PlayerNotificationService.kt
+++ b/android/app/src/main/java/com/audiobookshelf/app/PlayerNotificationService.kt
@ -191,6 +191,8 @@ class PlayerNotificationService : Service()  {
    playerNotificationManager.setUseChronometer(false)
    playerNotificationManager.setVisibility(NotificationCompat.VISIBILITY_PUBLIC)
    playerNotificationManager.setPriority(NotificationCompat.PRIORITY_MAX)
+    playerNotificationManager.setUseFastForwardActionInCompactView(true)
+    playerNotificationManager.setUseRewindActionInCompactView(true)

    // Unknown action
    playerNotificationManager.setBadgeIconType(NotificationCompat.BADGE_ICON_LARGE)
@ -276,14 +278,6 @@ class PlayerNotificationService : Service()  {
      }

      override fun onEvents(player: Player, events: Player.Events) {
-        if (events.contains(Player.EVENT_TRACKS_CHANGED)) {
-          Log.d(tag, "EVENT_TRACKS_CHANGED")
-        }
-
-        if (events.contains(Player.EVENT_TIMELINE_CHANGED)) {
-          Log.d(tag, "EVENT_TIMELINE_CHANGED")
-        }
-
        if (events.contains(Player.EVENT_POSITION_DISCONTINUITY)) {
          Log.d(tag, "EVENT_POSITION_DISCONTINUITY")
        }
--- a/android/app/src/main/res/drawable-anydpi/exo_icon_fastforward.xml
+++ b/android/app/src/main/res/drawable-anydpi/exo_icon_fastforward.xml
@ -0,0 +1,21 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24"
+    android:tint="#FFFFFF">
+  <group android:scaleX="1.127451"
+      android:scaleY="1.127451"
+      android:translateX="-1.5294118"
+      android:translateY="-1.5294118">
+    <path
+        android:fillColor="@android:color/white"
+        android:pathData="M18,13c0,3.31 -2.69,6 -6,6s-6,-2.69 -6,-6s2.69,-6 6,-6v4l5,-5l-5,-5v4c-4.42,0 -8,3.58 -8,8c0,4.42 3.58,8 8,8s8,-3.58 8,-8H18z"/>
+    <path
+        android:fillColor="@android:color/white"
+        android:pathData="M10.86,15.94l0,-4.27l-0.09,0l-1.77,0.63l0,0.69l1.01,-0.31l0,3.26z"/>
+    <path
+        android:fillColor="@android:color/white"
+        android:pathData="M12.25,13.44v0.74c0,1.9 1.31,1.82 1.44,1.82c0.14,0 1.44,0.09 1.44,-1.82v-0.74c0,-1.9 -1.31,-1.82 -1.44,-1.82C13.55,11.62 12.25,11.53 12.25,13.44zM14.29,13.32v0.97c0,0.77 -0.21,1.03 -0.59,1.03c-0.38,0 -0.6,-0.26 -0.6,-1.03v-0.97c0,-0.75 0.22,-1.01 0.59,-1.01C14.07,12.3 14.29,12.57 14.29,13.32z"/>
+  </group>
+</vector>
--- a/android/app/src/main/res/drawable-anydpi/exo_icon_rewind.xml
+++ b/android/app/src/main/res/drawable-anydpi/exo_icon_rewind.xml
@ -0,0 +1,21 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24"
+    android:tint="#FFFFFF">
+  <group android:scaleX="1.127451"
+      android:scaleY="1.127451"
+      android:translateX="-1.5294118"
+      android:translateY="-1.5294118">
+    <path
+        android:fillColor="@android:color/white"
+        android:pathData="M11.99,5V1l-5,5l5,5V7c3.31,0 6,2.69 6,6s-2.69,6 -6,6s-6,-2.69 -6,-6h-2c0,4.42 3.58,8 8,8s8,-3.58 8,-8S16.41,5 11.99,5z"/>
+    <path
+        android:fillColor="@android:color/white"
+        android:pathData="M10.89,16h-0.85v-3.26l-1.01,0.31v-0.69l1.77,-0.63h0.09V16z"/>
+    <path
+        android:fillColor="@android:color/white"
+        android:pathData="M15.17,14.24c0,0.32 -0.03,0.6 -0.1,0.82s-0.17,0.42 -0.29,0.57s-0.28,0.26 -0.45,0.33s-0.37,0.1 -0.59,0.1s-0.41,-0.03 -0.59,-0.1s-0.33,-0.18 -0.46,-0.33s-0.23,-0.34 -0.3,-0.57s-0.11,-0.5 -0.11,-0.82V13.5c0,-0.32 0.03,-0.6 0.1,-0.82s0.17,-0.42 0.29,-0.57s0.28,-0.26 0.45,-0.33s0.37,-0.1 0.59,-0.1s0.41,0.03 0.59,0.1c0.18,0.07 0.33,0.18 0.46,0.33s0.23,0.34 0.3,0.57s0.11,0.5 0.11,0.82V14.24zM14.32,13.38c0,-0.19 -0.01,-0.35 -0.04,-0.48s-0.07,-0.23 -0.12,-0.31s-0.11,-0.14 -0.19,-0.17s-0.16,-0.05 -0.25,-0.05s-0.18,0.02 -0.25,0.05s-0.14,0.09 -0.19,0.17s-0.09,0.18 -0.12,0.31s-0.04,0.29 -0.04,0.48v0.97c0,0.19 0.01,0.35 0.04,0.48s0.07,0.24 0.12,0.32s0.11,0.14 0.19,0.17s0.16,0.05 0.25,0.05s0.18,-0.02 0.25,-0.05s0.14,-0.09 0.19,-0.17s0.09,-0.19 0.11,-0.32s0.04,-0.29 0.04,-0.48V13.38z"/>
+  </group>
+</vector>
--- a/android/app/src/main/res/drawable-hdpi/exo_icon_fastforward.png
+++ b/android/app/src/main/res/drawable-hdpi/exo_icon_fastforward.png
--- a/android/app/src/main/res/drawable-hdpi/exo_icon_rewind.png
+++ b/android/app/src/main/res/drawable-hdpi/exo_icon_rewind.png
--- a/android/app/src/main/res/drawable-mdpi/exo_icon_fastforward.png
+++ b/android/app/src/main/res/drawable-mdpi/exo_icon_fastforward.png
--- a/android/app/src/main/res/drawable-mdpi/exo_icon_rewind.png
+++ b/android/app/src/main/res/drawable-mdpi/exo_icon_rewind.png
--- a/android/app/src/main/res/drawable-xhdpi/exo_icon_fastforward.png
+++ b/android/app/src/main/res/drawable-xhdpi/exo_icon_fastforward.png
--- a/android/app/src/main/res/drawable-xhdpi/exo_icon_rewind.png
+++ b/android/app/src/main/res/drawable-xhdpi/exo_icon_rewind.png
--- a/android/app/src/main/res/drawable-xxhdpi/exo_icon_fastforward.png
+++ b/android/app/src/main/res/drawable-xxhdpi/exo_icon_fastforward.png
--- a/android/app/src/main/res/drawable-xxhdpi/exo_icon_rewind.png
+++ b/android/app/src/main/res/drawable-xxhdpi/exo_icon_rewind.png
--- a/android/app/src/main/res/drawable/exo_icon_fastforward.xml
+++ b/android/app/src/main/res/drawable/exo_icon_fastforward.xml
@ -0,0 +1,7 @@
+<vector android:height="24dp" android:tint="#FFFFFF"
+    android:viewportHeight="24" android:viewportWidth="24"
+    android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="@android:color/white" android:pathData="M18,13c0,3.31 -2.69,6 -6,6s-6,-2.69 -6,-6s2.69,-6 6,-6v4l5,-5l-5,-5v4c-4.42,0 -8,3.58 -8,8c0,4.42 3.58,8 8,8s8,-3.58 8,-8H18z"/>
+    <path android:fillColor="@android:color/white" android:pathData="M10.86,15.94l0,-4.27l-0.09,0l-1.77,0.63l0,0.69l1.01,-0.31l0,3.26z"/>
+    <path android:fillColor="@android:color/white" android:pathData="M12.25,13.44v0.74c0,1.9 1.31,1.82 1.44,1.82c0.14,0 1.44,0.09 1.44,-1.82v-0.74c0,-1.9 -1.31,-1.82 -1.44,-1.82C13.55,11.62 12.25,11.53 12.25,13.44zM14.29,13.32v0.97c0,0.77 -0.21,1.03 -0.59,1.03c-0.38,0 -0.6,-0.26 -0.6,-1.03v-0.97c0,-0.75 0.22,-1.01 0.59,-1.01C14.07,12.3 14.29,12.57 14.29,13.32z"/>
+</vector>
--- a/android/app/src/main/res/drawable/exo_icon_rewind.xml
+++ b/android/app/src/main/res/drawable/exo_icon_rewind.xml
@ -0,0 +1,7 @@
+<vector android:height="24dp" android:tint="#FFFFFF"
+    android:viewportHeight="24" android:viewportWidth="24"
+    android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="@android:color/white" android:pathData="M11.99,5V1l-5,5l5,5V7c3.31,0 6,2.69 6,6s-2.69,6 -6,6s-6,-2.69 -6,-6h-2c0,4.42 3.58,8 8,8s8,-3.58 8,-8S16.41,5 11.99,5z"/>
+    <path android:fillColor="@android:color/white" android:pathData="M10.89,16h-0.85v-3.26l-1.01,0.31v-0.69l1.77,-0.63h0.09V16z"/>
+    <path android:fillColor="@android:color/white" android:pathData="M15.17,14.24c0,0.32 -0.03,0.6 -0.1,0.82s-0.17,0.42 -0.29,0.57s-0.28,0.26 -0.45,0.33s-0.37,0.1 -0.59,0.1s-0.41,-0.03 -0.59,-0.1s-0.33,-0.18 -0.46,-0.33s-0.23,-0.34 -0.3,-0.57s-0.11,-0.5 -0.11,-0.82V13.5c0,-0.32 0.03,-0.6 0.1,-0.82s0.17,-0.42 0.29,-0.57s0.28,-0.26 0.45,-0.33s0.37,-0.1 0.59,-0.1s0.41,0.03 0.59,0.1c0.18,0.07 0.33,0.18 0.46,0.33s0.23,0.34 0.3,0.57s0.11,0.5 0.11,0.82V14.24zM14.32,13.38c0,-0.19 -0.01,-0.35 -0.04,-0.48s-0.07,-0.23 -0.12,-0.31s-0.11,-0.14 -0.19,-0.17s-0.16,-0.05 -0.25,-0.05s-0.18,0.02 -0.25,0.05s-0.14,0.09 -0.19,0.17s-0.09,0.18 -0.12,0.31s-0.04,0.29 -0.04,0.48v0.97c0,0.19 0.01,0.35 0.04,0.48s0.07,0.24 0.12,0.32s0.11,0.14 0.19,0.17s0.16,0.05 0.25,0.05s0.18,-0.02 0.25,-0.05s0.14,-0.09 0.19,-0.17s0.09,-0.19 0.11,-0.32s0.04,-0.29 0.04,-0.48V13.38z"/>
+</vector>
--- a/components/app/Appbar.vue
+++ b/components/app/Appbar.vue
@ -9,10 +9,18 @@
      </a>
      <div>
        <p class="text-lg font-book leading-4">AudioBookshelf</p>
-        <!-- <a class="text-xs text-success leading-4 flex items-center py-1" :href="appListingUrl" target="_blank">Update available! <span class="material-icons text-sm leading-4 px-2">launch</span></a> -->
      </div>
      <div class="flex-grow" />
-      <ui-menu :label="username" :items="menuItems" @action="menuAction" class="ml-5" />
+      <!-- <ui-menu :label="username" :items="menuItems" @action="menuAction" class="ml-5" /> -->
+
+      <nuxt-link to="/account" class="relative w-28 bg-fg border border-gray-500 rounded shadow-sm ml-5 pl-3 pr-10 py-2 text-left focus:outline-none sm:text-sm cursor-pointer hover:bg-bg hover:bg-opacity-40" aria-haspopup="listbox" aria-expanded="true">
+        <span class="flex items-center">
+          <span class="block truncate">{{ username }}</span>
+        </span>
+        <span class="ml-3 absolute inset-y-0 right-0 flex items-center pr-2 pointer-events-none">
+          <span class="material-icons text-gray-100">person</span>
+        </span>
+      </nuxt-link>
    </div>
  </div>
 </template>
@ -44,9 +52,6 @@ export default {
    username() {
      return this.user ? this.user.username : 'err'
    },
-    // hasUpdate() {
-    //   return this.$store.state.hasUpdate
-    // },
    appListingUrl() {
      if (this.$platform === 'android') {
        return process.env.ANDROID_APP_URL
--- a/components/cards/BookCard.vue
+++ b/components/cards/BookCard.vue
@ -15,11 +15,9 @@

          <div class="absolute bottom-0 left-0 h-1.5 bg-yellow-400 shadow-sm" :style="{ width: width * userProgressPercent + 'px' }"></div>

-          <ui-tooltip v-if="showError" :text="errorText" class="absolute bottom-4 left-0">
          <div :style="{ height: 1.5 * sizeMultiplier + 'rem', width: 2.5 * sizeMultiplier + 'rem' }" class="bg-error rounded-r-full shadow-md flex items-center justify-end border-r border-b border-red-300">
            <span class="material-icons text-red-100 pr-1" :style="{ fontSize: 0.875 * sizeMultiplier + 'rem' }">priority_high</span>
          </div>
-          </ui-tooltip>
        </div>
      </nuxt-link>
    </div>
--- a/components/cards/BookCover.vue
+++ b/components/cards/BookCover.vue
@ -9,7 +9,7 @@

    <div v-if="imageFailed" class="absolute top-0 left-0 right-0 bottom-0 w-full h-full bg-red-100" :style="{ padding: placeholderCoverPadding + 'rem' }">
      <div class="w-full h-full border-2 border-error flex flex-col items-center justify-center">
-        <img src="/LogoTransparent.png" class="mb-2" :style="{ height: 64 * sizeMultiplier + 'px' }" />
+        <img src="/Logo.png" class="mb-2" :style="{ height: 64 * sizeMultiplier + 'px' }" />
        <p class="text-center font-book text-error" :style="{ fontSize: titleFontSize + 'rem' }">Invalid Cover</p>
      </div>
    </div>
--- a/package-lock.json
+++ b/package-lock.json
@ -1,6 +1,6 @@
 {
  "name": "audiobookshelf-app",
-  "version": "v0.1.0-beta",
+  "version": "v0.2.1-beta",
  "lockfileVersion": 1,
  "requires": true,
  "dependencies": {
@ -1001,9 +1001,9 @@
      }
    },
    "@capacitor/android": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/@capacitor/android/-/android-3.1.2.tgz",
-      "integrity": "sha512-WF2E2jWxO3EBl8Y3aTAa8PHwMZGiAl9pdqvJaEUUhbbovXe0UxAuG4n0mfci4ZI6dD8gannQ2peoZ74vJ0Gr3Q=="
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/@capacitor/android/-/android-3.2.2.tgz",
+      "integrity": "sha512-+/qbSZIHPP1VndRUe5c6dgheLV0MgX9CXeUo7el8ODHgVrC2DXKhczgvs+EpTAmvS2VZFxzDeld7AMUmHybTcg=="
    },
    "@capacitor/cli": {
      "version": "3.1.2",
@ -1044,9 +1044,9 @@
      }
    },
    "@capacitor/core": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/@capacitor/core/-/core-3.1.2.tgz",
-      "integrity": "sha512-cMqDY4JTNtyonqVPYxHqbmN3M3jlEBnQxecptlR+6yk/ZuhUwOJTHT1ActXRLyrQ8XIc74+9Yd37fwjWckSwFg==",
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/@capacitor/core/-/core-3.2.2.tgz",
+      "integrity": "sha512-xY3VyLbF0vSxQmQto6cI1PqP8idbwmfEAeaj248uuSrIYHeMc1L3RS6UN/yNBDPYPeAfNUwBhVqSTCtuZkEIcg==",
      "requires": {
        "tslib": "^2.1.0"
      }
--- a/package.json
+++ b/package.json
@ -1,6 +1,6 @@
 {
  "name": "audiobookshelf-app",
-  "version": "v0.2.0-beta",
+  "version": "v0.2.1-beta",
  "author": "advplyr",
  "scripts": {
    "dev": "nuxt --hostname localhost --port 1337",
@ -10,9 +10,9 @@
    "icons-android": "cordova-res android --skip-config --copy"
  },
  "dependencies": {
-    "@capacitor/android": "^3.1.2",
+    "@capacitor/android": "^3.2.2",
    "@capacitor/cli": "^3.1.2",
-    "@capacitor/core": "^3.1.2",
+    "@capacitor/core": "^3.2.2",
    "@capacitor/dialog": "^1.0.3",
    "@capacitor/ios": "^3.2.2",
    "@nuxtjs/axios": "^5.13.6",
--- a/pages/account.vue
+++ b/pages/account.vue
@ -4,12 +4,14 @@
      <ui-text-input-with-label :value="serverUrl" label="Server Url" disabled class="my-4" />

      <ui-text-input-with-label :value="username" label="Username" disabled class="my-4" />
+
+      <ui-btn color="primary flex items-center justify-between text-base w-full mt-8" @click="logout">Logout<span class="material-icons" style="font-size: 1.1rem">logout</span></ui-btn>
    </div>

-    <div class="flex items-center pt-4">
+    <div class="flex items-center pt-8">
      <div class="flex-grow" />
-      <p class="pr-2 text-sm font-book text-yellow-400">Report bugs, request features, provide feedback, and contribute on <a class="underline" href="https://github.com/advplyr/audiobookshelf" target="_blank">github</a>.</p>
-      <a href="https://github.com/advplyr/audiobookshelf" target="_blank" class="text-white hover:text-gray-200 hover:scale-150 hover:rotate-6 transform duration-500">
+      <p class="pr-2 text-sm font-book text-yellow-400">Report bugs, request features, provide feedback, and contribute on <a class="underline" href="https://github.com/advplyr/audiobookshelf-app" target="_blank">github</a>.</p>
+      <a href="https://github.com/advplyr/audiobookshelf-app" target="_blank" class="text-white hover:text-gray-200 hover:scale-150 hover:rotate-6 transform duration-500">
        <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" width="24" height="24" viewBox="0 0 24 24">
          <path
            d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"
@ -17,6 +19,7 @@
        </svg>
      </a>
    </div>
+
    <p class="font-mono pt-1 pb-4">{{ $config.version }}</p>

    <ui-btn v-if="isUpdateAvailable" class="w-full my-4" color="success" @click="clickUpdate"> Version {{ availableVersion }} is available! {{ immediateUpdateAllowed ? 'Update now' : 'Get update from app store' }} </ui-btn>
@ -57,6 +60,13 @@ export default {
    }
  },
  methods: {
+    logout() {
+      this.$axios.$post('/logout').catch((error) => {
+        console.error(error)
+      })
+      this.$server.logout()
+      this.$router.push('/connect')
+    },
    async clickUpdate() {
      if (this.immediateUpdateAllowed) {
        await AppUpdate.performImmediateUpdate()
--- a/pages/connect.vue
+++ b/pages/connect.vue
@ -51,8 +51,8 @@
      </div>
    </div>
    <div class="flex items-center justify-center pt-4 fixed bottom-4 left-0 right-0">
-      <a href="https://github.com/advplyr/audiobookshelf" target="_blank" class="text-sm pr-2">Follow the project on Github</a>
-      <a href="https://github.com/advplyr/audiobookshelf" target="_blank"
+      <a href="https://github.com/advplyr/audiobookshelf-app" target="_blank" class="text-sm pr-2">Follow the project on Github</a>
+      <a href="https://github.com/advplyr/audiobookshelf-app" target="_blank"
        ><svg class="w-8 h-8 text-gray-100" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="32" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24">
          <path
            d="M12 2.247a10 10 0 0 0-3.162 19.487c.5.088.687-.212.687-.475c0-.237-.012-1.025-.012-1.862c-2.513.462-3.163-.613-3.363-1.175a3.636 3.636 0 0 0-1.025-1.413c-.35-.187-.85-.65-.013-.662a2.001 2.001 0 0 1 1.538 1.025a2.137 2.137 0 0 0 2.912.825a2.104 2.104 0 0 1 .638-1.338c-2.225-.25-4.55-1.112-4.55-4.937a3.892 3.892 0 0 1 1.025-2.688a3.594 3.594 0 0 1 .1-2.65s.837-.262 2.75 1.025a9.427 9.427 0 0 1 5 0c1.912-1.3 2.75-1.025 2.75-1.025a3.593 3.593 0 0 1 .1 2.65a3.869 3.869 0 0 1 1.025 2.688c0 3.837-2.338 4.687-4.563 4.937a2.368 2.368 0 0 1 .675 1.85c0 1.338-.012 2.413-.012 2.75c0 .263.187.575.687.475A10.005 10.005 0 0 0 12 2.247z"