Need a unique gift idea?
A Pastebin account makes a great Christmas gift
SHARE
TWEET

json player dosary

5ALDOUN Jul 12th, 2018 66 Never
Upgrade to PRO!
ENDING IN00days00hours00mins00secs
 
  1. _.templateSettings = {
  2.     interpolate: /\{\{(.+?)\}\}/g
  3. };
  4. var playCtrl = $("#playerCtrl"),
  5.     musicList = $("#music_list"),
  6.     playerProgress = $("#playerProgress"),
  7.     playInfo = $(".playing_info"),
  8.     album_art = $(".album_art"),
  9.     lyric_wrap = $(".lyric_wrap"),
  10.     lyric = lyric_wrap.find("#lyric");
  11. $(document).ready(onReady);
  12. function onReady(){
  13.     getPlayList();
  14.     initPlayerProgress();
  15.     initPlayCtrl();
  16.     $player.bind("error",function(e){
  17.         alert(e.message);
  18.     });
  19. }
  20.  
  21. function initPlayerProgress(){
  22.     var total =  playerProgress.find(".totalTime"),
  23.         current = playerProgress.find(".currentTime");
  24.     $player.bind("timeupdate",function(){
  25.         var currentTime = this.currentTime,
  26.             duration = this.duration;
  27.         $progressbar.setProgress(currentTime/duration*100);
  28.         current.html(parseTime(currentTime));
  29.     });
  30.     $player.bind("playing",function(){
  31.         $progressbar.slideable = true;
  32.         musicList.find(".selected").addClass("playing");
  33.         playCtrl.find(".play").addClass("playing");
  34.         total.html(parseTime(this.duration));
  35.         renderInfo($player.music);
  36.         renderLyric($player.music);
  37.     });
  38.     $player.bind("pause ended",function(evt){
  39.         musicList.find(".selected").removeClass("playing");
  40.         playCtrl.find(".play").removeClass("playing");
  41.         album_art.removeClass("active");
  42.         if(evt.type == "ended"){
  43.             if($("#autoplay").prop('checked')) {
  44.                 $("#prev").trigger('click');
  45.             }
  46.             $progressbar.slideable = false;
  47.             $player.unbind("timeupdate",updateLyric);
  48.             text_temp = undefined;
  49.         }
  50.     });
  51.     $progressbar.bind("change",function(){
  52.         if(!$player.music)return;
  53.         var p = $progressbar.progress;
  54.         var time = $player.geDuration()*(p/100);
  55.         $player.seekTo(time);
  56.         console.log(time)
  57.     });
  58.     function parseTime(time){
  59.         var min = String(parseInt(time/60)),
  60.             sec = String(parseInt(time%60));
  61.         if(min.length==1)min = "0"+min;
  62.         if(sec.length==1)sec = "0"+sec;
  63.         return min+":"+sec;
  64.     }
  65. }
  66.  
  67. function renderInfo(music){
  68.     playInfo.find(".songName").html(music.name);
  69.     playInfo.find(".singer").html(music.singer);
  70.     album_art.addClass("active");
  71.     album_art.find(".cover").attr("src",music.cover);
  72.     var infoTemp = _.template($("#music_info").html());
  73.     $(".music_info").html(infoTemp(music));
  74. }
  75.  
  76. function renderLyric(music){
  77.     lyric.html("");
  78.     var lyricLineHeight = 27,
  79.         offset = lyric_wrap.offset().height*0.4;
  80.     music.lyric.fetch(function(data){
  81.         music.lyric.parsed = {};
  82.         var i = 0;
  83.         for(var k in data){
  84.             var txt = data[k];
  85.             if(!txt)txt = " ";
  86.             music.lyric.parsed[k] = {
  87.                 index:i++,
  88.                 text:txt,
  89.                 top: i*lyricLineHeight-offset
  90.             };
  91.             var li = $("<li>"+txt+"</li>");
  92.             lyric.append(li);
  93.         }
  94.         $player.bind("timeupdate",updateLyric);
  95.     },function(){
  96.         lyric.html("<li style='text-align: center'>Under Maintenance| سنعود قريبا</li>");
  97.     });
  98. }
  99.  
  100. var text_temp;
  101. function updateLyric(){
  102.     var data = $player.music.lyric.parsed;
  103.     if(!data)return;
  104.     var currentTime = Math.round(this.currentTime);
  105.     var lrc = data[currentTime];
  106.     if(!lrc)return;
  107.     var text = lrc.text;
  108.     if(text != text_temp){
  109.         locationLrc(lrc);
  110.         text_temp = text;
  111.     }
  112.     function locationLrc(lrc){
  113.         lyric_wrap.find(".lyric_wrap .on").removeClass("on");
  114.         var li = lyric_wrap.find("li:nth-child("+(lrc.index+1)+")");
  115.         li.addClass("on");
  116.         var top = Math.min(0,-lrc.top);
  117.         //lyric.css({"-webkit-transform":"translate(0,-"+lrc.top+"px)"});
  118.         lyric.css({"margin-top":top});
  119.     }
  120. }
  121.  
  122. function getPlayList(){
  123.     var list = $("#music_list");
  124.     $.ajax({
  125.         url:"https://pastebin.com/raw/PnsG1svX",
  126.         cache:false,
  127.         success:function(data){
  128.             list.empty();
  129.             $player.playList.add(data);
  130.             var template = _.template($("#music_list_item").html());
  131.             $.each($player.playList.all(),function(i,m){
  132.                 if(m["link_lrc"])m.lyric = new Lyrics(m["link_lrc"]);
  133.                 var dom = $(template(m)).get(0);
  134.                 dom.index = i;
  135.                 dom.music = m;
  136.                 list.append(dom);
  137.             })
  138.         },
  139.         error:function(){
  140.             list.html('<li style="text-align: center;display: block;">Under Maintenance|سنعود قريبا!</li>');
  141.         }
  142.     });
  143.     list.on("click","li",function(){
  144.         musicList.find(".selected").removeClass("selected");
  145.         $(this).addClass("selected");
  146.         $player.play(this.music);
  147.     });
  148. }
  149.  
  150. function initPlayCtrl(){
  151.     playCtrl.find(".play").bind("click",function(){
  152.         if($player.music){
  153.             $player.play($player.music);
  154.         }else{
  155.             musicList.find("li:first-child").trigger("click");
  156.         }
  157.     });
  158.     playCtrl.find(".prev").bind("click",function(){
  159.         var prev = musicList.find(".selected").prev("li");
  160.         prev.trigger("click");
  161.     });
  162.     playCtrl.find(".next").bind("click",function(){
  163.         var next = musicList.find(".selected").next("li");
  164.         if(next.length>0)next.trigger("click");
  165.         else{
  166.             musicList.find("li:first-child").trigger("click");
  167.         }
  168.     });
  169. }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top