Commit 6c01c334 authored by Henrik Hüttemann's avatar Henrik Hüttemann 🤔

Add search links; Fix #9

parent 2a1e843b
Pipeline #754 passed with stage
in 38 seconds
......@@ -28,6 +28,7 @@
v-bind:song="song"
v-bind:ipfsGateway="config.ipfs.gateway"
v-bind:coverUrl="getCoverUrl(song.cover)"
v-on:search="search = $event"
></Song>
</div>
<div v-show="songs.length == 0">
......@@ -42,6 +43,7 @@
v-bind:key="album.releaseId"
v-bind:album="album"
v-bind:search="search"
v-on:search="search = $event"
></Album>
</v-tab>
......@@ -61,10 +63,10 @@
v-bind:key="dl.releaseId"
>
<td>
{{ dl.artist }}
<a href="#" v-on:click="search = dl.artist">{{ dl.artist }}</a>
</td>
<td>
<a v-bind:href="`https://musicbrainz.org/release/${dl.releaseId}`" v-bind:title="dl.releaseId">{{ dl.album }}</a>
<a href="#" v-on:click="search = dl.album">{{ dl.album }}</a>
</td>
<td title="in DB?">
{{ getAlbumById(dl.releaseId) !== undefined ? '&#x2714;' : '&#x2718;' }}
......@@ -75,6 +77,7 @@
<td>
<button v-on:click.stop="getRelease(dl)" title="download">&#x25bc;</button>
<button v-on:click="deleteAlbum(dl.releaseId)" v-bind:disabled="getAlbumById(dl.releaseId) === undefined" title="delete">&#x2716;</button>
<a v-bind:href="`https://musicbrainz.org/release/${dl.releaseId}`" v-bind:title="dl.releaseId">MB</a>
</td>
</tr>
</table>
......
......@@ -4,7 +4,11 @@
<img v-bind:src="album.cover" alt="">
</p>
<div class="description">
<h2>{{ album.artist }} - {{ album.title }} [{{ album.year }}]</h2>
<h2>
<a href="#" v-on:click="$emit('search', album.artist)">{{ album.artist }}</a> -
<a href="#" v-on:click="$emit('search', album.title)">{{ album.title }}</a>
[{{ album.year }}]
</h2>
<p class="meta">
{{ album.songs.length }}/{{ album.tracks }} Tracks <em v-if="search">(filtered)</em>
</p>
......@@ -14,7 +18,9 @@
v-bind:key="song.id"
v-bind:value="song.metadata.track.no"
>
{{ song.metadata.title }}
<a href="#" v-on:click="$emit('search', song.metadata.title)">
{{ song.metadata.title }}
</a>
</li>
</ol>
</div>
......@@ -33,6 +39,10 @@ export default {
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
a, a:visited {
color: inherit;
text-decoration: underline;
}
.album {
display: flex;
}
......
......@@ -4,8 +4,12 @@
>
<div class="coverbox">
<p class="meta">
<strong>{{ song.metadata.artist }} - {{ song.metadata.title }}</strong><br/>
{{ song.metadata.album }} [{{ song.metadata.year }}]<br/>
<strong>
<a href="#" v-on:click="$emit('search', song.metadata.artist)">{{ song.metadata.artist }}</a> -
<a href="#" v-on:click="$emit('search', song.metadata.title)">{{ song.metadata.title }}</a>
</strong><br/>
<a href="#" v-on:click="$emit('search', song.metadata.album)">{{ song.metadata.album }}</a>
[{{ song.metadata.year }}]<br/>
{{ song.files.length }} Audiofiles<br/>
{{ song.files[0].format.dataformat.toUpperCase() }} {{ Math.round(song.files[0].format.bitrate / 1000) + ' kbps' }}<br/>
<a v-bind:href="coverUrl">
......@@ -39,6 +43,10 @@ export default {
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
a, a:visited {
color: inherit;
text-decoration: underline;
}
.song {
margin: 1rem;
background-size: cover;
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment