+
diff --git a/js/ajax.js b/js/ajax.js
index 2987718..2643ad2 100644
--- a/js/ajax.js
+++ b/js/ajax.js
@@ -1,12 +1,15 @@
/**************************************************
- * MKOnlinePlayer v2.0
+ * MKOnlinePlayer v2.1
* Ajax 后台数据交互请求模块
* 编写：mengkun(http://mkblog.cn)
- * 时间：2017-3-16
+ * 时间：2017-3-20
*************************************************/
// ajax加载搜索结果
function ajaxSearch() {
+ if(rem.loadPage == 1) { // 弹出搜索提示
+ var tmpLoading = layer.msg('搜索中', {icon: 16,shade: 0.01});
+ }
$.ajax({
type: "POST",
url: mkPlayer.api,
@@ -31,6 +34,7 @@ function ajaxSearch() {
if(rem.loadPage == 1) // 加载第一页，清空列表
{
+ layer.close(tmpLoading); // 关闭加载中动画
musicList[0].item = [];
rem.mainList.html(''); // 清空列表中原有的元素
addListhead(); // 加载列表头
@@ -132,7 +136,7 @@ function ajaxPlayList(lid, id, callback){
// 已经在加载了，跳过
if(musicList[id].isloading === true) {
- layer.load(2, {shade: false,time: 500}); //0代表加载的风格，支持0-2
+ layer.msg('列表读取中...', {icon: 16,shade: 0.01,time: 500}); //0代表加载的风格，支持0-2
return true;
}
@@ -213,7 +217,9 @@ function ajaxPlayList(lid, id, callback){
// ajax加载歌词
// 参数：音乐ID，回调函数
function ajaxLyric(mid, callback) {
- if(!mid) return false;
+ lyricTip('歌词加载中...');
+
+ if(!mid) callback(''); // 没有音乐ID，直接返回
$.ajax({
type: "POST",
diff --git a/js/functions.js b/js/functions.js
index 688ce97..e856cf6 100644
--- a/js/functions.js
+++ b/js/functions.js
@@ -68,9 +68,6 @@ $(function(){
case "sheet": // 播放列表
dataBox("sheet"); // 在主界面显示出音乐专辑
break;
-
- default:
- layer.msg('这个功能还没加');
}
});
@@ -229,7 +226,7 @@ $(function(){
var tempStr = "歌名：" + tmpMusic.musicName +
"
♫ MKOnlinePlayer
歌手：" + tmpMusic.artistsName + "
专辑：" + tmpMusic.albumName + - "
时长：" + formatTime($("#mkplayer")[0].duration) + + "
时长：" + formatTime(rem.audio.duration) + "
操作：下载外链"; layer.open({ @@ -262,20 +259,17 @@ $(function(){ if($(this).is('.btn-state-quiet')) { oldVol = $(this).data("volume"); $(this).removeClass("btn-state-quiet"); // 取消静音 - $("#mkplayer")[0].volume = oldVol; + rem.audio.volume = oldVol; volume_bar.goto(oldVol); // 恢复之前的音量 } else { oldVol = volume_bar.percent; - $("#mkplayer")[0].volume = 0; + rem.audio.volume = 0; $(this).addClass("btn-state-quiet"); // 开启静音 $(this).data("volume", oldVol); // 记录当前音量值 volume_bar.goto(0); // 音量归零 } }); - // 播放功能初始化 - audioInit(); - // 初始化播放列表 initList(); }); @@ -302,7 +296,7 @@ function download(music) { function ajaxShare(music) { layer.open({ title: '歌曲分享' - ,content: music.artistsName + ' - ' + music.musicName + ' 的外链地址为：
' + music.mp3Url + ,content: music.artistsName + ' - ' + music.musicName + ' 的外链地址为：
' }); } @@ -312,6 +306,7 @@ function changeCover(img) { if(!img) img = "images/player_cover.png"; var animate = false,imgload = false; + img += "?param=186x186"; // 限制封面图为 186*186px $("#music-cover").attr("src", img); // 改变右侧封面 $(".sheet-item[data-no='1'] .sheet-cover").attr('src', img); // 改变正在播放列表的图像 @@ -354,6 +349,11 @@ function search(str) { // 向列表中载入某个播放列表 function loadList(list) { + if(musicList[list].isloading === true) { + layer.msg('列表读取中...', {icon: 16,shade: 0.01,time: 500}); + return true; + } + dataBox("list"); // 在主界面显示出播放列表 // 调试信息输出 @@ -514,6 +514,7 @@ function refreshList() { function addSheet(no, name, cover) { if(!cover) cover = "images/player_cover.png"; if(!name) name = "读取中..."; + cover += "?param=186x186"; // 限制封面图像大小 var html = '
' +
' 
' +
' "+str+" "); // 显示内容
+}
+
// 歌曲加载完后的回调函数
// 参数：歌词源文件
function lyricCallback(str) {
rem.lyric = parseLyric(str); // 解析获取到的歌词
+ if(rem.lyric === '') {
+ lyricTip('没有歌词');
+ return false;
+ }
+
lyricArea.html(''); // 清空歌词区域的内容
lyricArea.scrollLeft(0); // 滚动到顶部
// 显示全部歌词
+ var i = 0;
for(var k in rem.lyric){
var txt = rem.lyric[k];
if(!txt) txt = " ";
- var li = $(""+txt+" ");
+ var li = $(""+txt+" ");
lyricArea.append(li);
+ i++;
}
}
// 强制刷新当前时间点的歌词
// 参数：当前播放时间（单位：秒）
function refreshLyric(time) {
+ if(rem.lyric === '') return false;
+
time = parseInt(time); // 时间取整
var i = 0;
for(var k in rem.lyric){
@@ -37,9 +51,11 @@ function refreshLyric(time) {
scrollLyric(i);
}
-// 滚动歌词
+// 滚动歌词到指定句
// 参数：当前播放时间（单位：秒）
function scrollLyric(time) {
+ if(rem.lyric === '') return false;
+
time = parseInt(time); // 时间取整
if(rem.lyric === undefined || rem.lyric[time] === undefined) return false; // 当前时间点没有歌词
@@ -52,8 +68,8 @@ function scrollLyric(time) {
i ++;
}
rem.lastLyric = time; // 记录方便下次使用
- $(".lplaying").removeClass("lplaying");
- lyricArea.children().eq(i).attr("class","lplaying"); // 加上正在播放样式
+ $(".lplaying").removeClass("lplaying"); // 移除其余句子的正在播放样式
+ $(".lrc-item[data-no='" + i + "']").addClass("lplaying"); // 加上正在播放样式
var scroll = (lyricArea.children().height() * i) - ($(".lyric").height() / 2);
lyricArea.stop().animate({scrollTop: scroll}, 300); // 平滑滚动到当前歌词位置
@@ -63,6 +79,7 @@ function scrollLyric(time) {
// 解析歌词
// 参数：原始歌词文件
function parseLyric(lrc) {
+ if(lrc === '') return '';
var lyrics = lrc.split("\n");
var lrcObj = {};
for(var i=0;i').html('').appendTo('html');
+ rem.audio = newaudio[0];
+ // 应用初始音量
+ rem.audio.volume = volume_bar.percent;
+ // 绑定歌曲进度变化事件
+ rem.audio.addEventListener('timeupdate', updateProgress);
+ rem.audio.addEventListener('play', audioPlay); // 开始播放了
+ rem.audio.addEventListener('pause', audioPause); // 暂停
+ rem.audio.addEventListener('ended', nextMusic); // 播放结束
+ rem.audio.addEventListener('error', audioErr); // 播放器错误处理
+
+ rem.audio.play();
}
// 我的要求并不高，保留这一句版权信息可好？
// 保留了，你不会损失什么；而保留版权，是对作者最大的尊重。
-console.info('欢迎使用 MKOnlinePlayer!\n当前版本： v2.0 \n作者：mengkun(http://mkblog.cn)\n歌曲来源于：网易云音乐(http://music.163.com/)\nGithub：https://github.com/mengkunsoft/MKOnlineMusicPlayer');
+console.info('欢迎使用 MKOnlinePlayer!\n当前版本： v2.1 \n作者：mengkun(http://mkblog.cn)\n歌曲来源于：网易云音乐(http://music.163.com/)\nGithub：https://github.com/mengkunsoft/MKOnlineMusicPlayer');
// 音乐进度条拖动回调函数
function mBcallback(newVal) {
- var newTime = $("#mkplayer")[0].duration * newVal;
+ var newTime = rem.audio.duration * newVal;
// 应用新的进度
- $("#mkplayer")[0].currentTime = newTime;
+ rem.audio.currentTime = newTime;
refreshLyric(newTime);
}
// 音量条变动回调函数
// 参数：新的值
function vBcallback(newVal) {
- $("#mkplayer")[0].volume = newVal;
+ rem.audio.volume = newVal;
if($(".btn-quiet").is('.btn-state-quiet')) {
$(".btn-quiet").removeClass("btn-state-quiet"); // 取消静音
' +name+ '
' + diff --git a/js/lyric.js b/js/lyric.js index 1889625..d1435a8 100644 --- a/js/lyric.js +++ b/js/lyric.js @@ -1,32 +1,46 @@ /************************************************** - * MKOnlinePlayer v2.0 + * MKOnlinePlayer v2.1 * 歌词解析及滚动模块 * 编写：mengkun(http://mkblog.cn) - * 时间：2017-3-16 + * 时间：2017-3-20 *************************************************/ var lyricArea = $("#lyric"); // 歌词显示容器 +// 在歌词区显示提示语（如歌词加载中、无歌词等） +function lyricTip(str) { + lyricArea.html("