63 lines
2.9 KiB
JavaScript
63 lines
2.9 KiB
JavaScript
import Icons from './icons';
|
|
import tplPlayer from '../template/player.art';
|
|
|
|
class Template {
|
|
constructor(options) {
|
|
this.container = options.container;
|
|
this.options = options.options;
|
|
this.randomOrder = options.randomOrder;
|
|
this.init();
|
|
}
|
|
|
|
init() {
|
|
let cover = '';
|
|
if (this.options.audio.length) {
|
|
if (this.options.order === 'random') {
|
|
cover = this.options.audio[this.randomOrder[0]].cover;
|
|
} else {
|
|
cover = this.options.audio[0].cover;
|
|
}
|
|
}
|
|
|
|
this.container.innerHTML = tplPlayer({
|
|
options: this.options,
|
|
icons: Icons,
|
|
cover: cover,
|
|
getObject: (obj) => obj,
|
|
});
|
|
|
|
this.lrc = this.container.querySelector('.aplayer-lrc-contents');
|
|
this.lrcWrap = this.container.querySelector('.aplayer-lrc');
|
|
this.ptime = this.container.querySelector('.aplayer-ptime');
|
|
this.info = this.container.querySelector('.aplayer-info');
|
|
this.time = this.container.querySelector('.aplayer-time');
|
|
this.barWrap = this.container.querySelector('.aplayer-bar-wrap');
|
|
this.button = this.container.querySelector('.aplayer-button');
|
|
this.body = this.container.querySelector('.aplayer-body');
|
|
this.list = this.container.querySelector('.aplayer-list');
|
|
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');
|
|
this.volume = this.container.querySelector('.aplayer-volume');
|
|
this.volumeBar = this.container.querySelector('.aplayer-volume-bar');
|
|
this.volumeButton = this.container.querySelector('.aplayer-time button');
|
|
this.volumeBarWrap = this.container.querySelector('.aplayer-volume-bar-wrap');
|
|
this.loop = this.container.querySelector('.aplayer-icon-loop');
|
|
this.order = this.container.querySelector('.aplayer-icon-order');
|
|
this.menu = this.container.querySelector('.aplayer-icon-menu');
|
|
this.pic = this.container.querySelector('.aplayer-pic');
|
|
this.title = this.container.querySelector('.aplayer-title');
|
|
this.author = this.container.querySelector('.aplayer-author');
|
|
this.dtime = this.container.querySelector('.aplayer-dtime');
|
|
this.notice = this.container.querySelector('.aplayer-notice');
|
|
this.miniSwitcher = this.container.querySelector('.aplayer-miniswitcher');
|
|
this.skipBackButton = this.container.querySelector('.aplayer-icon-back');
|
|
this.skipForwardButton = this.container.querySelector('.aplayer-icon-forward');
|
|
this.skipPlayButton = this.container.querySelector('.aplayer-icon-play');
|
|
this.lrcButton = this.container.querySelector('.aplayer-icon-lrc');
|
|
}
|
|
}
|
|
|
|
export default Template;
|