xiaoxue_admin
/
APlayer
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

new api: theme

This commit is contained in:
DIYgod 2018-03-13 17:01:18 +08:00
parent e10528397f
commit ba7692984a
No known key found for this signature in database
GPG Key ID: EC0B76A252D3EF67
3 changed files with 14 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/js/player.js
View File

@ -206,12 +206,7 @@ class APlayer {
else {
this.template.pic.style.backgroundImage = '';
}
if (this.options.audio[this.playIndex].theme) {
this.template.pic.style.backgroundColor = this.options.audio[this.playIndex].theme;
this.template.played.style.background = this.options.audio[this.playIndex].theme;
this.template.thumb.style.background = this.options.audio[this.playIndex].theme;
this.template.volume.style.background = this.options.audio[this.playIndex].theme;
}
this.theme();
this.template.title.innerHTML = this.options.audio[this.playIndex].name;
this.template.author.innerHTML = this.options.audio[this.playIndex].artist ? ' - ' + this.options.audio[this.playIndex].artist : '';
const light = this.container.getElementsByClassName('aplayer-list-light')[0];
@ -244,6 +239,17 @@ class APlayer {
});
}
theme (color = this.options.audio[this.playIndex].theme, index = this.playIndex) {
this.options.audio[index].theme = color;
this.template.listCurs[index].style.backgroundColor = color;
if (index === this.playIndex) {
this.template.pic.style.backgroundColor = color;
this.template.played.style.background = color;
this.template.thumb.style.background = color;
this.template.volume.style.background = color;
}
}
seek (time) {
time = Math.max(time, 0);
if (this.audio.duration) {

1
src/js/template.js
View File

@ -32,6 +32,7 @@ class Template {
this.button = this.container.querySelector('.aplayer-button');
this.list = this.container.querySelector('.aplayer-list');
this.listOl = this.container.querySelector('.aplayer-list ol');
this.listCurs = this.container.querySelectorAll('.aplayer-list-cur');
this.played = this.container.querySelector('.aplayer-played');
this.loaded = this.container.querySelector('.aplayer-loaded');
this.thumb = this.container.querySelector('.aplayer-thumb');

2
src/template/player.art
View File

@ -52,7 +52,7 @@
<ol{{ if options.listMaxHeight }} style="max-height: {{ options.listMaxHeight }}"{{ /if }}>
{{each options.audio}}
<li>
<span class="aplayer-list-cur" style="background: {{ $value.theme || options.theme }};"></span>
<span class="aplayer-list-cur" style="background-color: {{ $value.theme || options.theme }};"></span>
<span class="aplayer-list-index">{{ $index + 1 }}</span>
<span class="aplayer-list-title">{{ $value.name }}</span>
<span class="aplayer-list-author">{{ $value.artist }}</span>