mirror of
https://github.com/koel/koel
synced 2024-11-24 21:23:06 +00:00
Cleanup and refactor
This commit is contained in:
An Phan
parent
5583650681
commit
c8d67bd472
11 changed files with 16 additions and 16 deletions
|
|
@ -17,12 +17,12 @@
|
|||
<lyrics :song="song" ref="lyrics" v-show="currentView === 'lyrics'"/>
|
||||
<artist-info v-if="song.artist.id"
|
||||
:artist="song.artist"
|
||||
:mode="'sidebar'"
|
||||
mode="sidebar"
|
||||
ref="artist-info"
|
||||
v-show="currentView === 'artistInfo'"/>
|
||||
<album-info v-if="song.album.id"
|
||||
:album="song.album"
|
||||
:mode="'sidebar'"
|
||||
mode="sidebar"
|
||||
ref="album-info"
|
||||
v-show="currentView === 'albumInfo'"/>
|
||||
<youtube v-if="sharedState.useYouTube"
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div id="youtube-extra-wrapper">
|
||||
<template v-if="videos && videos.length">
|
||||
<a class="video" v-for="video in videos" :href="'https://youtu.be/' + video.id.videoId"
|
||||
<a class="video" v-for="video in videos" :href="`https://youtu.be/${video.id.videoId}`"
|
||||
@click.prevent="playYouTube(video.id.videoId)">
|
||||
<div class="thumb">
|
||||
<img :src="video.snippet.thumbnails.default.url" width="90">
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
|
||||
<span class="meta" v-show="meta.songCount">
|
||||
by
|
||||
<a class="artist" v-if="isNormalArtist" :href="'/#!/artist/'+album.artist.id">{{ album.artist.name }}</a>
|
||||
<a class="artist" v-if="isNormalArtist" :href="`/#!/artist/${album.artist.id}`">{{ album.artist.name }}</a>
|
||||
<span class="nope" v-else>{{ album.artist.name }}</span>
|
||||
•
|
||||
{{ meta.songCount | pluralize('song') }}
|
||||
|
|
@ -43,7 +43,7 @@
|
|||
<a href class="close" @click.prevent="info.showing = false"><i class="fa fa-times"></i></a>
|
||||
<div class="inner">
|
||||
<div class="loading" v-if="info.loading"><sound-bar/></div>
|
||||
<album-info :album="album" :mode="'full'" v-else/>
|
||||
<album-info :album="album" mode="full" v-else/>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
<view-mode-switch :mode="viewMode" for="albums"/>
|
||||
</h1>
|
||||
|
||||
<div ref="scroller" class="albums main-scroll-wrap" :class="'as-'+viewMode" @scroll="scrolling">
|
||||
<div ref="scroller" class="albums main-scroll-wrap" :class="`as-${viewMode}`" @scroll="scrolling">
|
||||
<album-item v-for="item in displayedItems" :album="item"/>
|
||||
<span class="item filler" v-for="n in 6"/>
|
||||
<to-top-button/>
|
||||
|
|
|
|||
|
|
@ -42,7 +42,7 @@
|
|||
<a href class="close" @click.prevent="info.showing = false"><i class="fa fa-times"></i></a>
|
||||
<div class="inner">
|
||||
<div class="loading" v-if="info.loading"><sound-bar/></div>
|
||||
<artist-info :artist="artist" :mode="'full'" v-else/>
|
||||
<artist-info :artist="artist" mode="full" v-else/>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
<view-mode-switch :mode="viewMode" for="artists"/>
|
||||
</h1>
|
||||
|
||||
<div class="artists main-scroll-wrap" :class="'as-'+viewMode" @scroll="scrolling">
|
||||
<div class="artists main-scroll-wrap" :class="`as-${viewMode}`" @scroll="scrolling">
|
||||
<artist-item v-for="item in displayedItems" :artist="item"/>
|
||||
<span class="item filler" v-for="n in 6"/>
|
||||
<to-top-button/>
|
||||
|
|
|
|||
|
|
@ -53,13 +53,13 @@
|
|||
<section class="top-artists" v-show="top.artists.length">
|
||||
<h1>Top Artists</h1>
|
||||
|
||||
<div class="wrapper" :class="'as-'+preferences.artistsViewMode">
|
||||
<div class="wrapper" :class="`as-${preferences.artistsViewMode}`">
|
||||
<artist-item v-for="artist in top.artists" :artist="artist"/>
|
||||
<span class="item filler" v-for="n in 3"/>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="top-albums" :class="'as-'+preferences.albumsViewMode" v-show="top.albums.length">
|
||||
<section class="top-albums" :class="`as-${preferences.albumsViewMode}`" v-show="top.albums.length">
|
||||
<h1>Top Albums</h1>
|
||||
|
||||
<div class="wrapper">
|
||||
|
|
|
|||
|
|
@ -7,9 +7,9 @@
|
|||
</span>
|
||||
<footer>
|
||||
<div class="info">
|
||||
<a class="name" :href="'/#!/album/'+album.id">{{ album.name }}</a>
|
||||
<a class="name" :href="`/#!/album/${album.id}`">{{ album.name }}</a>
|
||||
<span class="sep">by</span>
|
||||
<a class="artist" v-if="isNormalArtist" :href="'/#!/artist/'+album.artist.id">{{ album.artist.name }}</a>
|
||||
<a class="artist" v-if="isNormalArtist" :href="`/#!/artist/${album.artist.id}`">{{ album.artist.name }}</a>
|
||||
<span class="artist nope" v-else>{{ album.artist.name }}</span>
|
||||
</div>
|
||||
<p class="meta">
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
</span>
|
||||
<footer>
|
||||
<div class="info">
|
||||
<a class="name" :href="'/#!/artist/'+artist.id">{{ artist.name }}</a>
|
||||
<a class="name" :href="`/#!/artist/${artist.id}`">{{ artist.name }}</a>
|
||||
</div>
|
||||
<p class="meta">
|
||||
<span class="left">
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
<span v-if="showPlayCount" :style="{ width: song.playCount*100/topPlayCount+'%' }" class="play-count"/>
|
||||
{{ song.title }}
|
||||
<span class="by">
|
||||
<a :href="'/#!/artist/'+song.artist.id">{{ song.artist.name }}</a>
|
||||
<a :href="`/#!/artist/${song.artist.id}`">{{ song.artist.name }}</a>
|
||||
<template v-if="showPlayCount">- {{ song.playCount | pluralize('play') }}</template>
|
||||
</span>
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -20,8 +20,8 @@
|
|||
<div class="progress" id="progressPane">
|
||||
<h3 class="title">{{ song.title }}</h3>
|
||||
<p class="meta">
|
||||
<a class="artist" :href="'/#!/artist/'+song.artist.id">{{ song.artist.name }}</a> –
|
||||
<a class="album" :href="'/#!/album/'+song.album.id">{{ song.album.name }}</a>
|
||||
<a class="artist" :href="`/#!/artist/${song.artist.id}`">{{ song.artist.name }}</a> –
|
||||
<a class="album" :href="`/#!/album/${song.album.id}`">{{ song.album.name }}</a>
|
||||
</p>
|
||||
|
||||
<div class="plyr">
|
||||
|
|
|
|||
Loading…
Reference in a new issue