├── icon.png
├── README.md
├── index.html
├── style.css
└── script.js
/icon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/moeshin/QPlayer/HEAD/icon.png
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # QPlayer
2 |
3 | This project bas been deprecated in favour of [QPlayer2](https://github.com/moeshin/QPlayer2)
4 |
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | QPlayer
6 |
11 |
12 |
13 |
15 |
16 |
17 |
18 |
32 |
33 |
34 |
35 |
36 |
37 |
38 | 
39 |
40 |
41 |
42 | name - artist
43 |
44 |
49 |
50 |
00:00
51 |
56 |
60 |
61 |
62 |
63 |
66 |
67 |
71 |
72 |
'+str;
362 | else {
363 | lyric.arr.push(time);
364 | lyric.obj[time] = str?str:'';
365 | }
366 | }
367 |
368 | });
369 |
370 | lyric.arr = lyric.arr.sort(function (a, b) {
371 | return a-b;
372 | });
373 | if (lyric.arr.length > 0)
374 | $lyricOl.removeClass('no').html('');
375 | for (var i = 0; i < lyric.arr.length; i++) {
376 | $lyricOl.append(''+lyric.obj[lyric.arr[i]]+'');
377 | }
378 | $lyricLi = $lyricOl.find('li');
379 | }
380 | });
381 | isLoad = true;
382 | };
383 |
384 | /**
385 | * 暂停
386 | *
387 | */
388 | q.pause = function () {
389 | if (audio.networkState === 3)
390 | return;
391 | $player.removeClass('playing');
392 | audio.pause();
393 | };
394 |
395 | /**
396 | * 下一首
397 | *
398 | */
399 | q.next = function () {
400 | if (++q.histIndex < q.history.length) {
401 | q.play(q.history[q.histIndex]);
402 | } else {
403 | var index = random();
404 | q.history.push(index);
405 | q.play(index);
406 | }
407 | };
408 |
409 | /**
410 | * 上一首
411 | *
412 | */
413 | q.last = function () {
414 | if (q.histIndex === 0) {
415 | if (q.isRandom)
416 | q.play(random());
417 | else if (q.listIndex)
418 | q.play(q.listIndex-1);
419 | else
420 | q.play(q.list.length-1);
421 | q.history.splice(0,0,q.listIndex);
422 | q.histIndex = 0;
423 | } else
424 | q.play(q.history[--q.histIndex]);
425 | };
426 |
427 | /**
428 | * 播放错误
429 | *
430 | */
431 | q.error = function () {
432 | $listLi.eq(q.listIndex).addClass('error');
433 | q.history.splice(q.histIndex--, 1);
434 | q.next();
435 | };
436 |
437 | /**
438 | * 设置rotate
439 | *
440 | * @param bool
441 | */
442 | q.onSetRotate = function (bool) {
443 | if (bool) {
444 | $cover.attr('title', '点击不旋转封面');
445 | $cover.addClass('rotate');
446 | } else {
447 | $cover.attr('title', '点击旋转封面');
448 | $cover.removeClass('rotate');
449 | }
450 | };
451 |
452 | /**
453 | * .pop-btn点击
454 | */
455 | $player.find('.pop-btn').click(function () {
456 | $player.toggleClass('pop');
457 | });
458 |
459 | /**
460 | * 进度条按下
461 | */
462 | $progress.mousedown(function (e){
463 | if (!isProgressClick) {
464 | isProgressClick = true;
465 | $player.addClass('unselectable');
466 | mouseProgress(e.pageX);
467 | }
468 | }).on('touchstart', function (e) {
469 | isProgressClick = true;
470 | $player.addClass('unselectable');
471 | mouseProgress(e.originalEvent.changedTouches[0].pageX);
472 | });
473 |
474 | /**
475 | * 文档操作
476 | */
477 | $("body")
478 | .on('mouseup touchend', function () {
479 | if (isProgressClick) {
480 | isProgressClick = false;
481 | $player.removeClass('unselectable');
482 | if (isNaN(audio.duration))
483 | $already.width('0');
484 | else {
485 | var time = audio.duration*$already.width()/$progress.width();
486 | audio.currentTime = time;
487 | for (var i = 0; i < lyric.arr.length; i++)
488 | if (lyric.arr[i] >= time) {
489 | lyricSelect(lyric.index = i-1);
490 | break;
491 | }
492 | }
493 |
494 | }
495 | }).mousemove(function (e) {
496 | mouseProgress(e.pageX);
497 | }).on('touchmove',function (e) {
498 | if (isProgressClick)
499 | e.preventDefault();
500 | mouseProgress(e.originalEvent.changedTouches[0].pageX);
501 | });
502 |
503 | /**
504 | * .play点击
505 | */
506 | $play.click(function () {
507 | if (q.list.length)
508 | if ($player.hasClass('playing'))
509 | q.pause();
510 | else
511 | q.play();
512 | });
513 |
514 | /**
515 | * .next点击
516 | */
517 | $player.find('.next').click(q.next);
518 |
519 | /**
520 | * .last点击
521 | */
522 | $player.find('.last').click(q.last);
523 |
524 |
525 | $audio
526 |
527 | /**
528 | * 播放结束
529 | */
530 | .on('ended', q.next)
531 |
532 | /**
533 | * 播放中
534 | */
535 | .on('playing', function () {
536 | $player.addClass('playing');
537 | $title.marquee('resume');
538 | })
539 |
540 | /**
541 | * 播放暂停
542 | */
543 | .on('pause', function () {
544 | $player.removeClass('playing');
545 | $title.marquee('pause');
546 | })
547 | .on('timeupdate', function () {
548 | $timer.text(sToMin(audio.currentTime));
549 | if (!isProgressClick)
550 | $already.width(100*audio.currentTime/audio.duration+"%");
551 |
552 | //播放歌词
553 | if (lyric.index+1 !== lyric.arr.length)
554 | if (lyric.arr[lyric.index+1] <= audio.currentTime)
555 | lyricSelect(++lyric.index);
556 | })
557 | .on('error', q.error);
558 |
559 | $listBtn.click(function () {
560 | $more.toggleClass('list-show');
561 | });
562 |
563 | $lyricBtn.click(function () {
564 | $more.toggleClass('lyric-show');
565 | });
566 |
567 | $cover.click(function () {
568 | q.isRotate = !q.isRotate;
569 | });
570 |
571 | });
572 |
--------------------------------------------------------------------------------