Commit ae2781714e913ff103807072f851552307af84cd

Navigation Menu with style and onclick event handler
  • Diff rendering mode:
  • inline
  • side by side

mouchak/static/css/main.css

1/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */
1/*! HTML4 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */
22
3/*3/*
4 * What follows is the result of much research on cross-browser styling.4 * What follows is the result of much research on cross-browser styling.
……
99}99}
100.heading {100.heading {
101 font-family: Helvetica, Arial, Sans-Serif;101 font-family: Helvetica, Arial, Sans-Serif;
102}
102}/*
103.navigation-img {103.navigation-img {
104 top:-20px;104 top:-20px;
105 padding:0px 25px;105 padding:0px 25px;
……
198}198}
199.signal-strength-icon {199.signal-strength-icon {
200 url : "/static/img/signal-strength-icon.svg"200 url : "/static/img/signal-strength-icon.svg"
201}
201}*/
202 202
203/* CSS classes for the image url ends here */203/* CSS classes for the image url ends here */
204204
……
207 Author's custom styles207 Author's custom styles
208 ========================================================================== */208 ========================================================================== */
209209
210/*a .showme {
211 display:none;
212}
210213
214a .default {
215 display:block;
216}*/
217
218/*.nav>li:link .default{
219 display:none;
220
221}
222.nav>li:link .showme{
223 display:block;
224}*/
225
226.nav li a:hover .default{
227 display:none;
228}
229
230.nav li a:hover .showme{
231 display: block;
232 position:relative;
233 top: -3px;
234}
235
236.nav li.active .default{
237 display:none;
238
239}
240.nav li.active .showme{
241 display:block;
242 position:relative;
243 top:-3px;
244}
245
246
247
248.navbar {
249 background-image: url("/static/img/bg.jpg");
250
251}
252
253#forline {
254 position: relative;
255 display: block;
256 height: 1px;
257 /*width: 100%;*/
258 border: 1px solid #444;
259 z-index: 1;
260
261}
262
263.navbar-nav {
264 position:relative;
265 top:-1.5em;
266 left:10%;
267}
268
269.playcollapse {
270 position:relative;
271 top:-1.5em;
272 width:150px;
273 height:auto;
274}
275
276#navpos {
277 position:relative;
278 top:-10px;
279}
280
281#play-about {
282 display:block;
283 position:relative;
284
285}
286#play-signal-intensity, #play-research-methodology, #play-radio-policies, #play-global-radio {
287 position: relative;
288 top:-47px;
289
290}
291
292a {
293 color:#444;
294}
295
296/*a:active .showme{
297 display:block;
298}
299
300a:active .default{
301 display:none;
302}*/
211/* ==========================================================================303/* ==========================================================================
212 Helper classes304 Helper classes
213 ========================================================================== */305 ========================================================================== */

mouchak/static/img/global-radio-icon.png

1PNG
2
3 IHDRSk bKGD pHYs B(xtIME PIDATx]}xՙgޛ>
4V+K%bUkА;#BVZmږlˮkjV@ZRHo{3woȹn n>}9缟猠@u?GRFhdcGG]!vcHPDpoRE& ᴥK/ 544tvv.p$&{9 @ɾ?^sa%"ryqWD`}qu/'cċ0sqINb_ px0"RBd 4#LY;wҒ٦NoTJNGa,DHgEߧNJd2\gYYϙuuu#R/X$"W@em
5)/NoO3eN;w^CrD@9
6@'g3H@u hkDH$rm۝3Rv43J]#"^At< -"=sz3_c7yR개Ӈٗ6{u$`Q^=q W#,Yf
7`,Y0 `,P0 Tf*Yf
8`mh$uG"rGGx2ȋIc}#DbcaN"uL~~s&ɇh;HDѰCPK< ek ӦM+sSN=qKrDq:{{tuuu0{'u;Wf}~ @>t]+`Q)LQX4WVUUٽRtR]Luuu'+E'{!fSSbiE/pHJ8jyRO#cO9bgU!o8-ԏw>j I
92y:;Ks ZwEv8b`0ɑ."9ۖe5y#нtA9nmW"ښN'y ]v}2T=m╎L9aڭyOxg</HνXD"ѣJ&r\9WEj-"4bw0Y׈F%ɼt:g4H2_y#T7` `/y]ld>m"VsDrwt e,m͏am b$v$d<{oM\eEՎn%͛D </)"8#({ygdi/xIv+xƃ|C<}AtB Rjy^4iҠh4z)^dz<'j 0B*hQ>H2Qu>0#"!"WO"r&[\G5%"2
10qfH$"_( \zi^8C)\j$4 y !;:#3t浀։JQ$GRq"<?0-)}$\݊D"ryǐ< ޸&I  2$Тs5'?dGoüp]$/'yD$y $_?,m @"y]*EZr0Ѻ JImAݱ5;jv;E y<HH~^)Zk @8Ny9N 0IQJ%Ͷf 88R厘H$f IS'+\I1`?x<k 7"RH$za9=̩"竳5=]`M'O| C}޼yu=\Yf8"r2JJJb$GI$__0bX)\3W@r,1e|h pme>Er ^IreYqgiV:qmҭ8D2." yj("9qnf""g֖x<p(*qG@{˞6Bu߾t8lذӷl¿Ʋgi{&y` "r=lsk#qLY |Pę3I8N\KS`rSH^(]M423aPn&Fh@_ɚ=/hѢfФpyɿ3M>(L3[@$04e1=S>'@R0 fhϘmg)YykfCDbEUU=|zL]dHF k~nyeӦM+K6<yreYH7\-Р~7H$`@*'J_8Kk%:;;/pՃJKKO!Ѐ޽Ctk L$-"tuu]!dY&j `Ddh`9E>c89]ƫ$;vzRj㖠;\|is"KV\/#\@Lə=4mڴMz!.]rMMͤ4zxw>01+++ZvmI<ljjzrҤI/_<i|ǏO% x\CCé۶mK jkk.H$jjjǏ}}!H(a}^屍Nw;3ZIL2*L,))y6nd4ĺ 8X,ֶq8VQQҶ6x@]]Wb;7n}WضF_RJJJ}~ `鑡+r|Õ JiSP7Iv6"9ϸєRs't,}nGT~9v؋0<|}eY_d2=2 a~1 pٖNSg1J1mA<!˲D"'N*"VVV^fo3._i'jCFDβcH)"khܲe`˲&ڵP3H$2.JqJ?xm'dL&sHZ y"g2RPRRRiӦ`Lq^ %RjRj%
11O _/**:O0\'"7D"i|o% "(oTTTp+Ɍe&l]WW7$0 ݩ)?m{=cwL,Ḻ,53/"e2gH⾒LZ"r#4ᅾ:k~N'9>:N&"h͙ZDryѝt:
12@ g;;;[MENRxp*j6mΨ>777I.!"/ȃf=Dü:jyϛ)Q:uꡙLO$oO$TJ%y eJ_pq.977,*g,:\]]N2_ڜo!$/"w{h7x9&9@PYY9su+&HG/H.M$w `w] $[Lpɛ|4!"sl}>*ϣR:+D$ebOߢ$۶7D
13˲~ϙ$/CwhS4uo KJ`Wh%y-"Yp)"#m>e&yo8ݫ.#9{UJՐ @744\1"g} skfK'ZkEdmwXHrW*%$K20vͦŖe 9]SS_Xll2ٶmH$0ZW-Z>eʔ=|gޥ6ȗڒ%K^xT*5Ȳ3Lg`e^[avرmᏄa7n D"`L˲=rs,[ahll|uǔRoΈ!59]p{I{I>յL&bY֪X<?eb^rRꩊ@EEH(ܜZɋH>#\t:}1G'|3=&'g`?g_G'V͛A9=<Ha$f^1Cr6(^fsss뺏|WD4$W{n5ן3۔RL2ꨣzcƍDп:,** c: Ã3rBpN ,?\e3O1iwxou]owl;vٳgkqpeY/Yd\`yx xʔ)GaxQ:sK~s]]gRwܜH$~`h'/0a^u!^P`2ӧ<LV*"ܲef( p=3jaEL UUU7L"9\?D4H5I"†3<Lk-(BKk]ڳcǎI $h,Xr]w5+lmll&=8)a0qb!^oii̘1n_EdVoHq"5IQ2/TTT,FweHQ3Vڶ=G)X~sa8?>A[^Rjŋ2Id2 ,(..-̛7/ZUZZ);۶H$ΎAk̈i鴾vۚ3ǹ)\Frs]םD2N[g̘1r׮]DdCWWWzҤI,_u]wy83AQgHS2\Dqd2Ŀ;dKII&}}c;?U aczĀMG"Aeꔘ3Ķ8DZ$R;3vPD}Ok}Tz.^M9LDRLjDV3L}9z|yD`ذaD3_e$wzd:> fyyy57"S@mm?5,}f&O<u>L2eRj.+5FkYZ `8_RžSDpeY?2C?p]ײm{"r^___)s semԩZ:ȷH^an{ L&sow|vfKٶ=+wEd`k}@W6_D%y6Edq֫cV~ܜ:uL&Sf ",kq&LHTJ5moA\c+Ғ1 ϱSג|3dNVUv|Yk \&j:p+ue 큈p'zwuu
14 ~mmm0 _p]78I"0DzHԓ"fp4)JM˲ZLo,ڔzrE80?. 1cdDd#W3fL(w0v6zV/a60&$י@F$%(P ue+^n]=uRym̘1^zϋF+-SJWh}BuO }xȳj>6|\yލFEZ`[o_@$C=hp3d(#۷[JCНC4d6kxaڨ@wP`sԔe5 t>sF$cGapSۿ^H~ɲ <{BD,h1Ɍ}78YDMjO YcHRRc-cM'#xEz@C:w9ttǨ:>DwN:E$fh2oul͈IENDB`

mouchak/static/img/icon-1.png

1PNG
2
3 IHDR,,ZbKGD pHYs B(xtIME *scOt IDATXýYyT}=ǂ. .4P⑅vUVB<0)+<
4by#SNʣbuYfj AMP.
5,r-^{x]5_w믿~@,FڃuDŜ ݓz3f zĿ,655;fx"sxgDP SAD8ǒ;,8J <^c̵D{L&MJD1 mfim>!][<ib"8K)u87wtt`˲@ K\ם޾' 'y7$fKD ,G5j?X]]+c̓HS[
6eYX(4_2 qrD?
7nbbcͻ|m`1B@zS(mK_[5#04'Ƙp6*)t1<sܲ()f@DU=9M[@7VBDw^Z ^AnPz=_Դ]\YY٤L&pmm%rJzdY=v]wA[[[>1fD4%˽/LDwrmc&9ҿgeBdr.@̼S)dY"v1f|KKZP=DrG}dr[`ǙODf0<:_(`c-uݩZ8N?Tkk|Mm[eIDe=ecgDlbAۗ%˽n "KEŁorL2f_S/NhNUUZk=D"1BUVVƘR9 ꊘVg.̷bP( Ԍc@$y/ Hӯ=d󦉱(0Zs\,5SuY
8TS1v1Bǃ-Ƙ׉zٰfm^N#!9wGٶKUw"35k
9t:xy:!H"|AFW07"S~Ccs4>;wV8ANڑ6ؽ{8 L&N79^cqN(<ot`w\̰nIV=嫵b!# !aUYgg)0tK=$8.r8B;*a@v#-f6!IR>ݾ x]]]Vmkk"V←+|!YT?'vwwba̟CSu}+"Z' |:*n=wMC:0oޕz̷e@)6qēm9鴐""/38aڱcZTD^D"
10˾)LR!AZ)9I8t –龫ŚWP G"#oH&Mk=Ѳ!̼YeZk~o͏+k~N*˲h* ՉD0Rހ__QY$G `)"z2v,ڶdˤl6>J0C
118%drbKK%%%+Txv!iG_}DDO^ `d2y]_K0;ⴃ^z766&|gϞGh4:;2d2d_mە|]”iL$?}PVVvt6}8lذAD4#F(dDT*Ϋxkƍ_h: <jcr"\q<y 4 QbŊ ƍ|Nff{៷83YIW0uÇQ۰aî@ 4;"*bn"zeY'x)ff٦#f/EK0fKNeb{^ `R*[(mt:m۶Dt6]u#H$իWP]]="`iRBHDT+njjڞH$FD"ْ<p_YY_2gtf^
12Da<O0h4b b?RkY"/p(C͒?^^ZZڜdT*5uE\3G:tvvǀ̯g>璘*++c%%%#1$"3nfb3}cRЧJW"KD<'ȃY){P(l/9.D"?g,Q^fOD;_'ɷC N<y sMr$!J)rIIɫ Gm%IENDB`

mouchak/static/img/icon1on-mouseover.png

1PNG
2
3 IHDR,,ZbKGD pHYs B(xtIME )"gr IDATXý{tŵ?{/D(%j0'&GTPN۲hU^jz/v][ZZ<Rr~ ڥ ! !sNo?њ?Ξ=5I[w})ȭ0Zt`b4UeLi:5d/8Wa'<?WmmF*DM*t~+ᤦ 8Ah LWKXD4; xYG?P~LLRWv Mh+G?~nht"@/
4*~jp}I%wM /D#c&_vᔃߎ4磉Ymrnٹko1.5:_~,EEE" L0Ƥ7ƴc{>ʢvϏr(UV)FJpҀ
5
6RSSRկjOUc*1+7m2mW}a<pLGZ2KϞ=;T6-"򺪶$4 5y/|o[gRj`։GyFZ#Όb_YD]D~dئ|n@\MUD"q͛ݱe_Z,w%080 dE?9s按٦Ƙ555[FѳD$xח|Bu555U#'Ħq\cEd;`Ds^pIIəyc)QիUu.pL<`1ٚ gH-HdM;wc6 u|~) ܲrpYYX,"ppypx|wU]I&%?G6mjL8^Zy^j4w_fϬ嗜SO+**Fl.^ UUU&J-iJUR[[ )--b"Wn<o=Kpy54GU&QEEyz\O]pxNQQ"򬈜644ća\="=ﳜnM$36o|rW IУ&0Iڠx Xy;px1΂L]:\y^ cuD"0]@L&`8)r IR1f{YYxU]gq]4 {Χ5<
7|uE8w뺮5OYU}s,b?FTu{4]!3)K$yNDn\X]]""k Y>.dd
8#̾eMͲ{pj;`@?!"K_.t#nZP 9S'MBSXX8QDʁh0|81Q^V} UH8~*ZhǹՕ ĀEmI92sn[>vU]bO[\aW*<GU/oWy;ТGCSBǢsE4-3wmwmvsLU//((Hz[^^>VDU ab<Y;N/0Ƭ~_sz0.P՗E9Fz"bT;lB4Μ93ź8mދ~6_44%4V[ϰjuvLT59ǀ#ЄΣ#G8QUU5p%LM"pG?ʴڦ[p @fffu:t C1~'o8:-GZ'9^H.j3|IY?6+N
9|aV1w{+23rpp8NUH{{en@xh#Pћt`aTjAUg=o-μoם>zŸ<y:PbJu'9@[W["c7.IQg
10W7s:/߽aH)Ryp>s_V UݤE$?G"}6>yӨYضkmvЁk֬OXsyy"r>;%k,vutt!ϰљzPV<Uua8XJpx<d{wCCC\Ul"+ zU7
118x*󁫀c@CB[oӺc="27++k޽{x.Ǐ?uԉpH$6u@i(:ySPP."YYYlkjj:6\ ,ddd` `k0?bĈ|ߏ<:|潡Pȷ"
12yvWzsvvس>@zWWS"\FӁ]DꖖOw]A?,yޒ9sdKٟ4c$sDdVݛu]7Xm>q='=}VDDr]w|GU鬁nTȚqƭڳgIOO o0M?eH^6Gս PTT4s~?{m+X===wX X~})={@"r5K8WWW$m?}i_3^SSS?,eci_UT:U}vGâ뺎H /:=Ê߁HJJƍ7<Ui-IENDB`

mouchak/static/js/mouchak.js

103 }103 }
104 else if(this.model.get('customMenu') === true) {104 else if(this.model.get('customMenu') === true) {
105 // get the URL fragment105 // get the URL fragment
106 var fragment = location.hash.split('/')[1];
106 var fragment = location.hash;//.split('/')[1];
107 // find out where it is in the nav menu107 // find out where it is in the nav menu
108 var link = $('.nav').find('a[href="#/'+ fragment +'"]')[0];
108 //var link = $('.nav').find('a[href="#/'+ fragment +'"]')[0];
109 var link = $('.nav').find('a[href='+ fragment +'] ')[0];
109 // find its <li> parent all the way up in the main ul.nav110 // find its <li> parent all the way up in the main ul.nav
110 $(link).closest('ul.nav > li').addClass('active');111 $(link).closest('ul.nav > li').addClass('active');
112 //console.log(customNavClick);
113 customNavClick(link, fragment);
111 }114 }
112 }115 }
116
113});117});
114118
115var AppRouter = Backbone.Router.extend({119var AppRouter = Backbone.Router.extend({

mouchak/templates/index.html

34 <script src="{{url_for('static', filename='js/mouchak.js')}}"></script>34 <script src="{{url_for('static', filename='js/mouchak.js')}}"></script>
35 <script src="{{url_for('static', filename='js/models.js')}}"></script>35 <script src="{{url_for('static', filename='js/models.js')}}"></script>
36 <script src="{{url_for('static', filename='js/views.js')}}"></script>36 <script src="{{url_for('static', filename='js/views.js')}}"></script>
37 <script src="{{url_for('static', filename='user_plugins/some.js')}}"></script>
37{% endblock %}38{% endblock %}
3839
39{% block templates %}40{% block templates %}