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

added listitem-horizontal

Browse source
This commit is contained in:
booploops 2022-02-09 04:27:25 -08:00
parent 63b1293903
commit cb7c6e0922
7 changed files with 5143 additions and 51 deletions
Download patch file Download diff file Expand all files Collapse all files

43
src/renderer/views/components/listitem-horizontal.ejs Normal file
View file

@ -0,0 +1,43 @@
<script type="text/x-template" id="listitem-horizontal">
<div class="listitem-horizontal">
<vue-horizontal>
<div v-for="items in itemPages">
<mediaitem-list-item
v-for="(song, index) in items"
:index="song.index"
:item="song"></mediaitem-list-item>
</div>
</vue-horizontal>
</div>
</script>
<script>
Vue.component('listitem-horizontal', {
template: '#listitem-horizontal',
name: "listitem-horizontal",
props: {
items: {
type: Array,
required: true
}
},
data: function () {
return {
itemPages: []
}
},
mounted() {
// give every item an id
this.items.forEach(function (item, index) {
item.id = index;
});
// split items into pages
this.itemPages = app.arrayToChunk(this.items, 4);
},
methods: {
sayHello: function () {
alert('Hello world!');
}
}
});
</script>

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

@ -57,35 +57,32 @@
</div>
<div class="artist-body">
<div class="row well">
<div class="col">
<div class="col-sm-3" v-if="data.views['latest-release'].data.length != 0">
<h3>{{app.getLz('term.latestReleases')}}</h3>
<div style="width: auto;margin: 0 auto;">
<mediaitem-square kind="card" v-for="song in data.views['latest-release'].data"
:item="song">
</mediaitem-square>
</div>
</div>
<div class="col-sm-9" v-if="data.views['top-songs']">
<div class="row">
<div class="col-auto" v-if="data.views['latest-release'].data.length != 0">
<h3>{{app.getLz('term.latestReleases')}}</h3>
<div style="width: auto;margin: 0 auto;">
<mediaitem-square kind="card" v-for="song in data.views['latest-release'].data"
:item="song">
</mediaitem-square>
</div>
<div class="col" style="padding:0;">
<h3>{{app.getLz('term.topSongs')}}</h3>
</div>
<div class="col" v-if="data.views['top-songs']">
<div class="row">
<div class="col" style="padding:0;">
<h3>{{app.getLz('term.topSongs')}}</h3>
</div>
<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>
</div>
</div>
<div class="mediaitem-list-item__grid">
<div class="grid-body">
<mediaitem-list-item
v-for="(song, index) in data.views['top-songs'].data.limit(16)"
:index="index"
:item="song"></mediaitem-list-item>
</div>
</div>
<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>
</div>
</div>
<div class="row">
<div class="col flex-center" style="padding:0;">
<div class="mediaitem-list-item__grid">
<listitem-horizontal :items="data.views['top-songs'].data.limit(16)">
</listitem-horizontal>
</div>
</div>
</div>
</div>
</div>
<div class="row well">

16
src/renderer/views/pages/home.ejs
View file

@ -3,11 +3,11 @@
<div v-if="page == 'main'">
<div class="row">
<div class="col">
<div class="row nopadding">
<div class="col nopadding">
<div class="row">
<div class="col">
<h3>{{app.getLz('home.recentlyPlayed')}}</h3>
</div>
<div class="col-auto nopadding flex-center">
<div class="col-auto flex-center">
<button class="cd-btn-seeall" @click="seeAllHistory()">{{app.getLz('term.seeAll')}}</button>
</div>
</div>
@ -20,11 +20,11 @@
</div>
</div>
<div class="col">
<div class="row nopadding">
<div class="col nopadding">
<div class="row">
<div class="col">
<h3>{{app.getLz('home.artistsFeed')}}</h3>
</div>
<div class="col-auto nopadding flex-center">
<div class="col-auto flex-center">
<button class="cd-btn-seeall" @click="app.appRoute('artist-feed')">{{app.getLz('term.seeAll')}}</button>
</div>
</div>
@ -63,10 +63,10 @@
<div class="row" v-if="friendsListeningTo && friendsListeningTo.length > 0">
<div class="col">
<div class="row">
<div class="col nopadding">
<div class="col">
<h3>{{app.getLz('home.friendsListeningTo')}}</h3>
</div>
<div class="col-auto nopadding flex-center">
<div class="col-auto flex-center">
<button class="cd-btn-seeall" @click="app.showSocialListeningTo()">{{app.getLz('term.seeAll')}}</button>
</div>
</div>