Commit 111967c9eeda545ffdf7fc3e66494cc60ed33cb6

Authored by Edmar Moretti
1 parent 18a3962a

ajuste no layout da página inicial para funcionar em smtfone

init/dicionario.js
... ... @@ -244,5 +244,40 @@ g_traducao_init =
244 244 en : "",
245 245 es : ""
246 246 }
  247 + ],
  248 + 36 : [
  249 + {
  250 + pt : "Abrir",
  251 + en : "Open",
  252 + es : "Abrir"
  253 + }
  254 + ],
  255 + "mapas" : [
  256 + {
  257 + pt : "Mapas",
  258 + en : "Maps",
  259 + es : "Mapas"
  260 + }
  261 + ],
  262 + "docs" : [
  263 + {
  264 + pt : "Docs",
  265 + en : "Docs",
  266 + es : "DOcs"
  267 + }
  268 + ],
  269 + "admin" : [
  270 + {
  271 + pt : "Admin",
  272 + en : "Admin",
  273 + es : "Admin"
  274 + }
  275 + ],
  276 + "comunidade" : [
  277 + {
  278 + pt : "Comunidade",
  279 + en : "",
  280 + es : ""
  281 + }
247 282 ]
248 283 };
... ...
init/index.js
1   -botoesIni = [];
2   -botoesIni.push({
3   - "img":"certificate-server.png",
4   - "href":"../testainstal.php",
5   - "titulo":$trad(2,g_traducao_init),
6   - "subtitulo": "Verifica se a instalação do i3Geo está correta e mostra algumas das características do servidor, como as versões dos softwares básicos instalados.",
7   - "fa": "check",
8   - "atalho": false
9   -},{
10   - "img":"applications-development-web.png",
11   - "href":"../admin",
12   - "titulo":$trad(3,g_traducao_init),
13   - "subtitulo": "",
14   - "fa": "cogs",
15   - "atalho": true
16   -},{
  1 +botoesIni = [
  2 +{
17 3 "img":"openlayers.png",
18 4 "href":"../<?php echo $customDir; ?>/black_ol.htm",
19 5 "titulo":$trad(4,g_traducao_init),
... ... @@ -21,13 +7,6 @@ botoesIni.push({
21 7 "fa": "map-o",
22 8 "atalho": true
23 9 },{
24   - "img":"openlayersdebug.png",
25   - "href":"../<?php echo $customDir; ?>/openlayersdebug.htm",
26   - "titulo":$trad(5,g_traducao_init),
27   - "subtitulo": "",
28   - "fa": "map-o",
29   - "atalho": true
30   -},{
31 10 "img":"osm.png",
32 11 "href":"../<?php echo $customDir; ?>/black_osm.htm",
33 12 "titulo":$trad(23,g_traducao_init),
... ... @@ -119,6 +98,27 @@ botoesIni.push({
119 98 "fa": "link",
120 99 "atalho": false
121 100 },{
  101 + "img":"openlayersdebug.png",
  102 + "href":"../<?php echo $customDir; ?>/openlayersdebug.htm",
  103 + "titulo":$trad(5,g_traducao_init),
  104 + "subtitulo": "",
  105 + "fa": "map-o",
  106 + "atalho": true
  107 +},{
  108 + "img":"certificate-server.png",
  109 + "href":"../testainstal.php",
  110 + "titulo":$trad(2,g_traducao_init),
  111 + "subtitulo": "Verifica se a instalação do i3Geo está correta e mostra algumas das características do servidor, como as versões dos softwares básicos instalados.",
  112 + "fa": "check",
  113 + "atalho": false
  114 +},{
  115 + "img":"applications-development-web.png",
  116 + "href":"../admin",
  117 + "titulo":$trad(3,g_traducao_init),
  118 + "subtitulo": "",
  119 + "fa": "cogs",
  120 + "atalho": true
  121 +},{
122 122 "img":"folder-image.png",
123 123 "href":"../exemplos",
124 124 "titulo":$trad(14,g_traducao_init),
... ... @@ -181,10 +181,9 @@ botoesIni.push({
181 181 "fa": "envelope",
182 182 "atalho": true
183 183 }
184   -);
  184 +];
185 185 function mostraBotoes(){
186 186 $i("mensagemLogin").innerHTML = men;
187   -
188 187 i3GEO.configura = {"locaplic" : ".."};
189 188 i3GEO.idioma.IDSELETOR = "bandeiras";
190 189 i3GEO.idioma.mostraSeletor();
... ... @@ -202,20 +201,24 @@ function mostraBotoes(){
202 201 $i("conteudo").style.height = i3GEO.util.getScrollHeight() + "px";
203 202 }
204 203 //TODO um dia, remover as imagens da pasta init e deixar apenas as da pasta init/imagens
205   -function mostraBotoesBT(template,men){
  204 +function mostraBotoesBT(men){
  205 + var html = "";
  206 + //menu
  207 + html = Mustache.to_html(
  208 + $("#menuTpl").html(),
  209 + i3GEO.idioma.objetoIdioma(g_traducao_init)
  210 + );
  211 + $("#menuTpl").html(html);
  212 + //
206 213 $i("mensagemLogin").innerHTML = men;
207 214 $i("jumbotron").innerHTML = "<img src='../imagens/i3Geo_bigTransp.png' style='float:left;width:80px;margin:5px;' /><p>"+$trad(35,g_traducao_init)+"</p>";
208 215 i3GEO.configura = {"locaplic" : ".."};
209 216 i3GEO.idioma.IDSELETOR = "bandeiras";
210 217 i3GEO.idioma.mostraSeletor();
211   - //i3GEO.barraDeBotoes.ATIVA = false;
212   - var ins = [],i,n = botoesIni.length;
213   - for(i=0;i<n;i++){
214   - botoesIni[i].img = "imagens/"+botoesIni[i].img;
215   - ins.push(Mustache.render(template, botoesIni[i]));
216   - //if(botoesIni[i].atalho){
217   - // atalhos.push(Mustache.render('<a href="{{{href}}}" target="_blank" class="btn btn-raised">{{{titulo}}}</a>', botoesIni[i]));
218   - //}
219   - }
220   - $i("botoes").innerHTML = ins.join("");
  218 + html = Mustache.to_html(
  219 + "{{#d}}" + $("#botoesTpl").html() + "{{/d}}",
  220 + {"d":botoesIni,"abrir" : $trad(36,g_traducao_init)}
  221 + );
  222 + $("#botoesTpl").html(html);
221 223 }
  224 +
... ...
init/nindex.php
... ... @@ -99,9 +99,27 @@ define ( &quot;ONDEI3GEO&quot;, &quot;..&quot; );
99 99 <ul class="nav navbar-nav">
100 100 <li><a href="#"><div class="fa" id="bandeiras"></div></a></li>
101 101 </ul>
102   - <ul class="nav navbar-nav pull-right">
103   - <li><a href="#"><i class="fa fa-home fa-2x"></i></i></a></li>
104   - </ul>
  102 + <!-- template para permitir a traducao -->
  103 + <div id="menuTpl" >
  104 + <ul class="nav navbar-nav">
  105 + <li><a href="#map-o">{{{mapas}}}</a></li>
  106 + </ul>
  107 + <ul class="nav navbar-nav">
  108 + <li><a href="#download">Download</a></li>
  109 + </ul>
  110 + <ul class="nav navbar-nav">
  111 + <li><a href="#check">{{{admin}}}</a></li>
  112 + </ul>
  113 + <ul class="nav navbar-nav">
  114 + <li><a href="#book">{{{docs}}}</a></li>
  115 + </ul>
  116 + <ul class="nav navbar-nav">
  117 + <li><a href="#group">{{{comunidade}}}</a></li>
  118 + </ul>
  119 + <ul class="nav navbar-nav pull-right">
  120 + <li><a href="#"><i class="fa fa-home fa-2x"></i></i></a></li>
  121 + </ul>
  122 + </div>
105 123 </div>
106 124 </div>
107 125 </nav>
... ... @@ -113,9 +131,29 @@ define ( &quot;ONDEI3GEO&quot;, &quot;..&quot; );
113 131 <div class="jumbotron" id="jumbotron">
114 132 </div>
115 133 </div>
116   - <div id="botoes">
117   - </div>
118   -
  134 + <!-- Template para criacao dos quadros ver index.js -->
  135 + <div id="botoesTpl">
  136 + <div id="{{{fa}}}" class="col-sm-12" style="width:260px;min-width:260px;max-width:260px;">
  137 + <div class="panel panel-default">
  138 + <div class="panel-body" style="height: 250px;">
  139 + <div class="thumbnail" style="height:90px;">
  140 + <img class="img-rounded" style="height: 100%; width: 100%" src="imagens/{{{img}}}" />
  141 + </div>
  142 + <h4>{{{titulo}}}</h4>
  143 + <div style="overflow:auto;height:200px;">
  144 + <p>{{{subtitulo}}}</p>
  145 + </div>
  146 + </div>
  147 + <div class="panel-footer text-right" style="border:0px;background-color:white;">
  148 + <p>
  149 + <a class="btn btn-primary btn-raised" href="{{{href}}}" role="button" target="_blank" >
  150 + {{{abrir}}} <i class="fa fa-{{{fa}}}" aria-hidden="true" ></i>
  151 + </a>
  152 + </p>
  153 + </div>
  154 + </div>
  155 + </div>
  156 + </div>
119 157 <div class="col-sm-12 hidden" id="tt" style="width:260px;">
120 158 <div class="panel panel-default" >
121 159 <div class="panel-body">
... ... @@ -156,15 +194,16 @@ define ( &quot;ONDEI3GEO&quot;, &quot;..&quot; );
156 194 ?>
157 195 <script>
158 196 $(document).ready(function(){
159   - var template = '<div class="col-sm-12" style="width:260px;min-width:260px;max-width:260px;"><div class="panel panel-default"><div class="panel-body" style="height: 250px;"><div class="thumbnail" style="height:90px;"><img class="img-rounded" style="height: 100%; width: 100%" src="{{{img}}}" /></div><h4>{{{titulo}}}</h4><div style="overflow:auto;height:200px;"><p>{{{subtitulo}}}</p></div></div><div class="panel-footer text-right" style="border:0px;background-color:white;"><p><a class="btn btn-primary btn-raised" href="{{{href}}}" role="button" target="_blank" >Abrir <i class="fa fa-{{{fa}}}" aria-hidden="true" ></i></a></p></div></div></div>';
160   - <?php
  197 + var template = '<div class="col-sm-12" style="width:260px;min-width:260px;max-width:260px;"><div class="panel panel-default"><div class="panel-body" style="height: 250px;"><div class="thumbnail" style="height:90px;"><img class="img-rounded" style="height: 100%; width: 100%" src="imagens/{{{img}}}" /></div><h4>{{{titulo}}}</h4><div style="overflow:auto;height:200px;"><p>{{{subtitulo}}}</p></div></div><div class="panel-footer text-right" style="border:0px;background-color:white;"><p><a class="btn btn-primary btn-raised" href="{{{href}}}" role="button" target="_blank" >Abrir <i class="fa fa-{{{fa}}}" aria-hidden="true" ></i></a></p></div></div></div>';
  198 +
  199 + <?php
161 200 if ($i3geomaster [0] ["usuario"] == "admin" && $i3geomaster [0] ["senha"] == "admin") {
162   - echo "var men = $" . "trad(19,g_traducao_init);";
  201 + echo "var men = '<div class=\'alert alert-danger\' >' + $" . "trad(19,g_traducao_init) + '</div>';";
163 202 } else {
164 203 echo "var men = '';";
165 204 }
166 205 ?>
167   - mostraBotoesBT(template, '<div class="alert alert-danger">' + men + '</div>');
  206 + mostraBotoesBT(men);
168 207 $('.hidden').removeClass('hidden');
169 208 //carrega o TT
170 209 window.twttr = (function(d, s, id) {
... ...