58 lines
No EOL
2.2 KiB
Text
58 lines
No EOL
2.2 KiB
Text
<script type="text/x-template" id="cider-search">
|
|
<div class="content-inner">
|
|
<div class="row">
|
|
<div class="col-sm" style="width: auto;" v-if="getTopResult()">
|
|
<template>
|
|
<h3>Top Result</h3>
|
|
<mediaitem-square-large :item="getTopResult()"></mediaitem-square>
|
|
</template>
|
|
</div>
|
|
<div class="col" v-if="search.results.song">
|
|
<div class="row">
|
|
<div class="col">
|
|
<h3>Songs</h3>
|
|
</div>
|
|
<div class="col-auto flex-center" v-if="search.results.song.data.length >= 6">
|
|
<button class="cd-btn-seeall">See All</button>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<mediaitem-list-item :item="item"
|
|
v-for="item in search.results.song.data.limit(6)"></mediaitem-list-item>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<template v-if="search.results['meta']">
|
|
<template
|
|
v-for="section in search.results.meta.results.order" v-if="section != 'song' && section != 'top'">
|
|
<div class="row">
|
|
<div class="col">
|
|
<h3>{{ app.friendlyTypes(section) }}</h3>
|
|
</div>
|
|
<div class="col-auto flex-center" v-if="search.results[section].data.length >= 10">
|
|
<button class="cd-btn-seeall">See All</button>
|
|
</div>
|
|
</div>
|
|
<mediaitem-scroller-horizontal-large
|
|
:items="search.results[section].data.limit(10)"></mediaitem-scroller-horizontal-large>
|
|
</template>
|
|
</template>
|
|
</div>
|
|
</script>
|
|
|
|
<script>
|
|
Vue.component('cider-search', {
|
|
template: "#cider-search",
|
|
props: ['search'],
|
|
methods: {
|
|
getTopResult() {
|
|
if (this.search.results["meta"]) {
|
|
return this.search.results[this.search.results.meta.results.order[0]]["data"][0]
|
|
} else {
|
|
return false;
|
|
}
|
|
}
|
|
}
|
|
})
|
|
</script> |