github.com/insionng/yougam@v0.0.0-20170714101924-2bc18d833463/public/js/jPlayer/demo.js (about) 1 $(document).ready(function(){ 2 3 var myPlaylist = new jPlayerPlaylist({ 4 jPlayer: "#jplayer_N", 5 cssSelectorAncestor: "#jp_container_N" 6 }, [ 7 { 8 title:"Bubble", 9 artist:"Miaow", 10 mp3: "http://flatfull.com/themes/assets/musics/Miaow-07-Bubble.mp3", 11 oga: "http://flatfull.com/themes/assets/musics/Miaow-07-Bubble.ogg", 12 poster: "images/m0.jpg" 13 }, 14 { 15 title:"Lentement", 16 artist:"Miaow", 17 mp3: "http://flatfull.com/themes/assets/musics/Miaow-03-Lentement.mp3", 18 oga: "http://flatfull.com/themes/assets/musics/Miaow-03-Lentement.ogg", 19 poster: "images/m0.jpg" 20 }, 21 { 22 title:"Partir", 23 artist:"Miaow", 24 mp3: "http://flatfull.com/themes/assets/musics/Miaow-09-Partir.mp3", 25 oga: "http://flatfull.com/themes/assets/musics/Miaow-09-Partir.ogg", 26 poster: "images/m0.jpg" 27 } 28 ], { 29 playlistOptions: { 30 enableRemoveControls: true, 31 autoPlay: true 32 }, 33 swfPath: "js/jPlayer", 34 supplied: "webmv, ogv, m4v, oga, mp3", 35 smoothPlayBar: true, 36 keyEnabled: true, 37 audioFullScreen: false 38 }); 39 40 $(document).on($.jPlayer.event.pause, myPlaylist.cssSelector.jPlayer, function(){ 41 $('.musicbar').removeClass('animate'); 42 $('.jp-play-me').removeClass('active'); 43 $('.jp-play-me').parent('li').removeClass('active'); 44 }); 45 46 $(document).on($.jPlayer.event.play, myPlaylist.cssSelector.jPlayer, function(){ 47 $('.musicbar').addClass('animate'); 48 }); 49 50 $(document).on('click', '.jp-play-me', function(e){ 51 e && e.preventDefault(); 52 var $this = $(e.target); 53 if (!$this.is('a')) $this = $this.closest('a'); 54 55 $('.jp-play-me').not($this).removeClass('active'); 56 $('.jp-play-me').parent('li').not($this.parent('li')).removeClass('active'); 57 58 $this.toggleClass('active'); 59 $this.parent('li').toggleClass('active'); 60 if( !$this.hasClass('active') ){ 61 myPlaylist.pause(); 62 }else{ 63 var i = Math.floor(Math.random() * (1 + 7 - 1)); 64 myPlaylist.play(i); 65 } 66 67 }); 68 69 70 71 // video 72 73 $("#jplayer_1").jPlayer({ 74 ready: function () { 75 $(this).jPlayer("setMedia", { 76 title: "Big Buck Bunny", 77 m4v: "http://flatfull.com/themes/assets/video/big_buck_bunny_trailer.m4v", 78 ogv: "http://flatfull.com/themes/assets/video/big_buck_bunny_trailer.ogv", 79 webmv: "http://flatfull.com/themes/assets/video/big_buck_bunny_trailer.webm", 80 poster: "images/m41.jpg" 81 }); 82 }, 83 swfPath: "js", 84 supplied: "webmv, ogv, m4v", 85 size: { 86 width: "100%", 87 height: "auto", 88 cssClass: "jp-video-360p" 89 }, 90 globalVolume: true, 91 smoothPlayBar: true, 92 keyEnabled: true 93 }); 94 95 });