Show link analyzer error on error

This commit is contained in:
RemixDev 2022-05-28 15:17:40 +02:00
parent d5117d9ee7
commit 41588015ab
2 changed files with 42 additions and 25 deletions

View File

@ -19,12 +19,13 @@
<!-- @keyup.enter.exact="onEnter" <!-- @keyup.enter.exact="onEnter"
@keyup.ctrl.enter="onCTRLEnter" --> @keyup.ctrl.enter="onCTRLEnter" -->
<a <a
v-if="showSearchButton"
href="#" href="#"
class="searchButton" class="searchButton"
@contextmenu="rightClickPerformSearch" @contextmenu="rightClickPerformSearch"
@click="clickPerformSearch" @click="clickPerformSearch"
v-if="showSearchButton" ><i class="material-icons">search</i></a
><i class="material-icons">search</i></a> >
</header> </header>
</template> </template>
@ -42,6 +43,11 @@ export default defineComponent({
lastTextSearch: ref('') lastTextSearch: ref('')
} }
}, },
computed: {
...mapGetters({
showSearchButton: 'getShowSearchButton'
})
},
created() { created() {
const focusSearchBar = keyEvent => { const focusSearchBar = keyEvent => {
if (keyEvent.keyCode === 70 && keyEvent.ctrlKey) { if (keyEvent.keyCode === 70 && keyEvent.ctrlKey) {
@ -65,11 +71,6 @@ export default defineComponent({
document.removeEventListener('keyup', deleteSearchBarContent) document.removeEventListener('keyup', deleteSearchBarContent)
}) })
}, },
computed: {
...mapGetters({
showSearchButton: 'getShowSearchButton',
})
},
methods: { methods: {
async clickPerformSearch(ev) { async clickPerformSearch(ev) {
ev.preventDefault() ev.preventDefault()
@ -117,7 +118,8 @@ export default defineComponent({
const isError = !!analyzedData.errorCode const isError = !!analyzedData.errorCode
if (isError) { if (isError) {
throw new Error(analyzedData.errorMessage) EventBus.$emit('analyze_notSupported', analyzedData)
return
} }
if (analyzedData.type === 'track') { if (analyzedData.type === 'track') {
@ -127,7 +129,6 @@ export default defineComponent({
if (analyzedData.type === 'album') { if (analyzedData.type === 'album') {
EventBus.$emit('analyze_album', analyzedData) EventBus.$emit('analyze_album', analyzedData)
} }
// socket.emit('analyzeLink', term)
return return
} catch (error) { } catch (error) {
console.error(error) console.error(error)
@ -216,7 +217,10 @@ input[type='search']::-webkit-search-cancel-button {
background-color: var(--foreground); background-color: var(--foreground);
mask-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' height='28' viewBox='0 0 24 24' width='28'%3E%%3Cpath fill='%23ffffff' d='M22 3H7c-.69 0-1.23.35-1.59.88L0 12l5.41 8.11c.36.53.9.89 1.59.89h15c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-3 12.59L17.59 17 14 13.41 10.41 17 9 15.59 12.59 12 9 8.41 10.41 7 14 10.59 17.59 7 19 8.41 15.41 12 19 15.59z'/%3E3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' height='28' viewBox='0 0 24 24' width='28'%3E%%3Cpath fill='%23ffffff' d='M22 3H7c-.69 0-1.23.35-1.59.88L0 12l5.41 8.11c.36.53.9.89 1.59.89h15c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-3 12.59L17.59 17 14 13.41 10.41 17 9 15.59 12.59 12 9 8.41 10.41 7 14 10.59 17.59 7 19 8.41 15.41 12 19 15.59z'/%3E3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3C/svg%3E");
} }
#search #searchbar:-webkit-autofill, #search #searchbar:-webkit-autofill:hover, #search #searchbar:-webkit-autofill:focus, #search #searchbar:-webkit-autofill:active { #search #searchbar:-webkit-autofill,
#search #searchbar:-webkit-autofill:hover,
#search #searchbar:-webkit-autofill:focus,
#search #searchbar:-webkit-autofill:active {
box-shadow: 0 0 0 45px var(--secondary-background) inset !important; box-shadow: 0 0 0 45px var(--secondary-background) inset !important;
} }
#search .searchButton { #search .searchButton {

View File

@ -29,12 +29,14 @@
<i18n path="globals.by" tag="span"> <i18n path="globals.by" tag="span">
<template #artist> <template #artist>
<router-link <router-link
custom
v-slot="{ navigate }" v-slot="{ navigate }"
custom
class="clickable" class="clickable"
:to="{ name: 'Artist', params: { id: data.artist.id } }" :to="{ name: 'Artist', params: { id: data.artist.id } }"
> >
<span place="artist" @click="navigate" @keypress.enter="navigate" role="link">{{ data.artist.name }}</span> <span place="artist" role="link" @click="navigate" @keypress.enter="navigate">{{
data.artist.name
}}</span>
</router-link> </router-link>
</template> </template>
</i18n> </i18n>
@ -42,12 +44,12 @@
<i18n path="globals.in" tag="span"> <i18n path="globals.in" tag="span">
<template #album> <template #album>
<router-link <router-link
custom
v-slot="{ navigate }" v-slot="{ navigate }"
custom
class="clickable" class="clickable"
:to="{ name: 'Album', params: { id: data.album.id } }" :to="{ name: 'Album', params: { id: data.album.id } }"
> >
<span @click="navigate" @keypress.enter="navigate" role="link">{{ data.album.title }}</span> <span role="link" @click="navigate" @keypress.enter="navigate">{{ data.album.title }}</span>
</router-link> </router-link>
</template> </template>
</i18n> </i18n>
@ -56,12 +58,12 @@
<i18n path="globals.by" tag="span"> <i18n path="globals.by" tag="span">
<template #artist> <template #artist>
<router-link <router-link
custom
v-slot="{ navigate }" v-slot="{ navigate }"
custom
class="clickable" class="clickable"
:to="{ name: 'Artist', params: { id: data.artist.id } }" :to="{ name: 'Artist', params: { id: data.artist.id } }"
> >
<span @click="navigate" @keypress.enter="navigate" role="link">{{ data.artist.name }}</span> <span role="link" @click="navigate" @keypress.enter="navigate">{{ data.artist.name }}</span>
</router-link> </router-link>
</template> </template>
</i18n> </i18n>
@ -130,7 +132,11 @@
</tr> </tr>
<tr v-if="countries.length && user.country"> <tr v-if="countries.length && user.country">
<td>{{ $t('linkAnalyzer.table.available') }}</td> <td>{{ $t('linkAnalyzer.table.available') }}</td>
<td>{{ $t( available_countries.includes(user.country.toLowerCase()) ? 'globals.yes' : 'globals.no').capitalize() }}</td> <td>
{{
$t(available_countries.includes(user.country.toLowerCase()) ? 'globals.yes' : 'globals.no').capitalize()
}}
</td>
</tr> </tr>
</table> </table>
@ -138,13 +144,21 @@
<h3>{{ $t('linkAnalyzer.countries') }}</h3> <h3>{{ $t('linkAnalyzer.countries') }}</h3>
<p v-for="(country, i) in countries" :key="i">{{ country[0] }} - {{ country[1] }}</p> <p v-for="(country, i) in countries" :key="i">{{ country[0] }} - {{ country[1] }}</p>
</template> </template>
<template v-else-if="this.type === 'track'"> <template v-else-if="type === 'track'">
<h3>{{ $t('linkAnalyzer.noCountries') }}</h3> <h3>{{ $t('linkAnalyzer.noCountries') }}</h3>
</template> </template>
<div v-if="type === 'album'"> <div v-if="type === 'album'">
<router-link custom v-slot="{ navigate }" class="btn btn-primary" name="button" :to="{ name: 'Album', params: { id } }"> <router-link
<button @click="navigate" @keypress.enter="navigate" role="link">{{ $t('linkAnalyzer.table.tracklist') }}</button> v-slot="{ navigate }"
custom
class="btn btn-primary"
name="button"
:to="{ name: 'Album', params: { id } }"
>
<button role="link" @click="navigate" @keypress.enter="navigate">
{{ $t('linkAnalyzer.table.tracklist') }}
</button>
</router-link> </router-link>
</div> </div>
</div> </div>
@ -154,7 +168,6 @@
<script> <script>
/* eslint-disable camelcase */ /* eslint-disable camelcase */
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
import { socket } from '@/utils/socket'
import { convertDuration } from '@/utils/utils' import { convertDuration } from '@/utils/utils'
import { COUNTRIES } from '@/utils/countries' import { COUNTRIES } from '@/utils/countries'
import { sendAddToQueue } from '@/utils/downloads' import { sendAddToQueue } from '@/utils/downloads'
@ -182,7 +195,7 @@ export default {
mounted() { mounted() {
EventBus.$on('analyze_track', this.showTrack) EventBus.$on('analyze_track', this.showTrack)
EventBus.$on('analyze_album', this.showAlbum) EventBus.$on('analyze_album', this.showAlbum)
socket.on('analyze_notSupported', this.notSupported) EventBus.$on('analyze_notSupported', this.notSupported)
}, },
methods: { methods: {
convertDuration, convertDuration,