From ccfb471d241c86c7ddaab676c65568ee2f192f50 Mon Sep 17 00:00:00 2001 From: DIYgod Date: Mon, 28 Mar 2016 01:29:40 +0800 Subject: [PATCH] style of aplayer-time-narrow --- dist/APlayer.min.css | 2 +- dist/APlayer.min.js | 2 +- dist/APlayer.min.js.map | 2 +- src/APlayer.js | 3 +++ src/APlayer.scss | 14 ++++++++++++-- 5 files changed, 18 insertions(+), 5 deletions(-) diff --git a/dist/APlayer.min.css b/dist/APlayer.min.css index bb9aa7a..b75f3c7 100644 --- a/dist/APlayer.min.css +++ b/dist/APlayer.min.css @@ -1 +1 @@ -@font-face{font-family:aplayer-fontello;src:url(font/aplayer-fontello.eot?72550380);src:url(font/aplayer-fontello.eot?72550380#iefix) format("embedded-opentype"),url(font/aplayer-fontello.woff?72550380) format("woff"),url(font/aplayer-fontello.ttf?72550380) format("truetype"),url(font/aplayer-fontello.svg?72550380#fontello) format("svg");font-weight:400;font-style:normal}.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:initial}.aplayer *{box-sizing:content-box}.aplayer [class*=" aplayer-icon-"]:before,.aplayer [class^=aplayer-icon-]:before{font-family:aplayer-fontello;font-style:normal;font-weight:400;display:inline-block;text-decoration:inherit;width:1em;text-align:center;font-variant:normal;text-transform:none;line-height:1em}.aplayer .aplayer-icon-play:before{content:'\e806'}.aplayer .aplayer-icon-pause:before{content:'\e807'}.aplayer .aplayer-icon-to-start:before{content:'\e808'}.aplayer .aplayer-icon-to-end:before{content:'\e809'}.aplayer .aplayer-icon-loop:before{content:'\e803'}.aplayer .aplayer-icon-menu:before{content:'\e80b'}.aplayer .aplayer-icon-volume-off:before{content:'\e800'}.aplayer .aplayer-icon-volume-down:before{content:'\e801'}.aplayer .aplayer-icon-volume-up:before{content:'\e802'}.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;color:#fff;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-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:2px;left:4px;font-size:20px;line-height:23px}.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:1px;left:2px;font-size:12px;line-height:14px}.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:-5px;height:17px;color:#999;font-size:11px}.aplayer .aplayer-info .aplayer-controller .aplayer-time i{color:#666;font-size:15px;cursor:pointer;-webkit-transition:all .2s ease;transition:all .2s ease}.aplayer .aplayer-info .aplayer-controller .aplayer-time i.aplayer-icon-loop{margin:2px}.aplayer .aplayer-info .aplayer-controller .aplayer-time i.aplayer-noloop{color:#ddd}.aplayer .aplayer-info .aplayer-controller .aplayer-time i.aplayer-noloop:hover{color:#bbb}.aplayer .aplayer-info .aplayer-controller .aplayer-time i:hover{color:#000}.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap{position:relative;display:inline-block;margin-left:7px;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:17px;right:-5px;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{max-height:300px;overflow:auto;-webkit-transition:all .5s ease;transition:all .5s ease}.aplayer .aplayer-list.aplayer-list-hide{max-height:0}.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 +@font-face{font-family:aplayer-fontello;src:url(font/aplayer-fontello.eot?72550380);src:url(font/aplayer-fontello.eot?72550380#iefix) format("embedded-opentype"),url(font/aplayer-fontello.woff?72550380) format("woff"),url(font/aplayer-fontello.ttf?72550380) format("truetype"),url(font/aplayer-fontello.svg?72550380#fontello) format("svg");font-weight:400;font-style:normal}.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:initial}.aplayer *{box-sizing:content-box}.aplayer [class*=" aplayer-icon-"]:before,.aplayer [class^=aplayer-icon-]:before{font-family:aplayer-fontello;font-style:normal;font-weight:400;display:inline-block;text-decoration:inherit;width:1em;text-align:center;font-variant:normal;text-transform:none;line-height:1em}.aplayer .aplayer-icon-play:before{content:'\e806'}.aplayer .aplayer-icon-pause:before{content:'\e807'}.aplayer .aplayer-icon-to-start:before{content:'\e808'}.aplayer .aplayer-icon-to-end:before{content:'\e809'}.aplayer .aplayer-icon-loop:before{content:'\e803'}.aplayer .aplayer-icon-menu:before{content:'\e80b'}.aplayer .aplayer-icon-volume-off:before{content:'\e800'}.aplayer .aplayer-icon-volume-down:before{content:'\e801'}.aplayer .aplayer-icon-volume-up:before{content:'\e802'}.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;color:#fff;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-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:2px;left:4px;font-size:20px;line-height:23px}.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:1px;left:2px;font-size:12px;line-height:14px}.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:-5px;height:17px;color:#999;font-size:11px}.aplayer .aplayer-info .aplayer-controller .aplayer-time i{color:#666;font-size:15px;cursor:pointer;-webkit-transition:all .2s ease;transition:all .2s ease}.aplayer .aplayer-info .aplayer-controller .aplayer-time i.aplayer-icon-loop{margin-right:4px}.aplayer .aplayer-info .aplayer-controller .aplayer-time i.aplayer-noloop{color:#ddd}.aplayer .aplayer-info .aplayer-controller .aplayer-time i.aplayer-noloop:hover{color:#bbb}.aplayer .aplayer-info .aplayer-controller .aplayer-time i:hover{color:#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:17px;right:-5px;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{max-height:300px;overflow:auto;-webkit-transition:all .5s ease;transition:all .5s ease}.aplayer .aplayer-list.aplayer-list-hide{max-height:0}.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 7682fec..34363e9 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;ae?"0"+e:""+e},a=parseInt(e/60),s=parseInt(e-60*a);return t(a)+":"+t(s)},this.parseLrc=function(e){for(var t=[],a=0;al;l++){var o=s[l].match(/\[(\d{2}):(\d{2})\.(\d{2,3})]/g),r=s[l].replace(/\[(\d{2}):(\d{2})\.(\d{2,3})]/g,"").replace(/^\s+|\s+$/g,"");if(null!=o)for(var d=o.length,u=0;d>u;u++){var c=/\[(\d{2}):(\d{2})\.(\d{2,3})]/.exec(o[u]),p=60*c[1]+parseInt(c[2])+parseInt(c[3])/(2===(c[3]+"").length?100:1e3);i.push([p,r])}}i.sort(function(e,t){return e[0]-t[0]}),t.push(i)}return t},this.updateBar=function(e,t,s){t=t>0?t:0,t=1>t?t:1,a[e+"Bar"].style[s]=100*t+"%"},this.updateLrc=function(e){if("undefined"==typeof e&&(e=a.audio.currentTime),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.option.music[this.playIndex]:this.option.music;var i=void 0;if(this.option.showlrc){var n=[];for(i=0;i\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 '+(this.playIndex>-1?'':"")+"\n
\n
\n
";if(this.playIndex>-1){for(l+='\n
\n
    ',i=0;i\n \n '+(i+1)+'\n '+this.option.music[i].title+'\n '+this.option.music[i].author+"\n ";l+="\n
\n
"}this.element.innerHTML=l,console.log(this.element.getElementsByClassName("aplayer-info")[0].offsetWidth),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){s.button.classList.contains("aplayer-play")?s.play():s.button.classList.contains("aplayer-pause")&&s.pause()}),this.playIndex>-1&&!function(){for(var e=s.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!==s.playIndex&&s.setMusic(a),s.play()})},a=0;a0?i:0,i=1>i?i:1,s.updateBar("played",i,"width"),s.option.showlrc&&s.updateLrc(parseFloat(s.playedBar.style.width)/100*s.audio.duration),s.element.getElementsByClassName("aplayer-ptime")[0].innerHTML=s.secondToTime(i*s.audio.duration)},d=function h(){document.removeEventListener("mouseup",h),document.removeEventListener("mousemove",r),s.audio.currentTime=parseFloat(s.playedBar.style.width)/100*s.audio.duration,s.play()};this.thumb.addEventListener("mousedown",function(){o=s.bar.clientWidth,clearInterval(s.playedTime),document.addEventListener("mousemove",r),document.addEventListener("mouseup",d)}),this.volumeBar=this.element.getElementsByClassName("aplayer-volume")[0];var u=this.element.getElementsByClassName("aplayer-volume-bar")[0],c=this.element.getElementsByClassName("aplayer-time")[0].getElementsByTagName("i")[0],p=35;this.element.getElementsByClassName("aplayer-volume-bar-wrap")[0].addEventListener("click",function(e){var t=e||window.event,i=(p-t.clientY+a(u))/p;i=i>0?i:0,i=1>i?i:1,s.updateBar("volume",i,"height"),s.audio.volume=i,s.audio.muted&&(s.audio.muted=!1),1===i?c.className="demo-icon aplayer-icon-volume-up":c.className="demo-icon aplayer-icon-volume-down"}),c.addEventListener("click",function(){s.audio.muted?(s.audio.muted=!1,c.className=1===s.audio.volume?"demo-icon aplayer-icon-volume-up":"demo-icon aplayer-icon-volume-down",s.updateBar("volume",s.audio.volume,"height")):(s.audio.muted=!0,c.className="demo-icon aplayer-icon-volume-off",s.updateBar("volume",0,"height"))});var m=this.element.getElementsByClassName("aplayer-icon-loop")[0];m.addEventListener("click",function(){s.loop?(m.classList.add("aplayer-noloop"),s.loop=!1,s.audio.loop=s.playIndex>-1?!1:s.loop):(m.classList.remove("aplayer-noloop"),s.loop=!0,s.audio.loop=s.playIndex>-1?!1:s.loop)}),this.playIndex>-1&&this.element.getElementsByClassName("aplayer-icon-menu")[0].addEventListener("click",function(){var e=s.element.getElementsByClassName("aplayer-list")[0];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.playIndex>-1&&"undefined"!=typeof e&&(this.playIndex=e);var a=this.playIndex;if(this.music=this.playIndex>-1?this.option.music[a]:this.option.music,this.music.pic&&(this.element.getElementsByClassName("aplayer-pic")[0].style.backgroundImage="url("+encodeURI(this.music.pic)+")"),this.element.getElementsByClassName("aplayer-title")[0].innerHTML=this.music.title,this.element.getElementsByClassName("aplayer-author")[0].innerHTML=" - "+this.music.author,this.playIndex>-1&&(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.playIndex>-1&&!this.audios[a]||-1===this.playIndex?(this.audio=document.createElement("audio"),this.audio.src=this.music.url,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 ╥﹏╥"}),this.playIndex>-1?this.audio.addEventListener("ended",function(){t.playIndex-1?!1:this.loop,this.playIndex>-1&&(this.audios[a]=this.audio)):(this.audio=this.audios[a],this.audio.volume=parseInt(this.element.getElementsByClassName("aplayer-volume")[0].style.height)/100,this.audio.currentTime=0),this.option.showlrc){this.lrc=this.playIndex>-1?this.lrcs[a]:this.lrcs[0];var s="";this.lrcContents=this.element.getElementsByClassName("aplayer-lrc-contents")[0];for(var i=0;i"+this.lrc[i][1]+"

";this.lrcContents.innerHTML=s,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(){var t=this;if(this.audio.paused){if(this.button.classList.remove("aplayer-play"),this.button.classList.add("aplayer-pause"),this.button.innerHTML="",setTimeout(function(){t.button.innerHTML=''},100),this.option.mutex)for(var a=0;a'},100),this.audio.pause(),clearInterval(this.playedTime))}}]),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;ae?"0"+e:""+e},a=parseInt(e/60),s=parseInt(e-60*a);return t(a)+":"+t(s)},this.parseLrc=function(e){for(var t=[],a=0;al;l++){var o=s[l].match(/\[(\d{2}):(\d{2})\.(\d{2,3})]/g),r=s[l].replace(/\[(\d{2}):(\d{2})\.(\d{2,3})]/g,"").replace(/^\s+|\s+$/g,"");if(null!=o)for(var d=o.length,u=0;d>u;u++){var p=/\[(\d{2}):(\d{2})\.(\d{2,3})]/.exec(o[u]),c=60*p[1]+parseInt(p[2])+parseInt(p[3])/(2===(p[3]+"").length?100:1e3);i.push([c,r])}}i.sort(function(e,t){return e[0]-t[0]}),t.push(i)}return t},this.updateBar=function(e,t,s){t=t>0?t:0,t=1>t?t:1,a[e+"Bar"].style[s]=100*t+"%"},this.updateLrc=function(e){if("undefined"==typeof e&&(e=a.audio.currentTime),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.option.music[this.playIndex]:this.option.music;var i=void 0;if(this.option.showlrc){var n=[];for(i=0;i\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 '+(this.playIndex>-1?'':"")+"\n
\n
\n
";if(this.playIndex>-1){for(l+='\n
\n
    ',i=0;i\n \n '+(i+1)+'\n '+this.option.music[i].title+'\n '+this.option.music[i].author+"\n ";l+="\n
\n
"}this.element.innerHTML=l,console.log(this.element.getElementsByClassName("aplayer-info")[0].offsetWidth),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){s.button.classList.contains("aplayer-play")?s.play():s.button.classList.contains("aplayer-pause")&&s.pause()}),this.playIndex>-1&&!function(){for(var e=s.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!==s.playIndex&&s.setMusic(a),s.play()})},a=0;a0?i:0,i=1>i?i:1,s.updateBar("played",i,"width"),s.option.showlrc&&s.updateLrc(parseFloat(s.playedBar.style.width)/100*s.audio.duration),s.element.getElementsByClassName("aplayer-ptime")[0].innerHTML=s.secondToTime(i*s.audio.duration)},d=function h(){document.removeEventListener("mouseup",h),document.removeEventListener("mousemove",r),s.audio.currentTime=parseFloat(s.playedBar.style.width)/100*s.audio.duration,s.play()};this.thumb.addEventListener("mousedown",function(){o=s.bar.clientWidth,clearInterval(s.playedTime),document.addEventListener("mousemove",r),document.addEventListener("mouseup",d)}),this.volumeBar=this.element.getElementsByClassName("aplayer-volume")[0];var u=this.element.getElementsByClassName("aplayer-volume-bar")[0],p=this.element.getElementsByClassName("aplayer-time")[0].getElementsByTagName("i")[0],c=35;this.element.getElementsByClassName("aplayer-volume-bar-wrap")[0].addEventListener("click",function(e){var t=e||window.event,i=(c-t.clientY+a(u))/c;i=i>0?i:0,i=1>i?i:1,s.updateBar("volume",i,"height"),s.audio.volume=i,s.audio.muted&&(s.audio.muted=!1),1===i?p.className="demo-icon aplayer-icon-volume-up":p.className="demo-icon aplayer-icon-volume-down"}),p.addEventListener("click",function(){s.audio.muted?(s.audio.muted=!1,p.className=1===s.audio.volume?"demo-icon aplayer-icon-volume-up":"demo-icon aplayer-icon-volume-down",s.updateBar("volume",s.audio.volume,"height")):(s.audio.muted=!0,p.className="demo-icon aplayer-icon-volume-off",s.updateBar("volume",0,"height"))});var m=this.element.getElementsByClassName("aplayer-icon-loop")[0];m.addEventListener("click",function(){s.loop?(m.classList.add("aplayer-noloop"),s.loop=!1,s.audio.loop=s.playIndex>-1?!1:s.loop):(m.classList.remove("aplayer-noloop"),s.loop=!0,s.audio.loop=s.playIndex>-1?!1:s.loop)}),this.playIndex>-1&&this.element.getElementsByClassName("aplayer-icon-menu")[0].addEventListener("click",function(){var e=s.element.getElementsByClassName("aplayer-list")[0];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.playIndex>-1&&"undefined"!=typeof e&&(this.playIndex=e);var a=this.playIndex;if(this.music=this.playIndex>-1?this.option.music[a]:this.option.music,this.music.pic&&(this.element.getElementsByClassName("aplayer-pic")[0].style.backgroundImage="url("+encodeURI(this.music.pic)+")"),this.element.getElementsByClassName("aplayer-title")[0].innerHTML=this.music.title,this.element.getElementsByClassName("aplayer-author")[0].innerHTML=" - "+this.music.author,this.playIndex>-1&&(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.playIndex>-1&&!this.audios[a]||-1===this.playIndex?(this.audio=document.createElement("audio"),this.audio.src=this.music.url,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 ╥﹏╥"}),this.playIndex>-1?this.audio.addEventListener("ended",function(){t.playIndex-1?!1:this.loop,this.playIndex>-1&&(this.audios[a]=this.audio)):(this.audio=this.audios[a],this.audio.volume=parseInt(this.element.getElementsByClassName("aplayer-volume")[0].style.height)/100,this.audio.currentTime=0),this.option.showlrc){this.lrc=this.playIndex>-1?this.lrcs[a]:this.lrcs[0];var s="";this.lrcContents=this.element.getElementsByClassName("aplayer-lrc-contents")[0];for(var i=0;i"+this.lrc[i][1]+"

";this.lrcContents.innerHTML=s,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(){var t=this;if(this.audio.paused){if(this.button.classList.remove("aplayer-play"),this.button.classList.add("aplayer-pause"),this.button.innerHTML="",setTimeout(function(){t.button.innerHTML=''},100),this.option.mutex)for(var a=0;a'},100),this.audio.pause(),clearInterval(this.playedTime))}}]),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 71c1af5..11615c0 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","APlayers","APlayer","option","_this","this","isMobile","navigator","userAgent","match","autoplay","defaultOption","element","document","getElementsByClassName","narrow","mutex","showlrc","theme","defaultKey","hasOwnProperty","playIndex","toString","call","music","audios","loop","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","type","percentage","direction","style","updateLrc","currentTime","audio","lrcIndex","lrcContents","transform","webkitTransform","classList","remove","getElementsByTagName","add","value","getElementViewLeft","actualLeft","offsetLeft","current","offsetParent","elementScrollLeft","body","scrollLeft","documentElement","getElementViewTop","actualTop","offsetTop","elementScrollTop","scrollTop","_this2","innerHTML","eleHTML","pic","encodeURI","title","author","console","log","offsetWidth","marginRight","button","addEventListener","e","contains","play","pause","listItem","_loop","_i","musicIndex","setMusic","playedBar","loadedBar","thumb","bar","barWidth","event","window","clientWidth","clientX","duration","parseFloat","width","background","thumbMove","thumbUp","removeEventListener","clearInterval","playedTime","volumeBar","volumeBarWrap","volumeicon","barHeight","clientY","volume","muted","className","loopEle","list","index","_this3","indexMusic","backgroundImage","createElement","src","url","preload","buffered","end","height","lrcHTML","_this4","paused","setTimeout","setInterval","_this5","module","exports"],"mappings":"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","file":"APlayer.min.js","sourcesContent":["/**\n * APlayer constructor function\n *\n * @param {Object} option - See README\n * @constructor\n */\n(() => {\n let APlayers = [];\n\n class APlayer {\n constructor(option) {\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: false,\n theme: '#b7daff'\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 = true;\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) => {\n if (typeof(currentTime) === 'undefined') {\n currentTime = this.audio.currentTime;\n }\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\n /**\n * AutoLink initialization function\n */\n init() {\n this.element = this.option.element;\n this.music = this.playIndex > -1 ? this.option.music[this.playIndex] : this.option.music;\n\n let i;\n // parser lrc\n if (this.option.showlrc) {\n let lrcs = [];\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 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 - 00:00 / 00:00\n
\n \n
\n
\n
\n
\n
\n
\n ` + (this.playIndex > -1 ? `` : ``) + `\n
\n
\n
`;\n if (this.playIndex > -1) {\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 console.log(this.element.getElementsByClassName('aplayer-info')[0].offsetWidth);\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.playIndex > -1) {\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 this.play();\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.play();\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 const volumeicon = this.element.getElementsByClassName('aplayer-time')[0].getElementsByTagName('i')[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.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 volumeicon.className = 'demo-icon aplayer-icon-volume-up';\n }\n else {\n volumeicon.className = 'demo-icon aplayer-icon-volume-down';\n }\n });\n volumeicon.addEventListener('click', () => {\n if (this.audio.muted) {\n this.audio.muted = false;\n volumeicon.className = this.audio.volume === 1 ? 'demo-icon aplayer-icon-volume-up' : 'demo-icon aplayer-icon-volume-down';\n this.updateBar('volume', this.audio.volume, 'height');\n }\n else {\n this.audio.muted = true;\n volumeicon.className = 'demo-icon aplayer-icon-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.playIndex > -1 ? false : this.loop;\n }\n else {\n loopEle.classList.remove('aplayer-noloop');\n this.loop = true;\n this.audio.loop = this.playIndex > -1 ? false : this.loop;\n }\n });\n\n // toggle menu control\n if (this.playIndex > -1) {\n this.element.getElementsByClassName('aplayer-icon-menu')[0].addEventListener('click', () => {\n const list = this.element.getElementsByClassName('aplayer-list')[0];\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 APlayers.push(this);\n };\n\n /**\n * Set music\n */\n setMusic(index) {\n // get this.music\n if (this.playIndex > -1 && typeof(index) !== 'undefined') {\n this.playIndex = index;\n }\n const indexMusic = this.playIndex;\n this.music = this.playIndex > -1 ? 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(' + encodeURI(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.playIndex > -1) {\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.playIndex > -1 && !this.audios[indexMusic]) || this.playIndex === -1) {\n this.audio = document.createElement(\"audio\");\n this.audio.src = this.music.url;\n this.audio.preload = this.isMobile ? 'none' : 'metadata';\n\n // show audio time\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\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\n this.audio.addEventListener('error', () => {\n this.element.getElementsByClassName('aplayer-author')[0].innerHTML = ' - ' + 'Error happens ╥﹏╥';\n });\n\n // multiple music play\n if (this.playIndex > -1) {\n this.audio.addEventListener('ended', () => {\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.pause();\n }\n });\n }\n else {\n this.audio.addEventListener('ended', () => {\n if (!this.loop) {\n this.pause();\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.playIndex > -1 ? false : this.loop;\n\n if (this.playIndex > -1) {\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.playIndex > -1 ? 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() {\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 }, 100);\n\n // pause other players (Thanks @Aprikyblue)\n if (this.option.mutex) {\n for (let i = 0; i < APlayers.length; i++) {\n if (this != APlayers[i]) {\n APlayers[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.element.getElementsByClassName('aplayer-ptime')[0].innerHTML = this.secondToTime(this.audio.currentTime);\n }, 100);\n }\n };\n\n /**\n * Pause music\n */\n pause() {\n if (!this.audio.paused) {\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 }, 100);\n this.audio.pause();\n clearInterval(this.playedTime);\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","APlayers","APlayer","option","_this","this","isMobile","navigator","userAgent","match","autoplay","defaultOption","element","document","getElementsByClassName","narrow","mutex","showlrc","theme","defaultKey","hasOwnProperty","playIndex","toString","call","music","audios","loop","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","type","percentage","direction","style","updateLrc","currentTime","audio","lrcIndex","lrcContents","transform","webkitTransform","classList","remove","getElementsByTagName","add","value","getElementViewLeft","actualLeft","offsetLeft","current","offsetParent","elementScrollLeft","body","scrollLeft","documentElement","getElementViewTop","actualTop","offsetTop","elementScrollTop","scrollTop","_this2","innerHTML","eleHTML","pic","encodeURI","title","author","console","log","offsetWidth","marginRight","button","addEventListener","e","contains","play","pause","listItem","_loop","_i","musicIndex","setMusic","playedBar","loadedBar","thumb","bar","barWidth","event","window","clientWidth","clientX","duration","parseFloat","width","background","thumbMove","thumbUp","removeEventListener","clearInterval","playedTime","volumeBar","volumeBarWrap","volumeicon","barHeight","clientY","volume","muted","className","loopEle","list","index","_this3","indexMusic","backgroundImage","createElement","src","url","preload","buffered","end","height","lrcHTML","_this4","paused","setTimeout","setInterval","_this5","module","exports"],"mappings":"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","file":"APlayer.min.js","sourcesContent":["/**\n * APlayer constructor function\n *\n * @param {Object} option - See README\n * @constructor\n */\n(() => {\n let APlayers = [];\n\n class APlayer {\n constructor(option) {\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: false,\n theme: '#b7daff'\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 = true;\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) => {\n if (typeof(currentTime) === 'undefined') {\n currentTime = this.audio.currentTime;\n }\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\n /**\n * AutoLink initialization function\n */\n init() {\n this.element = this.option.element;\n this.music = this.playIndex > -1 ? this.option.music[this.playIndex] : this.option.music;\n\n let i;\n // parser lrc\n if (this.option.showlrc) {\n let lrcs = [];\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 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 - 00:00 / 00:00\n
\n \n
\n
\n
\n
\n
\n
\n ` + (this.playIndex > -1 ? `` : ``) + `\n
\n
\n
`;\n if (this.playIndex > -1) {\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 console.log(this.element.getElementsByClassName('aplayer-info')[0].offsetWidth);\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.playIndex > -1) {\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 this.play();\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.play();\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 const volumeicon = this.element.getElementsByClassName('aplayer-time')[0].getElementsByTagName('i')[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.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 volumeicon.className = 'demo-icon aplayer-icon-volume-up';\n }\n else {\n volumeicon.className = 'demo-icon aplayer-icon-volume-down';\n }\n });\n volumeicon.addEventListener('click', () => {\n if (this.audio.muted) {\n this.audio.muted = false;\n volumeicon.className = this.audio.volume === 1 ? 'demo-icon aplayer-icon-volume-up' : 'demo-icon aplayer-icon-volume-down';\n this.updateBar('volume', this.audio.volume, 'height');\n }\n else {\n this.audio.muted = true;\n volumeicon.className = 'demo-icon aplayer-icon-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.playIndex > -1 ? false : this.loop;\n }\n else {\n loopEle.classList.remove('aplayer-noloop');\n this.loop = true;\n this.audio.loop = this.playIndex > -1 ? false : this.loop;\n }\n });\n\n // toggle menu control\n if (this.playIndex > -1) {\n this.element.getElementsByClassName('aplayer-icon-menu')[0].addEventListener('click', () => {\n const list = this.element.getElementsByClassName('aplayer-list')[0];\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 APlayers.push(this);\n };\n\n /**\n * Set music\n */\n setMusic(index) {\n // get this.music\n if (this.playIndex > -1 && typeof(index) !== 'undefined') {\n this.playIndex = index;\n }\n const indexMusic = this.playIndex;\n this.music = this.playIndex > -1 ? 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(' + encodeURI(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.playIndex > -1) {\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.playIndex > -1 && !this.audios[indexMusic]) || this.playIndex === -1) {\n this.audio = document.createElement(\"audio\");\n this.audio.src = this.music.url;\n this.audio.preload = this.isMobile ? 'none' : 'metadata';\n\n // show audio time\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\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\n this.audio.addEventListener('error', () => {\n this.element.getElementsByClassName('aplayer-author')[0].innerHTML = ' - ' + 'Error happens ╥﹏╥';\n });\n\n // multiple music play\n if (this.playIndex > -1) {\n this.audio.addEventListener('ended', () => {\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.pause();\n }\n });\n }\n else {\n this.audio.addEventListener('ended', () => {\n if (!this.loop) {\n this.pause();\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.playIndex > -1 ? false : this.loop;\n\n if (this.playIndex > -1) {\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.playIndex > -1 ? 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() {\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 }, 100);\n\n // pause other players (Thanks @Aprikyblue)\n if (this.option.mutex) {\n for (let i = 0; i < APlayers.length; i++) {\n if (this != APlayers[i]) {\n APlayers[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.element.getElementsByClassName('aplayer-ptime')[0].innerHTML = this.secondToTime(this.audio.currentTime);\n }, 100);\n }\n };\n\n /**\n * Pause music\n */\n pause() {\n if (!this.audio.paused) {\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 }, 100);\n this.audio.pause();\n clearInterval(this.playedTime);\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 6e5c2b0..5c80719 100644 --- a/src/APlayer.js +++ b/src/APlayer.js @@ -208,6 +208,9 @@ this.element.innerHTML = eleHTML; console.log(this.element.getElementsByClassName('aplayer-info')[0].offsetWidth); + 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'; diff --git a/src/APlayer.scss b/src/APlayer.scss index 6b6334b..e6f3780 100644 --- a/src/APlayer.scss +++ b/src/APlayer.scss @@ -246,7 +246,7 @@ $aplayer-height-lrc: $aplayer-height + $lrc-height; transition: all 0.2s ease; &.aplayer-icon-loop { - margin: 2px; + margin-right: 4px; } &.aplayer-noloop { color: #ddd; @@ -259,12 +259,22 @@ $aplayer-height-lrc: $aplayer-height + $lrc-height; color: #000; } } + + &.aplayer-time-narrow { + .aplayer-icon-loop { + display: none; + } + + .aplayer-icon-menu { + display: none; + } + } } .aplayer-volume-wrap { position: relative; display: inline-block; - margin-left: 7px; + margin-left: 3px; cursor: pointer !important; &:hover .aplayer-volume-bar-wrap {