From bde1373c6ebfc19488bacb06026b4a37a2e0cb53 Mon Sep 17 00:00:00 2001
From: Guillaume Rousse <guillaume.rousse@renater.fr>
Date: Thu, 26 Jul 2018 11:59:36 +0200
Subject: [PATCH] add language selection menu on renater templates

---
 resources/Makefile.am                |   3 +
 resources/css/renater.css            |  13 +++
 resources/images/en.png              | Bin 0 -> 1760 bytes
 resources/images/fr.png              | Bin 0 -> 1204 bytes
 resources/images/lang.svg            | 132 +++++++++++++++++++++++++++
 templates/renater/web/index.tt2.html |  34 +++++++
 6 files changed, 182 insertions(+)
 create mode 100644 resources/images/en.png
 create mode 100644 resources/images/fr.png
 create mode 100644 resources/images/lang.svg

diff --git a/resources/Makefile.am b/resources/Makefile.am
index e01cb83..78bec68 100644
--- a/resources/Makefile.am
+++ b/resources/Makefile.am
@@ -72,6 +72,9 @@ nobase_www_DATA = \
 	images/logo_renater_blanc.png \
 	images/facebook.svg \
 	images/twitter.svg \
+	images/lang.svg \
+	images/en.png \
+	images/fr.png \
 	jquery-3.3.1.min.js \
 	jquery-ui-1.12.1/images/ui-icons_444444_256x240.png \
 	jquery-ui-1.12.1/images/ui-icons_555555_256x240.png \
diff --git a/resources/css/renater.css b/resources/css/renater.css
index 377bc95..5f461b9 100644
--- a/resources/css/renater.css
+++ b/resources/css/renater.css
@@ -267,6 +267,19 @@ td.label {
     border: 1px solid #41494c;
 }
 
+.nocursor{
+    cursor: default!important;
+    opacity:0.6;
+}
+.nocursor label{
+    cursor: default!important;
+    color:#aaa!important;
+}
+.nocursor [class*=" fa-"]:before{
+    text-align: right;
+    font-size: 1rem;
+}
+
 /* Small screens */
 
 /* Define mobile styles */
diff --git a/resources/images/en.png b/resources/images/en.png
new file mode 100644
index 0000000000000000000000000000000000000000..1c9d84fdbc9371b0371e374d11327096f26aa57d
GIT binary patch
literal 1760
zcmaJ?X;2eq7!FdXpfF$&0ii5wEh^?F!~_D3Nw^aPB7{?yWCIbB4Vw)KU`5edWdIdV
z<fw|Ms94d0Z5blApjZ#k;KeBI0QEvdTRB^`8wBl-(w*7;j(MKvectbVcfPGFL_s#z
zF4hDB!6qb_ABB&O_-i+F2L7$s=9GyK&X_=gMI&-d2ca;5D??IXAVdkJ!cj0J%g($E
z`w<A{fI=+6B*JjE6j72O6NaQ$s&O`f;1{4*L(+5@15)5rg^B|XHl7Cog^UBnGK3VN
zng^#Tf^$$fI!7dy=A=tmGBCg&@YAz#0VRw<fL@uQ(y;X$a6*@j&rRE85SV~q=^XH#
zDT#0ez(Y_NV2~(8DaD5Z_)tkyx;K-_Tnf-AR0^3wBU5QaDw9p8u_+W_@&WN^s7%g|
z;s;K~!dDzH4a3xIGFhk7k#uwtf~JzGEEdb8L8B3I1W}W%!XQ0SrCBhgz=t(bRH4Qc
zhzc+%LMezA<AAu+cPS{<?`2h*$z#F~jI4*$WGabbN@)rx6#hR{seF&tU{UY~zyB$$
z5ofDmaulpVw5Sv>oP2>Pl$y;$VF*J|F@j`Fo#Ki#1Vc1wh#KHUGk{oyN`~k(6KJ83
z9iq};kV*=N@HrsPCn*#%wt&f_2&i0dDq}gFN)=F9KHiLFyydh&uE3kZr!%Lxd_<~M
z!YXWvEBnA@Ov^Pjf>Mn~=EJBW3zh|<h!U7cn5~%J3vF7xNv>>qFZ5}-WZVqdRMvl$
zd1?#q9n<uE)8dQwZ4ayPUPtk!-s9a^h5sutA$+b_-&G!+9_#=)yq3$gy43qV#4us#
zV?kPVb>}dxK0JmSqKWiA6Amu2&Xq{)7ILave(8J_6e)35)Rb*aD0Lhr3B%~_(7>sF
zL+YxtXN?bv4!93hk=%b~jWj;GUiw2~xUM#)ymb8GgU6*ih4HnYdLVtamL9`dNrunq
zZf$-2%;@L>d(iHW@oZnHATPP+>R5Z9WHr!!<3YN?czRK$Qm|5FY&yr|g>KRx2-?zX
z?=;uV#+p!9cW@?DNlNS}tjXjCcaCgm6U|$iyd}1v%5`njs`$mD!&+WW-`^G<OLlXs
zZ`Ozd_s(Knx>&x3K{yavEvl}+TIvS;9=Pe-%2}V>UjGJ#eY?TDFSQ+E9A^2cntE@q
zIdgtO(OCLyt}#m=5M(TGok2Ke?g@M4_gZ#YozV6aCpK+E1Y^DX_xqGXciWrHFAdsq
z%1KnM!I^Au@~OBV3oy!*u04s~HXjo@2B4N_#ea?VY_VcFZ>zK&Y(L+9i_vz*sr?C7
z8eS+$J!W8to`=Q@T%PPrG9KDnvGn@GWi2j6DzfWwwq0*$T2t@2HDf)ttw;ZS<l-^d
zA4V&5n}4UwVut_P0e9ZcJ<lqGm9O2AOxJrEwkLx?`|+_lOY`v&pe5zRg=T4mNRI8g
z)&I8Yt1B5<FUR(w;huISd0ylGh@+o*Zou2xW_kUKJ$y&nY&k7%!`|es1}eQ|W%}bw
zZrxn7;ukZY--*b-f701-F=1%?c~<zdyIEEx;EwI>K@{;-3vKzG4Ln+hv55GzukcO7
z$eaEpe#uE~#)Tjj(H^v0;^LdU4u<dT=&7LkM{kVV13S5<#^nYFpFY%ddi7wu5VB9g
zj(aWkt)E+WGQo<p&c*D<wNL6cH|$WvlES+_3(GjZD^-;2IIs1KZKI<CwAB!t_pDKT
z@l{?;@#V09Uu#_-n-2_<*2mXw{%%*vYYW{+31^NZ63aTf#7~V)tg!rVymq{FD7Y~+
z|C)VdZreU1Jh173C=x8_Y4nUJ!7qmDMFoeCU736B=J#he`kP&dcy15U`de+f?{1xQ
zWn+-};<&Hp8;V{v<lJ`fxoOrt#IEgr*zIso)UR$n@>``%U`54XOo*);F*G4h&5ZMW
b>(NZGEI2Ie*nU)Qx^qGVBL1o6tMmT>Nhh=w

literal 0
HcmV?d00001

diff --git a/resources/images/fr.png b/resources/images/fr.png
new file mode 100644
index 0000000000000000000000000000000000000000..c31b28ae3e421d3068e65a1fc4adbda6bccd2821
GIT binary patch
literal 1204
zcmeAS@N?(olHy`uVBq!ia0vp^Vn8gw!2~4d_Dd83DajJoh?3y^w370~qErUQl>DSr
z1<%~X^wgl##FWaylc_cg49p6dArU1JzCKpT`MG+DAT@dwxdlMo3=B5*6$OdO*{LN8
zNvY|XdA3ULckfqH$V{<S3ODsN@GWpo&B*kqDoPEm@(W3>%1*XSQL?vFu&J;D8jzb>
zlBiITo0C^;Rbi_HHrEQs1_|pcDS(xfWZNo192Makpx~Tel&WB=XP}#GU}m6TW~gUq
zY+`P1uA^XNU}&IkV5Dzoq-$tyWo%?+V4wg6N<iC+Qqrt~T-=~`0eQAc86_nJR{Hwo
z<>h+i#(Mch>H3D2mX;thjEr=FDs+o0^GXscbn}XpVJ5hw7AF^F7L;V>=P7_pOiaoz
zEwNPsx)kDt+yc0<dBxCR0tT3VMPh-zp`HQAOE87LzW9~q=E7AMmjtCE+>6!V;*iRM
zRQ;gT;{4L0WMIUlDTAykuyQU+O)SYT3dzsUfrVl~Mt(_taYlZDf^)E`LU?9gN`84U
zShcUOm1kaYNn&1ds;7&s5>UThW@d_&o4Jvhn~SN5p{bLxp`ojxrJ=d0tC6vrqq(c0
zo28)zOs`9Ra%paAUI|QZ3PP_bPQ9RnkXrz>*(J3ovn(~mttdZN0qkL`Ox$iU!f75<
zZwhX=7~|Bd4|I$^C|Z%C872fwJ0K=J(E>T}WS^P`OzTC!ME!6c`zr<pMlDYl$B>F!
zQzkk39X1ef%{`vgsB|T}fVFJJ-6EEA2Yh$<Z_lw{3lh^2@DjeBCsmzxCgSdcNk<L1
z-S7XZn>Al@@7;Y;$sw`3?{?2x-M{?#{^`^1=bL@^3ftb#FK+(t?Omn^CQEDUrzl*y
zUjFk*&9t+>`X=Zov>M1dPf;k6(B2u5!obbBxBs5M5X;XG(OKEXNt{I%J?DCbSfaJ>
zN_Yhb{HYUAnzMe38B3?&h41R-b6gzftmcRcWSK3rE%*9qHKE(*wT@doxO(YW2Lsnc
zmu|<Yy~iCBEIb~~_nPAByjHMlyV6pj77yW*yByYZa0aAy&uNr8qQhOZ?c>VRo|fu5
zu~Rz!^9B9c6W(%%bwcKqtgTZN&YUgnJtJAUf<fwU>(<x1B9929UwiJ}z{s%p&n2VV
S1rry5$`MajKbLh*2~7b0ho4da

literal 0
HcmV?d00001

diff --git a/resources/images/lang.svg b/resources/images/lang.svg
new file mode 100644
index 0000000..873a3dc
--- /dev/null
+++ b/resources/images/lang.svg
@@ -0,0 +1,132 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="7.9434972mm"
+   height="11.258333mm"
+   viewBox="0 0 28.14625 39.891732"
+   id="svg20079"
+   version="1.1"
+   inkscape:version="0.91 r13725"
+   sodipodi:docname="lang.svg">
+  <defs
+     id="defs20081">
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath4527">
+      <path
+         d="m 0,838.007 1024,0 L 1024,0 0,0 0,838.007 Z"
+         id="path4529"
+         inkscape:connector-curvature="0" />
+    </clipPath>
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="5.6"
+     inkscape:cx="21.797157"
+     inkscape:cy="19.410157"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:window-width="1280"
+     inkscape:window-height="778"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata20084">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Calque 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(1073.4043,124.72652)">
+    <g
+       transform="matrix(1.25,0,0,-1.25,-1936.9683,859.18611)"
+       id="g4523">
+      <g
+         id="g4525"
+         clip-path="url(#clipPath4527)">
+        <g
+           id="g4531"
+           transform="translate(712.9932,775.8171)">
+          <path
+             d="m 0,0 c 0,-6.041 -4.873,-10.938 -10.884,-10.938 -6.011,0 -10.883,4.897 -10.883,10.938 0,6.041 4.872,10.938 10.883,10.938 C -4.873,10.938 0,6.041 0,0 Z"
+             style="fill:none;stroke:#ffffff;stroke-width:0.75;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+             id="path4533"
+             inkscape:connector-curvature="0" />
+        </g>
+        <g
+           id="g4535"
+           transform="translate(702.1631,786.7546)">
+          <path
+             d="m 0,0 c 3.849,0 2.362,-4.357 2.365,-4.358 -0.688,0 -1.818,-0.619 -2.243,-1.415 -0.261,-0.489 -0.239,-1.007 0.06,-1.457 0.204,-0.309 0.38,-0.652 0.551,-0.984 0.361,-0.703 0.762,-1.483 1.391,-1.483 0.133,0 0.276,0.035 0.432,0.113 0.495,0.249 0.85,0.957 1.193,1.641 0.151,0.301 0.374,0.744 0.505,0.884 0.432,-0.059 0.642,-0.451 0.928,-1.071 0.21,-0.457 0.426,-0.929 0.853,-1.143 0.718,-0.361 3.078,0.017 4.383,0.573"
+             style="fill:none;stroke:#ffffff;stroke-width:0.75;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+             id="path4537"
+             inkscape:connector-curvature="0" />
+        </g>
+        <g
+           id="g4539"
+           transform="translate(707.2578,775.4328)">
+          <path
+             d="m 0,0 c -0.122,-0.035 -0.29,-0.083 -0.335,-0.087 -0.587,0 -0.959,-0.457 -1.23,-0.79 -0.104,-0.127 -0.291,-0.355 -0.411,-0.359 -0.192,0.096 -0.393,0.145 -0.599,0.145 -0.501,0 -0.935,-0.299 -1.031,-0.713 -0.069,-0.29 0.032,-0.687 0.518,-0.932 0.69,-0.347 1.403,-0.704 1.72,-1.024 0.219,-0.219 0.597,-0.345 1.037,-0.345 0.669,0 1.559,0.327 1.863,1.248 0.121,0.363 0.409,0.64 0.689,0.908 0.324,0.312 0.63,0.607 0.633,1.029 0.003,0.249 -0.106,0.487 -0.326,0.708 C 2.229,0.088 1.823,0.24 1.319,0.24 0.837,0.24 0.354,0.102 0,0 Z"
+             style="fill:none;stroke:#ffffff;stroke-width:0.75;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+             id="path4541"
+             inkscape:connector-curvature="0" />
+        </g>
+        <g
+           id="g4543"
+           transform="translate(702.2852,764.8796)">
+          <path
+             d="m 0,0 c -1.537,0 -2.927,2.688 -2.296,4.167 1.133,2.656 0.079,3.646 -0.371,4.069 l -0.085,0.081 c -0.129,0.129 -0.273,0.217 -0.401,0.294 -0.312,0.188 -0.396,0.238 -0.229,0.742 0.111,0.334 0.258,0.49 0.428,0.67 0.392,0.417 0.692,0.833 0.692,2.04 0,0.703 -0.354,1.264 -0.972,1.538 -0.702,0.312 -1.638,0.202 -2.133,-0.25 -0.31,-0.283 -0.414,-0.667 -0.285,-1.055 0.302,-0.911 -0.39,-2.228 -1.683,-3.203 -0.342,-0.258 -0.444,-0.139 -0.505,-0.069 -0.38,0.439 -0.35,1.689 -0.039,2.001 0.209,0.21 0.271,0.477 0.165,0.716 -0.344,0.784 -2.538,0.724 -2.974,0.703"
+             style="fill:none;stroke:#ffffff;stroke-width:0.75;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+             id="path4545"
+             inkscape:connector-curvature="0" />
+        </g>
+        <g
+           id="g4547"
+           transform="translate(702.4873,769.4577)">
+          <path
+             d="m 0,0 c -0.529,0 -1.151,-0.613 -1.379,-1.163 -0.177,-0.43 -0.124,-0.831 0.146,-1.102 0.253,-0.255 0.629,-0.401 1.032,-0.401 0.402,0 0.779,0.146 1.033,0.401 0.282,0.284 0.351,0.701 0.193,1.173 C 0.92,-0.773 0.71,-0.435 0.466,-0.188 0.344,-0.067 0.179,0 0,0 Z"
+             style="fill:none;stroke:#ffffff;stroke-width:0.75;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+             id="path4549"
+             inkscape:connector-curvature="0" />
+        </g>
+        <g
+           id="g4551"
+           transform="translate(706.1422,759.6247)">
+          <path
+             d="M 0,0 -4.033,-4.033 -8.065,0"
+             style="fill:none;stroke:#ffffff;stroke-width:0.75;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+             id="path4553"
+             inkscape:connector-curvature="0" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/templates/renater/web/index.tt2.html b/templates/renater/web/index.tt2.html
index cfb4d3b..8e27d83 100644
--- a/templates/renater/web/index.tt2.html
+++ b/templates/renater/web/index.tt2.html
@@ -55,6 +55,40 @@
                             <label class="show-for-small-only">Accueil</label>
                             </a>
                         </li>
+                        <li class="has-submenu" data-action="select_language">
+                            <a href="#" title="[% lh.maketext("Language") %]">
+                                <img class="lang_img" src="images/lang.svg" alt="[% lh.maketext("Language") %]" data-options="disable_for_touch:true"/>
+                                <label class="show-for-small-only">[% lh.maketext("Language") %]</label>
+                            </a>
+                            <ul class="submenu vertical" data-submenu>
+                                <li>
+                                    <a
+[% IF lh.language_tag() == "en" %]
+                                        class="nocursor"
+[% ELSE %]
+                                        href="[% app.url %]?action=[% action %]&federation=[% federation %]&entityid=[% entityid %]&email=[% email %]&token=[% token %]&lang=en"
+[% END %]
+                                        data-lang="en" title="English">
+                                        <img src="images/en.png" />
+                                        <label>English</label>
+                                        [% IF lh.language_tag() == "en" %]<span class="fa fa-check"></span>[% END %]
+                                    </a>
+                                </li>
+                                <li>
+                                    <a
+[% IF lh.language_tag() == "fr" %]
+                                        class="nocursor"
+[% ELSE %]
+                                        href="[% app.url %]?action=[% action %]&federation=[% federation %]&entityid=[% entityid %]&email=[% email %]&token=[% token %]&lang=fr"
+[% END %]
+                                        data-lang="fr" title="Français">
+                                        <img src="images/fr.png" />
+                                        <label>Français</label>
+                                        [% IF lh.language_tag() == "fr" %]<span class="fa fa-check"></span>[% END %]
+                                    </a>
+                                </li>
+                            </ul>
+                        </li>
                     </ul>
                 </menu>
             </nav>
-- 
GitLab