forked from rc/aircox
add download link; update player and pages layout
This commit is contained in:
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="playlist">
|
||||
<slot name="header"></slot>
|
||||
<ul :class="listClass">
|
||||
<li v-for="(item,index) in items" :class="itemClass" @click="!hasAction('play') && select(index)"
|
||||
@ -9,9 +9,9 @@
|
||||
:data="item" :index="index" :set="set" :player="player_"
|
||||
@togglePlay="togglePlay(index)"
|
||||
:actions="actions">
|
||||
<template v-slot:actions="{}">
|
||||
<template v-slot:extra-right="{}">
|
||||
<button class="button" v-if="editable" @click.stop="remove(index,true)">
|
||||
<span class="icon is-small"><span class="fa fa-minus"></span></span>
|
||||
<span class="icon is-small"><span class="fa fa-close"></span></span>
|
||||
</button>
|
||||
</template>
|
||||
</ASoundItem>
|
||||
|
@ -1,19 +1,16 @@
|
||||
<template>
|
||||
<div class="media sound-item">
|
||||
<div class="media-left">
|
||||
<div class="media-left" @click.stop="$emit('togglePlay')">
|
||||
<img class="cover is-tiny" :src="item.data.cover" v-if="item.data.cover">
|
||||
</div>
|
||||
<div class="media-left">
|
||||
<button class="button" @click.stop="$emit('togglePlay')">
|
||||
<div class="icon">
|
||||
<span class="fa fa-pause" v-if="playing"></span>
|
||||
<span class="fa fa-play" v-else></span>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
<div class="media-content">
|
||||
<slot name="content" :player="player" :item="item" :loaded="loaded">
|
||||
<h4 class="title is-4">{{ name || item.name }}</h4>
|
||||
<h4 class="title is-5" @click.stop="$emit('togglePlay')">
|
||||
<span class="icon is-small is-size-7 blink" v-if="playing">
|
||||
<span class="fa fa-play"></span>
|
||||
</span>
|
||||
{{ name || item.name }}
|
||||
</h4>
|
||||
<a class="subtitle is-6 is-inline-block" v-if="hasAction('page') && item.data.page_url"
|
||||
:href="item.data.page_url">
|
||||
{{ item.data.page_title }}
|
||||
@ -21,6 +18,12 @@
|
||||
</slot>
|
||||
</div>
|
||||
<div class="media-right">
|
||||
<a class="button" v-if="item.data.is_downloadable"
|
||||
:href="item.data.url" target="_blank">
|
||||
<span class="icon is-small">
|
||||
<span class="fa fa-download"></span>
|
||||
</span>
|
||||
</a>
|
||||
<button class="button" v-if="player && player.sets.pin != $parent.set" @click.stop="player.togglePin(item)">
|
||||
<span class="icon is-small">
|
||||
<span :class="(pinned ? '' : 'has-text-grey-light ') + 'fa fa-thumbtack'"></span>
|
||||
@ -28,6 +31,7 @@
|
||||
</button>
|
||||
<slot name="actions" :player="player" :item="item" :loaded="loaded"></slot>
|
||||
</div>
|
||||
<slot name="extra-right" :player="player" :item="item" :loaded="loaded"></slot>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
Reference in New Issue
Block a user