diff --git a/README.md b/README.md index 414bc4a..f855136 100644 --- a/README.md +++ b/README.md @@ -81,9 +81,11 @@ ap.init(); #### LRC format: +Support multiple time tag, support three decimal second + ``` [mm:ss.xx]lyric -[mm:ss.xx]lyric +[mm:ss.xxx]lyric [mm:ss.xx][mm:ss.xx][mm:ss.xx]lyric ... ``` diff --git a/dist/APlayer.min.js b/dist/APlayer.min.js index 28a7043..e5b3c87 100644 --- a/dist/APlayer.min.js +++ b/dist/APlayer.min.js @@ -1 +1 @@ -function APlayer(e){if(!("music"in e&&"title"in e.music&&"author"in e.music&&"url"in e.music&&"pic"in e.music))throw"APlayer Error: Music, music.title, music.author, music.url, music.pic are required in options";if(null===e.element)throw"APlayer Error: element option null";this.isMobile=navigator.userAgent.match(/(iPad)|(iPhone)|(iPod)|(android)|(webOS)/i),this.isMobile&&(e.autoplay=!1);var a={element:document.getElementsByClassName("aplayer")[0],narrow:!1,autoplay:!1,showlrc:!1};for(var t in a)a.hasOwnProperty(t)&&!e.hasOwnProperty(t)&&(e[t]=a[t]);this.option=e}APlayer.prototype.init=function(){function e(e){var a=e||window.event,l=(a.clientX-t(n.bar))/o;l=l>0?l:0,l=1>l?l:1,n.updateBar.call(n,"played",l,"width"),n.option.showlrc&&n.updateLrc.call(n,parseFloat(n.playedBar.style.width)/100*n.audio.duration),n.element.getElementsByClassName("aplayer-ptime")[0].innerHTML=n.secondToTime(l*n.audio.duration)}function a(){document.removeEventListener("mouseup",a),document.removeEventListener("mousemove",e),n.audio.currentTime=parseFloat(n.playedBar.style.width)/100*n.audio.duration,n.play()}function t(e){for(var a,t=e.offsetLeft,l=e.offsetParent;null!==l;)t+=l.offsetLeft,l=l.offsetParent;return a=document.body.scrollLeft+document.documentElement.scrollLeft,t-a}function l(e){for(var a,t=e.offsetTop,l=e.offsetParent;null!==l;)t+=l.offsetTop,l=l.offsetParent;return a=document.body.scrollTop+document.documentElement.scrollTop,t-a}if(this.element=this.option.element,this.music=this.option.music,this.option.showlrc){var i=this.element.getElementsByClassName("aplayer-lrc-content")[0].innerHTML;this.lrc=this.parseLrc(i)}if(this.element.innerHTML='
'+this.music.title+' - (＞﹏＜)加载中,好累的说...
- 00:00 / (oﾟ▽ﾟ)
',this.option.showlrc){this.element.classList.add("aplayer-withlrc");var s="";this.lrcContents=this.element.getElementsByClassName("aplayer-lrc-contents")[0];for(var r=0;r"+this.lrc[r][1]+"

";this.lrcContents.innerHTML=s,this.lrcIndex=0,this.lrcContents.getElementsByTagName("p")[0].classList.add("aplayer-lrc-current")}this.option.narrow&&this.element.classList.add("aplayer-narrow"),this.audio=document.createElement("audio"),this.audio.src=this.music.url,this.audio.loop=!0,this.audio.preload="metadata";var n=this;this.audio.addEventListener("durationchange",function(){1!==n.audio.duration&&(n.element.getElementsByClassName("aplayer-dtime")[0].innerHTML=n.secondToTime(n.audio.duration))}),this.audio.addEventListener("loadedmetadata",function(){n.element.getElementsByClassName("aplayer-author")[0].innerHTML=" - "+n.music.author,n.loadedTime=setInterval(function(){var e=n.audio.buffered.end(n.audio.buffered.length-1)/n.audio.duration;n.updateBar.call(n,"loaded",e,"width"),1===e&&clearInterval(n.loadedTime)},500)}),this.audio.addEventListener("error",function(){n.element.getElementsByClassName("aplayer-author")[0].innerHTML=" - 加载失败 ╥﹏╥"}),this.playButton=this.element.getElementsByClassName("aplayer-play")[0],this.pauseButton=this.element.getElementsByClassName("aplayer-pause")[0],this.playButton.addEventListener("click",function(){n.play.call(n)}),this.pauseButton.addEventListener("click",function(){n.pause.call(n)}),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];var o;this.bar.addEventListener("click",function(e){var a=e||window.event;o=n.bar.clientWidth;var l=(a.clientX-t(n.bar))/o;n.updateBar.call(n,"played",l,"width"),n.element.getElementsByClassName("aplayer-ptime")[0].innerHTML=n.secondToTime(l*n.audio.duration),n.audio.currentTime=parseFloat(n.playedBar.style.width)/100*n.audio.duration}),this.thumb.addEventListener("mousedown",function(){o=n.bar.clientWidth,clearInterval(n.playedTime),document.addEventListener("mousemove",e),document.addEventListener("mouseup",a)}),this.audio.volume=.8,this.volumeBar=this.element.getElementsByClassName("aplayer-volume")[0];var d=this.element.getElementsByClassName("aplayer-volume-bar")[0],c=n.element.getElementsByClassName("aplayer-time")[0].getElementsByTagName("i")[0],u=35;this.element.getElementsByClassName("aplayer-volume-bar-wrap")[0].addEventListener("click",function(e){var a=e||window.event,t=(u-a.clientY+l(d))/u;t=t>0?t:0,t=1>t?t:1,n.updateBar.call(n,"volume",t,"height"),n.audio.volume=t,n.audio.muted&&(n.audio.muted=!1),1===t?c.className="demo-icon aplayer-icon-volume-up":c.className="demo-icon aplayer-icon-volume-down"}),c.addEventListener("click",function(){n.audio.muted?(n.audio.muted=!1,c.className=1===n.audio.volume?"demo-icon aplayer-icon-volume-up":"demo-icon aplayer-icon-volume-down",n.updateBar.call(n,"volume",n.audio.volume,"height")):(n.audio.muted=!0,c.className="demo-icon aplayer-icon-volume-off",n.updateBar.call(n,"volume",0,"height"))}),this.option.autoplay&&this.play()},APlayer.prototype.play=function(){this.playButton.classList.add("aplayer-hide"),this.pauseButton.classList.remove("aplayer-hide"),this.audio.play();var e=this;this.playedTime=setInterval(function(){e.updateBar.call(e,"played",e.audio.currentTime/e.audio.duration,"width"),e.option.showlrc&&e.updateLrc.call(e),e.element.getElementsByClassName("aplayer-ptime")[0].innerHTML=e.secondToTime(e.audio.currentTime)},100)},APlayer.prototype.pause=function(){this.pauseButton.classList.add("aplayer-hide"),this.playButton.classList.remove("aplayer-hide"),this.audio.pause(),clearInterval(this.playedTime)},APlayer.prototype.updateBar=function(e,a,t){a=a>0?a:0,a=1>a?a:1,this[e+"Bar"].style[t]=100*a+"%"},APlayer.prototype.updateLrc=function(e){if(e||(e=this.audio.currentTime),e=this.lrc[this.lrcIndex+1][0])for(var a=0;a=this.lrc[a][0]&&(!this.lrc[a+1]||ee?"0"+e:""+e},t=parseInt(e/60),l=parseInt(e-60*t);return a(t)+":"+a(l)},APlayer.prototype.parseLrc=function(e){for(var a=e.split("\n"),t=[],l=a.length,i=0;l>i;i++){var s=a[i].match(/\[(\d{2}):(\d{2})\.(\d{2})]/g),r=a[i].replace(/\[(\d{2}):(\d{2})\.(\d{2})]/g,"").replace(/^\s+|\s+$/g,"");if(null!=s)for(var n=s.length,o=0;n>o;o++){var d=/\[(\d{2}):(\d{2})\.(\d{2})]/.exec(s[o]),c=60*d[1]+parseInt(d[2])+parseInt(d[3])/100;t.push([c,r])}}return t.sort(function(e,a){return e[0]-a[0]}),t}; \ No newline at end of file +function APlayer(e){if(!("music"in e&&"title"in e.music&&"author"in e.music&&"url"in e.music&&"pic"in e.music))throw"APlayer Error: Music, music.title, music.author, music.url, music.pic are required in options";if(null===e.element)throw"APlayer Error: element option null";this.isMobile=navigator.userAgent.match(/(iPad)|(iPhone)|(iPod)|(android)|(webOS)/i),this.isMobile&&(e.autoplay=!1);var a={element:document.getElementsByClassName("aplayer")[0],narrow:!1,autoplay:!1,showlrc:!1};for(var t in a)a.hasOwnProperty(t)&&!e.hasOwnProperty(t)&&(e[t]=a[t]);this.option=e}APlayer.prototype.init=function(){function e(e){var a=e||window.event,l=(a.clientX-t(n.bar))/o;l=l>0?l:0,l=1>l?l:1,n.updateBar.call(n,"played",l,"width"),n.option.showlrc&&n.updateLrc.call(n,parseFloat(n.playedBar.style.width)/100*n.audio.duration),n.element.getElementsByClassName("aplayer-ptime")[0].innerHTML=n.secondToTime(l*n.audio.duration)}function a(){document.removeEventListener("mouseup",a),document.removeEventListener("mousemove",e),n.audio.currentTime=parseFloat(n.playedBar.style.width)/100*n.audio.duration,n.play()}function t(e){for(var a,t=e.offsetLeft,l=e.offsetParent;null!==l;)t+=l.offsetLeft,l=l.offsetParent;return a=document.body.scrollLeft+document.documentElement.scrollLeft,t-a}function l(e){for(var a,t=e.offsetTop,l=e.offsetParent;null!==l;)t+=l.offsetTop,l=l.offsetParent;return a=document.body.scrollTop+document.documentElement.scrollTop,t-a}if(this.element=this.option.element,this.music=this.option.music,this.option.showlrc){var i=this.element.getElementsByClassName("aplayer-lrc-content")[0].innerHTML;this.lrc=this.parseLrc(i)}if(this.element.innerHTML='
'+this.music.title+' - (＞﹏＜)加载中,好累的说...
- 00:00 / (oﾟ▽ﾟ)
',this.option.showlrc){this.element.classList.add("aplayer-withlrc");var s="";this.lrcContents=this.element.getElementsByClassName("aplayer-lrc-contents")[0];for(var r=0;r"+this.lrc[r][1]+"

";this.lrcContents.innerHTML=s,this.lrcIndex=0,this.lrcContents.getElementsByTagName("p")[0].classList.add("aplayer-lrc-current")}this.option.narrow&&this.element.classList.add("aplayer-narrow"),this.audio=document.createElement("audio"),this.audio.src=this.music.url,this.audio.loop=!0,this.audio.preload="metadata";var n=this;this.audio.addEventListener("durationchange",function(){1!==n.audio.duration&&(n.element.getElementsByClassName("aplayer-dtime")[0].innerHTML=n.secondToTime(n.audio.duration))}),this.audio.addEventListener("loadedmetadata",function(){n.element.getElementsByClassName("aplayer-author")[0].innerHTML=" - "+n.music.author,n.loadedTime=setInterval(function(){var e=n.audio.buffered.end(n.audio.buffered.length-1)/n.audio.duration;n.updateBar.call(n,"loaded",e,"width"),1===e&&clearInterval(n.loadedTime)},500)}),this.audio.addEventListener("error",function(){n.element.getElementsByClassName("aplayer-author")[0].innerHTML=" - 加载失败 ╥﹏╥"}),this.playButton=this.element.getElementsByClassName("aplayer-play")[0],this.pauseButton=this.element.getElementsByClassName("aplayer-pause")[0],this.playButton.addEventListener("click",function(){n.play.call(n)}),this.pauseButton.addEventListener("click",function(){n.pause.call(n)}),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];var o;this.bar.addEventListener("click",function(e){var a=e||window.event;o=n.bar.clientWidth;var l=(a.clientX-t(n.bar))/o;n.updateBar.call(n,"played",l,"width"),n.element.getElementsByClassName("aplayer-ptime")[0].innerHTML=n.secondToTime(l*n.audio.duration),n.audio.currentTime=parseFloat(n.playedBar.style.width)/100*n.audio.duration}),this.thumb.addEventListener("mousedown",function(){o=n.bar.clientWidth,clearInterval(n.playedTime),document.addEventListener("mousemove",e),document.addEventListener("mouseup",a)}),this.audio.volume=.8,this.volumeBar=this.element.getElementsByClassName("aplayer-volume")[0];var d=this.element.getElementsByClassName("aplayer-volume-bar")[0],c=n.element.getElementsByClassName("aplayer-time")[0].getElementsByTagName("i")[0],u=35;this.element.getElementsByClassName("aplayer-volume-bar-wrap")[0].addEventListener("click",function(e){var a=e||window.event,t=(u-a.clientY+l(d))/u;t=t>0?t:0,t=1>t?t:1,n.updateBar.call(n,"volume",t,"height"),n.audio.volume=t,n.audio.muted&&(n.audio.muted=!1),1===t?c.className="demo-icon aplayer-icon-volume-up":c.className="demo-icon aplayer-icon-volume-down"}),c.addEventListener("click",function(){n.audio.muted?(n.audio.muted=!1,c.className=1===n.audio.volume?"demo-icon aplayer-icon-volume-up":"demo-icon aplayer-icon-volume-down",n.updateBar.call(n,"volume",n.audio.volume,"height")):(n.audio.muted=!0,c.className="demo-icon aplayer-icon-volume-off",n.updateBar.call(n,"volume",0,"height"))}),this.option.autoplay&&this.play()},APlayer.prototype.play=function(){this.playButton.classList.add("aplayer-hide"),this.pauseButton.classList.remove("aplayer-hide"),this.audio.play();var e=this;this.playedTime=setInterval(function(){e.updateBar.call(e,"played",e.audio.currentTime/e.audio.duration,"width"),e.option.showlrc&&e.updateLrc.call(e),e.element.getElementsByClassName("aplayer-ptime")[0].innerHTML=e.secondToTime(e.audio.currentTime)},100)},APlayer.prototype.pause=function(){this.pauseButton.classList.add("aplayer-hide"),this.playButton.classList.remove("aplayer-hide"),this.audio.pause(),clearInterval(this.playedTime)},APlayer.prototype.updateBar=function(e,a,t){a=a>0?a:0,a=1>a?a:1,this[e+"Bar"].style[t]=100*a+"%"},APlayer.prototype.updateLrc=function(e){if(e||(e=this.audio.currentTime),e=this.lrc[this.lrcIndex+1][0])for(var a=0;a=this.lrc[a][0]&&(!this.lrc[a+1]||ee?"0"+e:""+e},t=parseInt(e/60),l=parseInt(e-60*t);return a(t)+":"+a(l)},APlayer.prototype.parseLrc=function(e){for(var a=e.split("\n"),t=[],l=a.length,i=0;l>i;i++){var s=a[i].match(/\[(\d{2}):(\d{2})\.(\d{2,3})]/g),r=a[i].replace(/\[(\d{2}):(\d{2})\.(\d{2,3})]/g,"").replace(/^\s+|\s+$/g,"");if(null!=s)for(var n=s.length,o=0;n>o;o++){var d=/\[(\d{2}):(\d{2})\.(\d{2,3})]/.exec(s[o]),c=60*d[1]+parseInt(d[2])+parseInt(d[3])/(2===(d[3]+"").length?100:1e3);t.push([c,r])}}return t.sort(function(e,a){return e[0]-a[0]}),t}; \ No newline at end of file diff --git a/src/APlayer.js b/src/APlayer.js index e84edbc..8e21ae6 100644 --- a/src/APlayer.js +++ b/src/APlayer.js @@ -337,7 +337,11 @@ APlayer.prototype.secondToTime = function (second) { /** * Parse lrc, suppose multiple time tag * - * @param {String} text - Format: [mm:ss.xx][mm:ss.xx]lyric + * @param {String} text - Format: + * [mm:ss.xx]lyric + * [mm:ss.xxx]lyric + * [mm:ss.xx][mm:ss.xx][mm:ss.xx]lyric + * * @return {Array} [[time, text], [time, text], [time, text], ...] */ APlayer.prototype.parseLrc = function (text) { @@ -346,16 +350,16 @@ APlayer.prototype.parseLrc = function (text) { var lyricLen = lyric.length; for (var i = 0; i < lyricLen; i++) { // match lrc time - var lrcTimes = lyric[i].match(/\[(\d{2}):(\d{2})\.(\d{2})]/g); + var lrcTimes = lyric[i].match(/\[(\d{2}):(\d{2})\.(\d{2,3})]/g); // match lrc text - var lrcText = lyric[i].replace(/\[(\d{2}):(\d{2})\.(\d{2})]/g, '').replace(/^\s+|\s+$/g, ''); + var lrcText = lyric[i].replace(/\[(\d{2}):(\d{2})\.(\d{2,3})]/g, '').replace(/^\s+|\s+$/g, ''); if (lrcTimes != null) { // handle multiple time tag var timeLen = lrcTimes.length; for (var j = 0; j < timeLen; j++) { - var oneTime = /\[(\d{2}):(\d{2})\.(\d{2})]/.exec(lrcTimes[j]); - var lrcTime = (oneTime[1]) * 60 + parseInt(oneTime[2]) + parseInt(oneTime[3]) / 100; + var oneTime = /\[(\d{2}):(\d{2})\.(\d{2,3})]/.exec(lrcTimes[j]); + var lrcTime = (oneTime[1]) * 60 + parseInt(oneTime[2]) + parseInt(oneTime[3]) / ((oneTime[3] + '').length === 2 ? 100 : 1000); lrc.push([lrcTime, lrcText]); } }