Merge remote-tracking branch 'origin/main'
This commit is contained in:
Core
commit
5abb57f041
9 changed files with 177 additions and 28 deletions
|
|
@ -277,10 +277,10 @@
|
|||
<div class="app-chrome-item search">
|
||||
<div class="search-input-container">
|
||||
<div class="search-input--icon"></div>
|
||||
<input type="search" spellcheck="false" @click="$root.appRoute('search');"
|
||||
<input type="search" spellcheck="false" @click="$root.appRoute('search');search.showHints = true"
|
||||
@focus="search.showHints = true"
|
||||
@blur="setTimeout(()=>{search.showHints = false}, 300)"
|
||||
v-on:keyup.enter="searchQuery();search.showHints = false;search.cursor = -1" @change="$root.appRoute('search');"
|
||||
v-on:keyup.enter="searchQuery(search.hints[search.cursor].content ?? search.hints[search.cursor].searchTerm);search.showHints = false;search.cursor = -1" @change="$root.appRoute('search');"
|
||||
v-on:keyup="searchCursor"
|
||||
@input="getSearchHints()"
|
||||
:placeholder="$root.getLz('term.search') + '...'" v-model="search.term" ref="searchInput"
|
||||
|
|
@ -288,10 +288,40 @@
|
|||
|
||||
<div class="search-hints-container" v-if="search.showHints && search.hints.length != 0">
|
||||
<div class="search-hints">
|
||||
<button class="search-hint text-overflow-elipsis" :class="{active: (search.cursor == index)}" v-for="(hint, index) in search.hints"
|
||||
@click="search.term = hint;search.showHints = false;searchQuery(hint);search.cursor = -1">
|
||||
{{ hint }}
|
||||
<button class="search-hint text-overflow-elipsis" :class="{active: (search.cursor == index)}" v-for="(hint, index) in search.hints.filter((a) => {return a.content == null})"
|
||||
@click="search.term = hint.searchTerm;search.showHints = false;searchQuery(hint.searchTerm);search.cursor = -1">
|
||||
{{ hint.displayTerm }}
|
||||
</button>
|
||||
<template v-for="(item, position) in search.hints.filter((a) => {return a.content != null})">
|
||||
<div class="cd-queue-item" @click="search.showHints = false;routeView(item.content);search.cursor = -1"
|
||||
:class="{'hintactive': (search.cursor == position + search.hints.filter((a) => {return a.content == null}).length)}">
|
||||
<div class="row">
|
||||
<div class="col-auto cider-flex-center">
|
||||
<div class="artwork" :class="{'circle': item.content.type == 'artists'}">
|
||||
<mediaitem-artwork
|
||||
:url="item.content.attributes.artwork ? item.content.attributes.artwork.url : ''"
|
||||
:size="32"></mediaitem-artwork>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col queue-info">
|
||||
<div class="queue-title text-overflow-elipsis">{{ item.content.attributes.name }}
|
||||
</div>
|
||||
<div class="queue-subtitle text-overflow-elipsis">{{
|
||||
item.content.attributes.artistName }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="queue-explicit-icon cider-flex-center"
|
||||
v-if="item.content.attributes.contentRating == 'explicit'">
|
||||
<div class="explicit-icon"></div>
|
||||
</div>
|
||||
<!-- <div class="col queue-duration-info">
|
||||
<div class="queue-duration cider-flex-center">
|
||||
{{convertTimeToString(item.content.attributes.durationInMillis)}}
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -494,6 +494,10 @@
|
|||
"name": `${app.getLz('action.share')} (song.link)`,
|
||||
"action": async function() {
|
||||
let item = self.item
|
||||
if(item.type.startsWith('library-')) {
|
||||
self.item.attributes.url = self.item.relationships.catalog.data[0].attributes.url
|
||||
item.attributes.url = item.relationships.catalog.data[0].attributes.url
|
||||
}
|
||||
if (!item.attributes.url) {
|
||||
if (item.type.includes("library")) {
|
||||
let result = (await app.mk.api.v3.music(`/v1/me/library/${item.type.replace("library-", '')}/${item.id}/catalog`)).data.data[0]
|
||||
|
|
|
|||
|
|
@ -7,10 +7,10 @@
|
|||
<input
|
||||
type="search"
|
||||
spellcheck="false"
|
||||
@click="$root.appRoute('search');"
|
||||
@click="$root.appRoute('search');$root.search.showHints = true"
|
||||
@focus="$root.search.showHints = true"
|
||||
@blur="$root.setTimeout(()=>{$root.search.showHints = false}, 300)"
|
||||
v-on:keyup.enter="$root.searchQuery();$root.search.showHints = false;$root.search.cursor = -1"
|
||||
v-on:keyup.enter="$root.searchQuery($root.search.hints[$root.search.cursor].content ?? $root.search.hints[$root.search.cursor].searchTerm);$root.search.showHints = false;$root.search.cursor = -1"
|
||||
v-on:keyup="$root.searchCursor"
|
||||
@change="$root.appRoute('search');"
|
||||
@input="$root.getSearchHints()"
|
||||
|
|
@ -27,11 +27,41 @@
|
|||
<div class="search-hints">
|
||||
<button
|
||||
class="search-hint text-overflow-elipsis"
|
||||
v-for="hint in $root.search.hints"
|
||||
@click="$root.search.term = hint;$root.search.showHints = false;$root.searchQuery(hint);$root.search.cursor = -1"
|
||||
v-for="(hint, index) in $root.search.hints.filter((a) => {return a.content == null})" :class="{active: ($root.search.cursor == index)}"
|
||||
@click="$root.search.term = hint.searchTerm;$root.search.showHints = false;$root.searchQuery(hint.searchTerm);$root.search.cursor = -1"
|
||||
>
|
||||
{{ hint }}
|
||||
{{ hint.displayTerm }}
|
||||
</button>
|
||||
<template v-for="(item, position) in $root.search.hints.filter((a) => {return a.content != null})">
|
||||
<div class="cd-queue-item" @click="$root.search.showHints = false;$root.routeView(item.content);$root.search.cursor = -1"
|
||||
:class="{'hintactive': ($root.search.cursor == position + $root.search.hints.filter((a) => {return a.content == null}).length)}">
|
||||
<div class="row">
|
||||
<div class="col-auto cider-flex-center">
|
||||
<div class="artwork" :class="{'circle': item.content.type == 'artists'}">
|
||||
<mediaitem-artwork
|
||||
:url="item.content.attributes.artwork ? item.content.attributes.artwork.url : ''"
|
||||
:size="32"></mediaitem-artwork>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col queue-info">
|
||||
<div class="queue-title text-overflow-elipsis">{{ item.content.attributes.name }}
|
||||
</div>
|
||||
<div class="queue-subtitle text-overflow-elipsis">{{
|
||||
item.content.attributes.artistName }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="queue-explicit-icon cider-flex-center"
|
||||
v-if="item.content.attributes.contentRating == 'explicit'">
|
||||
<div class="explicit-icon"></div>
|
||||
</div>
|
||||
<!-- <div class="col queue-duration-info">
|
||||
<div class="queue-duration cider-flex-center">
|
||||
{{convertTimeToString(item.content.attributes.durationInMillis)}}
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,17 +4,48 @@
|
|||
<div class="search-input--icon"></div>
|
||||
<input type="search" spellcheck="false" @focus="$root.search.showHints = true"
|
||||
@blur="$root.setTimeout(()=>{$root.search.showHints = false}, 300)"
|
||||
v-on:keyup.enter="$root.searchQuery();$root.search.showHints = false" @input="$root.getSearchHints()"
|
||||
v-on:keyup.enter="$root.searchQuery($root.search.hints[$root.search.cursor].content ?? $root.search.hints[$root.search.cursor].searchTerm);$root.search.showHints = false" @input="$root.getSearchHints()"
|
||||
:placeholder="$root.getLz('term.search') + '...'" v-model="$root.search.term"
|
||||
class="search-input" />
|
||||
|
||||
<div class="search-hints-container" v-if="$root.search.showHints && $root.search.hints.length != 0">
|
||||
<div class="search-hints">
|
||||
<button class="search-hint text-overflow-elipsis" v-for="hint in $root.search.hints"
|
||||
@click="$root.search.term = hint;$root.search.showHints = false;$root.searchQuery(hint)">
|
||||
{{ hint }}
|
||||
<button class="search-hint text-overflow-elipsis" v-for="(hint, index) in $root.search.hints.filter((a) => {return a.content == null})" :class="{active: ($root.search.cursor == index)}"
|
||||
@click="$root.search.term = hint.searchTerm;$root.search.showHints = false;$root.searchQuery(hint.searchTerm)">
|
||||
{{ hint.displayTerm }}
|
||||
</button>
|
||||
<template v-for="(item, position) in $root.search.hints.filter((a) => {return a.content != null})">
|
||||
<div class="cd-queue-item" @click="$root.search.showHints = false;$root.routeView(item.content);$root.search.cursor = -1"
|
||||
:class="{'hintactive': ($root.search.cursor == position + $root.search.hints.filter((a) => {return a.content == null}).length)}">
|
||||
<div class="row">
|
||||
<div class="col-auto cider-flex-center">
|
||||
<div class="artwork" :class="{'circle': item.content.type == 'artists'}">
|
||||
<mediaitem-artwork
|
||||
:url="item.content.attributes.artwork ? item.content.attributes.artwork.url : ''"
|
||||
:size="32"></mediaitem-artwork>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col queue-info">
|
||||
<div class="queue-title text-overflow-elipsis">{{ item.content.attributes.name }}
|
||||
</div>
|
||||
<div class="queue-subtitle text-overflow-elipsis">{{
|
||||
item.content.attributes.artistName }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="queue-explicit-icon cider-flex-center"
|
||||
v-if="item.content.attributes.contentRating == 'explicit'">
|
||||
<div class="explicit-icon"></div>
|
||||
</div>
|
||||
<!-- <div class="col queue-duration-info">
|
||||
<div class="queue-duration cider-flex-center">
|
||||
{{convertTimeToString(item.content.attributes.durationInMillis)}}
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-group searchToggle">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue