From cdb65247b36f2089ab35e0ea99820327af85e399 Mon Sep 17 00:00:00 2001 From: Sybil <sybil.deboin@gmail.com> Date: Wed, 24 Sep 2014 05:07:46 +0200 Subject: [PATCH] - Tiny player included in the menu, - Expanded player with a better integration, - To finish : Autoplay goes to the next page. --- app/assets/javascripts/.music_player.js.swo | Bin 12288 -> 20480 bytes app/assets/javascripts/music_player.js | 63 +++++++++++++++----- app/assets/stylesheets/.music_index.css.swp | Bin 12288 -> 12288 bytes app/assets/stylesheets/music_index.css | 7 +-- app/views/layouts/.application.html.erb.swp | Bin 12288 -> 0 bytes app/views/layouts/application.html.erb | 4 +- 6 files changed, 53 insertions(+), 21 deletions(-) delete mode 100644 app/views/layouts/.application.html.erb.swp diff --git a/app/assets/javascripts/.music_player.js.swo b/app/assets/javascripts/.music_player.js.swo index 0c298efffb640fc2337f7b56d73c4b0909f1b01f..a1c8aa8500088941548c92fbbd3ffa219f5ba17d 100644 GIT binary patch delta 2689 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 delta 984 zcmZozz}S!=oMaH@>8oI_XTre1z#zcDFsV;wqwsrveny6R1_lNukSGHK!{o_=0^*x9 z1ZMD0Jm4@%fu;T{0|P@WGepZ|sG<-23=B{B85mCRGcX+IXJDAi&%jW?&%of$&%of! z&%nUP&%p4AkAdMH9|OZJJ_d%Hd<+a*_!t<b^D!_?=3`)(#K*uek&l6)jE{jKj*o%C zi;sc9gO7p1osWS*n~#A(oR5Klg^z*ZGcQ9u!wFsnhON8|42yXg80vW$7z%kA7y@}2 z7*u%~7}$9k7#MjO7=H6GF#P0UVEDnq!0>>Ffnhce14A|s14Aee14AGW1A`<F0|NsO z1H&I~28Pev3=9vs85r(zGcerdW?;C*&A_mQn}K0AHv>Z_Hv>Z}Hv>a6Hv>ZoHv>Zm zcRd3`5H|yZ5jO*a7&ilh2sZ<RFgF8(5H|yZAjmK-28P>Q3=BuO7#I$5F)$qDVqjRx z#lX<a#lR5H#lR59#lYao#lWD)#lWD;#lRrT#lY~HlYwCkCj-MWP6mdhoD2-JIT;w5 zIT;vgIT;voIT;voI2jm{I2jmpIT;uj>Ny!0esM4`yy9SBc*?=R@R);v;SmP|!$A%P zhCU7khAa*S22&0OhQI6#3}4w97(TNzFnnTXV7ScAz_6d4fng0h1H)`~28IxJ28Oq6 z3=Fr~7#NPTF)$otV_?|E#=ua|#=zju#=xM+#=s!W#=s!T#=s!V#=s!N#=!7{m4PAa z0V@N;R8|ItiL49^9jputwyX>cmaGg67OV^m{HzQNpII0f_OmcBOl4tUC}&|{C}d$^ zNMm7OFl1q1U}s@qc*V@X@PwIx;T|&s!yRS@hTF^x42PK+7}}T_7~+{BX)A`AfgzfC z;>L?gwWxqWL7`UDnn6K9L7^5x)=u7NYcg5dE`0Jdbv};xl+5CSoW#n>ukExrJTg;K zW0f?mCm&Fk6-zEI)=+}VD(NUFCFSHNXDdy<uOc;ho;n*s;~aZ!j^K>^a+pSabd7oW zd8tZJH)N(MXefZ}OD%%iyhcffQDO28C0iDdF_Wd0Lo~n+vC&Vov(YauNX)Z?Xa{LV z(>p_1d9t(0w#gj+Va$d`29vY>OE+&&Wn!J&rJXRjNaqNvy0N8!`ebKa-N_qN9XE^W O&1YnX`f2hleKi2CMa}2{ diff --git a/app/assets/javascripts/music_player.js b/app/assets/javascripts/music_player.js index 161d7d0..63d0ab5 100644 --- a/app/assets/javascripts/music_player.js +++ b/app/assets/javascripts/music_player.js @@ -1,6 +1,8 @@ var music_info; var player; -var player_display = false; +var player_expand = false; +var player_min; +var player_max; $( ".clickable_links" ).each(function() { if ($(this).data().player == "youtube" ) { @@ -25,8 +27,13 @@ function youtube_player() { player_destroy(); player_button(); next_button(); + + var player_height; + if (player_expand) { player_height = 390; } + else { player_height = 30; } + player = new YT.Player('player_block', { - height: '390', + height: player_height, width: '640', videoId: music_info.data().url, events: { @@ -35,10 +42,22 @@ function youtube_player() { 'onError': player_error } }); + + var white_top = $("#header").height(); + $("#white").css({'height':white_top}).slideDown(); + player_min = 30; + player_max = 390; } function next_music() { music_info = $("li[data-id=\'"+music_info.data().id+"\']").next(); + if (music_info.length == 0) { + + window.location.href = $(".next a").attr('href'); + + //setTimeout($(".clickable_links").first().trigger("click"),2000); + //console.log($(".clickable_links").first()); + } if (music_info.data().player == "youtube" ) { youtube_player(); } @@ -106,8 +125,13 @@ function soundcloud_player() { player_destroy(); player_button(); next_button(); + + var player_height; + if (player_expand) { player_height = 120; } + else { player_height = 20; } + var music_url = "https://www.soundcloud.com/"+music_info.data().url; - SC.oEmbed(music_url, { auto_play: true , maxheight: 120, maxwidth: 1000 }, function(oEmbed, error) { + SC.oEmbed(music_url, { auto_play: true , maxheight: player_height, maxwidth: 1000 }, function(oEmbed, error) { if (error) { next_music(); } @@ -117,27 +141,36 @@ function soundcloud_player() { setTimeout(soundcloud_listener, 2000 ); } }); + + var white_top = $("#header").height(); + $("#white").css({'height':white_top}).slideDown(); + player_min = 20; + player_max = 120; } function player_button(){ - if (player_display) { - $(".menu").prepend("<span><a id=\"player\">Player [Hide]</a></span>"); + if (player_expand) { + $(".menu").prepend("<span><a id=\"player\">Player [Reduce]</a></span>"); } else { - $(".menu").prepend("<span><a id=\"player\">Player [Show]</a></span>"); + $(".menu").prepend("<span><a id=\"player\">Player [Expand]</a></span>"); } - $("#player").on( 'click', function(){ - if ( player_display ) { - $("#player_position").css("display", "none"); - $("#player").html("Player [Show]"); - player_display = false; + $("#player").on( 'click', function(){ + if ( player_expand ) { + $("iframe").attr('height', player_min); + $("#player").html("Player [Expand]"); + player_expand = false; + } else { - $("#player_position").css("display", "block"); - $("#player").html("Player [Hide]"); - player_display = true; - } + $("iframe").attr('height', player_max); + $("#player_position").slideDown(); + $("#player").html("Player [Reduce]"); + player_expand = true; + } + var white_top = $("#header").height(); + $("#white").css({'height':white_top}).slideDown(); }); } diff --git a/app/assets/stylesheets/.music_index.css.swp b/app/assets/stylesheets/.music_index.css.swp index 0fb5045a9f2ae050c1d03772a132e72caf7d677f..ba4e1e690d16628d0ff3ab8693514058f9f78121 100644 GIT binary patch delta 432 zcmZojXh;xEG6?hZRWR2xVPIfj5MW@~X`&ReexvAbe#Xwtf&!oUc>~!P7$$N+Bs(_? zD#$a|Cvh_{_;52YC~-3|C~z|{NN_VSaBwp)uyHdmuyQjn{NZ9?c*VuQaGQ&P;Q$u{ z!zL~Uh80{449mC}7?yG|FihrRU})oFV5sC`U?}HeU?}5aU?}BcV94QOV2I>mVDRQ* zV6fm~V36lxV0gmGz;J<+fnggb1H&Rt28IQk4D}52IT;vwIT;v=IT;uVIT;uVI2jny zI2jmHI2jniIT;unIT;x2IT;x2I2jm>I2jlWI2jm}I2jleI2jn^IT;v)I2jlOI2jn2 zI2jliI2joJb1*P`<X~WU&%wa(kb{BYJ_iHCJq`wjOB@Ug7dRLg4skFr9N=JJ*w4Yh zu$@DOfng~J1H)tvNWe63Ffi0{FfdecFfbHyY-VJ6%{tjs!&$Pnww6Jmww9rmK|vum zu_!$=&q~2SA+fY%a<|44afpa+QhrHEey){*X+edxf`Wp==2}fN#>vgvLX&T3*)f_; R7T1nsHZ7>woUc8R1pvnfP<;RZ delta 417 zcmZojXh;xEG6?hZRWR2xVPIfj5MW?9+$j^XW25MAe#WlNf&!oUdEMC<7`izil3kkx z733M~)3_NJ0=O9%)VLWKRJa)!WVjg^c(@rDxVRY@IJp@Z7`Pc2-f=N7+~;CoIKsui zu#t;_VKEm2!%Qv)hUr`k4AZz67+Sa(7|OXA7_zt+7&5pR7}B{I7}B^H7-G2?7`(U` z7;Ly07&N&U7zDT&7_M?MFdXD$U|7z{z%ZGUp`KwPCj-L-P6mcLP6mctP6mc-P6mc7 zP6mbqP6mcJP6mcRP6h^RP6h@`P6h@GP6h@YP6h@oP6h@UP6h@kP6h@^P6h@ZP6h@p zP6mcQ91IM<I2agyaxgHw=3roW$-%&In}dPjCI<t<4Gso|GaL*Ir#KiG_HZyT?BZZx z*vTQoz_5{nfnh!e14AzdByc)87#K=97#IpUHZ!ukW}R%R;Vi76kegVPo|$K*V4#p# zT2jkU%P@JO#uL7j%;JKa#7ZlLy!^aW>&-oyW{i`Cb%iIZXbVlgqGiWuK3P~ha&v+9 G1Qq~EluJYa diff --git a/app/assets/stylesheets/music_index.css b/app/assets/stylesheets/music_index.css index ecc5763..e2ec1d3 100644 --- a/app/assets/stylesheets/music_index.css +++ b/app/assets/stylesheets/music_index.css @@ -68,19 +68,18 @@ ul } .menu { - margin: auto; + margin: 5px auto; text-align: center; background-color: rgba(0, 110, 140, 1); } #white{ - height: 73px; + height: 63px; } #header{ position:fixed; width: 100%; background-color: white; - padding: 10px 0; margin: 0; top: 0; } @@ -103,7 +102,7 @@ body, html, head{ } #player_position{ - display: none; + margin-bottom: 5px; } .music_id diff --git a/app/views/layouts/.application.html.erb.swp b/app/views/layouts/.application.html.erb.swp deleted file mode 100644 index be86fcde058000883890e6b2866bfe0a62704611..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 12288 zcmYc?2=nw+FxN9-U|?VnU|=}hEECeq^@b(amw}<UGAT0$Bu)T_6ekvBWM`%lQd<W$ zP(M61DIh1Y(kZ`0Ke3=dzbrGgyjVXcu`<83q!=WUlbM`Yl9`{Umr;_NqnBEgM8Nt{ z>Cq4v4FN(SP+F3vYr)H4Y-DHvQmU+^s30s93Sy4p(GVC7fzc2c4S~@R7!85Z5Eu=C z(GVC7fe{h{B?XKO^$ZLQOi=&ILTN@c8p<7|MnhmU1V%$(Gz3ONU^E0qLtr!nMnhmU z1V%$(Gz3ONU^E1VU<f3pFfi!yFfi=pfz1EI`u`vJ85myjGcY{jXJ9zS&%lt$&%hAK z&%ofx&%ofs&%mI~&%hwb&%hwW&%p49kAdMl9|OZ2J_d$-J_ZICJ_ZIWJ_ZIOJ_d#l zybKJ_c^MdP@iH*n<Yi#E$jiXc!pp$m$;-gN%FDoTjE8~YDAfLKJPZtTco-Pg@GvlR z@h~vtg4{F&!*tZiqaiRF0;3@?8UmvsFd71*Aut*OqaiRjL%>EKw8qwsfx)IYxhS)s zM4`AS*;Xl|q@<wON?*TRuQ<Qd1`70{v<(q@@=}s>@=GxlVu~PHhbf6E0#go^fl~OK z4{=J0UUGh}enC!RWonUrVnL=}R<V+ujXuQFcG!KNoS&DMnp^@317t&rQ?hl9^bGV2 zh%uwQyj%~ouDLWR73_k{w4%h^)cC}LOcd)?Z56T-%Mu~ZiO<YS&M8evjW0<|S5QwZ zD1fbpR@YHbPf09E)GaA3O3Kg4%*!s;Eh$P&&Q@2jwNof5Dos^TwPUc+Ps&fJ1VyQ; ztwLpHYEBABR6)T;KP9uwjzK{|LBS>^vrHi~#a0OtAn^tH#hIW5*GhKiGD$i4$=M*M zg7m^ou+cBgftsYBlL=)N7bND{*(54t6s4xwD(RObrWY&Og(RjI+vq2Pf*K^P0I?oT zX=!n4QL&O;D2O7cI5{IRFE2HxSjo;A$|9&Gx3oAjxmd~0BR@A4Q*lnFLUK-Gaj~sZ zZfahs6390;An(D0A|o|1CACP&jsY%Go{?FS3JVnm8%TKD=z|o3wX51HBo`N@#pkA$ zB!XhG7#ahrwhF~1l{u-!8L6oy@t_C<$%0}8Et+#vQ!*2+6x0)Qa)^s`1qGXu%#xf` gJH*<08-0ifgAK%8Hjtcdqv+!A91<DessP~w0JFS?$p8QV diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index 10b5eac..2d23ae9 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -16,8 +16,8 @@ <span><a href="/tags">Tags</a></span> </li> </ul> - <div id="player_position"><div id="player_block"></div></div> - </div> + <div id="player_position"><div id="player_block"></div></div> +</div> <%= yield %> </body> -- GitLab