From 631208ad140040b0cd82db32ba6a48acbfbb2a29 Mon Sep 17 00:00:00 2001
From: Sybil <sybil.deboin@gmail.com>
Date: Fri, 19 Sep 2014 23:10:33 +0200
Subject: [PATCH] Menu improved : next track, hide/show player, position fixed.
---
app/assets/javascripts/.music_player.js.swo | Bin 0 -> 12288 bytes
app/assets/javascripts/music_player.js | 35 ++++++++++++
.../stylesheets/.music_index.css.swp} | Bin 12288 -> 12288 bytes
app/assets/stylesheets/music_index.css | 52 +++++++++++-------
app/views/layouts/.application.html.erb.swp | Bin 12288 -> 12288 bytes
app/views/layouts/application.html.erb | 5 +-
app/views/tags/index.html.erb | 2 +-
7 files changed, 72 insertions(+), 22 deletions(-)
create mode 100644 app/assets/javascripts/.music_player.js.swo
rename app/{views/shared/._music.html.erb.swp => assets/stylesheets/.music_index.css.swp} (76%)
diff --git a/app/assets/javascripts/.music_player.js.swo b/app/assets/javascripts/.music_player.js.swo
new file mode 100644
index 0000000000000000000000000000000000000000..0c298efffb640fc2337f7b56d73c4b0909f1b01f
GIT binary patch
literal 12288
zcmYc?2=nw+FxN9-U|?VnU|^WkClj)b{S`~DF9SnyWm0AiNSpu;DNZcN$j(e9q_z%h
zpniC2Qb0~(rBi;1equp^eqwQPYDuwvR$^IVadJ^+K}oTGZfS95a(qEfVr6QPURE&y
z>qn(WLtr!n2!%jtNt&(&FN3j>p#ey#vXY{Luuv$7If_R^U^E0qLtr!nMnhmU1V%$(
zGz3ONU^E0qNC=b^Ff!CLFfcGd{W}>-GosN@?kF`H0;3@?8UmvsFd71*Aut*OqaiRF
z0;3@?8UmvsFd71*Aut3(ATfo3;VT0JLo737{vX!=|G>|{@Pwa%;RHVe!*PBFhPnI<
z3<dlQ4DS3449@%v41D|y43GF281C^gFx=u}V7ST0z_5jnfnhoy1H)uK28Ky|3=9+b
z7#Pa<7#QOC7#O_x7#KYG7#Q677#Otq7#PI)7#LXi7#KeDGBBLrWnkFK%fPUhmw}<4
zmw};>mw_RWmw`c*mw|zumw|zimx19o4+Fzb9tMUVJPZsEco-OF^Dr=E^Dr=k@-Q$2
z@-Q$+@-Q$k@Gvm^;bvg?%+0{?keh+wE;j?iZEgmJTigr`Teuk*W^*$zbaFE=v~n{r
zG;=dBq;NAZgm5!31aUJk7;!T&h;cJ8h;TD72y-(q2yrto2!hPwVqmz<#lUcci-F+~
z7X!mVE(V6BTnr4&Tnr5HTnr3xTnr4ZTnr3)Tnr4lTnr4dTnr4KIT;w%a569~<78l1
z%E`bmo0EZ|nUjH`mXm=Ymy>}Zhm(OJiIagrmy>~kfs=vZ7Y75wD-H&RryL9nk2x3^
z9&s=*9OPhN=;L5u$l_pNFy&xi_{+|~@Rgl`;WIk}!zXqIhRf^>4Exy`7}l^eFwACW
zU<hGnV0g>Mz;K(5f#EnC1H(Z!28L~H3=H*b3=IBk3=E2F3=Gn23=E=d3=G0-3=BeS
z3=BV585kb0GB8YKWnh@d%D~XU%D`aD%D`aB%D`a3%D}+S%E0iMg@Iu|3j@Pc76yiL
z76yhw76yhi76t}G76t}(76yh_%nS@qm>C%EF*7jSVP;^s&CI}Xn3;j0jhTTVo*9y^
zVwf2iqCx3v2<8twPOe1-3<?Uhn$`>o3JMCf5V96Tt7s@G=cQJZC~4~D=V>UYC+B1)
zXRGTdfW+d#3thmPR5X<Ia#Qn4l{EDd3kp*6QZ$roiVG6+>}(PhGE;10ltAiZl<fRc
zD@tti6YXsD!Lmx4)(mN-dC4W2`FRi{lS)fU^7Aw_s~H$T)}uN}K>@O;CO##z7{pSr
zRVXPcO@+8xK>_4ekZ@{|lBQlpNp6mY5@@APYLP;;M`lWDEXX#H|BzM27vvXbf~;54
z)JrZd)=+{Pt)!!%l$4X7oDI{Inp2#rPz?zgFp0%6X^A<-#JDCnBfp$v*W~5rrNSJO
znWmtD9u}Hl*P(;~N{qq6Swpj0fdLfTU|%3bTtQJPwwQy2XpE8_EG)sUM~g%S1$g*?
zq759vumnM@x!^d$Fc;)ih!bG34)Q3>Gq6A)kZg)mOF}YpQ}atpG>Y>}^HP#?@=H_V
zb25udQu9)abQFvX3=9;&2^o|=Al50^DyV3vD?>Q(;IyC)O;!*wO!fJ$xk;%h;H0Nl
zlv<FJn4GGiUY1#0nwVn?N~mh;I_m0BZSe4d<u?UL1_0+N4X7fJ=TnP{@{2STsudU%
z6oQ@gAa-bgmBp79<>)9>D<qbd<b&6nS%LF|f{sFNVns%3W_m`6m4cy>0hnK&nNpHr
zrC<p1YORg}ECe+m2I?rl>|sz)C`&9-fLowotDuxoQc_TCrLSLJUap4-K)vMrTzw^N
zh|0{ow0ymk#F9h}O})~h98jJF<@tD6%zy+S;f75pCAGMuD8CZqZ<xar5Eg;`mRh6%
zig|FcfGDdJ6v{JG(o;+Hk}~sBG=iP=!XaGOvedkiVm&ucKhIzfjN*!bt{_)Omq?@_
z0@({n7@%;0Sf^kMiVKKc8kuQDiMgrJC<Cd12q@Spq~s@;=BDPA=oOZx7F7nP=A<T<
z<QHkELll6L0yf{m(j~&bwV=pXP)JTJNzTwn)l{g4WHJb;pa3yWuOP7~HLt`kKP6SK
zC^a{~EY&$9GbaVrd63A3XdudgAb*z>RVq}2$_(62fJChxQaqw*gt-+_Kp_{s@Jb^k
zvkX#UKn#TByBH-q8~v2bGCSn*56K{K=2X(u%Sp{kFUe4_wN)^HL>VamKnw!$8NkI7
ztU7}P5h%q$gdysbG@)S!l3-APW&?2IPAn-Y(oo7w0aXq8dEhh&aSzBPZ~>@xN0?&d
z8V+JbJUoy<feH#2EGZq7T@V=yTo#pNWELZvhNKHzD?^eCq~1&gC4aq=#3E4E09hNB
znUb0h@)JD4fkab_;&T#9^FWCTqyZF2AoqYXF4%T#I=}^m2G|Ce29PGq@(UFDU}bus
zaseJKa2Mp~L8_GClEji!=ZwU>^i+hg;CznVTzJt5kwyv!h@U`?hE_-*CxAT?4~{~R
zJ2W))Aj&`vQbK4}QULh|RvK64mzI<!rGjG_RPuo0gP>thO)!%X7K7tYDJL@;<N#ez
zgGe1)xtW=wtrVjktE8z1iUE)};9&(4fV8(D(G2oBdgDkvKhG6ZS*TmVszq>Af$Mn%
z1@-(qq<~hpQos`YItaBvsfj6-2$LYm1R@WP(_$-ddqY8?43x4wQ>>7)3doy~dH|vW
zTKA}%nHZ=;L}0a(y0Ilh2o@&_d8y?Jks*4Jq@ke>5r>om>N;RM!C^suy#kFTc+|pj
zA-Xsy%F&__JqyCLAm=|=tbjvFuec<?AfPC}ATd1=)XD_KsfvbDB6@Qg7SGW14{H5_
z>l08kgNi4x#i%WCM9Pf^TMt$b&KjU}s-gkW0*whsDB?}=FdZn3MidW%ZNP6hR6QgI
zsAwoC>4Dvrn3R(mpOcxFU96;_sh66VoS^~tF(}tDfND*M8)2<H1zQDZa~dIM4OWMU
H6Ke(lu}X9|
literal 0
HcmV?d00001
diff --git a/app/assets/javascripts/music_player.js b/app/assets/javascripts/music_player.js
index 8d1ade0..161d7d0 100644
--- a/app/assets/javascripts/music_player.js
+++ b/app/assets/javascripts/music_player.js
@@ -1,5 +1,6 @@
var music_info;
var player;
+var player_display = false;
$( ".clickable_links" ).each(function() {
if ($(this).data().player == "youtube" ) {
@@ -22,6 +23,8 @@ function youtube_click() {
function youtube_player() {
player_destroy();
+ player_button();
+ next_button();
player = new YT.Player('player_block', {
height: '390',
width: '640',
@@ -69,6 +72,10 @@ function soundcloud_click() {
function player_destroy() {
$("#on_play").removeAttr("id");
music_info.attr("id", "on_play");
+
+ $("#player").remove();
+ $("#next").remove();
+
if (player) {
if ($("#player_block").length == 0) {
$("#player_position").append("<div id=\"player_block\"></div>");
@@ -97,6 +104,8 @@ function soundcloud_listener() {
function soundcloud_player() {
player_destroy();
+ player_button();
+ next_button();
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) {
if (error) {
@@ -110,3 +119,29 @@ function soundcloud_player() {
});
}
+function player_button(){
+ if (player_display) {
+ $(".menu").prepend("<span><a id=\"player\">Player [Hide]</a></span>");
+ }
+ else {
+ $(".menu").prepend("<span><a id=\"player\">Player [Show]</a></span>");
+ }
+
+ $("#player").on( 'click', function(){
+ if ( player_display ) {
+ $("#player_position").css("display", "none");
+ $("#player").html("Player [Show]");
+ player_display = false;
+ }
+ else {
+ $("#player_position").css("display", "block");
+ $("#player").html("Player [Hide]");
+ player_display = true;
+ }
+ });
+}
+
+function next_button(){
+ $(".menu").append("<span><a id=\"next\">Next</a></span>");
+ $("#next").on( 'click', next_music);
+}
diff --git a/app/views/shared/._music.html.erb.swp b/app/assets/stylesheets/.music_index.css.swp
similarity index 76%
rename from app/views/shared/._music.html.erb.swp
rename to app/assets/stylesheets/.music_index.css.swp
index 7de8c0b5ec70c19b8cf878edc212195df87c3eff..0fb5045a9f2ae050c1d03772a132e72caf7d677f 100644
GIT binary patch
literal 12288
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
literal 12288
zcmYc?2=nw+FxN9-U|?VnU|^WFR5D~D(>oSBK?a86%B0L3kT?MxQk+<jk)4@JNNpY1
zK>hI4q=1~nN~io1{ltO-{j$u|@?!nsjKreU6#e+z(&Efyy^NCF9KF<{Bmx$XN{@!X
zXb2D&0;MHsx)!_)#zuw)APve&iVDI)p&;fc9u0xf5Eu=C(GVC7fzc2c4S~@R7!85Z
z5EvmLP*T9iP|v`?zy$TLIFx2YqoLeUYBU5!Ltr!nMnhmU1V%$(Gz3ONU^E0qLtr!n
zMnhmU1V%$(2!=pn3Ijt74+Fy$9?1MZtpER*pMl{RKLf*Jeg=j~{0t05{0t1<{0t0g
z{0s~a_!t;2^D!_i=3`)J=VM^d<zrw_=3`)B<6~gB!^^;MiI;(48!rPxGA{!|BrgMl
zH7^6h6CMVJTTpv0gX|iDVKwUH(GVC7fzc2c4S~@R7!85Z5Eu=C(GVC7fx#C7Hu^c4
zb_@y%Hu}W{iFqKFf`W~ztwK&_UUqy*z5-;8adJjtUS4XBUU6z(N@`JjW>K<^g1SCf
zu2{dcIJKx)UtJr_)x%V(pb9e924ucMa!z7#v8@tVX*|R<C9o`-^+k#08em0wC5h?9
zdbx=O)iotGa95Rpgpr&8Qlzi04HmA|%gWEp(@;`S($vIhHAn+ii&6bul39|Issjy#
z(xM#P=7AIvVIVAYKs1v3LEOC59L!JzN$3@qCTXZEtLvz%<Mt3pA;f;naL!CovIE5_
zBtSD$6jbeyqdPSZBm&l~prD{oQk0mStze7rG}wOqjFOUqVyhVa7=4ZM^70rxP5a{f
z(!7-9ocz+17`^2D+!%d*kP8_=W~Am6XQn|-D5)$+Rj{>HP(r9z0xQC4m7Z3aEy65J
zgDUe&OG=Ycl@u5h6jBmP5_L<9a%`1AK7<Jr<Rn(67D2=yz6QHO)efO2GX+^194JZ(
b3^qBLur!*SlbM{In3R(m4@wioN(u}BL2)uK
diff --git a/app/assets/stylesheets/music_index.css b/app/assets/stylesheets/music_index.css
index 7176eca..ecc5763 100644
--- a/app/assets/stylesheets/music_index.css
+++ b/app/assets/stylesheets/music_index.css
@@ -1,13 +1,12 @@
-a, .clickable_links span{
+a, .page.current, .clickable_links span{
display: inline-block;
font: 15px Helvetica Neue, Helvetica, Arial, sans-serif;
overflow: hidden;
color: rgba(255,220,180,1);
- font-weight: 550;
vertical-align: middle;
}
-a
+a, .page.current
{
text-decoration: none;
/* 250 220 180 1*/
@@ -18,6 +17,7 @@ a
.cloud{
color: rgba(0, 110, 140, 0.95);
}
+
.cloud:hover{
color: rgba(255,220,180,1);
background-color: rgba(0, 110, 140, 0.95);
@@ -32,8 +32,8 @@ a:hover{
ul
{
list-style-type: none;
- margin: 5px;
- padding: 0px;
+ padding: 0;
+ margin: 0;
}
.clickable_links
@@ -57,12 +57,6 @@ ul
.page.current{
background-color: rgba(255,220,180,1);
color: rgba(0, 110, 140, 0.95);
- display: inline-block;
- font: 15px Helvetica Neue, Helvetica, Arial, sans-serif;
- font-weight: 550;
- vertical-align: middle;
- border-radius:20px;
- padding: 2px 6px;
}
.clickable_links:hover{
@@ -74,22 +68,42 @@ ul
}
.menu {
- background-color: rgba(0, 110, 140, 1);
margin: auto;
- cursor: pointer;
- border-radius: 12px;
- width: 60%;
+ text-align: center;
+ background-color: rgba(0, 110, 140, 1);
+}
+#white{
+ height: 73px;
}
+#header{
+ position:fixed;
+ width: 100%;
+ background-color: white;
+ padding: 10px 0;
+ margin: 0;
+ top: 0;
+}
+
+body, html, head{
+ padding:0;
+ margin: 0;
+}
+
+
.menu a{
- width: 24.55%;
+ cursor: pointer;
+ width: 15%;
padding: 15px 0;
- border-radius: 12px;
display: inline-block;
font: 20px Helvetica Neue, Helvetica, Arial, sans-serif;
overflow: hidden;
vertical-align: middle;
- text-align: center;
+ border-radius: 0;
+}
+
+#player_position{
+ display: none;
}
.music_id
@@ -110,7 +124,7 @@ ul
.music_sender
{
- width: 10%;
+ width: 12%;
}
.music_tags
diff --git a/app/views/layouts/.application.html.erb.swp b/app/views/layouts/.application.html.erb.swp
index 1caf2a10765c22112bcad1804794860ce23a4401..be86fcde058000883890e6b2866bfe0a62704611 100644
GIT binary patch
delta 301
zcmZojXh@JsG6?hZRWR2xVPIfj5MW?9+$<B)%=LyP*LS1TH-1Lh&4L1-`FVAD7#Q~Q
zKvc+17F1AA)8=PjkmP4z5aMTG_`}D*aGsBWVGbVyLp~n^g9{%6gB2eGgApGC!v|gl
zhUdHt47Ye07;f@1FkIwiU})iGVDRK+U|{8CU^vFZz;G05`ZgX0hB-V83~P887`k{E
z7;<?wGqNObPj=K$=CpwV{mBn?3@4{*2~Bp?kQKDi&nU^wv14GcDNZiREGSW!?4Tjd
z4i%m3s1ZGRt+wK1FCCxB8+Gd^2k3E4R?w4Wwb4(>ESnsu_ew1#vrHi~#a1aJH8CZ%
XNXd@D1}0LTky(<eWCu~|pnm`W|I$f<
delta 447
zcmZojXh@JsG6?hZRWR2xVPIfj5MW@iHI)u&=6b_oC%94S8$YAWW<i0^{JgO|3=A)M
zASz@g3o5ABTk|t8sPZ!~{NQ6?ILgPsFoTbQA(xMVA(@YXA)1eY!H$oCL57ckL70z$
zfsK!Wft8Pe;V&-(!v<akhEiSz218y3hEF^U3?HE;gZLu63=G1&3=H3S7#P0sFfcsl
zVPJU1!@w|&hk;=#4+FzFZU%-RZU%;zTnz3Ev$z--Qn?ryY`7R0K65fKoZ)0(IL*nx
zu#1y{VJ9a8!y--whJ~CA4DOr^3~rnZ40|~k81`^5FwEs(V3@<fz~IQiz+lF)nUTeU
zeeyqT?#chOl_x*Yv6yVAqcGV}M{DvkodhUtIN4A~LdeEOKcgf!$Bu!)rZ~AMv!Dc|
zOarP-ZL*P$^<)7Z!O0JFgrH(NP}&VjM?&ePlZ|vVCqL5><FP>kleKgVH$T&nW1K9f
r$1B62pkR}dS*DPgVyje;lUSKr6km{EoLQ2YpQkk0K=0LLXZ^hZSxs&M
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index fd88f04..10b5eac 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -6,6 +6,8 @@
<%= csrf_meta_tags %>
</head>
<body>
+<div id="white"></div>
+<div id="header">
<ul>
<li class="menu">
<span><a href="/musics">Home</a></span>
@@ -14,8 +16,7 @@
<span><a href="/tags">Tags</a></span>
</li>
</ul>
- <div id="player_position">
- <div id="player_block"></div>
+ <div id="player_position"><div id="player_block"></div></div>
</div>
<%= yield %>
diff --git a/app/views/tags/index.html.erb b/app/views/tags/index.html.erb
index f2321bf..5e26506 100644
--- a/app/views/tags/index.html.erb
+++ b/app/views/tags/index.html.erb
@@ -1,4 +1,4 @@
<% @tagcloud.each do |tag,weight| %>
- <%= link_to tag, '/musics/tags/'+tag, style: "font-size:"+(15+weight*200).to_s+"px", class: "cloud" %>
+ <%= link_to tag, '/musics/tags/'+tag, style: "font-size:"+(15+weight*100).to_s+"px", class: "cloud" %>
<% end %>
--
GitLab