okseby/orchard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

added .mediaitem-list-item__grid

Browse source
This commit is contained in:
booploops 2022-01-25 03:15:06 -08:00
parent 798cfb9828
commit be3b0b3108
3 changed files with 55 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

34
src/renderer/style.less
View file

@ -5168,7 +5168,39 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
} }
} }
/* Cider */ // Cider App
.mediaitem-list-item__grid {
overflow-x: overlay;
overflow-y: hidden;
background: rgba(200, 200, 200, 0.05);
border-radius: 10px;
padding: var(--contentInnerPadding);
box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
.grid-body {
display: grid;
grid-auto-flow: column dense;
grid-template-rows: auto auto auto auto;
grid-gap: 0 6px;
padding: 2px 0;
justify-content: left;
width: 0;
}
.cd-mediaitem-list-item {
width: 350px;
height: 60px;
}
&::-webkit-scrollbar {
display: none;
}
&:hover::-webkit-scrollbar {
display: initial;
}
}
.settings-page { .settings-page {
padding:0px; padding:0px;

19
src/renderer/views/pages/artist.ejs
View file

@ -72,23 +72,18 @@
<div class="col" style="padding:0;"> <div class="col" style="padding:0;">
<h3>{{app.getLz('term.topSongs')}}</h3> <h3>{{app.getLz('term.topSongs')}}</h3>
</div> </div>
<div class="col-auto flex-center" v-if="data.views['top-songs'].data.length >= 10" style="padding:0;"> <div class="col-auto flex-center" v-if="data.views['top-songs'].data.length >= 16" style="padding:0;">
<button class="cd-btn-seeall" @click="app.showArtistView(data.id, data.attributes.name + ' - Top Songs', 'top-songs')">{{app.getLz('term.seeAll')}}</button> <button class="cd-btn-seeall" @click="app.showArtistView(data.id, data.attributes.name + ' - Top Songs', 'top-songs')">{{app.getLz('term.seeAll')}}</button>
</div> </div>
</div> </div>
<mediaitem-list-item <div class="mediaitem-list-item__grid">
v-for="(song, index) in data.views['top-songs'].data.limit(topSongsExpanded ? 10 : 5)" <div class="grid-body">
<mediaitem-list-item
v-for="(song, index) in data.views['top-songs'].data.limit(16)"
:index="index" :index="index"
:item="song"></mediaitem-list-item> :item="song"></mediaitem-list-item>
<button class="showmoreless" </div>
@click="topSongsExpanded = !topSongsExpanded"> </div>
<template v-if="!topSongsExpanded">
{{app.getLz('term.showMore')}}
</template>
<template v-else>
{{app.getLz('term.showLess')}}
</template>
</button>
</div> </div>
</div> </div>
</div> </div>

27
src/renderer/views/pages/search.ejs
View file

@ -19,13 +19,15 @@
</div> </div>
<div class="col-auto flex-center" <div class="col-auto flex-center"
@click="app.showSearchView(app.search.term, 'song', app.friendlyTypes('song'))" @click="app.showSearchView(app.search.term, 'song', app.friendlyTypes('song'))"
v-if="search.results.song.data.length >= 6"> v-if="search.results.song.data.length >= 12">
<button class="cd-btn-seeall">{{app.getLz('term.seeAll')}}</button> <button class="cd-btn-seeall">{{app.getLz('term.seeAll')}}</button>
</div> </div>
</div> </div>
<div> <div class="mediaitem-list-item__grid">
<div class="grid-body">
<mediaitem-list-item :item="item" :index="index" <mediaitem-list-item :item="item" :index="index"
v-for="(item, index) in search.results.song.data.limit(6)"></mediaitem-list-item> v-for="(item, index) in search.results.song.data.limit(12)"></mediaitem-list-item>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -106,24 +108,25 @@
data: function () { data: function () {
return { return {
app: this.$root, app: this.$root,
categoriesView : [], categoriesView: [],
categoriesReady : false, categoriesReady: false,
} }
}, },
methods: { methods: {
getTopResult() { getTopResult() {
try { try {
return this.search.results[this.search.results.meta.results.order[0]]["data"][0] return this.search.results[this.search.results.meta.results.order[0]]["data"][0]
} catch( error ) { } catch (error) {
return false return false
} }
}, },
async getCategories() { async getCategories() {
if(this.categoriesView != [] && this.categoriesView.length > 0) {this.categoriesReady = true; return await true;} else { if (this.categoriesView != [] && this.categoriesView.length > 0) { this.categoriesReady = true; return await true; } else {
let response = await this.app.mk.api.v3.music(`/v1/recommendations/${this.app.mk.storefrontId}?timezone=${encodeURIComponent(this.app.formatTimezoneOffset())}&name=search-landing&platform=web&extend=editorialArtwork&art%5Burl%5D=f%2Cc&types=editorial-items%2Capple-curators%2Cactivities`); let response = await this.app.mk.api.v3.music(`/v1/recommendations/${this.app.mk.storefrontId}?timezone=${encodeURIComponent(this.app.formatTimezoneOffset())}&name=search-landing&platform=web&extend=editorialArtwork&art%5Burl%5D=f%2Cc&types=editorial-items%2Capple-curators%2Cactivities`);
this.categoriesView = response.data.data; this.categoriesView = response.data.data;
this.categoriesReady = true; this.categoriesReady = true;
return await true;} return await true;
}
} }
} }
}) })