diff --git a/README.md b/README.md index 58ac345..b6979bc 100644 --- a/README.md +++ b/README.md @@ -75,6 +75,7 @@ var option = { + `ap.play()` // Resume play + `ap.play(time)` // Set currentTime + `ap.pause()` // Pause ++ `ap.toggle()` // Toggle between play and pause + `ap.volume(percentage)` // Set volume + `ap.on(event, handler)` // Event binding diff --git a/dist/APlayer.min.css b/dist/APlayer.min.css index bd53a8e..4658472 100644 --- a/dist/APlayer.min.css +++ b/dist/APlayer.min.css @@ -1 +1 @@ -.aplayer-narrow{width:66px}.aplayer-narrow .aplayer-info{display:none}.aplayer-withlrc.aplayer-narrow{width:106px}.aplayer-withlrc.aplayer .aplayer-pic{height:106px;width:106px}.aplayer-withlrc.aplayer .aplayer-info{margin-left:106px;height:106px}.aplayer-withlrc.aplayer .aplayer-lrc{display:block}.aplayer{font-family:Arial,Helvetica,sans-serif;margin:5px;box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);border-radius:2px;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;line-height:normal}.aplayer *{box-sizing:content-box}.aplayer .aplayer-icon{width:15px;height:15px;border:none;background-color:transparent;outline:none;cursor:pointer;opacity:.8;vertical-align:middle;padding:0}.aplayer .aplayer-icon .aplayer-fill{-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.aplayer .aplayer-lrc-content{display:none}.aplayer .aplayer-pic{position:relative;float:left;height:66px;width:66px;background-image:url(default.jpg);background-size:100%;-webkit-transition:all .3s ease;transition:all .3s ease}.aplayer .aplayer-pic .aplayer-button{position:absolute;border-radius:50%;opacity:.8;cursor:pointer;text-shadow:0 1px 1px rgba(0,0,0,.2);box-shadow:0 1px 1px rgba(0,0,0,.2);background:rgba(0,0,0,.2);-webkit-transition:all .1s ease;transition:all .1s ease}.aplayer .aplayer-pic .aplayer-button:hover{opacity:1}.aplayer .aplayer-pic .aplayer-button .aplayer-fill{fill:#fff}.aplayer .aplayer-pic .aplayer-hide{display:none}.aplayer .aplayer-pic .aplayer-play{width:26px;height:26px;border:2px solid #fff;bottom:50%;right:50%;margin:0 -15px -15px 0}.aplayer .aplayer-pic .aplayer-play .aplayer-icon-play{position:absolute;top:3px;left:4px;height:20px;width:20px}.aplayer .aplayer-pic .aplayer-pause{width:16px;height:16px;border:2px solid #fff;bottom:4px;right:4px}.aplayer .aplayer-pic .aplayer-pause .aplayer-icon-pause{position:absolute;top:2px;left:2px;height:12px;width:12px}.aplayer .aplayer-info{margin-left:66px;padding:14px 7px 0 10px;height:66px;box-sizing:border-box}.aplayer .aplayer-info .aplayer-music{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-bottom:17px}.aplayer .aplayer-info .aplayer-music .aplayer-title{font-size:14px}.aplayer .aplayer-info .aplayer-music .aplayer-author{font-size:12px;color:#666}.aplayer .aplayer-info .aplayer-controller{position:relative}.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap{margin:0 140px 0 5px}.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar{position:relative;height:2px;width:100%;background:#cdcdcd;cursor:pointer!important}.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-loaded{position:absolute;left:0;top:0;bottom:0;background:#aaa;height:2px;-webkit-transition:all .5s ease;transition:all .5s ease}.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played{position:absolute;left:0;top:0;bottom:0;height:2px}.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played .aplayer-thumb{position:absolute;top:0;right:5px;margin-top:-4px;margin-right:-10px;height:8px;width:8px;border-radius:50%;background:#fff;cursor:pointer!important}.aplayer .aplayer-info .aplayer-controller .aplayer-time{position:absolute;right:0;bottom:-7px;height:17px;color:#999;font-size:11px}.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-time-inner{vertical-align:middle}.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon{cursor:pointer;-webkit-transition:all .2s ease;transition:all .2s ease}.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon .aplayer-fill{fill:#666}.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon.aplayer-icon-loop{margin-right:4px}.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon.aplayer-noloop .aplayer-fill{fill:#ddd}.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon.aplayer-noloop:hover .aplayer-fill{fill:#bbb}.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon:hover .aplayer-fill{fill:#000}.aplayer .aplayer-info .aplayer-controller .aplayer-time.aplayer-time-narrow .aplayer-icon-loop,.aplayer .aplayer-info .aplayer-controller .aplayer-time.aplayer-time-narrow .aplayer-icon-menu{display:none}.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap{position:relative;display:inline-block;margin-left:3px;cursor:pointer!important}.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap:hover .aplayer-volume-bar-wrap{display:block}.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap .aplayer-volume-bar-wrap{display:none;position:absolute;bottom:15px;right:-3px;width:25px;height:40px;z-index:2}.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap .aplayer-volume-bar-wrap .aplayer-volume-bar{position:absolute;bottom:0;right:10px;width:5px;height:35px;background:#aaa}.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap .aplayer-volume-bar-wrap .aplayer-volume-bar .aplayer-volume{position:absolute;bottom:0;right:0;width:5px;-webkit-transition:all .1s ease;transition:all .1s ease}.aplayer .aplayer-lrc{display:none;position:relative;height:40px;background:#fff;text-align:center;overflow:hidden;margin:-10px 0 10px}.aplayer .aplayer-lrc:before{top:0;height:10%;background:-webkit-linear-gradient(top,#fff,hsla(0,0%,100%,0));background:-webkit-gradient(linear,left top,left bottom,from(#fff),to(hsla(0,0%,100%,0)));background:linear-gradient(180deg,#fff 0,hsla(0,0%,100%,0));filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#00ffffff',GradientType=0)}.aplayer .aplayer-lrc:after,.aplayer .aplayer-lrc:before{position:absolute;z-index:1;display:block;overflow:hidden;width:100%;content:' '}.aplayer .aplayer-lrc:after{bottom:0;height:33%;background:-webkit-linear-gradient(bottom,#fff,hsla(0,0%,100%,0));background:-webkit-gradient(linear,left bottom,left top,from(#fff),to(hsla(0,0%,100%,0)));background:linear-gradient(0deg,#fff 0,hsla(0,0%,100%,0));filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff',endColorstr='#ffffff',GradientType=0)}.aplayer .aplayer-lrc p{font-size:12px;color:#666;line-height:20px!important;height:20px!important;padding:0!important;margin:0!important;-webkit-transition:all .5s ease-out;transition:all .5s ease-out;opacity:.4;overflow:hidden}.aplayer .aplayer-lrc p.aplayer-lrc-current{opacity:1}.aplayer .aplayer-lrc .aplayer-lrc-contents{width:100%;-webkit-transition:all .5s ease-out;transition:all .5s ease-out}.aplayer .aplayer-list{overflow:auto;-webkit-transition:all .5s ease;transition:all .5s ease}.aplayer .aplayer-list.aplayer-list-hide{height:0!important}.aplayer .aplayer-list ol{list-style-type:none;margin:0;padding:0}.aplayer .aplayer-list ol li{position:relative;height:32px;line-height:32px;padding:0 15px;font-size:12px;border-top:1px solid #e9e9e9;cursor:pointer;-webkit-transition:all .2s ease;transition:all .2s ease}.aplayer .aplayer-list ol li:hover{background:#efefef}.aplayer .aplayer-list ol li.aplayer-list-light{background:#e9e9e9}.aplayer .aplayer-list ol li.aplayer-list-light .aplayer-list-cur{display:inline-block}.aplayer .aplayer-list ol li .aplayer-list-cur{display:none;width:3px;height:22px;position:absolute;left:0;top:5px;cursor:pointer}.aplayer .aplayer-list ol li .aplayer-list-index{color:#666;margin-right:12px;cursor:pointer}.aplayer .aplayer-list ol li .aplayer-list-author{color:#666;float:right;cursor:pointer} \ No newline at end of file +.aplayer-narrow{width:66px}.aplayer-narrow .aplayer-info{display:none}.aplayer-withlrc.aplayer-narrow{width:106px}.aplayer-withlrc.aplayer .aplayer-pic{height:106px;width:106px}.aplayer-withlrc.aplayer .aplayer-info{margin-left:106px;height:106px}.aplayer-withlrc.aplayer .aplayer-lrc{display:block}.aplayer{font-family:Arial,Helvetica,sans-serif;margin:5px;box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);border-radius:2px;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;line-height:normal}.aplayer *{box-sizing:content-box}.aplayer .aplayer-icon{width:15px;height:15px;border:none;background-color:transparent;outline:none;cursor:pointer;opacity:.8;vertical-align:middle;padding:0}.aplayer .aplayer-icon .aplayer-fill{-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.aplayer .aplayer-lrc-content{display:none}.aplayer .aplayer-pic{position:relative;float:left;height:66px;width:66px;background-image:url(default.jpg);background-size:100%;-webkit-transition:all .3s ease;transition:all .3s ease}.aplayer .aplayer-pic .aplayer-button{position:absolute;border-radius:50%;opacity:.8;cursor:pointer;text-shadow:0 1px 1px rgba(0,0,0,.2);box-shadow:0 1px 1px rgba(0,0,0,.2);background:rgba(0,0,0,.2);-webkit-transition:all .1s ease;transition:all .1s ease}.aplayer .aplayer-pic .aplayer-button:hover{opacity:1}.aplayer .aplayer-pic .aplayer-button .aplayer-fill{fill:#fff}.aplayer .aplayer-pic .aplayer-hide{display:none}.aplayer .aplayer-pic .aplayer-play{width:26px;height:26px;border:2px solid #fff;bottom:50%;right:50%;margin:0 -15px -15px 0}.aplayer .aplayer-pic .aplayer-play .aplayer-icon-play{position:absolute;top:3px;left:4px;height:20px;width:20px}.aplayer .aplayer-pic .aplayer-pause{width:16px;height:16px;border:2px solid #fff;bottom:4px;right:4px}.aplayer .aplayer-pic .aplayer-pause .aplayer-icon-pause{position:absolute;top:2px;left:2px;height:12px;width:12px}.aplayer .aplayer-info{margin-left:66px;padding:14px 7px 0 10px;height:66px;box-sizing:border-box}.aplayer .aplayer-info .aplayer-music{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-bottom:13px}.aplayer .aplayer-info .aplayer-music .aplayer-title{font-size:14px}.aplayer .aplayer-info .aplayer-music .aplayer-author{font-size:12px;color:#666}.aplayer .aplayer-info .aplayer-controller{position:relative}.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap{margin:0 140px 0 5px;padding:4px 0;cursor:pointer!important}.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar{position:relative;height:2px;width:100%;background:#cdcdcd}.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-loaded{position:absolute;left:0;top:0;bottom:0;background:#aaa;height:2px;-webkit-transition:all .5s ease;transition:all .5s ease}.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played{position:absolute;left:0;top:0;bottom:0;height:2px}.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played .aplayer-thumb{position:absolute;top:0;right:5px;margin-top:-4px;margin-right:-10px;height:8px;width:8px;border-radius:50%;background:#fff;cursor:pointer!important}.aplayer .aplayer-info .aplayer-controller .aplayer-time{position:absolute;right:0;bottom:-3px;height:17px;color:#999;font-size:11px}.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-time-inner{vertical-align:middle}.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon{cursor:pointer;-webkit-transition:all .2s ease;transition:all .2s ease}.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon .aplayer-fill{fill:#666}.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon.aplayer-icon-loop{margin-right:4px}.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon.aplayer-noloop .aplayer-fill{fill:#ddd}.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon.aplayer-noloop:hover .aplayer-fill{fill:#bbb}.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon:hover .aplayer-fill{fill:#000}.aplayer .aplayer-info .aplayer-controller .aplayer-time.aplayer-time-narrow .aplayer-icon-loop,.aplayer .aplayer-info .aplayer-controller .aplayer-time.aplayer-time-narrow .aplayer-icon-menu{display:none}.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap{position:relative;display:inline-block;margin-left:3px;cursor:pointer!important}.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap:hover .aplayer-volume-bar-wrap{display:block}.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap .aplayer-volume-bar-wrap{display:none;position:absolute;bottom:15px;right:-3px;width:25px;height:40px;z-index:2}.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap .aplayer-volume-bar-wrap .aplayer-volume-bar{position:absolute;bottom:0;right:10px;width:5px;height:35px;background:#aaa}.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap .aplayer-volume-bar-wrap .aplayer-volume-bar .aplayer-volume{position:absolute;bottom:0;right:0;width:5px;-webkit-transition:all .1s ease;transition:all .1s ease}.aplayer .aplayer-lrc{display:none;position:relative;height:40px;background:#fff;text-align:center;overflow:hidden;margin:-10px 0 10px}.aplayer .aplayer-lrc:before{top:0;height:10%;background:-webkit-linear-gradient(top,#fff,hsla(0,0%,100%,0));background:-webkit-gradient(linear,left top,left bottom,from(#fff),to(hsla(0,0%,100%,0)));background:linear-gradient(180deg,#fff 0,hsla(0,0%,100%,0));filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#00ffffff',GradientType=0)}.aplayer .aplayer-lrc:after,.aplayer .aplayer-lrc:before{position:absolute;z-index:1;display:block;overflow:hidden;width:100%;content:' '}.aplayer .aplayer-lrc:after{bottom:0;height:33%;background:-webkit-linear-gradient(bottom,#fff,hsla(0,0%,100%,0));background:-webkit-gradient(linear,left bottom,left top,from(#fff),to(hsla(0,0%,100%,0)));background:linear-gradient(0deg,#fff 0,hsla(0,0%,100%,0));filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff',endColorstr='#ffffff',GradientType=0)}.aplayer .aplayer-lrc p{font-size:12px;color:#666;line-height:20px!important;height:20px!important;padding:0!important;margin:0!important;-webkit-transition:all .5s ease-out;transition:all .5s ease-out;opacity:.4;overflow:hidden}.aplayer .aplayer-lrc p.aplayer-lrc-current{opacity:1}.aplayer .aplayer-lrc .aplayer-lrc-contents{width:100%;-webkit-transition:all .5s ease-out;transition:all .5s ease-out}.aplayer .aplayer-list{overflow:auto;-webkit-transition:all .5s ease;transition:all .5s ease}.aplayer .aplayer-list.aplayer-list-hide{height:0!important}.aplayer .aplayer-list ol{list-style-type:none;margin:0;padding:0}.aplayer .aplayer-list ol li{position:relative;height:32px;line-height:32px;padding:0 15px;font-size:12px;border-top:1px solid #e9e9e9;cursor:pointer;-webkit-transition:all .2s ease;transition:all .2s ease}.aplayer .aplayer-list ol li:hover{background:#efefef}.aplayer .aplayer-list ol li.aplayer-list-light{background:#e9e9e9}.aplayer .aplayer-list ol li.aplayer-list-light .aplayer-list-cur{display:inline-block}.aplayer .aplayer-list ol li .aplayer-list-cur{display:none;width:3px;height:22px;position:absolute;left:0;top:5px;cursor:pointer}.aplayer .aplayer-list ol li .aplayer-list-index{color:#666;margin-right:12px;cursor:pointer}.aplayer .aplayer-list ol li .aplayer-list-author{color:#666;float:right;cursor:pointer} \ No newline at end of file diff --git a/dist/APlayer.min.js b/dist/APlayer.min.js index ed30bdd..49145ab 100644 --- a/dist/APlayer.min.js +++ b/dist/APlayer.min.js @@ -1,2 +1,2 @@ -"use strict";function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var _createClass=function(){function e(e,t){for(var a=0;a\n \n \n \n '},this.isMobile=navigator.userAgent.match(/(iPad)|(iPhone)|(iPod)|(android)|(webOS)/i),this.isMobile&&(e.autoplay=!1);var i={element:document.getElementsByClassName("aplayer")[0],narrow:!1,autoplay:!1,mutex:!0,showlrc:0,theme:"#b7daff",loop:!0};for(var s in i)i.hasOwnProperty(s)&&!e.hasOwnProperty(s)&&(e[s]=i[s]);this.playIndex="[object Array]"===Object.prototype.toString.call(e.music)?0:-1,this.option=e,this.audios=[],this.loop=e.loop,this.secondToTime=function(e){var t=function(e){return e<10?"0"+e:""+e},a=parseInt(e/60),i=parseInt(e-60*a);return t(a)+":"+t(i)},this.parseLrc=function(e){for(var t=[],a=0;a0?t:0,t=t<1?t:1,a[e+"Bar"].style[i]=100*t+"%"},this.updateLrc=function(){var e=arguments.length<=0||void 0===arguments[0]?a.audio.currentTime:arguments[0];if(a.lrcIndex>a.lrc.length-1||e=a.lrc[a.lrcIndex+1][0])for(var t=0;t=a.lrc[t][0]&&(!a.lrc[t+1]||e-1,this.music=this.multiple?this.option.music[this.playIndex]:this.option.music;var s=void 0;if(this.option.showlrc){var n=[];if(1===this.option.showlrc)if(this.multiple)for(s=0;s\n
\n \n
\n \n
\n
\n \n \n
\n
\n
\n
\n
\n
\n
\n
\n
\n \n
\n
\n
\n
\n \n - 00:00 / 00:00\n \n
\n \n
\n
\n
\n
\n
\n
\n \n "+(this.multiple?'":"")+"\n
\n
\n
");if(this.multiple){for(l+='\n
\n
    ',s=0;s\n \n '+(s+1)+'\n '+this.option.music[s].title+'\n '+this.option.music[s].author+"\n ";l+="\n
\n
"}this.element.innerHTML=l,this.ptime=this.element.getElementsByClassName("aplayer-ptime")[0],this.element.getElementsByClassName("aplayer-info")[0].offsetWidth<200&&this.element.getElementsByClassName("aplayer-time")[0].classList.add("aplayer-time-narrow"),this.element.getElementsByClassName("aplayer-bar-wrap")[0].style.marginRight=this.element.getElementsByClassName("aplayer-time")[0].offsetWidth+5+"px",this.option.narrow&&this.element.classList.add("aplayer-narrow"),this.button=this.element.getElementsByClassName("aplayer-button")[0],this.button.addEventListener("click",function(e){i.button.classList.contains("aplayer-play")?i.play():i.button.classList.contains("aplayer-pause")&&i.pause()}),this.multiple&&!function(){for(var e=i.element.getElementsByClassName("aplayer-list")[0].getElementsByTagName("li"),t=function(t){e[t].addEventListener("click",function(){var a=parseInt(e[t].getElementsByClassName("aplayer-list-index")[0].innerHTML)-1;a!==i.playIndex&&i.setMusic(a),i.isMobile?i.pause():i.play()})},a=0;a0?s:0,s=s<1?s:1,i.updateBar("played",s,"width"),i.option.showlrc&&i.updateLrc(parseFloat(i.playedBar.style.width)/100*i.audio.duration),i.element.getElementsByClassName("aplayer-ptime")[0].innerHTML=i.secondToTime(s*i.audio.duration)},u=function m(){document.removeEventListener("mouseup",m),document.removeEventListener("mousemove",r),i.audio.currentTime=parseFloat(i.playedBar.style.width)/100*i.audio.duration,i.playedTime=setInterval(function(){i.updateBar("played",i.audio.currentTime/i.audio.duration,"width"),i.option.showlrc&&i.updateLrc(),i.element.getElementsByClassName("aplayer-ptime")[0].innerHTML=i.secondToTime(i.audio.currentTime),i.trigger("playing")},100)};this.thumb.addEventListener("mousedown",function(){o=i.bar.clientWidth,clearInterval(i.playedTime),document.addEventListener("mousemove",r),document.addEventListener("mouseup",u)}),this.volumeBar=this.element.getElementsByClassName("aplayer-volume")[0];var p=this.element.getElementsByClassName("aplayer-volume-bar")[0];this.volumeicon=this.element.getElementsByClassName("aplayer-time")[0].getElementsByTagName("button")[0];var d=35;this.element.getElementsByClassName("aplayer-volume-bar-wrap")[0].addEventListener("click",function(e){var t=e||window.event,s=(d-t.clientY+a(p))/d;s=s>0?s:0,s=s<1?s:1,i.volume(s)}),this.volumeicon.addEventListener("click",function(){i.audio.muted?(i.audio.muted=!1,i.volumeicon.className=1===i.audio.volume?"aplayer-icon aplayer-icon-volume-up":"aplayer-icon aplayer-icon-volume-down",1===i.audio.volume?(i.volumeicon.className="aplayer-icon aplayer-icon-volume-up",i.volumeicon.innerHTML=i.getSVG("volume-up")):(i.volumeicon.className="aplayer-icon aplayer-icon-volume-down",i.volumeicon.innerHTML=i.getSVG("volume-down")),i.updateBar("volume",i.audio.volume,"height")):(i.audio.muted=!0,i.volumeicon.className="aplayer-icon aplayer-icon-volume-off",i.volumeicon.innerHTML=i.getSVG("volume-off"),i.updateBar("volume",0,"height"))});var c=this.element.getElementsByClassName("aplayer-icon-loop")[0];c.addEventListener("click",function(){i.loop?(c.classList.add("aplayer-noloop"),i.loop=!1,i.audio.loop=!i.multiple&&i.loop):(c.classList.remove("aplayer-noloop"),i.loop=!0,i.audio.loop=!i.multiple&&i.loop)}),this.multiple&&!function(){var e=i.element.getElementsByClassName("aplayer-list")[0];e.style.height=e.offsetHeight+"px",i.element.getElementsByClassName("aplayer-icon-menu")[0].addEventListener("click",function(){e.classList.contains("aplayer-list-hide")?e.classList.remove("aplayer-list-hide"):e.classList.add("aplayer-list-hide")})}(),this.setMusic(0),e.push(this)}},{key:"setMusic",value:function(e){var t=this;this.multiple&&"undefined"!=typeof e&&(this.playIndex=e);var a=this.playIndex;if(this.music=this.multiple?this.option.music[a]:this.option.music,this.music.pic&&(this.element.getElementsByClassName("aplayer-pic")[0].style.backgroundImage="url('"+this.music.pic+"')"),this.element.getElementsByClassName("aplayer-title")[0].innerHTML=this.music.title,this.element.getElementsByClassName("aplayer-author")[0].innerHTML=" - "+this.music.author,this.multiple&&(this.element.getElementsByClassName("aplayer-list-light")[0]&&this.element.getElementsByClassName("aplayer-list-light")[0].classList.remove("aplayer-list-light"),this.element.getElementsByClassName("aplayer-list")[0].getElementsByTagName("li")[a].classList.add("aplayer-list-light")),this.audio&&(this.pause(),this.audio.currentTime=0),this.multiple&&!this.audios[a]||this.playIndex===-1?(this.audio=document.createElement("audio"),this.audio.src=this.music.url,this.option.preload?this.audio.preload=this.option.preload:this.audio.preload=this.isMobile?"none":"metadata",this.audio.addEventListener("durationchange",function(){1!==t.audio.duration&&(t.element.getElementsByClassName("aplayer-dtime")[0].innerHTML=t.secondToTime(t.audio.duration))}),this.audio.addEventListener("progress",function(){var e=t.audio.buffered.length?t.audio.buffered.end(t.audio.buffered.length-1)/t.audio.duration:0;t.updateBar("loaded",e,"width")}),this.audio.addEventListener("error",function(){t.element.getElementsByClassName("aplayer-author")[0].innerHTML=" - Error happens ╥﹏╥",t.trigger("pause")}),this.audio.addEventListener("canplay",function(){t.trigger("canplay")}),this.ended=!1,this.multiple?this.audio.addEventListener("ended",function(){return t.isMobile?(t.ended=!0,void t.pause()):void(0!==t.audio.currentTime&&(t.playIndex"+this.lrc[s][1]+"

";this.lrcContents.innerHTML=i,this.lrcIndex||(this.lrcIndex=0),this.lrcContents.getElementsByTagName("p")[0].classList.add("aplayer-lrc-current"),this.lrcContents.style.transform="translateY(0px)",this.lrcContents.style.webkitTransform="translateY(0px)"}1!==this.audio.duration&&(this.element.getElementsByClassName("aplayer-dtime")[0].innerHTML=this.audio.duration?this.secondToTime(this.audio.duration):"00:00"),this.option.autoplay&&!this.isMobile&&this.play(),this.option.autoplay=!0,this.isMobile&&this.pause()}},{key:"play",value:function(t){var a=this;if("[object Number]"===Object.prototype.toString.call(t)&&(this.audio.currentTime=t),this.audio.paused){if(this.button.classList.remove("aplayer-play"),this.button.classList.add("aplayer-pause"),this.button.innerHTML="",setTimeout(function(){a.button.innerHTML='\n "},100),this.option.mutex)for(var i=0;i'+e.getSVG("play")+" "},100),this.audio.pause(),clearInterval(this.playedTime),this.trigger("pause"))}},{key:"volume",value:function(e){this.updateBar("volume",e,"height"),this.audio.volume=e,this.audio.muted&&(this.audio.muted=!1),1===e?(this.volumeicon.className="aplayer-icon aplayer-icon-volume-up",this.volumeicon.innerHTML=this.getSVG("volume-up")):(this.volumeicon.className="aplayer-icon aplayer-icon-volume-down",this.volumeicon.innerHTML=this.getSVG("volume-down"))}},{key:"on",value:function(e,t){"function"==typeof t&&this.event[e].push(t)}}]),t}();"undefined"!=typeof module&&"undefined"!=typeof module.exports?module.exports=t:window.APlayer=t}([]); +"use strict";function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var _createClass=function(){function e(e,t){for(var a=0;a\n \n \n \n '},this.isMobile=/mobile/i.test(window.navigator.userAgent),this.isMobile&&(e.autoplay=!1);var i={element:document.getElementsByClassName("aplayer")[0],narrow:!1,autoplay:!1,mutex:!0,showlrc:0,theme:"#b7daff",loop:!0};for(var s in i)i.hasOwnProperty(s)&&!e.hasOwnProperty(s)&&(e[s]=i[s]);this.playIndex="[object Array]"===Object.prototype.toString.call(e.music)?0:-1,this.option=e,this.audios=[],this.loop=e.loop,this.secondToTime=function(e){var t=function(e){return e<10?"0"+e:""+e},a=parseInt(e/60),i=parseInt(e-60*a);return t(a)+":"+t(i)},this.parseLrc=function(e){for(var t=[],a=0;a0?t:0,t=t<1?t:1,a[e+"Bar"].style[i]=100*t+"%"},this.updateLrc=function(){var e=arguments.length<=0||void 0===arguments[0]?a.audio.currentTime:arguments[0];if(a.lrcIndex>a.lrc.length-1||e=a.lrc[a.lrcIndex+1][0])for(var t=0;t=a.lrc[t][0]&&(!a.lrc[t+1]||e-1,this.music=this.multiple?this.option.music[this.playIndex]:this.option.music;var s=void 0;if(this.option.showlrc){var n=[];if(1===this.option.showlrc)if(this.multiple)for(s=0;s\n
\n \n
\n \n
\n
\n \n \n
\n
\n
\n
\n
\n
\n
\n
\n
\n \n
\n
\n
\n
\n \n - 00:00 / 00:00\n \n
\n \n
\n
\n
\n
\n
\n
\n \n "+(this.multiple?'":"")+"\n
\n
\n
");if(this.multiple){for(l+='\n
\n
    ',s=0;s\n \n '+(s+1)+'\n '+this.option.music[s].title+'\n '+this.option.music[s].author+"\n ";l+="\n
\n
"}this.element.innerHTML=l,this.element.offsetWidth<300&&(this.element.getElementsByClassName("aplayer-icon-loop")[0].style.display="none"),this.ptime=this.element.getElementsByClassName("aplayer-ptime")[0],this.element.getElementsByClassName("aplayer-info")[0].offsetWidth<200&&this.element.getElementsByClassName("aplayer-time")[0].classList.add("aplayer-time-narrow"),this.bar=this.element.getElementsByClassName("aplayer-bar-wrap")[0],this.bar.style.marginRight=this.element.getElementsByClassName("aplayer-time")[0].offsetWidth+5+"px",this.option.narrow&&this.element.classList.add("aplayer-narrow"),this.button=this.element.getElementsByClassName("aplayer-button")[0],this.button.addEventListener("click",function(e){i.button.classList.contains("aplayer-play")?i.play():i.button.classList.contains("aplayer-pause")&&i.pause()}),this.multiple&&!function(){for(var e=i.element.getElementsByClassName("aplayer-list")[0].getElementsByTagName("li"),t=function(t){e[t].addEventListener("click",function(){var a=parseInt(e[t].getElementsByClassName("aplayer-list-index")[0].innerHTML)-1;a!==i.playIndex?(i.setMusic(a),i.isMobile?i.pause():i.play()):i.toggle()})},a=0;a0?s:0,s=s<1?s:1,i.updateBar("played",s,"width"),i.option.showlrc&&i.updateLrc(parseFloat(i.playedBar.style.width)/100*i.audio.duration),i.element.getElementsByClassName("aplayer-ptime")[0].innerHTML=i.secondToTime(s*i.audio.duration)},u=function h(){document.removeEventListener("mouseup",h),document.removeEventListener("mousemove",r),i.audio.currentTime=parseFloat(i.playedBar.style.width)/100*i.audio.duration,i.playedTime=setInterval(function(){i.updateBar("played",i.audio.currentTime/i.audio.duration,"width"),i.option.showlrc&&i.updateLrc(),i.element.getElementsByClassName("aplayer-ptime")[0].innerHTML=i.secondToTime(i.audio.currentTime),i.trigger("playing")},100)};this.thumb.addEventListener("mousedown",function(){o=i.bar.clientWidth,clearInterval(i.playedTime),document.addEventListener("mousemove",r),document.addEventListener("mouseup",u)}),this.volumeBar=this.element.getElementsByClassName("aplayer-volume")[0];var p=this.element.getElementsByClassName("aplayer-volume-bar")[0];this.volumeicon=this.element.getElementsByClassName("aplayer-time")[0].getElementsByTagName("button")[0];var d=35;this.element.getElementsByClassName("aplayer-volume-bar-wrap")[0].addEventListener("click",function(e){var t=e||window.event,s=(d-t.clientY+a(p))/d;s=s>0?s:0,s=s<1?s:1,i.volume(s)}),this.volumeicon.addEventListener("click",function(){i.audio.muted?(i.audio.muted=!1,i.volumeicon.className=1===i.audio.volume?"aplayer-icon aplayer-icon-volume-up":"aplayer-icon aplayer-icon-volume-down",1===i.audio.volume?(i.volumeicon.className="aplayer-icon aplayer-icon-volume-up",i.volumeicon.innerHTML=i.getSVG("volume-up")):(i.volumeicon.className="aplayer-icon aplayer-icon-volume-down",i.volumeicon.innerHTML=i.getSVG("volume-down")),i.updateBar("volume",i.audio.volume,"height")):(i.audio.muted=!0,i.volumeicon.className="aplayer-icon aplayer-icon-volume-off",i.volumeicon.innerHTML=i.getSVG("volume-off"),i.updateBar("volume",0,"height"))});var c=this.element.getElementsByClassName("aplayer-icon-loop")[0];c.addEventListener("click",function(){i.loop?(c.classList.add("aplayer-noloop"),i.loop=!1,i.audio.loop=!i.multiple&&i.loop):(c.classList.remove("aplayer-noloop"),i.loop=!0,i.audio.loop=!i.multiple&&i.loop)}),this.multiple&&!function(){var e=i.element.getElementsByClassName("aplayer-list")[0];e.style.height=e.offsetHeight+"px",i.element.getElementsByClassName("aplayer-icon-menu")[0].addEventListener("click",function(){e.classList.contains("aplayer-list-hide")?e.classList.remove("aplayer-list-hide"):e.classList.add("aplayer-list-hide")})}(),this.setMusic(0),e.push(this)}},{key:"setMusic",value:function(e){var t=this;this.multiple&&"undefined"!=typeof e&&(this.playIndex=e);var a=this.playIndex;if(this.music=this.multiple?this.option.music[a]:this.option.music,this.music.pic&&(this.element.getElementsByClassName("aplayer-pic")[0].style.backgroundImage="url('"+this.music.pic+"')"),this.element.getElementsByClassName("aplayer-title")[0].innerHTML=this.music.title,this.element.getElementsByClassName("aplayer-author")[0].innerHTML=" - "+this.music.author,this.multiple&&(this.element.getElementsByClassName("aplayer-list-light")[0]&&this.element.getElementsByClassName("aplayer-list-light")[0].classList.remove("aplayer-list-light"),this.element.getElementsByClassName("aplayer-list")[0].getElementsByTagName("li")[a].classList.add("aplayer-list-light")),this.audio&&(this.pause(),this.audio.currentTime=0),this.multiple&&!this.audios[a]||this.playIndex===-1?(this.audio=document.createElement("audio"),this.audio.src=this.music.url,this.option.preload?this.audio.preload=this.option.preload:this.audio.preload=this.isMobile?"none":"metadata",this.audio.addEventListener("durationchange",function(){1!==t.audio.duration&&(t.element.getElementsByClassName("aplayer-dtime")[0].innerHTML=t.secondToTime(t.audio.duration))}),this.audio.addEventListener("progress",function(){var e=t.audio.buffered.length?t.audio.buffered.end(t.audio.buffered.length-1)/t.audio.duration:0;t.updateBar("loaded",e,"width")}),this.audio.addEventListener("error",function(){t.element.getElementsByClassName("aplayer-author")[0].innerHTML=" - Error happens ╥﹏╥",t.trigger("pause")}),this.audio.addEventListener("canplay",function(){t.trigger("canplay")}),this.ended=!1,this.multiple?this.audio.addEventListener("ended",function(){return t.isMobile?(t.ended=!0,void t.pause()):void(0!==t.audio.currentTime&&(t.playIndex"+this.lrc[s][1]+"

";this.lrcContents.innerHTML=i,this.lrcIndex||(this.lrcIndex=0),this.lrcContents.getElementsByTagName("p")[0].classList.add("aplayer-lrc-current"),this.lrcContents.style.transform="translateY(0px)",this.lrcContents.style.webkitTransform="translateY(0px)"}1!==this.audio.duration&&(this.element.getElementsByClassName("aplayer-dtime")[0].innerHTML=this.audio.duration?this.secondToTime(this.audio.duration):"00:00"),this.option.autoplay&&!this.isMobile&&this.play(),this.option.autoplay=!0,this.isMobile&&this.pause()}},{key:"play",value:function(t){var a=this;if("[object Number]"===Object.prototype.toString.call(t)&&(this.audio.currentTime=t),this.audio.paused){if(this.button.classList.remove("aplayer-play"),this.button.classList.add("aplayer-pause"),this.button.innerHTML="",setTimeout(function(){a.button.innerHTML='\n "},100),this.option.mutex)for(var i=0;i'+e.getSVG("play")+" "},100),this.audio.pause(),clearInterval(this.playedTime),this.trigger("pause"))}},{key:"volume",value:function(e){this.updateBar("volume",e,"height"),this.audio.volume=e,this.audio.muted&&(this.audio.muted=!1),1===e?(this.volumeicon.className="aplayer-icon aplayer-icon-volume-up",this.volumeicon.innerHTML=this.getSVG("volume-up")):(this.volumeicon.className="aplayer-icon aplayer-icon-volume-down",this.volumeicon.innerHTML=this.getSVG("volume-down"))}},{key:"on",value:function(e,t){"function"==typeof t&&this.event[e].push(t)}},{key:"toggle",value:function(){this.audio.paused?this.play():this.pause()}}]),t}();"undefined"!=typeof module&&"undefined"!=typeof module.exports?module.exports=t:window.APlayer=t}([]); //# sourceMappingURL=APlayer.min.js.map diff --git a/dist/APlayer.min.js.map b/dist/APlayer.min.js.map index b7ba4ab..b2a50e2 100644 --- a/dist/APlayer.min.js.map +++ b/dist/APlayer.min.js.map @@ -1 +1 @@ -{"version":3,"sources":["APlayer.js"],"names":["_classCallCheck","instance","Constructor","TypeError","_createClass","defineProperties","target","props","i","length","descriptor","enumerable","configurable","writable","Object","defineProperty","key","protoProps","staticProps","prototype","instances","APlayer","option","_this","this","svg","play","pause","volume-up","volume-down","volume-off","loop","menu","getSVG","type","isMobile","navigator","userAgent","match","autoplay","defaultOption","element","document","getElementsByClassName","narrow","mutex","showlrc","theme","defaultKey","hasOwnProperty","playIndex","toString","call","music","audios","secondToTime","second","add0","num","min","parseInt","sec","parseLrc","arr","lrcs","k","lyric","split","lrc","lyricLen","lrcTimes","lrcText","replace","timeLen","j","oneTime","exec","lrcTime","push","sort","a","b","updateBar","percentage","direction","style","updateLrc","currentTime","arguments","undefined","audio","lrcIndex","lrcContents","transform","webkitTransform","classList","remove","getElementsByTagName","add","eventTypes","event","trigger","_i","value","getElementViewLeft","actualLeft","offsetLeft","current","offsetParent","elementScrollLeft","body","scrollLeft","documentElement","getElementViewTop","actualTop","offsetTop","elementScrollTop","scrollTop","_this2","multiple","innerHTML","eleHTML","pic","title","author","ptime","offsetWidth","marginRight","button","addEventListener","e","contains","listItem","_loop","_i2","musicIndex","setMusic","playedBar","loadedBar","thumb","bar","barWidth","window","clientWidth","clientX","duration","parseFloat","width","background","thumbMove","thumbUp","removeEventListener","playedTime","setInterval","clearInterval","volumeBar","volumeBarWrap","volumeicon","barHeight","clientY","volume","muted","className","loopEle","list","height","offsetHeight","index","_this3","indexMusic","backgroundImage","createElement","src","url","preload","buffered","end","ended","lrcHTML","time","_this4","paused","setTimeout","_this5","name","func","module","exports"],"mappings":"AAAA,YAIA,SAASA,iBAAgBC,EAAUC,GAAe,KAAMD,YAAoBC,IAAgB,KAAM,IAAIC,WAAU,qCAFhH,GAAIC,cAAe,WAAc,QAASC,GAAiBC,EAAQC,GAAS,IAAK,GAAIC,GAAI,EAAGA,EAAID,EAAME,OAAQD,IAAK,CAAE,GAAIE,GAAaH,EAAMC,EAAIE,GAAWC,WAAaD,EAAWC,aAAc,EAAOD,EAAWE,cAAe,EAAU,SAAWF,KAAYA,EAAWG,UAAW,GAAMC,OAAOC,eAAeT,EAAQI,EAAWM,IAAKN,IAAiB,MAAO,UAAUR,EAAae,EAAYC,GAAiJ,MAA9HD,IAAYZ,EAAiBH,EAAYiB,UAAWF,GAAiBC,GAAab,EAAiBH,EAAagB,GAAqBhB,OAFhiB,SAAEkB,GAAc,GAENC,GAFM,WASR,QAAAA,GAAYC,GAAQ,GAAAC,GAAAC,IAAAxB,iBAAAwB,KAAAH,GAChBG,KAAKC,KACDC,MAAS,YAAa,uJACtBC,OAAU,YAAa,4LACvBC,aAAc,YAAa,qsCAC3BC,eAAgB,YAAa,wfAC7BC,cAAe,YAAa,yMAC5BC,MAAS,YAAa,iOACtBC,MAAS,YAAa,qXAE1BR,KAAKS,OAAS,SAACC,GACX,MAAA,8GAC2FX,EAAKE,IAAIS,GAAM,GAD1G,sEAEoCA,EAFpC,mEAGwCX,EAAKE,IAAIS,GAAM,GAHvD,iBAG0EA,EAH1E,2DAQJV,KAAKW,SAAWC,UAAUC,UAAUC,MAAM,6CAEtCd,KAAKW,WACLb,EAAOiB,UAAW,EAItB,IAAMC,IACFC,QAASC,SAASC,uBAAuB,WAAW,GACpDC,QAAQ,EACRL,UAAU,EACVM,OAAO,EACPC,QAAS,EACTC,MAAO,UACPhB,MAAM,EAEV,KAAK,GAAIiB,KAAcR,GACfA,EAAcS,eAAeD,KAAgB1B,EAAO2B,eAAeD,KACnE1B,EAAO0B,GAAcR,EAAcQ,GAK3CxB,MAAK0B,UAA6D,mBAAjDpC,OAAOK,UAAUgC,SAASC,KAAK9B,EAAO+B,OAA8B,KAErF7B,KAAKF,OAASA,EACdE,KAAK8B,UACL9B,KAAKO,KAAOT,EAAOS,KAQnBP,KAAK+B,aAAe,SAACC,GACjB,GAAMC,GAAO,SAACC,GACV,MAAOA,GAAM,GAAK,IAAMA,EAAM,GAAKA,GAEjCC,EAAMC,SAASJ,EAAS,IACxBK,EAAMD,SAASJ,EAAe,GAANG,EAC9B,OAAOF,GAAKE,GAAO,IAAMF,EAAKI,IAalCrC,KAAKsC,SAAW,SAACC,GAEb,IAAK,GADDC,MACKC,EAAI,EAAGA,EAAIF,EAAItD,OAAQwD,IAAK,CAIjC,IAAK,GAHCC,GAAQH,EAAIE,GAAGE,MAAM,MACvBC,KACEC,EAAWH,EAAMzD,OACdD,EAAI,EAAGA,EAAI6D,EAAU7D,IAAK,CAE/B,GAAM8D,GAAWJ,EAAM1D,GAAG8B,MAAM,kCAE1BiC,EAAUL,EAAM1D,GAAGgE,QAAQ,iCAAkC,IAAIA,QAAQ,aAAc,GAE7F,IAAgB,MAAZF,EAGA,IAAK,GADCG,GAAUH,EAAS7D,OAChBiE,EAAI,EAAGA,EAAID,EAASC,IAAK,CAC9B,GAAMC,GAAU,gCAAgCC,KAAKN,EAASI,IACxDG,EAAyB,GAAdF,EAAQ,GAAWf,SAASe,EAAQ,IAAMf,SAASe,EAAQ,KAAoC,KAA5BA,EAAQ,GAAK,IAAIlE,OAAe,IAAM,IAC1H2D,GAAIU,MAAMD,EAASN,KAK/BH,EAAIW,KAAK,SAACC,EAAGC,GAAJ,MAAUD,GAAE,GAAKC,EAAE,KAC5BjB,EAAKc,KAAKV,GAEd,MAAOJ,IAUXxC,KAAK0D,UAAY,SAAChD,EAAMiD,EAAYC,GAChCD,EAAaA,EAAa,EAAIA,EAAa,EAC3CA,EAAaA,EAAa,EAAIA,EAAa,EAC3C5D,EAAKW,EAAO,OAAOmD,MAAMD,GAA0B,IAAbD,EAAmB,KAQ7D3D,KAAK8D,UAAY,WAA0C,GAAzCC,GAAyCC,UAAA/E,QAAA,GAAAgF,SAAAD,UAAA,GAA3BjE,EAAKmE,MAAMH,YAAgBC,UAAA,EACvD,IAAIjE,EAAKoE,SAAWpE,EAAK6C,IAAI3D,OAAS,GAAK8E,EAAchE,EAAK6C,IAAI7C,EAAKoE,UAAU,KAAQpE,EAAK6C,IAAI7C,EAAKoE,SAAW,IAAMJ,GAAehE,EAAK6C,IAAI7C,EAAKoE,SAAW,GAAG,GAC/J,IAAK,GAAInF,GAAI,EAAGA,EAAIe,EAAK6C,IAAI3D,OAAQD,IAC7B+E,GAAehE,EAAK6C,IAAI5D,GAAG,MAAQe,EAAK6C,IAAI5D,EAAI,IAAM+E,EAAchE,EAAK6C,IAAI5D,EAAI,GAAG,MACpFe,EAAKoE,SAAWnF,EAChBe,EAAKqE,YAAYP,MAAMQ,UAAvB,cAAkE,IAAhBtE,EAAKoE,SAAvD,MACApE,EAAKqE,YAAYP,MAAMS,gBAAvB,cAAwE,IAAhBvE,EAAKoE,SAA7D,MACApE,EAAKqE,YAAYjD,uBAAuB,uBAAuB,GAAGoD,UAAUC,OAAO,uBACnFzE,EAAKqE,YAAYK,qBAAqB,KAAKzF,GAAGuF,UAAUG,IAAI,yBAO5E1E,KAAK2E,YAAc,OAAQ,QAAS,UAAW,UAAW,QAAS,SACnE3E,KAAK4E,QACL,KAAK,GAAI5F,GAAI,EAAGA,EAAIgB,KAAK2E,WAAW1F,OAAQD,IACxCgB,KAAK4E,MAAM5E,KAAK2E,WAAW3F,MAE/BgB,MAAK6E,QAAU,SAACnE,GACZ,IAAK,GAAIoE,GAAI,EAAGA,EAAI/E,EAAK6E,MAAMlE,GAAMzB,OAAQ6F,IACzC/E,EAAK6E,MAAMlE,GAAMoE,MAvJrB,MAAAlG,cAAAiB,IAAAL,IAAA,OAAAuF,MAAA,WAyYJ,QAASC,GAAmB/D,GAIxB,IAHA,GAAIgE,GAAahE,EAAQiE,WACrBC,EAAUlE,EAAQmE,aAClBC,EAAA,OACe,OAAZF,GACHF,GAAcE,EAAQD,WACtBC,EAAUA,EAAQC,YAGtB,OADAC,GAAoBnE,SAASoE,KAAKC,WAAarE,SAASsE,gBAAgBD,WACjEN,EAAaI,EAGxB,QAASI,GAAkBxE,GAIvB,IAHA,GAAIyE,GAAYzE,EAAQ0E,UACpBR,EAAUlE,EAAQmE,aAClBQ,EAAA,OACe,OAAZT,GACHO,GAAaP,EAAQQ,UACrBR,EAAUA,EAAQC,YAGtB,OADAQ,GAAmB1E,SAASoE,KAAKO,UAAY3E,SAASsE,gBAAgBK,UAC/DH,EAAYE,EA/PpB,GAAAE,GAAA9F,IACHA,MAAKiB,QAAUjB,KAAKF,OAAOmB,QAC3BjB,KAAK+F,SAAW/F,KAAK0B,aACrB1B,KAAK6B,MAAQ7B,KAAK+F,SAAW/F,KAAKF,OAAO+B,MAAM7B,KAAK0B,WAAa1B,KAAKF,OAAO+B,KAE7E,IAAI7C,GAAA,MAEJ,IAAIgB,KAAKF,OAAOwB,QAAS,CACrB,GAAIkB,KACJ,IAA4B,IAAxBxC,KAAKF,OAAOwB,QACZ,GAAItB,KAAK+F,SACL,IAAK/G,EAAI,EAAGA,EAAIgB,KAAKF,OAAO+B,MAAM5C,OAAQD,IACtCwD,EAAKc,KAAKtD,KAAKF,OAAO+B,MAAM7C,GAAG4D,SAInCJ,GAAKc,KAAKtD,KAAKF,OAAO+B,MAAMe,SAG/B,IAA4B,IAAxB5C,KAAKF,OAAOwB,SAAiBtB,KAAKF,OAAOwB,WAAY,EAC1D,IAAKtC,EAAI,EAAGA,EAAIgB,KAAKiB,QAAQE,uBAAuB,uBAAuBlC,OAAQD,IAC/EwD,EAAKc,KAAKtD,KAAKiB,QAAQE,uBAAuB,uBAAuBnC,GAAGgH,UAIhFhG,MAAKwC,KAAOxC,KAAKsC,SAASE,GAI1BxC,KAAKF,OAAOwB,SACZtB,KAAKiB,QAAQsD,UAAUG,IAAI,kBAI/B,IAAIuB,GAAU,+CACkBjG,KAAK6B,MAAMqE,IAAX,kCAAmDlG,KAAK6B,MAAMqE,IAA9D,QAAA,IADlB,4IAIElG,KAAKS,OAAO,SAJd,+1BAoBiET,KAAKF,OAAOyB,MApB7E,iGAqBiEvB,KAAKF,OAAOyB,MArB7E,giBA+BUvB,KAAKS,OAAO,gBA/BtB,4QAmC4ET,KAAKF,OAAOyB,MAnCxF,gNAuCkDvB,KAAKO,KAAL,GAAA,mBAvClD,MAwCMP,KAAKS,OAAO,SAxClB,oDA0CKT,KAAK+F,SAAW,kDACf/F,KAAKS,OAAO,QADG,qBAAhB,IA1CL,uFAgDd,IAAIT,KAAK+F,SAAU,CAIf,IAHAE,GAAA,yEAGKjH,EAAI,EAAGA,EAAIgB,KAAKF,OAAO+B,MAAM5C,OAAQD,IACtCiH,GAAA,iHAE4DjG,KAAKF,OAAOyB,MAFxE,6EAG4CvC,EAAI,GAHhD,yEAI2CgB,KAAKF,OAAO+B,MAAM7C,GAAGmH,MAJhE,0EAK4CnG,KAAKF,OAAO+B,MAAM7C,GAAGoH,OALjE,wCAQJH,IAAA,sDAIJjG,KAAKiB,QAAQ+E,UAAYC,EAEzBjG,KAAKqG,MAAQrG,KAAKiB,QAAQE,uBAAuB,iBAAiB,GAE9DnB,KAAKiB,QAAQE,uBAAuB,gBAAgB,GAAGmF,YAAc,KACrEtG,KAAKiB,QAAQE,uBAAuB,gBAAgB,GAAGoD,UAAUG,IAAI,uBAGzE1E,KAAKiB,QAAQE,uBAAuB,oBAAoB,GAAG0C,MAAM0C,YAAcvG,KAAKiB,QAAQE,uBAAuB,gBAAgB,GAAGmF,YAAc,EAAI,KAGpJtG,KAAKF,OAAOsB,QACZpB,KAAKiB,QAAQsD,UAAUG,IAAI,kBAI/B1E,KAAKwG,OAASxG,KAAKiB,QAAQE,uBAAuB,kBAAkB,GACpEnB,KAAKwG,OAAOC,iBAAiB,QAAS,SAACC,GAC/BZ,EAAKU,OAAOjC,UAAUoC,SAAS,gBAC/Bb,EAAK5F,OAEA4F,EAAKU,OAAOjC,UAAUoC,SAAS,kBACpCb,EAAK3F,UAKTH,KAAK+F,WAAU,WAEf,IAAK,GADCa,GAAWd,EAAK7E,QAAQE,uBAAuB,gBAAgB,GAAGsD,qBAAqB,MAD9EoC,EAAA,SAENC,GACLF,EAASE,GAAGL,iBAAiB,QAAS,WAClC,GAAMM,GAAa3E,SAASwE,EAASE,GAAG3F,uBAAuB,sBAAsB,GAAG6E,WAAa,CACjGe,KAAejB,EAAKpE,WACpBoE,EAAKkB,SAASD,GAEdjB,EAAKnF,SACLmF,EAAK3F,QAGL2F,EAAK5F,UAVR4G,EAAI,EAAGA,EAAIhB,EAAKhG,OAAO+B,MAAM5C,OAAQ6H,IAAKD,EAA1CC,MAiBb9G,KAAKiH,UAAYjH,KAAKiB,QAAQE,uBAAuB,kBAAkB,GACvEnB,KAAKkH,UAAYlH,KAAKiB,QAAQE,uBAAuB,kBAAkB,GACvEnB,KAAKmH,MAAQnH,KAAKiB,QAAQE,uBAAuB,iBAAiB,GAClEnB,KAAKoH,IAAMpH,KAAKiB,QAAQE,uBAAuB,eAAe,EAC9D,IAAIkG,GAAA,MACJrH,MAAKoH,IAAIX,iBAAiB,QAAS,SAAC7B,GAChC,GAAM8B,GAAI9B,GAAS0C,OAAO1C,KAC1ByC,GAAWvB,EAAKsB,IAAIG,WACpB,IAAM5D,IAAc+C,EAAEc,QAAUxC,EAAmBc,EAAKsB,MAAQC,CAChEvB,GAAKpC,UAAU,SAAUC,EAAY,SACrCmC,EAAK7E,QAAQE,uBAAuB,iBAAiB,GAAG6E,UAAYF,EAAK/D,aAAa4B,EAAamC,EAAK5B,MAAMuD,UAC9G3B,EAAK5B,MAAMH,YAAc2D,WAAW5B,EAAKmB,UAAUpD,MAAM8D,OAAS,IAAM7B,EAAK5B,MAAMuD,WAGvFzH,KAAKmH,MAAMV,iBAAiB,YAAa,WACrCX,EAAKqB,MAAMtD,MAAM+D,WAAa9B,EAAKhG,OAAOyB,QAE9CvB,KAAKmH,MAAMV,iBAAiB,WAAY,WACpCX,EAAKqB,MAAMtD,MAAM+D,WAAa,QAGlC,IAAMC,GAAY,SAACjD,GACf,GAAM8B,GAAI9B,GAAS0C,OAAO1C,MACtBjB,GAAc+C,EAAEc,QAAUxC,EAAmBc,EAAKsB,MAAQC,CAC9D1D,GAAaA,EAAa,EAAIA,EAAa,EAC3CA,EAAaA,EAAa,EAAIA,EAAa,EAC3CmC,EAAKpC,UAAU,SAAUC,EAAY,SACjCmC,EAAKhG,OAAOwB,SACZwE,EAAKhC,UAAU4D,WAAW5B,EAAKmB,UAAUpD,MAAM8D,OAAS,IAAM7B,EAAK5B,MAAMuD,UAE7E3B,EAAK7E,QAAQE,uBAAuB,iBAAiB,GAAG6E,UAAYF,EAAK/D,aAAa4B,EAAamC,EAAK5B,MAAMuD,WAG5GK,EAAU,QAAVA,KACF5G,SAAS6G,oBAAoB,UAAWD,GACxC5G,SAAS6G,oBAAoB,YAAaF,GAC1C/B,EAAK5B,MAAMH,YAAc2D,WAAW5B,EAAKmB,UAAUpD,MAAM8D,OAAS,IAAM7B,EAAK5B,MAAMuD,SACnF3B,EAAKkC,WAAaC,YAAY,WAC1BnC,EAAKpC,UAAU,SAAUoC,EAAK5B,MAAMH,YAAc+B,EAAK5B,MAAMuD,SAAU,SACnE3B,EAAKhG,OAAOwB,SACZwE,EAAKhC,YAETgC,EAAK7E,QAAQE,uBAAuB,iBAAiB,GAAG6E,UAAYF,EAAK/D,aAAa+D,EAAK5B,MAAMH,aACjG+B,EAAKjB,QAAQ,YACd,KAGP7E,MAAKmH,MAAMV,iBAAiB,YAAa,WACrCY,EAAWvB,EAAKsB,IAAIG,YACpBW,cAAcpC,EAAKkC,YACnB9G,SAASuF,iBAAiB,YAAaoB,GACvC3G,SAASuF,iBAAiB,UAAWqB,KAIzC9H,KAAKmI,UAAYnI,KAAKiB,QAAQE,uBAAuB,kBAAkB,EACvE,IAAMiH,GAAgBpI,KAAKiB,QAAQE,uBAAuB,sBAAsB,EAChFnB,MAAKqI,WAAarI,KAAKiB,QAAQE,uBAAuB,gBAAgB,GAAGsD,qBAAqB,UAAU,EACxG,IAAM6D,GAAY,EAClBtI,MAAKiB,QAAQE,uBAAuB,2BAA2B,GAAGsF,iBAAiB,QAAS,SAAC7B,GACzF,GAAM8B,GAAI9B,GAAS0C,OAAO1C,MACtBjB,GAAc2E,EAAY5B,EAAE6B,QAAU9C,EAAkB2C,IAAkBE,CAC9E3E,GAAaA,EAAa,EAAIA,EAAa,EAC3CA,EAAaA,EAAa,EAAIA,EAAa,EAC3CmC,EAAK0C,OAAO7E,KAEhB3D,KAAKqI,WAAW5B,iBAAiB,QAAS,WAClCX,EAAK5B,MAAMuE,OACX3C,EAAK5B,MAAMuE,OAAQ,EACnB3C,EAAKuC,WAAWK,UAAkC,IAAtB5C,EAAK5B,MAAMsE,OAAe,sCAAwC,wCACpE,IAAtB1C,EAAK5B,MAAMsE,QACX1C,EAAKuC,WAAWK,UAAY,sCAC5B5C,EAAKuC,WAAWrC,UAAYF,EAAKrF,OAAO,eAGxCqF,EAAKuC,WAAWK,UAAY,wCAC5B5C,EAAKuC,WAAWrC,UAAYF,EAAKrF,OAAO,gBAE5CqF,EAAKpC,UAAU,SAAUoC,EAAK5B,MAAMsE,OAAQ,YAG5C1C,EAAK5B,MAAMuE,OAAQ,EACnB3C,EAAKuC,WAAWK,UAAY,uCAC5B5C,EAAKuC,WAAWrC,UAAYF,EAAKrF,OAAO,cACxCqF,EAAKpC,UAAU,SAAU,EAAG,YA8BpC,IAAMiF,GAAU3I,KAAKiB,QAAQE,uBAAuB,qBAAqB,EACzEwH,GAAQlC,iBAAiB,QAAS,WAC1BX,EAAKvF,MACLoI,EAAQpE,UAAUG,IAAI,kBACtBoB,EAAKvF,MAAO,EACZuF,EAAK5B,MAAM3D,MAAOuF,EAAKC,UAAmBD,EAAKvF,OAG/CoI,EAAQpE,UAAUC,OAAO,kBACzBsB,EAAKvF,MAAO,EACZuF,EAAK5B,MAAM3D,MAAOuF,EAAKC,UAAmBD,EAAKvF,QAKnDP,KAAK+F,WAAU,WACf,GAAM6C,GAAO9C,EAAK7E,QAAQE,uBAAuB,gBAAgB,EACjEyH,GAAK/E,MAAMgF,OAASD,EAAKE,aAAe,KACxChD,EAAK7E,QAAQE,uBAAuB,qBAAqB,GAAGsF,iBAAiB,QAAS,WAC7EmC,EAAKrE,UAAUoC,SAAS,qBAIzBiC,EAAKrE,UAAUC,OAAO,qBAHtBoE,EAAKrE,UAAUG,IAAI,0BAQ/B1E,KAAKgH,SAAS,GAEdpH,EAAU0D,KAAKtD,SAhcXR,IAAA,WAAAuF,MAAA,SAscCgE,GAAO,GAAAC,GAAAhJ,IAERA,MAAK+F,UAA8B,mBAAXgD,KACxB/I,KAAK0B,UAAYqH,EAErB,IAAME,GAAajJ,KAAK0B,SA4GxB,IA3GA1B,KAAK6B,MAAQ7B,KAAK+F,SAAW/F,KAAKF,OAAO+B,MAAMoH,GAAcjJ,KAAKF,OAAO+B,MAGrE7B,KAAK6B,MAAMqE,MACXlG,KAAKiB,QAAQE,uBAAuB,eAAe,GAAG0C,MAAMqF,gBAA5D,QAAsFlJ,KAAK6B,MAAMqE,IAAjG,MAEJlG,KAAKiB,QAAQE,uBAAuB,iBAAiB,GAAG6E,UAAYhG,KAAK6B,MAAMsE,MAC/EnG,KAAKiB,QAAQE,uBAAuB,kBAAkB,GAAG6E,UAAzD,MAA2EhG,KAAK6B,MAAMuE,OAClFpG,KAAK+F,WACD/F,KAAKiB,QAAQE,uBAAuB,sBAAsB,IAC1DnB,KAAKiB,QAAQE,uBAAuB,sBAAsB,GAAGoD,UAAUC,OAAO,sBAElFxE,KAAKiB,QAAQE,uBAAuB,gBAAgB,GAAGsD,qBAAqB,MAAMwE,GAAY1E,UAAUG,IAAI,uBAI5G1E,KAAKkE,QACLlE,KAAKG,QACLH,KAAKkE,MAAMH,YAAc,GAIxB/D,KAAK+F,WAAa/F,KAAK8B,OAAOmH,IAAgBjJ,KAAK0B,gBACpD1B,KAAKkE,MAAQhD,SAASiI,cAAc,SACpCnJ,KAAKkE,MAAMkF,IAAMpJ,KAAK6B,MAAMwH,IACxBrJ,KAAKF,OAAOwJ,QACZtJ,KAAKkE,MAAMoF,QAAUtJ,KAAKF,OAAOwJ,QAGjCtJ,KAAKkE,MAAMoF,QAAUtJ,KAAKW,SAAW,OAAS,WAIlDX,KAAKkE,MAAMuC,iBAAiB,iBAAkB,WACd,IAAxBuC,EAAK9E,MAAMuD,WACXuB,EAAK/H,QAAQE,uBAAuB,iBAAiB,GAAG6E,UAAYgD,EAAKjH,aAAaiH,EAAK9E,MAAMuD,aAKzGzH,KAAKkE,MAAMuC,iBAAiB,WAAY,WACpC,GAAM9C,GAAaqF,EAAK9E,MAAMqF,SAAStK,OAAS+J,EAAK9E,MAAMqF,SAASC,IAAIR,EAAK9E,MAAMqF,SAAStK,OAAS,GAAK+J,EAAK9E,MAAMuD,SAAW,CAChIuB,GAAKtF,UAAU,SAAUC,EAAY,WAIzC3D,KAAKkE,MAAMuC,iBAAiB,QAAS,WACjCuC,EAAK/H,QAAQE,uBAAuB,kBAAkB,GAAG6E,UAAzD,uBACAgD,EAAKnE,QAAQ,WAIjB7E,KAAKkE,MAAMuC,iBAAiB,UAAW,WACnCuC,EAAKnE,QAAQ,aAIjB7E,KAAKyJ,OAAQ,EACTzJ,KAAK+F,SACL/F,KAAKkE,MAAMuC,iBAAiB,QAAS,WACjC,MAAIuC,GAAKrI,UACLqI,EAAKS,OAAQ,MACbT,GAAK7I,cAGsB,IAA3B6I,EAAK9E,MAAMH,cACPiF,EAAKtH,UAAYsH,EAAKlJ,OAAO+B,MAAM5C,OAAS,EAC5C+J,EAAKhC,WAAWgC,EAAKtH,WAEhBsH,EAAKzI,KACVyI,EAAKhC,SAAS,GAERgC,EAAKzI,OACXyI,EAAKS,OAAQ,EACbT,EAAK7I,QACL6I,EAAKnE,QAAQ,cAMzB7E,KAAKkE,MAAMuC,iBAAiB,QAAS,WAC5BuC,EAAKzI,OACNyI,EAAKS,OAAQ,EACbT,EAAK7I,QACL6I,EAAKnE,QAAQ,YAMzB7E,KAAKkE,MAAMsE,OAASpG,SAASpC,KAAKiB,QAAQE,uBAAuB,kBAAkB,GAAG0C,MAAMgF,QAAU,IAGtG7I,KAAKkE,MAAM3D,MAAOP,KAAK+F,UAAmB/F,KAAKO,KAE3CP,KAAK+F,WACL/F,KAAK8B,OAAOmH,GAAcjJ,KAAKkE,SAInClE,KAAKkE,MAAQlE,KAAK8B,OAAOmH,GACzBjJ,KAAKkE,MAAMsE,OAASpG,SAASpC,KAAKiB,QAAQE,uBAAuB,kBAAkB,GAAG0C,MAAMgF,QAAU,IACtG7I,KAAKkE,MAAMH,YAAc,GAIzB/D,KAAKF,OAAOwB,QAAS,CACrBtB,KAAK4C,IAAM5C,KAAK+F,SAAW/F,KAAKwC,KAAKyG,GAAcjJ,KAAKwC,KAAK,EAC7D,IAAIkH,GAAU,EACd1J,MAAKoE,YAAcpE,KAAKiB,QAAQE,uBAAuB,wBAAwB,EAC/E,KAAK,GAAInC,GAAI,EAAGA,EAAIgB,KAAK4C,IAAI3D,OAAQD,IACjC0K,GAAA,MAAiB1J,KAAK4C,IAAI5D,GAAG,GAA7B,MAEJgB,MAAKoE,YAAY4B,UAAY0D,EACxB1J,KAAKmE,WACNnE,KAAKmE,SAAW,GAEpBnE,KAAKoE,YAAYK,qBAAqB,KAAK,GAAGF,UAAUG,IAAI,uBAC5D1E,KAAKoE,YAAYP,MAAMQ,UAAY,kBACnCrE,KAAKoE,YAAYP,MAAMS,gBAAkB,kBAIjB,IAAxBtE,KAAKkE,MAAMuD,WACXzH,KAAKiB,QAAQE,uBAAuB,iBAAiB,GAAG6E,UAAYhG,KAAKkE,MAAMuD,SAAWzH,KAAK+B,aAAa/B,KAAKkE,MAAMuD,UAAY,SAInIzH,KAAKF,OAAOiB,WAAaf,KAAKW,UAC9BX,KAAKE,OAETF,KAAKF,OAAOiB,UAAW,EAEnBf,KAAKW,UACLX,KAAKG,WAnlBLX,IAAA,OAAAuF,MAAA,SA0lBH4E,GAAM,GAAAC,GAAA5J,IAIP,IAH6C,oBAAzCV,OAAOK,UAAUgC,SAASC,KAAK+H,KAC/B3J,KAAKkE,MAAMH,YAAc4F,GAEzB3J,KAAKkE,MAAM2F,OAAQ,CAYnB,GAXA7J,KAAKwG,OAAOjC,UAAUC,OAAO,gBAC7BxE,KAAKwG,OAAOjC,UAAUG,IAAI,iBAC1B1E,KAAKwG,OAAOR,UAAY,GACxB8D,WAAW,WACPF,EAAKpD,OAAOR,UAAY,qFAER4D,EAAKnJ,OAAO,SAFJ,kBAIzB,KAGCT,KAAKF,OAAOuB,MACZ,IAAK,GAAIrC,GAAI,EAAGA,EAAIY,EAAUX,OAAQD,IAC9BgB,MAAQJ,EAAUZ,IAClBY,EAAUZ,GAAGmB,OAIzBH,MAAKkE,MAAMhE,OACPF,KAAKgI,YACLE,cAAclI,KAAKgI,YAEvBhI,KAAKgI,WAAaC,YAAY,WAC1B2B,EAAKlG,UAAU,SAAUkG,EAAK1F,MAAMH,YAAc6F,EAAK1F,MAAMuD,SAAU,SACnEmC,EAAK9J,OAAOwB,SACZsI,EAAK9F,YAET8F,EAAKvD,MAAML,UAAY4D,EAAK7H,aAAa6H,EAAK1F,MAAMH,aACpD6F,EAAK/E,QAAQ,YACd,KACH7E,KAAK6E,QAAQ,YA7nBbrF,IAAA,QAAAuF,MAAA,WAooBA,GAAAgF,GAAA/J,IACCA,MAAKkE,MAAM2F,SAAU7J,KAAKyJ,QAC3BzJ,KAAKyJ,OAAQ,EACbzJ,KAAKwG,OAAOjC,UAAUC,OAAO,iBAC7BxE,KAAKwG,OAAOjC,UAAUG,IAAI,gBAC1B1E,KAAKwG,OAAOR,UAAY,GACxB8D,WAAW,WACPC,EAAKvD,OAAOR,UAAY,oFAER+D,EAAKtJ,OAAO,QAFJ,kBAIzB,KACHT,KAAKkE,MAAM/D,QACX+H,cAAclI,KAAKgI,YACnBhI,KAAK6E,QAAQ,aAlpBbrF,IAAA,SAAAuF,MAAA,SAypBDpB,GACH3D,KAAK0D,UAAU,SAAUC,EAAY,UACrC3D,KAAKkE,MAAMsE,OAAS7E,EAChB3D,KAAKkE,MAAMuE,QACXzI,KAAKkE,MAAMuE,OAAQ,GAEJ,IAAf9E,GACA3D,KAAKqI,WAAWK,UAAY,sCAC5B1I,KAAKqI,WAAWrC,UAAYhG,KAAKS,OAAO,eAGxCT,KAAKqI,WAAWK,UAAY,wCAC5B1I,KAAKqI,WAAWrC,UAAYhG,KAAKS,OAAO,mBArqBxCjB,IAAA,KAAAuF,MAAA,SA4qBLiF,EAAMC,GACe,kBAATA,IACPjK,KAAK4E,MAAMoF,GAAM1G,KAAK2G,OA9qBtBpK,IAmrBU,oBAAXqK,SAAoD,mBAAnBA,QAAOC,QAC/CD,OAAOC,QAAUtK,EAGjByH,OAAOzH,QAAUA","file":"APlayer.min.js","sourcesContent":["((instances) => {\n\n class APlayer {\n /**\n * APlayer constructor function\n *\n * @param {Object} option - See README\n * @constructor\n */\n constructor(option) {\n this.svg = {\n 'play': ['0 0 16 31', 'M15.552 15.168q0.448 0.32 0.448 0.832 0 0.448-0.448 0.768l-13.696 8.512q-0.768 0.512-1.312 0.192t-0.544-1.28v-16.448q0-0.96 0.544-1.28t1.312 0.192z'],\n 'pause': ['0 0 17 32', 'M14.080 4.8q2.88 0 2.88 2.048v18.24q0 2.112-2.88 2.112t-2.88-2.112v-18.24q0-2.048 2.88-2.048zM2.88 4.8q2.88 0 2.88 2.048v18.24q0 2.112-2.88 2.112t-2.88-2.112v-18.24q0-2.048 2.88-2.048z'],\n 'volume-up': ['0 0 28 32', 'M13.728 6.272v19.456q0 0.448-0.352 0.8t-0.8 0.32-0.8-0.32l-5.952-5.952h-4.672q-0.48 0-0.8-0.352t-0.352-0.8v-6.848q0-0.48 0.352-0.8t0.8-0.352h4.672l5.952-5.952q0.32-0.32 0.8-0.32t0.8 0.32 0.352 0.8zM20.576 16q0 1.344-0.768 2.528t-2.016 1.664q-0.16 0.096-0.448 0.096-0.448 0-0.8-0.32t-0.32-0.832q0-0.384 0.192-0.64t0.544-0.448 0.608-0.384 0.512-0.64 0.192-1.024-0.192-1.024-0.512-0.64-0.608-0.384-0.544-0.448-0.192-0.64q0-0.48 0.32-0.832t0.8-0.32q0.288 0 0.448 0.096 1.248 0.48 2.016 1.664t0.768 2.528zM25.152 16q0 2.72-1.536 5.056t-4 3.36q-0.256 0.096-0.448 0.096-0.48 0-0.832-0.352t-0.32-0.8q0-0.704 0.672-1.056 1.024-0.512 1.376-0.8 1.312-0.96 2.048-2.4t0.736-3.104-0.736-3.104-2.048-2.4q-0.352-0.288-1.376-0.8-0.672-0.352-0.672-1.056 0-0.448 0.32-0.8t0.8-0.352q0.224 0 0.48 0.096 2.496 1.056 4 3.36t1.536 5.056zM29.728 16q0 4.096-2.272 7.552t-6.048 5.056q-0.224 0.096-0.448 0.096-0.48 0-0.832-0.352t-0.32-0.8q0-0.64 0.704-1.056 0.128-0.064 0.384-0.192t0.416-0.192q0.8-0.448 1.44-0.896 2.208-1.632 3.456-4.064t1.216-5.152-1.216-5.152-3.456-4.064q-0.64-0.448-1.44-0.896-0.128-0.096-0.416-0.192t-0.384-0.192q-0.704-0.416-0.704-1.056 0-0.448 0.32-0.8t0.832-0.352q0.224 0 0.448 0.096 3.776 1.632 6.048 5.056t2.272 7.552z'],\n 'volume-down': ['0 0 28 32', 'M13.728 6.272v19.456q0 0.448-0.352 0.8t-0.8 0.32-0.8-0.32l-5.952-5.952h-4.672q-0.48 0-0.8-0.352t-0.352-0.8v-6.848q0-0.48 0.352-0.8t0.8-0.352h4.672l5.952-5.952q0.32-0.32 0.8-0.32t0.8 0.32 0.352 0.8zM20.576 16q0 1.344-0.768 2.528t-2.016 1.664q-0.16 0.096-0.448 0.096-0.448 0-0.8-0.32t-0.32-0.832q0-0.384 0.192-0.64t0.544-0.448 0.608-0.384 0.512-0.64 0.192-1.024-0.192-1.024-0.512-0.64-0.608-0.384-0.544-0.448-0.192-0.64q0-0.48 0.32-0.832t0.8-0.32q0.288 0 0.448 0.096 1.248 0.48 2.016 1.664t0.768 2.528z'],\n 'volume-off': ['0 0 28 32', 'M13.728 6.272v19.456q0 0.448-0.352 0.8t-0.8 0.32-0.8-0.32l-5.952-5.952h-4.672q-0.48 0-0.8-0.352t-0.352-0.8v-6.848q0-0.48 0.352-0.8t0.8-0.352h4.672l5.952-5.952q0.32-0.32 0.8-0.32t0.8 0.32 0.352 0.8z'],\n 'loop': ['0 0 29 32', 'M25.6 9.92q1.344 0 2.272 0.928t0.928 2.272v9.28q0 1.28-0.928 2.24t-2.272 0.96h-22.4q-1.28 0-2.24-0.96t-0.96-2.24v-9.28q0-1.344 0.96-2.272t2.24-0.928h8v-3.52l6.4 5.76-6.4 5.76v-3.52h-6.72v6.72h19.84v-6.72h-4.8v-4.48h6.080z'],\n 'menu': ['0 0 22 32', 'M20.8 14.4q0.704 0 1.152 0.48t0.448 1.12-0.48 1.12-1.12 0.48h-19.2q-0.64 0-1.12-0.48t-0.48-1.12 0.448-1.12 1.152-0.48h19.2zM1.6 11.2q-0.64 0-1.12-0.48t-0.48-1.12 0.448-1.12 1.152-0.48h19.2q0.704 0 1.152 0.48t0.448 1.12-0.48 1.12-1.12 0.48h-19.2zM20.8 20.8q0.704 0 1.152 0.48t0.448 1.12-0.48 1.12-1.12 0.48h-19.2q-0.64 0-1.12-0.48t-0.48-1.12 0.448-1.12 1.152-0.48h19.2z']\n };\n this.getSVG = (type) => {\n return `\n \n \n \n \n `;\n };\n\n this.isMobile = navigator.userAgent.match(/(iPad)|(iPhone)|(iPod)|(android)|(webOS)/i);\n // compatibility: some mobile browsers don't suppose autoplay\n if (this.isMobile) {\n option.autoplay = false;\n }\n\n // default options\n const defaultOption = {\n element: document.getElementsByClassName('aplayer')[0],\n narrow: false,\n autoplay: false,\n mutex: true,\n showlrc: 0,\n theme: '#b7daff',\n loop: true\n };\n for (let defaultKey in defaultOption) {\n if (defaultOption.hasOwnProperty(defaultKey) && !option.hasOwnProperty(defaultKey)) {\n option[defaultKey] = defaultOption[defaultKey];\n }\n }\n\n // multiple music\n this.playIndex = Object.prototype.toString.call(option.music) === '[object Array]' ? 0 : -1;\n\n this.option = option;\n this.audios = [];\n this.loop = option.loop;\n\n /**\n * Parse second to 00:00 format\n *\n * @param {Number} second\n * @return {String} 00:00 format\n */\n this.secondToTime = (second) => {\n const add0 = (num) => {\n return num < 10 ? '0' + num : '' + num;\n };\n const min = parseInt(second / 60);\n const sec = parseInt(second - min * 60);\n return add0(min) + ':' + add0(sec);\n };\n\n /**\n * Parse lrc, suppose multiple time tag\n *\n * @param {Array} arr - Format:\n * [mm:ss.xx]lyric\n * [mm:ss.xxx]lyric\n * [mm:ss.xx][mm:ss.xx][mm:ss.xx]lyric\n *\n * @return {Array} [[[time, text], [time, text], [time, text], ...], [[time, text], [time, text], [time, text], ...], ...]\n */\n this.parseLrc = (arr) => {\n let lrcs = [];\n for (let k = 0; k < arr.length; k++) {\n const lyric = arr[k].split('\\n');\n let lrc = [];\n const lyricLen = lyric.length;\n for (let i = 0; i < lyricLen; i++) {\n // match lrc time\n const lrcTimes = lyric[i].match(/\\[(\\d{2}):(\\d{2})\\.(\\d{2,3})]/g);\n // match lrc text\n const lrcText = lyric[i].replace(/\\[(\\d{2}):(\\d{2})\\.(\\d{2,3})]/g, '').replace(/^\\s+|\\s+$/g, '');\n\n if (lrcTimes != null) {\n // handle multiple time tag\n const timeLen = lrcTimes.length;\n for (let j = 0; j < timeLen; j++) {\n const oneTime = /\\[(\\d{2}):(\\d{2})\\.(\\d{2,3})]/.exec(lrcTimes[j]);\n const lrcTime = (oneTime[1]) * 60 + parseInt(oneTime[2]) + parseInt(oneTime[3]) / ((oneTime[3] + '').length === 2 ? 100 : 1000);\n lrc.push([lrcTime, lrcText]);\n }\n }\n }\n // sort by time\n lrc.sort((a, b) => a[0] - b[0]);\n lrcs.push(lrc);\n }\n return lrcs;\n };\n\n /**\n * Update progress bar, including loading progress bar and play progress bar\n *\n * @param {String} type - Point out which bar it is, should be played loaded or volume\n * @param {Number} percentage\n * @param {String} direction - Point out the direction of this bar, Should be height or width\n */\n this.updateBar = (type, percentage, direction) => {\n percentage = percentage > 0 ? percentage : 0;\n percentage = percentage < 1 ? percentage : 1;\n this[type + 'Bar'].style[direction] = percentage * 100 + '%';\n };\n\n /**\n * Update lrc\n *\n * @param {Number} currentTime\n */\n this.updateLrc = (currentTime = this.audio.currentTime) => {\n if (this.lrcIndex > this.lrc.length - 1 || currentTime < this.lrc[this.lrcIndex][0] || (!this.lrc[this.lrcIndex + 1] || currentTime >= this.lrc[this.lrcIndex + 1][0])) {\n for (let i = 0; i < this.lrc.length; i++) {\n if (currentTime >= this.lrc[i][0] && (!this.lrc[i + 1] || currentTime < this.lrc[i + 1][0])) {\n this.lrcIndex = i;\n this.lrcContents.style.transform = `translateY(${-this.lrcIndex * 20}px)`;\n this.lrcContents.style.webkitTransform = `translateY(${-this.lrcIndex * 20}px)`;\n this.lrcContents.getElementsByClassName('aplayer-lrc-current')[0].classList.remove('aplayer-lrc-current');\n this.lrcContents.getElementsByTagName('p')[i].classList.add('aplayer-lrc-current');\n }\n }\n }\n };\n\n // define APlayer events\n this.eventTypes = ['play', 'pause', 'canplay', 'playing', 'ended', 'error'];\n this.event = {};\n for (let i = 0; i < this.eventTypes.length; i++) {\n this.event[this.eventTypes[i]] = [];\n }\n this.trigger = (type) => {\n for (let i = 0; i < this.event[type].length; i++) {\n this.event[type][i]();\n }\n }\n }\n\n /**\n * AutoLink initialization function\n */\n init() {\n this.element = this.option.element;\n this.multiple = this.playIndex > -1;\n this.music = this.multiple ? this.option.music[this.playIndex] : this.option.music;\n\n let i;\n // parser lrc\n if (this.option.showlrc) {\n let lrcs = [];\n if (this.option.showlrc === 1) {\n if (this.multiple) {\n for (i = 0; i < this.option.music.length; i++) {\n lrcs.push(this.option.music[i].lrc);\n }\n }\n else {\n lrcs.push(this.option.music.lrc);\n }\n }\n else if (this.option.showlrc === 2 || this.option.showlrc === true) {\n for (i = 0; i < this.element.getElementsByClassName('aplayer-lrc-content').length; i++) {\n lrcs.push(this.element.getElementsByClassName('aplayer-lrc-content')[i].innerHTML);\n }\n }\n\n this.lrcs = this.parseLrc(lrcs);\n }\n\n // add class aplayer-withlrc\n if (this.option.showlrc) {\n this.element.classList.add('aplayer-withlrc');\n }\n\n // fill in HTML\n let eleHTML = `\n
\n
\n \n
\n
\n
\n
\n \n \n
\n
\n
\n
\n
\n
\n
\n
\n
\n \n
\n
\n
\n
\n \n - 00:00 / 00:00\n \n
\n \n
\n
\n
\n
\n
\n
\n \n ${(this.multiple ? `` : ``)}\n
\n
\n
`;\n if (this.multiple) {\n eleHTML += `\n
\n
    `;\n for (i = 0; i < this.option.music.length; i++) {\n eleHTML += `\n
  1. \n \n ${(i + 1)}\n ${this.option.music[i].title}\n ${this.option.music[i].author}\n
    2. `\n }\n eleHTML += `\n
\n
`\n }\n this.element.innerHTML = eleHTML;\n\n this.ptime = this.element.getElementsByClassName('aplayer-ptime')[0];\n\n if (this.element.getElementsByClassName('aplayer-info')[0].offsetWidth < 200) {\n this.element.getElementsByClassName('aplayer-time')[0].classList.add('aplayer-time-narrow');\n }\n // fix the width of aplayer bar\n this.element.getElementsByClassName('aplayer-bar-wrap')[0].style.marginRight = this.element.getElementsByClassName('aplayer-time')[0].offsetWidth + 5 + 'px';\n\n // switch to narrow style\n if (this.option.narrow) {\n this.element.classList.add('aplayer-narrow');\n }\n\n // play and pause button\n this.button = this.element.getElementsByClassName('aplayer-button')[0];\n this.button.addEventListener('click', (e) => {\n if (this.button.classList.contains('aplayer-play')) {\n this.play();\n }\n else if (this.button.classList.contains('aplayer-pause')) {\n this.pause();\n }\n });\n\n // click music list: change music\n if (this.multiple) {\n const listItem = this.element.getElementsByClassName('aplayer-list')[0].getElementsByTagName('li');\n for (let i = 0; i < this.option.music.length; i++) {\n listItem[i].addEventListener('click', () => {\n const musicIndex = parseInt(listItem[i].getElementsByClassName('aplayer-list-index')[0].innerHTML) - 1;\n if (musicIndex !== this.playIndex) {\n this.setMusic(musicIndex);\n }\n if (this.isMobile) {\n this.pause();\n }\n else {\n this.play();\n }\n });\n }\n }\n\n // control play progress\n this.playedBar = this.element.getElementsByClassName('aplayer-played')[0];\n this.loadedBar = this.element.getElementsByClassName('aplayer-loaded')[0];\n this.thumb = this.element.getElementsByClassName('aplayer-thumb')[0];\n this.bar = this.element.getElementsByClassName('aplayer-bar')[0];\n let barWidth;\n this.bar.addEventListener('click', (event) => {\n const e = event || window.event;\n barWidth = this.bar.clientWidth;\n const percentage = (e.clientX - getElementViewLeft(this.bar)) / barWidth;\n this.updateBar('played', percentage, 'width');\n this.element.getElementsByClassName('aplayer-ptime')[0].innerHTML = this.secondToTime(percentage * this.audio.duration);\n this.audio.currentTime = parseFloat(this.playedBar.style.width) / 100 * this.audio.duration;\n });\n\n this.thumb.addEventListener('mouseover', () => {\n this.thumb.style.background = this.option.theme;\n });\n this.thumb.addEventListener('mouseout', () => {\n this.thumb.style.background = '#fff';\n });\n\n const thumbMove = (event) => {\n const e = event || window.event;\n let percentage = (e.clientX - getElementViewLeft(this.bar)) / barWidth;\n percentage = percentage > 0 ? percentage : 0;\n percentage = percentage < 1 ? percentage : 1;\n this.updateBar('played', percentage, 'width');\n if (this.option.showlrc) {\n this.updateLrc(parseFloat(this.playedBar.style.width) / 100 * this.audio.duration);\n }\n this.element.getElementsByClassName('aplayer-ptime')[0].innerHTML = this.secondToTime(percentage * this.audio.duration);\n };\n\n const thumbUp = () => {\n document.removeEventListener('mouseup', thumbUp);\n document.removeEventListener('mousemove', thumbMove);\n this.audio.currentTime = parseFloat(this.playedBar.style.width) / 100 * this.audio.duration;\n this.playedTime = setInterval(() => {\n this.updateBar('played', this.audio.currentTime / this.audio.duration, 'width');\n if (this.option.showlrc) {\n this.updateLrc();\n }\n this.element.getElementsByClassName('aplayer-ptime')[0].innerHTML = this.secondToTime(this.audio.currentTime);\n this.trigger('playing');\n }, 100);\n };\n\n this.thumb.addEventListener('mousedown', () => {\n barWidth = this.bar.clientWidth;\n clearInterval(this.playedTime);\n document.addEventListener('mousemove', thumbMove);\n document.addEventListener('mouseup', thumbUp);\n });\n\n // control volume\n this.volumeBar = this.element.getElementsByClassName('aplayer-volume')[0];\n const volumeBarWrap = this.element.getElementsByClassName('aplayer-volume-bar')[0];\n this.volumeicon = this.element.getElementsByClassName('aplayer-time')[0].getElementsByTagName('button')[0];\n const barHeight = 35;\n this.element.getElementsByClassName('aplayer-volume-bar-wrap')[0].addEventListener('click', (event) => {\n const e = event || window.event;\n let percentage = (barHeight - e.clientY + getElementViewTop(volumeBarWrap)) / barHeight;\n percentage = percentage > 0 ? percentage : 0;\n percentage = percentage < 1 ? percentage : 1;\n this.volume(percentage);\n });\n this.volumeicon.addEventListener('click', () => {\n if (this.audio.muted) {\n this.audio.muted = false;\n this.volumeicon.className = this.audio.volume === 1 ? 'aplayer-icon aplayer-icon-volume-up' : 'aplayer-icon aplayer-icon-volume-down';\n if (this.audio.volume === 1) {\n this.volumeicon.className = 'aplayer-icon aplayer-icon-volume-up';\n this.volumeicon.innerHTML = this.getSVG('volume-up');\n }\n else {\n this.volumeicon.className = 'aplayer-icon aplayer-icon-volume-down';\n this.volumeicon.innerHTML = this.getSVG('volume-down');\n }\n this.updateBar('volume', this.audio.volume, 'height');\n }\n else {\n this.audio.muted = true;\n this.volumeicon.className = 'aplayer-icon aplayer-icon-volume-off';\n this.volumeicon.innerHTML = this.getSVG('volume-off');\n this.updateBar('volume', 0, 'height');\n }\n });\n\n // get element's view position\n function getElementViewLeft(element) {\n let actualLeft = element.offsetLeft;\n let current = element.offsetParent;\n let elementScrollLeft;\n while (current !== null) {\n actualLeft += current.offsetLeft;\n current = current.offsetParent;\n }\n elementScrollLeft = document.body.scrollLeft + document.documentElement.scrollLeft;\n return actualLeft - elementScrollLeft;\n }\n\n function getElementViewTop(element) {\n let actualTop = element.offsetTop;\n let current = element.offsetParent;\n let elementScrollTop;\n while (current !== null) {\n actualTop += current.offsetTop;\n current = current.offsetParent;\n }\n elementScrollTop = document.body.scrollTop + document.documentElement.scrollTop;\n return actualTop - elementScrollTop;\n }\n\n // loop control\n const loopEle = this.element.getElementsByClassName('aplayer-icon-loop')[0];\n loopEle.addEventListener('click', () => {\n if (this.loop) {\n loopEle.classList.add('aplayer-noloop');\n this.loop = false;\n this.audio.loop = this.multiple ? false : this.loop;\n }\n else {\n loopEle.classList.remove('aplayer-noloop');\n this.loop = true;\n this.audio.loop = this.multiple ? false : this.loop;\n }\n });\n\n // toggle menu control\n if (this.multiple) {\n const list = this.element.getElementsByClassName('aplayer-list')[0];\n list.style.height = list.offsetHeight + 'px';\n this.element.getElementsByClassName('aplayer-icon-menu')[0].addEventListener('click', () => {\n if (!list.classList.contains('aplayer-list-hide')) {\n list.classList.add('aplayer-list-hide');\n }\n else {\n list.classList.remove('aplayer-list-hide');\n }\n });\n }\n\n this.setMusic(0);\n\n instances.push(this);\n }\n\n /**\n * Set music\n */\n setMusic(index) {\n // get this.music\n if (this.multiple && typeof(index) !== 'undefined') {\n this.playIndex = index;\n }\n const indexMusic = this.playIndex;\n this.music = this.multiple ? this.option.music[indexMusic] : this.option.music;\n\n // set html\n if (this.music.pic) {\n this.element.getElementsByClassName('aplayer-pic')[0].style.backgroundImage = `url('${this.music.pic}')`;\n }\n this.element.getElementsByClassName('aplayer-title')[0].innerHTML = this.music.title;\n this.element.getElementsByClassName('aplayer-author')[0].innerHTML = ` - ${this.music.author}`;\n if (this.multiple) {\n if (this.element.getElementsByClassName('aplayer-list-light')[0]) {\n this.element.getElementsByClassName('aplayer-list-light')[0].classList.remove('aplayer-list-light');\n }\n this.element.getElementsByClassName('aplayer-list')[0].getElementsByTagName('li')[indexMusic].classList.add('aplayer-list-light');\n }\n\n // set the previous audio object\n if (this.audio) {\n this.pause();\n this.audio.currentTime = 0;\n }\n\n // get this audio object\n if ((this.multiple && !this.audios[indexMusic]) || this.playIndex === -1) {\n this.audio = document.createElement(\"audio\");\n this.audio.src = this.music.url;\n if (this.option.preload) {\n this.audio.preload = this.option.preload;\n }\n else {\n this.audio.preload = this.isMobile ? 'none' : 'metadata';\n }\n\n // show audio time: the metadata has loaded or changed\n this.audio.addEventListener('durationchange', () => {\n if (this.audio.duration !== 1) { // compatibility: Android browsers will output 1 at first\n this.element.getElementsByClassName('aplayer-dtime')[0].innerHTML = this.secondToTime(this.audio.duration);\n }\n });\n\n // show audio loaded bar: to inform interested parties of progress downloading the media\n this.audio.addEventListener('progress', () => {\n const percentage = this.audio.buffered.length ? this.audio.buffered.end(this.audio.buffered.length - 1) / this.audio.duration : 0;\n this.updateBar('loaded', percentage, 'width');\n });\n\n // audio download error: an error occurs\n this.audio.addEventListener('error', () => {\n this.element.getElementsByClassName('aplayer-author')[0].innerHTML = ` - Error happens ╥﹏╥`;\n this.trigger('pause');\n });\n\n // audio can play: enough data is available that the media can be played\n this.audio.addEventListener('canplay', () => {\n this.trigger('canplay');\n });\n\n // multiple music play\n this.ended = false;\n if (this.multiple) {\n this.audio.addEventListener('ended', () => {\n if (this.isMobile) {\n this.ended = true;\n this.pause();\n return;\n }\n if (this.audio.currentTime !== 0) {\n if (this.playIndex < this.option.music.length - 1) {\n this.setMusic(++this.playIndex);\n }\n else if (this.loop) {\n this.setMusic(0);\n }\n else if (!this.loop) {\n this.ended = true;\n this.pause();\n this.trigger('ended');\n }\n }\n });\n }\n else {\n this.audio.addEventListener('ended', () => {\n if (!this.loop) {\n this.ended = true;\n this.pause();\n this.trigger('ended');\n }\n });\n }\n\n // control volume\n this.audio.volume = parseInt(this.element.getElementsByClassName('aplayer-volume')[0].style.height) / 100;\n\n // loop\n this.audio.loop = this.multiple ? false : this.loop;\n\n if (this.multiple) {\n this.audios[indexMusic] = this.audio;\n }\n }\n else {\n this.audio = this.audios[indexMusic];\n this.audio.volume = parseInt(this.element.getElementsByClassName('aplayer-volume')[0].style.height) / 100;\n this.audio.currentTime = 0;\n }\n\n // fill in lrc\n if (this.option.showlrc) {\n this.lrc = this.multiple ? this.lrcs[indexMusic] : this.lrcs[0];\n let lrcHTML = '';\n this.lrcContents = this.element.getElementsByClassName('aplayer-lrc-contents')[0];\n for (let i = 0; i < this.lrc.length; i++) {\n lrcHTML += `

${this.lrc[i][1]}

`;\n }\n this.lrcContents.innerHTML = lrcHTML;\n if (!this.lrcIndex) {\n this.lrcIndex = 0;\n }\n this.lrcContents.getElementsByTagName('p')[0].classList.add('aplayer-lrc-current');\n this.lrcContents.style.transform = 'translateY(0px)';\n this.lrcContents.style.webkitTransform = 'translateY(0px)';\n }\n\n // set duration time\n if (this.audio.duration !== 1) { // compatibility: Android browsers will output 1 at first\n this.element.getElementsByClassName('aplayer-dtime')[0].innerHTML = this.audio.duration ? this.secondToTime(this.audio.duration) : '00:00';\n }\n\n // autoplay\n if (this.option.autoplay && !this.isMobile) {\n this.play();\n }\n this.option.autoplay = true; // autoplay next music\n\n if (this.isMobile) {\n this.pause();\n }\n }\n\n /**\n * Play music\n */\n play(time) {\n if (Object.prototype.toString.call(time) === '[object Number]') {\n this.audio.currentTime = time;\n }\n if (this.audio.paused) {\n this.button.classList.remove('aplayer-play');\n this.button.classList.add('aplayer-pause');\n this.button.innerHTML = '';\n setTimeout(() => {\n this.button.innerHTML = `\n `;\n }, 100);\n\n // pause other players (Thanks @Aprikyblue)\n if (this.option.mutex) {\n for (let i = 0; i < instances.length; i++) {\n if (this != instances[i]) {\n instances[i].pause();\n }\n }\n }\n this.audio.play();\n if (this.playedTime) {\n clearInterval(this.playedTime);\n }\n this.playedTime = setInterval(() => {\n this.updateBar('played', this.audio.currentTime / this.audio.duration, 'width');\n if (this.option.showlrc) {\n this.updateLrc();\n }\n this.ptime.innerHTML = this.secondToTime(this.audio.currentTime);\n this.trigger('playing');\n }, 100);\n this.trigger('play');\n }\n }\n\n /**\n * Pause music\n */\n pause() {\n if (!this.audio.paused || this.ended) {\n this.ended = false;\n this.button.classList.remove('aplayer-pause');\n this.button.classList.add('aplayer-play');\n this.button.innerHTML = '';\n setTimeout(() => {\n this.button.innerHTML = `\n `;\n }, 100);\n this.audio.pause();\n clearInterval(this.playedTime);\n this.trigger('pause');\n }\n }\n\n /**\n * Set volume\n */\n volume(percentage) {\n this.updateBar('volume', percentage, 'height');\n this.audio.volume = percentage;\n if (this.audio.muted) {\n this.audio.muted = false;\n }\n if (percentage === 1) {\n this.volumeicon.className = 'aplayer-icon aplayer-icon-volume-up';\n this.volumeicon.innerHTML = this.getSVG('volume-up');\n }\n else {\n this.volumeicon.className = 'aplayer-icon aplayer-icon-volume-down';\n this.volumeicon.innerHTML = this.getSVG('volume-down');\n }\n }\n\n /**\n * attach event\n */\n on(name, func) {\n if (typeof func === 'function') {\n this.event[name].push(func);\n }\n }\n }\n\n if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {\n module.exports = APlayer;\n }\n else {\n window.APlayer = APlayer;\n }\n})([]);"],"sourceRoot":"/source/"} \ No newline at end of file +{"version":3,"sources":["APlayer.js"],"names":["_classCallCheck","instance","Constructor","TypeError","_createClass","defineProperties","target","props","i","length","descriptor","enumerable","configurable","writable","Object","defineProperty","key","protoProps","staticProps","prototype","instances","APlayer","option","_this","this","svg","play","pause","volume-up","volume-down","volume-off","loop","menu","getSVG","type","isMobile","test","window","navigator","userAgent","autoplay","defaultOption","element","document","getElementsByClassName","narrow","mutex","showlrc","theme","defaultKey","hasOwnProperty","playIndex","toString","call","music","audios","secondToTime","second","add0","num","min","parseInt","sec","parseLrc","arr","lrcs","k","lyric","split","lrc","lyricLen","lrcTimes","match","lrcText","replace","timeLen","j","oneTime","exec","lrcTime","push","sort","a","b","updateBar","percentage","direction","style","updateLrc","currentTime","arguments","undefined","audio","lrcIndex","lrcContents","transform","webkitTransform","classList","remove","getElementsByTagName","add","eventTypes","event","trigger","_i","value","getElementViewLeft","actualLeft","offsetLeft","current","offsetParent","elementScrollLeft","body","scrollLeft","documentElement","getElementViewTop","actualTop","offsetTop","elementScrollTop","scrollTop","_this2","multiple","innerHTML","eleHTML","pic","title","author","offsetWidth","display","ptime","bar","marginRight","button","addEventListener","e","contains","listItem","_loop","_i2","musicIndex","setMusic","toggle","playedBar","loadedBar","thumb","barWidth","clientWidth","clientX","duration","parseFloat","width","background","thumbMove","thumbUp","removeEventListener","playedTime","setInterval","clearInterval","volumeBar","volumeBarWrap","volumeicon","barHeight","clientY","volume","muted","className","loopEle","list","height","offsetHeight","index","_this3","indexMusic","backgroundImage","createElement","src","url","preload","buffered","end","ended","lrcHTML","time","_this4","paused","setTimeout","_this5","name","func","module","exports"],"mappings":"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","file":"APlayer.min.js","sourcesContent":["((instances) => {\n\n class APlayer {\n /**\n * APlayer constructor function\n *\n * @param {Object} option - See README\n * @constructor\n */\n constructor(option) {\n this.svg = {\n 'play': ['0 0 16 31', 'M15.552 15.168q0.448 0.32 0.448 0.832 0 0.448-0.448 0.768l-13.696 8.512q-0.768 0.512-1.312 0.192t-0.544-1.28v-16.448q0-0.96 0.544-1.28t1.312 0.192z'],\n 'pause': ['0 0 17 32', 'M14.080 4.8q2.88 0 2.88 2.048v18.24q0 2.112-2.88 2.112t-2.88-2.112v-18.24q0-2.048 2.88-2.048zM2.88 4.8q2.88 0 2.88 2.048v18.24q0 2.112-2.88 2.112t-2.88-2.112v-18.24q0-2.048 2.88-2.048z'],\n 'volume-up': ['0 0 28 32', 'M13.728 6.272v19.456q0 0.448-0.352 0.8t-0.8 0.32-0.8-0.32l-5.952-5.952h-4.672q-0.48 0-0.8-0.352t-0.352-0.8v-6.848q0-0.48 0.352-0.8t0.8-0.352h4.672l5.952-5.952q0.32-0.32 0.8-0.32t0.8 0.32 0.352 0.8zM20.576 16q0 1.344-0.768 2.528t-2.016 1.664q-0.16 0.096-0.448 0.096-0.448 0-0.8-0.32t-0.32-0.832q0-0.384 0.192-0.64t0.544-0.448 0.608-0.384 0.512-0.64 0.192-1.024-0.192-1.024-0.512-0.64-0.608-0.384-0.544-0.448-0.192-0.64q0-0.48 0.32-0.832t0.8-0.32q0.288 0 0.448 0.096 1.248 0.48 2.016 1.664t0.768 2.528zM25.152 16q0 2.72-1.536 5.056t-4 3.36q-0.256 0.096-0.448 0.096-0.48 0-0.832-0.352t-0.32-0.8q0-0.704 0.672-1.056 1.024-0.512 1.376-0.8 1.312-0.96 2.048-2.4t0.736-3.104-0.736-3.104-2.048-2.4q-0.352-0.288-1.376-0.8-0.672-0.352-0.672-1.056 0-0.448 0.32-0.8t0.8-0.352q0.224 0 0.48 0.096 2.496 1.056 4 3.36t1.536 5.056zM29.728 16q0 4.096-2.272 7.552t-6.048 5.056q-0.224 0.096-0.448 0.096-0.48 0-0.832-0.352t-0.32-0.8q0-0.64 0.704-1.056 0.128-0.064 0.384-0.192t0.416-0.192q0.8-0.448 1.44-0.896 2.208-1.632 3.456-4.064t1.216-5.152-1.216-5.152-3.456-4.064q-0.64-0.448-1.44-0.896-0.128-0.096-0.416-0.192t-0.384-0.192q-0.704-0.416-0.704-1.056 0-0.448 0.32-0.8t0.832-0.352q0.224 0 0.448 0.096 3.776 1.632 6.048 5.056t2.272 7.552z'],\n 'volume-down': ['0 0 28 32', 'M13.728 6.272v19.456q0 0.448-0.352 0.8t-0.8 0.32-0.8-0.32l-5.952-5.952h-4.672q-0.48 0-0.8-0.352t-0.352-0.8v-6.848q0-0.48 0.352-0.8t0.8-0.352h4.672l5.952-5.952q0.32-0.32 0.8-0.32t0.8 0.32 0.352 0.8zM20.576 16q0 1.344-0.768 2.528t-2.016 1.664q-0.16 0.096-0.448 0.096-0.448 0-0.8-0.32t-0.32-0.832q0-0.384 0.192-0.64t0.544-0.448 0.608-0.384 0.512-0.64 0.192-1.024-0.192-1.024-0.512-0.64-0.608-0.384-0.544-0.448-0.192-0.64q0-0.48 0.32-0.832t0.8-0.32q0.288 0 0.448 0.096 1.248 0.48 2.016 1.664t0.768 2.528z'],\n 'volume-off': ['0 0 28 32', 'M13.728 6.272v19.456q0 0.448-0.352 0.8t-0.8 0.32-0.8-0.32l-5.952-5.952h-4.672q-0.48 0-0.8-0.352t-0.352-0.8v-6.848q0-0.48 0.352-0.8t0.8-0.352h4.672l5.952-5.952q0.32-0.32 0.8-0.32t0.8 0.32 0.352 0.8z'],\n 'loop': ['0 0 29 32', 'M25.6 9.92q1.344 0 2.272 0.928t0.928 2.272v9.28q0 1.28-0.928 2.24t-2.272 0.96h-22.4q-1.28 0-2.24-0.96t-0.96-2.24v-9.28q0-1.344 0.96-2.272t2.24-0.928h8v-3.52l6.4 5.76-6.4 5.76v-3.52h-6.72v6.72h19.84v-6.72h-4.8v-4.48h6.080z'],\n 'menu': ['0 0 22 32', 'M20.8 14.4q0.704 0 1.152 0.48t0.448 1.12-0.48 1.12-1.12 0.48h-19.2q-0.64 0-1.12-0.48t-0.48-1.12 0.448-1.12 1.152-0.48h19.2zM1.6 11.2q-0.64 0-1.12-0.48t-0.48-1.12 0.448-1.12 1.152-0.48h19.2q0.704 0 1.152 0.48t0.448 1.12-0.48 1.12-1.12 0.48h-19.2zM20.8 20.8q0.704 0 1.152 0.48t0.448 1.12-0.48 1.12-1.12 0.48h-19.2q-0.64 0-1.12-0.48t-0.48-1.12 0.448-1.12 1.152-0.48h19.2z']\n };\n this.getSVG = (type) => {\n return `\n \n \n \n \n `;\n };\n\n this.isMobile = /mobile/i.test(window.navigator.userAgent);\n // compatibility: some mobile browsers don't suppose autoplay\n if (this.isMobile) {\n option.autoplay = false;\n }\n\n // default options\n const defaultOption = {\n element: document.getElementsByClassName('aplayer')[0],\n narrow: false,\n autoplay: false,\n mutex: true,\n showlrc: 0,\n theme: '#b7daff',\n loop: true\n };\n for (let defaultKey in defaultOption) {\n if (defaultOption.hasOwnProperty(defaultKey) && !option.hasOwnProperty(defaultKey)) {\n option[defaultKey] = defaultOption[defaultKey];\n }\n }\n\n // multiple music\n this.playIndex = Object.prototype.toString.call(option.music) === '[object Array]' ? 0 : -1;\n\n this.option = option;\n this.audios = [];\n this.loop = option.loop;\n\n /**\n * Parse second to 00:00 format\n *\n * @param {Number} second\n * @return {String} 00:00 format\n */\n this.secondToTime = (second) => {\n const add0 = (num) => {\n return num < 10 ? '0' + num : '' + num;\n };\n const min = parseInt(second / 60);\n const sec = parseInt(second - min * 60);\n return add0(min) + ':' + add0(sec);\n };\n\n /**\n * Parse lrc, suppose multiple time tag\n *\n * @param {Array} arr - Format:\n * [mm:ss.xx]lyric\n * [mm:ss.xxx]lyric\n * [mm:ss.xx][mm:ss.xx][mm:ss.xx]lyric\n *\n * @return {Array} [[[time, text], [time, text], [time, text], ...], [[time, text], [time, text], [time, text], ...], ...]\n */\n this.parseLrc = (arr) => {\n let lrcs = [];\n for (let k = 0; k < arr.length; k++) {\n const lyric = arr[k].split('\\n');\n let lrc = [];\n const lyricLen = lyric.length;\n for (let i = 0; i < lyricLen; i++) {\n // match lrc time\n const lrcTimes = lyric[i].match(/\\[(\\d{2}):(\\d{2})\\.(\\d{2,3})]/g);\n // match lrc text\n const lrcText = lyric[i].replace(/\\[(\\d{2}):(\\d{2})\\.(\\d{2,3})]/g, '').replace(/^\\s+|\\s+$/g, '');\n\n if (lrcTimes != null) {\n // handle multiple time tag\n const timeLen = lrcTimes.length;\n for (let j = 0; j < timeLen; j++) {\n const oneTime = /\\[(\\d{2}):(\\d{2})\\.(\\d{2,3})]/.exec(lrcTimes[j]);\n const lrcTime = (oneTime[1]) * 60 + parseInt(oneTime[2]) + parseInt(oneTime[3]) / ((oneTime[3] + '').length === 2 ? 100 : 1000);\n lrc.push([lrcTime, lrcText]);\n }\n }\n }\n // sort by time\n lrc.sort((a, b) => a[0] - b[0]);\n lrcs.push(lrc);\n }\n return lrcs;\n };\n\n /**\n * Update progress bar, including loading progress bar and play progress bar\n *\n * @param {String} type - Point out which bar it is, should be played loaded or volume\n * @param {Number} percentage\n * @param {String} direction - Point out the direction of this bar, Should be height or width\n */\n this.updateBar = (type, percentage, direction) => {\n percentage = percentage > 0 ? percentage : 0;\n percentage = percentage < 1 ? percentage : 1;\n this[type + 'Bar'].style[direction] = percentage * 100 + '%';\n };\n\n /**\n * Update lrc\n *\n * @param {Number} currentTime\n */\n this.updateLrc = (currentTime = this.audio.currentTime) => {\n if (this.lrcIndex > this.lrc.length - 1 || currentTime < this.lrc[this.lrcIndex][0] || (!this.lrc[this.lrcIndex + 1] || currentTime >= this.lrc[this.lrcIndex + 1][0])) {\n for (let i = 0; i < this.lrc.length; i++) {\n if (currentTime >= this.lrc[i][0] && (!this.lrc[i + 1] || currentTime < this.lrc[i + 1][0])) {\n this.lrcIndex = i;\n this.lrcContents.style.transform = `translateY(${-this.lrcIndex * 20}px)`;\n this.lrcContents.style.webkitTransform = `translateY(${-this.lrcIndex * 20}px)`;\n this.lrcContents.getElementsByClassName('aplayer-lrc-current')[0].classList.remove('aplayer-lrc-current');\n this.lrcContents.getElementsByTagName('p')[i].classList.add('aplayer-lrc-current');\n }\n }\n }\n };\n\n // define APlayer events\n this.eventTypes = ['play', 'pause', 'canplay', 'playing', 'ended', 'error'];\n this.event = {};\n for (let i = 0; i < this.eventTypes.length; i++) {\n this.event[this.eventTypes[i]] = [];\n }\n this.trigger = (type) => {\n for (let i = 0; i < this.event[type].length; i++) {\n this.event[type][i]();\n }\n }\n }\n\n /**\n * AutoLink initialization function\n */\n init() {\n this.element = this.option.element;\n this.multiple = this.playIndex > -1;\n this.music = this.multiple ? this.option.music[this.playIndex] : this.option.music;\n\n let i;\n // parser lrc\n if (this.option.showlrc) {\n let lrcs = [];\n if (this.option.showlrc === 1) {\n if (this.multiple) {\n for (i = 0; i < this.option.music.length; i++) {\n lrcs.push(this.option.music[i].lrc);\n }\n }\n else {\n lrcs.push(this.option.music.lrc);\n }\n }\n else if (this.option.showlrc === 2 || this.option.showlrc === true) {\n for (i = 0; i < this.element.getElementsByClassName('aplayer-lrc-content').length; i++) {\n lrcs.push(this.element.getElementsByClassName('aplayer-lrc-content')[i].innerHTML);\n }\n }\n\n this.lrcs = this.parseLrc(lrcs);\n }\n\n // add class aplayer-withlrc\n if (this.option.showlrc) {\n this.element.classList.add('aplayer-withlrc');\n }\n\n // fill in HTML\n let eleHTML = `\n
\n
\n \n
\n
\n
\n
\n \n \n
\n
\n
\n
\n
\n
\n
\n
\n
\n \n
\n
\n
\n
\n \n - 00:00 / 00:00\n \n
\n \n
\n
\n
\n
\n
\n
\n \n ${(this.multiple ? `` : ``)}\n
\n
\n
`;\n if (this.multiple) {\n eleHTML += `\n
\n
    `;\n for (i = 0; i < this.option.music.length; i++) {\n eleHTML += `\n
  1. \n \n ${(i + 1)}\n ${this.option.music[i].title}\n ${this.option.music[i].author}\n
    2. `\n }\n eleHTML += `\n
\n
`\n }\n this.element.innerHTML = eleHTML;\n\n // hide loop button in arrow container\n if (this.element.offsetWidth < 300) {\n this.element.getElementsByClassName('aplayer-icon-loop')[0].style.display = 'none';\n }\n\n this.ptime = this.element.getElementsByClassName('aplayer-ptime')[0];\n\n if (this.element.getElementsByClassName('aplayer-info')[0].offsetWidth < 200) {\n this.element.getElementsByClassName('aplayer-time')[0].classList.add('aplayer-time-narrow');\n }\n // fix the width of aplayer bar\n this.bar = this.element.getElementsByClassName('aplayer-bar-wrap')[0];\n this.bar.style.marginRight = this.element.getElementsByClassName('aplayer-time')[0].offsetWidth + 5 + 'px';\n\n // switch to narrow style\n if (this.option.narrow) {\n this.element.classList.add('aplayer-narrow');\n }\n\n // play and pause button\n this.button = this.element.getElementsByClassName('aplayer-button')[0];\n this.button.addEventListener('click', (e) => {\n if (this.button.classList.contains('aplayer-play')) {\n this.play();\n }\n else if (this.button.classList.contains('aplayer-pause')) {\n this.pause();\n }\n });\n\n // click music list: change music\n if (this.multiple) {\n const listItem = this.element.getElementsByClassName('aplayer-list')[0].getElementsByTagName('li');\n for (let i = 0; i < this.option.music.length; i++) {\n listItem[i].addEventListener('click', () => {\n const musicIndex = parseInt(listItem[i].getElementsByClassName('aplayer-list-index')[0].innerHTML) - 1;\n if (musicIndex !== this.playIndex) {\n this.setMusic(musicIndex);\n if (this.isMobile) {\n this.pause();\n }\n else {\n this.play();\n }\n }\n else {\n this.toggle();\n }\n });\n }\n }\n\n // control play progress\n this.playedBar = this.element.getElementsByClassName('aplayer-played')[0];\n this.loadedBar = this.element.getElementsByClassName('aplayer-loaded')[0];\n this.thumb = this.element.getElementsByClassName('aplayer-thumb')[0];\n let barWidth;\n this.bar.addEventListener('click', (event) => {\n const e = event || window.event;\n barWidth = this.bar.clientWidth;\n const percentage = (e.clientX - getElementViewLeft(this.bar)) / barWidth;\n this.updateBar('played', percentage, 'width');\n this.element.getElementsByClassName('aplayer-ptime')[0].innerHTML = this.secondToTime(percentage * this.audio.duration);\n this.audio.currentTime = parseFloat(this.playedBar.style.width) / 100 * this.audio.duration;\n });\n\n this.thumb.addEventListener('mouseover', () => {\n this.thumb.style.background = this.option.theme;\n });\n this.thumb.addEventListener('mouseout', () => {\n this.thumb.style.background = '#fff';\n });\n\n const thumbMove = (event) => {\n const e = event || window.event;\n let percentage = (e.clientX - getElementViewLeft(this.bar)) / barWidth;\n percentage = percentage > 0 ? percentage : 0;\n percentage = percentage < 1 ? percentage : 1;\n this.updateBar('played', percentage, 'width');\n if (this.option.showlrc) {\n this.updateLrc(parseFloat(this.playedBar.style.width) / 100 * this.audio.duration);\n }\n this.element.getElementsByClassName('aplayer-ptime')[0].innerHTML = this.secondToTime(percentage * this.audio.duration);\n };\n\n const thumbUp = () => {\n document.removeEventListener('mouseup', thumbUp);\n document.removeEventListener('mousemove', thumbMove);\n this.audio.currentTime = parseFloat(this.playedBar.style.width) / 100 * this.audio.duration;\n this.playedTime = setInterval(() => {\n this.updateBar('played', this.audio.currentTime / this.audio.duration, 'width');\n if (this.option.showlrc) {\n this.updateLrc();\n }\n this.element.getElementsByClassName('aplayer-ptime')[0].innerHTML = this.secondToTime(this.audio.currentTime);\n this.trigger('playing');\n }, 100);\n };\n\n this.thumb.addEventListener('mousedown', () => {\n barWidth = this.bar.clientWidth;\n clearInterval(this.playedTime);\n document.addEventListener('mousemove', thumbMove);\n document.addEventListener('mouseup', thumbUp);\n });\n\n // control volume\n this.volumeBar = this.element.getElementsByClassName('aplayer-volume')[0];\n const volumeBarWrap = this.element.getElementsByClassName('aplayer-volume-bar')[0];\n this.volumeicon = this.element.getElementsByClassName('aplayer-time')[0].getElementsByTagName('button')[0];\n const barHeight = 35;\n this.element.getElementsByClassName('aplayer-volume-bar-wrap')[0].addEventListener('click', (event) => {\n const e = event || window.event;\n let percentage = (barHeight - e.clientY + getElementViewTop(volumeBarWrap)) / barHeight;\n percentage = percentage > 0 ? percentage : 0;\n percentage = percentage < 1 ? percentage : 1;\n this.volume(percentage);\n });\n this.volumeicon.addEventListener('click', () => {\n if (this.audio.muted) {\n this.audio.muted = false;\n this.volumeicon.className = this.audio.volume === 1 ? 'aplayer-icon aplayer-icon-volume-up' : 'aplayer-icon aplayer-icon-volume-down';\n if (this.audio.volume === 1) {\n this.volumeicon.className = 'aplayer-icon aplayer-icon-volume-up';\n this.volumeicon.innerHTML = this.getSVG('volume-up');\n }\n else {\n this.volumeicon.className = 'aplayer-icon aplayer-icon-volume-down';\n this.volumeicon.innerHTML = this.getSVG('volume-down');\n }\n this.updateBar('volume', this.audio.volume, 'height');\n }\n else {\n this.audio.muted = true;\n this.volumeicon.className = 'aplayer-icon aplayer-icon-volume-off';\n this.volumeicon.innerHTML = this.getSVG('volume-off');\n this.updateBar('volume', 0, 'height');\n }\n });\n\n // get element's view position\n function getElementViewLeft(element) {\n let actualLeft = element.offsetLeft;\n let current = element.offsetParent;\n let elementScrollLeft;\n while (current !== null) {\n actualLeft += current.offsetLeft;\n current = current.offsetParent;\n }\n elementScrollLeft = document.body.scrollLeft + document.documentElement.scrollLeft;\n return actualLeft - elementScrollLeft;\n }\n\n function getElementViewTop(element) {\n let actualTop = element.offsetTop;\n let current = element.offsetParent;\n let elementScrollTop;\n while (current !== null) {\n actualTop += current.offsetTop;\n current = current.offsetParent;\n }\n elementScrollTop = document.body.scrollTop + document.documentElement.scrollTop;\n return actualTop - elementScrollTop;\n }\n\n // loop control\n const loopEle = this.element.getElementsByClassName('aplayer-icon-loop')[0];\n loopEle.addEventListener('click', () => {\n if (this.loop) {\n loopEle.classList.add('aplayer-noloop');\n this.loop = false;\n this.audio.loop = this.multiple ? false : this.loop;\n }\n else {\n loopEle.classList.remove('aplayer-noloop');\n this.loop = true;\n this.audio.loop = this.multiple ? false : this.loop;\n }\n });\n\n // toggle menu control\n if (this.multiple) {\n const list = this.element.getElementsByClassName('aplayer-list')[0];\n list.style.height = list.offsetHeight + 'px';\n this.element.getElementsByClassName('aplayer-icon-menu')[0].addEventListener('click', () => {\n if (!list.classList.contains('aplayer-list-hide')) {\n list.classList.add('aplayer-list-hide');\n }\n else {\n list.classList.remove('aplayer-list-hide');\n }\n });\n }\n\n this.setMusic(0);\n\n instances.push(this);\n }\n\n /**\n * Set music\n */\n setMusic(index) {\n // get this.music\n if (this.multiple && typeof(index) !== 'undefined') {\n this.playIndex = index;\n }\n const indexMusic = this.playIndex;\n this.music = this.multiple ? this.option.music[indexMusic] : this.option.music;\n\n // set html\n if (this.music.pic) {\n this.element.getElementsByClassName('aplayer-pic')[0].style.backgroundImage = `url('${this.music.pic}')`;\n }\n this.element.getElementsByClassName('aplayer-title')[0].innerHTML = this.music.title;\n this.element.getElementsByClassName('aplayer-author')[0].innerHTML = ` - ${this.music.author}`;\n if (this.multiple) {\n if (this.element.getElementsByClassName('aplayer-list-light')[0]) {\n this.element.getElementsByClassName('aplayer-list-light')[0].classList.remove('aplayer-list-light');\n }\n this.element.getElementsByClassName('aplayer-list')[0].getElementsByTagName('li')[indexMusic].classList.add('aplayer-list-light');\n }\n\n // set the previous audio object\n if (this.audio) {\n this.pause();\n this.audio.currentTime = 0;\n }\n\n // get this audio object\n if ((this.multiple && !this.audios[indexMusic]) || this.playIndex === -1) {\n this.audio = document.createElement(\"audio\");\n this.audio.src = this.music.url;\n if (this.option.preload) {\n this.audio.preload = this.option.preload;\n }\n else {\n this.audio.preload = this.isMobile ? 'none' : 'metadata';\n }\n\n // show audio time: the metadata has loaded or changed\n this.audio.addEventListener('durationchange', () => {\n if (this.audio.duration !== 1) { // compatibility: Android browsers will output 1 at first\n this.element.getElementsByClassName('aplayer-dtime')[0].innerHTML = this.secondToTime(this.audio.duration);\n }\n });\n\n // show audio loaded bar: to inform interested parties of progress downloading the media\n this.audio.addEventListener('progress', () => {\n const percentage = this.audio.buffered.length ? this.audio.buffered.end(this.audio.buffered.length - 1) / this.audio.duration : 0;\n this.updateBar('loaded', percentage, 'width');\n });\n\n // audio download error: an error occurs\n this.audio.addEventListener('error', () => {\n this.element.getElementsByClassName('aplayer-author')[0].innerHTML = ` - Error happens ╥﹏╥`;\n this.trigger('pause');\n });\n\n // audio can play: enough data is available that the media can be played\n this.audio.addEventListener('canplay', () => {\n this.trigger('canplay');\n });\n\n // multiple music play\n this.ended = false;\n if (this.multiple) {\n this.audio.addEventListener('ended', () => {\n if (this.isMobile) {\n this.ended = true;\n this.pause();\n return;\n }\n if (this.audio.currentTime !== 0) {\n if (this.playIndex < this.option.music.length - 1) {\n this.setMusic(++this.playIndex);\n }\n else if (this.loop) {\n this.setMusic(0);\n }\n else if (!this.loop) {\n this.ended = true;\n this.pause();\n this.trigger('ended');\n }\n }\n });\n }\n else {\n this.audio.addEventListener('ended', () => {\n if (!this.loop) {\n this.ended = true;\n this.pause();\n this.trigger('ended');\n }\n });\n }\n\n // control volume\n this.audio.volume = parseInt(this.element.getElementsByClassName('aplayer-volume')[0].style.height) / 100;\n\n // loop\n this.audio.loop = this.multiple ? false : this.loop;\n\n if (this.multiple) {\n this.audios[indexMusic] = this.audio;\n }\n }\n else {\n this.audio = this.audios[indexMusic];\n this.audio.volume = parseInt(this.element.getElementsByClassName('aplayer-volume')[0].style.height) / 100;\n this.audio.currentTime = 0;\n }\n\n // fill in lrc\n if (this.option.showlrc) {\n this.lrc = this.multiple ? this.lrcs[indexMusic] : this.lrcs[0];\n let lrcHTML = '';\n this.lrcContents = this.element.getElementsByClassName('aplayer-lrc-contents')[0];\n for (let i = 0; i < this.lrc.length; i++) {\n lrcHTML += `

${this.lrc[i][1]}

`;\n }\n this.lrcContents.innerHTML = lrcHTML;\n if (!this.lrcIndex) {\n this.lrcIndex = 0;\n }\n this.lrcContents.getElementsByTagName('p')[0].classList.add('aplayer-lrc-current');\n this.lrcContents.style.transform = 'translateY(0px)';\n this.lrcContents.style.webkitTransform = 'translateY(0px)';\n }\n\n // set duration time\n if (this.audio.duration !== 1) { // compatibility: Android browsers will output 1 at first\n this.element.getElementsByClassName('aplayer-dtime')[0].innerHTML = this.audio.duration ? this.secondToTime(this.audio.duration) : '00:00';\n }\n\n // autoplay\n if (this.option.autoplay && !this.isMobile) {\n this.play();\n }\n this.option.autoplay = true; // autoplay next music\n\n if (this.isMobile) {\n this.pause();\n }\n }\n\n /**\n * Play music\n */\n play(time) {\n if (Object.prototype.toString.call(time) === '[object Number]') {\n this.audio.currentTime = time;\n }\n if (this.audio.paused) {\n this.button.classList.remove('aplayer-play');\n this.button.classList.add('aplayer-pause');\n this.button.innerHTML = '';\n setTimeout(() => {\n this.button.innerHTML = `\n `;\n }, 100);\n\n // pause other players (Thanks @Aprikyblue)\n if (this.option.mutex) {\n for (let i = 0; i < instances.length; i++) {\n if (this != instances[i]) {\n instances[i].pause();\n }\n }\n }\n this.audio.play();\n if (this.playedTime) {\n clearInterval(this.playedTime);\n }\n this.playedTime = setInterval(() => {\n this.updateBar('played', this.audio.currentTime / this.audio.duration, 'width');\n if (this.option.showlrc) {\n this.updateLrc();\n }\n this.ptime.innerHTML = this.secondToTime(this.audio.currentTime);\n this.trigger('playing');\n }, 100);\n this.trigger('play');\n }\n }\n\n /**\n * Pause music\n */\n pause() {\n if (!this.audio.paused || this.ended) {\n this.ended = false;\n this.button.classList.remove('aplayer-pause');\n this.button.classList.add('aplayer-play');\n this.button.innerHTML = '';\n setTimeout(() => {\n this.button.innerHTML = `\n `;\n }, 100);\n this.audio.pause();\n clearInterval(this.playedTime);\n this.trigger('pause');\n }\n }\n\n /**\n * Set volume\n */\n volume(percentage) {\n this.updateBar('volume', percentage, 'height');\n this.audio.volume = percentage;\n if (this.audio.muted) {\n this.audio.muted = false;\n }\n if (percentage === 1) {\n this.volumeicon.className = 'aplayer-icon aplayer-icon-volume-up';\n this.volumeicon.innerHTML = this.getSVG('volume-up');\n }\n else {\n this.volumeicon.className = 'aplayer-icon aplayer-icon-volume-down';\n this.volumeicon.innerHTML = this.getSVG('volume-down');\n }\n }\n\n /**\n * attach event\n */\n on(name, func) {\n if (typeof func === 'function') {\n this.event[name].push(func);\n }\n }\n\n /**\n * toggle between play and pause\n */\n toggle() {\n if (this.audio.paused) {\n this.play();\n }\n else {\n this.pause();\n }\n }\n }\n\n if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {\n module.exports = APlayer;\n }\n else {\n window.APlayer = APlayer;\n }\n})([]);"],"sourceRoot":"/source/"} \ No newline at end of file diff --git a/src/APlayer.js b/src/APlayer.js index dab4dbd..d9a0e20 100644 --- a/src/APlayer.js +++ b/src/APlayer.js @@ -26,7 +26,7 @@ `; }; - this.isMobile = navigator.userAgent.match(/(iPad)|(iPhone)|(iPod)|(android)|(webOS)/i); + this.isMobile = /mobile/i.test(window.navigator.userAgent); // compatibility: some mobile browsers don't suppose autoplay if (this.isMobile) { option.autoplay = false; @@ -258,13 +258,19 @@ } this.element.innerHTML = eleHTML; + // hide loop button in arrow container + if (this.element.offsetWidth < 300) { + this.element.getElementsByClassName('aplayer-icon-loop')[0].style.display = 'none'; + } + this.ptime = this.element.getElementsByClassName('aplayer-ptime')[0]; if (this.element.getElementsByClassName('aplayer-info')[0].offsetWidth < 200) { this.element.getElementsByClassName('aplayer-time')[0].classList.add('aplayer-time-narrow'); } // fix the width of aplayer bar - this.element.getElementsByClassName('aplayer-bar-wrap')[0].style.marginRight = this.element.getElementsByClassName('aplayer-time')[0].offsetWidth + 5 + 'px'; + this.bar = this.element.getElementsByClassName('aplayer-bar-wrap')[0]; + this.bar.style.marginRight = this.element.getElementsByClassName('aplayer-time')[0].offsetWidth + 5 + 'px'; // switch to narrow style if (this.option.narrow) { @@ -290,12 +296,15 @@ const musicIndex = parseInt(listItem[i].getElementsByClassName('aplayer-list-index')[0].innerHTML) - 1; if (musicIndex !== this.playIndex) { this.setMusic(musicIndex); - } - if (this.isMobile) { - this.pause(); + if (this.isMobile) { + this.pause(); + } + else { + this.play(); + } } else { - this.play(); + this.toggle(); } }); } @@ -305,7 +314,6 @@ this.playedBar = this.element.getElementsByClassName('aplayer-played')[0]; this.loadedBar = this.element.getElementsByClassName('aplayer-loaded')[0]; this.thumb = this.element.getElementsByClassName('aplayer-thumb')[0]; - this.bar = this.element.getElementsByClassName('aplayer-bar')[0]; let barWidth; this.bar.addEventListener('click', (event) => { const e = event || window.event; @@ -687,6 +695,18 @@ this.event[name].push(func); } } + + /** + * toggle between play and pause + */ + toggle() { + if (this.audio.paused) { + this.play(); + } + else { + this.pause(); + } + } } if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') { diff --git a/src/APlayer.scss b/src/APlayer.scss index 7f4ca53..cc8d9c5 100644 --- a/src/APlayer.scss +++ b/src/APlayer.scss @@ -132,7 +132,7 @@ $aplayer-height-lrc: $aplayer-height + $lrc-height; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; - margin-bottom: 17px; + margin-bottom: 13px; .aplayer-title { font-size: 14px; @@ -149,13 +149,14 @@ $aplayer-height-lrc: $aplayer-height + $lrc-height; .aplayer-bar-wrap { margin: 0 140px 0 5px; + padding: 4px 0; + cursor: pointer !important; .aplayer-bar { position: relative; height: 2px; width: 100%; background: #cdcdcd; - cursor: pointer !important; .aplayer-loaded { position: absolute; @@ -193,7 +194,7 @@ $aplayer-height-lrc: $aplayer-height + $lrc-height; .aplayer-time { position: absolute; right: 0; - bottom: -7px; + bottom: -3px; height: 17px; color: #999; font-size: 11px;