Use local image as cover if found, adding release-it version control

client/components/cards/BookCover.vue

@@ -1,7 +1,13 @@
 <template>
   <div class="relative rounded-sm overflow-hidden" :style="{ height: width * 1.6 + 'px', width: width + 'px', maxWidth: width + 'px', minWidth: width + 'px' }">
-    <img ref="cover" :src="cover" class="w-full h-full object-cover" />
+    <img ref="cover" :src="cover" @error="imageError" class="w-full h-full object-cover" />
 
+    <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' }" />
+        <p class="text-center font-book text-error" :style="{ fontSize: titleFontSize + 'rem' }">Invalid Cover</p>
+      </div>
+    </div>
     <div v-if="!hasCover" class="absolute top-0 left-0 right-0 bottom-0 w-full h-full flex items-center justify-center" :style="{ padding: placeholderCoverPadding + 'rem' }">
       <div>
         <p class="text-center font-book" style="color: rgb(247 223 187)" :style="{ fontSize: titleFontSize + 'rem' }">{{ titleCleaned }}</p>
@@ -26,7 +32,9 @@ export default {
     }
   },
   data() {
-    return {}
+    return {
+      imageFailed: false
+    }
   },
   computed: {
     book() {
@@ -56,23 +64,28 @@ export default {
     hasCover() {
       return !!this.book.cover
     },
-    fontSizeMultiplier() {
+    sizeMultiplier() {
       return this.width / 120
     },
     titleFontSize() {
-      return 0.75 * this.fontSizeMultiplier
+      return 0.75 * this.sizeMultiplier
     },
     authorFontSize() {
-      return 0.6 * this.fontSizeMultiplier
+      return 0.6 * this.sizeMultiplier
     },
     placeholderCoverPadding() {
-      return 0.8 * this.fontSizeMultiplier
+      return 0.8 * this.sizeMultiplier
     },
     authorBottom() {
-      return 0.75 * this.fontSizeMultiplier
+      return 0.75 * this.sizeMultiplier
+    }
+  },
+  methods: {
+    imageError(err) {
+      console.error('ImgError', err)
+      this.imageFailed = true
     }
   },
-  methods: {},
   mounted() {}
 }
 </script>

client/components/ui/MultiSelect.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="w-full">
-    <p class="px-1 text-sm">{{ label }}</p>
+    <p class="px-1 text-sm font-semibold">{{ label }}</p>
     <div ref="wrapper" class="relative">
       <form @submit.prevent="submitForm">
         <div ref="inputWrapper" style="min-height: 40px" class="flex-wrap relative w-full shadow-sm flex items-center bg-primary border border-gray-600 rounded-md px-2 py-1 cursor-text" @click.stop.prevent="clickWrapper" @mouseup.stop.prevent @mousedown.prevent>

client/components/ui/TextInputWithLabel.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="w-full">
-    <p class="px-1 text-sm">{{ label }}</p>
+    <p class="px-1 text-sm font-semibold">{{ label }}</p>
     <ui-text-input v-model="inputValue" :disabled="disabled" :type="type" class="w-full" />
   </div>
 </template>

client/components/ui/TextareaWithLabel.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="w-full">
-    <p class="px-1 text-sm">{{ label }}</p>
+    <p class="px-1 text-sm font-semibold">{{ label }}</p>
     <ui-textarea-input v-model="inputValue" :rows="rows" class="w-full" />
   </div>
 </template>

client/layouts/default.vue

@@ -136,6 +136,11 @@ export default {
       this.socket.on('scan_start', this.scanStart)
       this.socket.on('scan_complete', this.scanComplete)
       this.socket.on('scan_progress', this.scanProgress)
+    },
+    checkVersion() {
+      this.$axios.$get('http://github.com/advplyr/audiobookshelf/raw/master/package.json').then((data) => {
+        console.log('GOT DATA', data)
+      })
     }
   },
   beforeMount() {
@@ -145,6 +150,7 @@ export default {
   },
   mounted() {
     this.initializeSocket()
+    this.checkVersion()
   }
 }
 </script>

client/nuxt.config.js

@@ -35,7 +35,7 @@ module.exports = {
     ],
     link: [
       { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' },
-      { rel: 'stylesheet', href: 'https://fonts.googleapis.com/css2?family=Fira+Mono&family=Ubuntu+Mono&family=Open+Sans:wght@600&family=Gentium+Book+Basic' },
+      { rel: 'stylesheet', href: 'https://fonts.googleapis.com/css2?family=Fira+Mono&family=Ubuntu+Mono&family=Open+Sans:wght@400;600&family=Gentium+Book+Basic' },
       { rel: 'stylesheet', href: 'https://fonts.googleapis.com/icon?family=Material+Icons' }
     ]
   },
@@ -69,7 +69,8 @@ module.exports = {
   ],
 
   proxy: {
-    '/dev/': { target: 'http://localhost:3333', pathRewrite: { '^/dev/': '' } }
+    '/dev/': { target: 'http://localhost:3333', pathRewrite: { '^/dev/': '' } },
+    '/local/': { target: process.env.NODE_ENV !== 'production' ? 'http://localhost:3333' : '/', pathRewrite: { '^/local/': '' } }
   },
 
   io: {

client/pages/config/index.vue

@@ -14,7 +14,7 @@
       </div>
       <div class="h-0.5 bg-primary bg-opacity-50 w-full" />
       <div class="flex items-center py-4">
-        <p class="font-mono">Beta v{{ $config.version }}</p>
+        <p class="font-mono">v{{ $config.version }}</p>
         <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">

client/plugins/axios.js

@@ -1,6 +1,9 @@
 export default function ({ $axios, store }) {
   $axios.onRequest(config => {
     console.log('Making request to ' + config.url)
+    if (config.url.startsWith('http:') || config.url.startsWith('https:')) {
+      return
+    }
     var bearerToken = store.state.user ? store.state.user.token : null
     // console.log('Bearer token', bearerToken)
     if (bearerToken) {