merged mediaitem-square and mediaitem-square-large into the same element

added observed visibility to mediaitem-square.
fixed artist page animated artwork not changing when navigation to another artist with animated artwork
This commit is contained in:
booploops 2021-12-20 23:48:32 -08:00
parent 3b04f2d608
commit f8491848fd
12 changed files with 283 additions and 110 deletions

View file

@ -1,6 +1,6 @@
<script type="text/x-template" id="cider-artist">
<div class="content-inner artist-page">
<div class="artist-header" :style="getArtistPalette(data)">
<div class="artist-header" :style="getArtistPalette(data)" :key="data.id">
<animatedartwork-view
v-if="data.attributes.editorialVideo && (data.attributes.editorialVideo.motionArtistWide16x9 || data.attributes.editorialVideo.motionArtistFullscreen16x9)"
:video="data.attributes.editorialVideo.motionArtistWide16x9.video ?? (data.attributes.editorialVideo.motionArtistFullscreen16x9.video ?? '')">

View file

@ -4,7 +4,7 @@
<div v-if="data['data'] != 'null'" class="well">
<template v-for="(item, key) in data.data">
<template v-if="item.type == 'artists'">
<mediaitem-square-large :item="item"></mediaitem-square-large>
<mediaitem-square :item="item"></mediaitem-square>
</template>
<template v-else>
<mediaitem-list-item
@ -12,7 +12,7 @@
:index="key"
:item="item"></mediaitem-list-item>
<mediaitem-mvview v-else-if="item.attributes.playParams.kind == 'musicVideo'" :item="item"></mediaitem-mvview>
<mediaitem-square-large v-else :item="item"></mediaitem-square-large>
<mediaitem-square v-else :item="item"></mediaitem-square>
</template>
</template>
<button v-if="triggerEnabled" style="opacity:0;height: 32px;" v-observe-visibility="{callback: visibilityChanged}">Show More</button>

View file

@ -48,8 +48,8 @@
</div>
</div>
</div>
<mediaitem-square-large v-if="library.albums.viewAs == 'covers'" :item="item" v-for="item in library.albums.displayListing">
</mediaitem-square-large>
<mediaitem-square v-if="library.albums.viewAs == 'covers'" :item="item" v-for="item in library.albums.displayListing">
</mediaitem-square>
<mediaitem-list-item v-if="library.albums.viewAs == 'list'" :show-duration="false" :show-meta-data="true" :show-library-status="false" :item="item" v-for="item in library.albums.displayListing">
</mediaitem-list-item>
</div>

View file

@ -41,8 +41,8 @@
</div>
</div>
</div>
<mediaitem-square-large v-if="library.albums.viewAs == 'covers'" :item="item" v-for="item in library.albums.displayListing">
</mediaitem-square-large>
<mediaitem-square v-if="library.albums.viewAs == 'covers'" :item="item" v-for="item in library.albums.displayListing">
</mediaitem-square>
<mediaitem-list-item v-if="library.albums.viewAs == 'list'" :show-duration="false" :show-meta-data="true" :show-library-status="false" :item="item" v-for="item in library.albums.displayListing">
</mediaitem-list-item>
</div>

View file

@ -5,7 +5,7 @@
</div>
</div>
<div class="madeforyou-body">
<mediaitem-square-large :item="item" v-for="item in madeforyou.data">
</mediaitem-square-large>
<mediaitem-square :item="item" v-for="item in madeforyou.data">
</mediaitem-square>
</div>
</div>

View file

@ -36,8 +36,8 @@
<button class="cd-btn-seeall" @click="app.showRecordLabelView(data.id, data.attributes.name + ' - Latest Releases', 'latest-releases')">See All</button>
</div>
</div>
<mediaitem-square-large :item="item" v-for="item in data.views['latest-releases'].data">
</mediaitem-square-large>
<mediaitem-square :item="item" v-for="item in data.views['latest-releases'].data">
</mediaitem-square>
</template>
<template v-if="data.views && data.views['top-releases']">
<div class="row">
@ -48,8 +48,8 @@
<button class="cd-btn-seeall" @click="app.showRecordLabelView(data.id, data.attributes.name + ' - Top Releases', 'top-releases')">See All</button>
</div>
</div>
<mediaitem-square-large :item="item" v-for="item in data.views['top-releases'].data">
</mediaitem-square-large>
<mediaitem-square :item="item" v-for="item in data.views['top-releases'].data">
</mediaitem-square>
</template>
<template v-if="data.relationships && data.relationships.playlists && data.relationships.playlists.data.length > 0">
<div class="row">
@ -60,8 +60,8 @@
<button class="cd-btn-seeall" @click="app.showCollection(data.relationships.playlists, data.attributes.name + ' - Playlists', 'curator')">See All</button>
</div>
</div>
<mediaitem-square-large :item="item" v-for="item in data.relationships.playlists.data.limit(5)">
</mediaitem-square-large>
<mediaitem-square :item="item" v-for="item in data.relationships.playlists.data.limit(5)">
</mediaitem-square>
</template>
</div>
</div>

View file

@ -4,7 +4,7 @@
<div class="col-sm" style="width: auto;" v-if="getTopResult()">
<template>
<h3>Top Result</h3>
<mediaitem-square-large :item="getTopResult()"></mediaitem-square-large>
<mediaitem-square :item="getTopResult()"></mediaitem-square>
</template>
</div>
<div class="col" v-if="search.results.song">