Download as
Browse Code »

Commit a790c559c508887c48f6185162c468274ba6e26d

Authored by Edmar Moretti
1 parent dec31de1
Exists in master and in 7 other branches composer, doc-root, docker, guia, licenca, readme, unmaintened

carregamento do twitter apenas em dispositivos maiores que xs

Showing 4 changed files with 143 additions and 113 deletions   Show diff stats
@@ -199,27 +199,43 @@ function mostraBotoesBT(men){ @@ -199,27 +199,43 @@ function mostraBotoesBT(men){
199 var html = ""; 199 var html = "";
200 //menu 200 //menu
201 html = Mustache.to_html( 201 html = Mustache.to_html(
202 - $("#menuTpl").html(),  
203 - i3GEO.idioma.objetoIdioma(g_traducao_init) 202 + $("#menuTpl").html(),
  203 + i3GEO.idioma.objetoIdioma(g_traducao_init)
204 ); 204 );
205 $("#menuTpl").html(html); 205 $("#menuTpl").html(html);
206 // 206 //
207 $("#mensagemLogin").html(men); 207 $("#mensagemLogin").html(men);
208 html = Mustache.to_html( 208 html = Mustache.to_html(
209 - $("#jumbotron").html(),  
210 - {  
211 - "jumbotron" : $trad(35,g_traducao_init),  
212 - "host" : location.host,  
213 - "href" : location.href  
214 - } 209 + $("#jumbotron").html(),
  210 + {
  211 + "jumbotron" : $trad(35,g_traducao_init),
  212 + "host" : location.host,
  213 + "href" : location.href
  214 + }
215 ); 215 );
216 $("#jumbotron").html(html); 216 $("#jumbotron").html(html);
217 i3GEO.configura = {"locaplic" : ".."}; 217 i3GEO.configura = {"locaplic" : ".."};
218 i3GEO.idioma.IDSELETOR = "bandeiras"; 218 i3GEO.idioma.IDSELETOR = "bandeiras";
219 i3GEO.idioma.mostraSeletor(); 219 i3GEO.idioma.mostraSeletor();
220 html = Mustache.to_html( 220 html = Mustache.to_html(
221 - "{{#d}}" + $("#botoesTpl").html() + "{{/d}}",  
222 - {"d":botoesIni,"abrir" : $trad(36,g_traducao_init)} 221 + "{{#d}}" + $("#botoesTpl").html() + "{{/d}}",
  222 + {"d":botoesIni,"abrir" : $trad(36,g_traducao_init)}
223 ); 223 );
224 $("#botoesTpl").html(html); 224 $("#botoesTpl").html(html);
225 } 225 }
  226 +function findBootstrapDeviceSize() {
  227 + var dsize = ['lg', 'md', 'sm', 'xs'];
  228 + for (var i = dsize.length - 1; i >= 0; i--) {
  229 +
  230 + // Need to add   for Chrome. Works fine in Firefox/Safari/Opera without it.
  231 + // Chrome seem to have an issue with empty div's
  232 + $el = $('<div id="sizeTest" class="hidden-'+dsize[i]+'">&nbsp;</div>');
  233 + $el.appendTo($('body'));
  234 +
  235 + if ($el.is(':hidden')) {
  236 + $el.remove();
  237 + return dsize[i];
  238 + }
  239 + }
  240 + return 'unknown';
  241 +}
init/index.php
  Diff comments   View file @a790c55
@@ -93,7 +93,7 @@ include &quot;head.php&quot;; @@ -93,7 +93,7 @@ include &quot;head.php&quot;;
93 <!-- Template para mensagem do i3Geo --> 93 <!-- Template para mensagem do i3Geo -->
94 <ul class="list-inline"> 94 <ul class="list-inline">
95 <li><img class="pull-left" src='../imagens/i3Geo_bigTransp.png' 95 <li><img class="pull-left" src='../imagens/i3Geo_bigTransp.png'
96 - style='width: 80px; margin: 5px;' /> <img class="pull-right" 96 + style='width: 80px; margin: 5px;' /> <img class="pull-right hidden-xs"
97 src='../pacotes/qrcode/php/qr_img.php?host={{{host}}}&d={{{href}}}' 97 src='../pacotes/qrcode/php/qr_img.php?host={{{host}}}&d={{{href}}}'
98 style='width: 80px; margin: 5px;' /> 98 style='width: 80px; margin: 5px;' />
99 <p>{{{jumbotron}}}</p></li> 99 <p>{{{jumbotron}}}</p></li>
@@ -113,7 +113,7 @@ include &quot;head.php&quot;; @@ -113,7 +113,7 @@ include &quot;head.php&quot;;
113 <div class="panel-body" style="height: 250px;"> 113 <div class="panel-body" style="height: 250px;">
114 <div class="thumbnail" role="button" style="height: 90px;" data-toggle="quadroQrcode" data-url="{{{href}}}"> 114 <div class="thumbnail" role="button" style="height: 90px;" data-toggle="quadroQrcode" data-url="{{{href}}}">
115 <img class="img-rounded" style="height: 100%; width: 100%" src="imagens/{{{img}}}" /> 115 <img class="img-rounded" style="height: 100%; width: 100%" src="imagens/{{{img}}}" />
116 - <i class="fa fa-qrcode btn-qrcode pull-right" ></i> 116 + <i class="fa fa-qrcode btn-qrcode pull-right hidden-xs" ></i>
117 </div> 117 </div>
118 <h4>{{{titulo}}}</h4> 118 <h4>{{{titulo}}}</h4>
119 <div style="overflow: auto; height: 200px;"> 119 <div style="overflow: auto; height: 200px;">
@@ -138,7 +138,7 @@ include &quot;head.php&quot;; @@ -138,7 +138,7 @@ include &quot;head.php&quot;;
138 style="width: 260px; min-width: 260px; max-width: 260px;"> 138 style="width: 260px; min-width: 260px; max-width: 260px;">
139 <div class="panel panel-default"> 139 <div class="panel panel-default">
140 <div class="panel-body"> 140 <div class="panel-body">
141 - <a class="twitter-timeline" href="https://twitter.com/i3geo" 141 + <a class="twitter-timeline tline" href=""
142 data-widget-id="288061915689787392" height="300">Tweets @i3Geo</a> 142 data-widget-id="288061915689787392" height="300">Tweets @i3Geo</a>
143 </div> 143 </div>
144 </div> 144 </div>
@@ -147,7 +147,7 @@ include &quot;head.php&quot;; @@ -147,7 +147,7 @@ include &quot;head.php&quot;;
147 style="width: 260px; min-width: 260px; max-width: 260px;"> 147 style="width: 260px; min-width: 260px; max-width: 260px;">
148 <div class="panel panel-default"> 148 <div class="panel panel-default">
149 <div class="panel-body"> 149 <div class="panel-body">
150 - <a class="twitter-timeline" href="https://twitter.com/hashtag/i3geo" 150 + <a class="twitter-timeline htag" href=""
151 data-widget-id="643417277208133633" height="300">i3geo Tweets</a> 151 data-widget-id="643417277208133633" height="300">i3geo Tweets</a>
152 </div> 152 </div>
153 </div> 153 </div>
@@ -164,7 +164,6 @@ include &quot;head.php&quot;; @@ -164,7 +164,6 @@ include &quot;head.php&quot;;
164 <footer> 164 <footer>
165 <div class="row text-center hidden"> 165 <div class="row text-center hidden">
166 <div class="col-xs-6 center-block"> 166 <div class="col-xs-6 center-block">
167 -  
168 <a rel="license" href="http://creativecommons.org/licenses/GPL/2.0/legalcode.pt" 167 <a rel="license" href="http://creativecommons.org/licenses/GPL/2.0/legalcode.pt"
169 target="_blank"><img alt="Licen&ccedil;a Creative Commons" style="border-width: 0" 168 target="_blank"><img alt="Licen&ccedil;a Creative Commons" style="border-width: 0"
170 src="https://i.creativecommons.org/l/GPL/2.0/88x62.png" /></a><br />O i3Geo est&aacute; 169 src="https://i.creativecommons.org/l/GPL/2.0/88x62.png" /></a><br />O i3Geo est&aacute;
@@ -209,34 +208,38 @@ include &quot;head.php&quot;; @@ -209,34 +208,38 @@ include &quot;head.php&quot;;
209 $("#jumbotron").fadeOut(300) 208 $("#jumbotron").fadeOut(300)
210 } 209 }
211 ); 210 );
212 - //$("#mensagemLogin").delay(10000).fadeOut(300);  
213 - //carrega o TT  
214 - window.twttr = (function(d, s, id) {  
215 - var js, fjs = d.getElementsByTagName(s)[0],  
216 - t = window.twttr || {};  
217 - if (d.getElementById(id)) return t;  
218 - js = d.createElement(s);  
219 - js.id = id;  
220 - js.src = "https://platform.twitter.com/widgets.js";  
221 - fjs.parentNode.insertBefore(js, fjs); 211 + var tamanho = findBootstrapDeviceSize();
  212 + if(tamanho != "xs"){
  213 + $(".tline").attr("src","https://twitter.com/i3geo");
  214 + $(".tline").attr("src","https://twitter.com/hashtag/i3geo");
222 215
223 - t._e = [];  
224 - t.ready = function(f) {  
225 - t._e.push(f);  
226 - }; 216 + window.twttr = (function(d, s, id) {
  217 + var js, fjs = d.getElementsByTagName(s)[0],
  218 + t = window.twttr || {};
  219 + if (d.getElementById(id)) return t;
  220 + js = d.createElement(s);
  221 + js.id = id;
  222 + js.src = "https://platform.twitter.com/widgets.js";
  223 + fjs.parentNode.insertBefore(js, fjs);
227 224
228 - return t;  
229 - }(document, "script", "twitter-wjs")); 225 + t._e = [];
  226 + t.ready = function(f) {
  227 + t._e.push(f);
  228 + };
230 229
231 - $('[data-toggle="quadroQrcode"]').popover({  
232 - html: true,  
233 - placement: "auto",  
234 - trigger: "click focus",  
235 - content: function(){  
236 - var urlqr = "../pacotes/qrcode/php/qr_img.php?host=" + window.location.host + "&u=" + $(this).attr("data-url");  
237 - return "<img style='width:200px; height: 200px;' src='" + urlqr + "' '>";  
238 - }  
239 - }); 230 + return t;
  231 + }(document, "script", "twitter-wjs"));
  232 +
  233 + $('[data-toggle="quadroQrcode"]').popover({
  234 + html: true,
  235 + placement: "auto",
  236 + trigger: "click focus",
  237 + content: function(){
  238 + var urlqr = "../pacotes/qrcode/php/qr_img.php?host=" + window.location.host + "&u=" + $(this).attr("data-url");
  239 + return "<img style='width:200px; height: 200px;' src='" + urlqr + "' '>";
  240 + }
  241 + });
  242 + }
240 $.material.init(); 243 $.material.init();
241 }); 244 });
242 </script> 245 </script>
1 -function listaDoNivelMenu(templateMenus,templateGrupos,templateCamadas){ 1 +function listaDoNivelMenu(templateMenus,templateGrupos,templateSubGrupos,templateCamadas){
2 var r = function(retorno) { 2 var r = function(retorno) {
3 var menus = retorno.data; 3 var menus = retorno.data;
4 var nmenus = menus.length; 4 var nmenus = menus.length;
5 var i = 0; 5 var i = 0;
6 var s = []; 6 var s = [];
7 for(i=0; i<nmenus; i++){ 7 for(i=0; i<nmenus; i++){
8 - var dataMenu = menus[i];  
9 - var camadasRaiz = ckCamada(dataMenu.temas,templateCamadas);  
10 - dataMenu["camadas"] = camadasRaiz; 8 + var camadasRaiz = "",
  9 + dataMenu = menus[i];
  10 + if(dataMenu.temas){
  11 + camadasRaiz = ckCamada(dataMenu.temas,templateCamadas);
  12 + dataMenu["camadas"] = camadasRaiz;
  13 + }
11 var htmlMenus = Mustache.to_html( 14 var htmlMenus = Mustache.to_html(
12 templateMenus, 15 templateMenus,
13 dataMenu 16 dataMenu
@@ -18,29 +21,72 @@ function listaDoNivelMenu(templateMenus,templateGrupos,templateCamadas){ @@ -18,29 +21,72 @@ function listaDoNivelMenu(templateMenus,templateGrupos,templateCamadas){
18 //pega os grupos do menu 21 //pega os grupos do menu
19 for(i=0; i<nmenus; i++){ 22 for(i=0; i<nmenus; i++){
20 var grupos = function(retorno){ 23 var grupos = function(retorno){
21 - var gr = retorno.data.grupos;  
22 - var c = gr.length - 3;  
23 - var g = [];  
24 - var i = 0; 24 + if(retorno.data){
  25 + var gr = retorno.data.grupos;
  26 + //verifica se existem dados na raiz e grupos
  27 + if(gr[0].length == 0 && gr[1].temasraiz.length == 0){
  28 + $("#gruposMenu"+retorno.data.idmenu).html("");
  29 + return;
  30 + }
  31 + var c = gr.length - 3;
  32 + var g = [];
  33 + var i = 0;
  34 + //camadas na raiz do grupo
  35 + for (i = 0; i < c; i++) {
  36 + if(gr[i].temasgrupo){
  37 + var camadas = ckCamada(gr[i].temasgrupo,templateCamadas);
  38 + gr[i]["camadas"] = camadas;
  39 + } else {
  40 + gr[i]["camadas"] = "";
  41 + }
  42 + g.push(gr[i]);
  43 + }
  44 + if(g){
  45 + var htmlGrupos = Mustache.to_html(
  46 + "{{#grupos}}" + templateGrupos + "{{/grupos}}",
  47 + {"grupos":g}
  48 + );
  49 + }
  50 + $("#gruposMenu"+retorno.data.idmenu).html(htmlGrupos);
  51 + for (i = 0; i < c; i++) {
  52 + var subgrupos = gr[i].subgrupos;
  53 + id_n1 = gr[i]["id_n1"];
25 54
26 - for (i = 0; i < c; i++) {  
27 - var camadas = ckCamada(gr[i].temasgrupo,templateCamadas);  
28 - gr[i]["camadas"] = camadas;  
29 - g.push(gr[i]); 55 + var nsubgrupos = subgrupos.length;
  56 + var j = 0;
  57 + for( j = 0; j < nsubgrupos; j++){
  58 + subgrupos[j]["id_n1"] = id_n1;
  59 + subgrupos[j]["idmenu"] = retorno.data.idmenu;
  60 + }
  61 + var htmlSubGrupos = Mustache.to_html(
  62 + "{{#s}}" + templateSubGrupos + "{{/s}}",
  63 + {"s":subgrupos}
  64 + );
  65 + if(id_n1){
  66 + $("#subGruposGrupo"+id_n1).html(htmlSubGrupos);
  67 + }
  68 + }
30 } 69 }
31 -  
32 - var htmlGrupos = Mustache.to_html(  
33 - "{{#grupos}}" + templateGrupos + "{{/grupos}}",  
34 - {"grupos":g}  
35 - );  
36 - $("#gruposMenu"+retorno.data.idmenu).html(htmlGrupos);  
37 }; 70 };
38 - i3GEO.php.pegalistadegrupos(grupos, menus[i]["idmenu"], "nao"); 71 + i3GEO.php.pegalistadegrupos(grupos, menus[i]["idmenu"], "sim");
39 } 72 }
40 //$.material.init(); 73 //$.material.init();
41 }; 74 };
42 i3GEO.php.pegalistademenus(r); 75 i3GEO.php.pegalistademenus(r);
43 } 76 }
  77 +function listaCamadasSubgrupo(idmenu,id_n1,id_n2){
  78 + //console.info(id_n2)
  79 + var corpo = $("#corpoSubGrupo"+id_n2);
  80 + if(corpo.html().trim()+"x" == "x"){
  81 + corpo.html('<div class="panel-body"><i class="fa fa-spinner fa-pulse fa-2x fa-fw"></i><span class="sr-only">Aguarde</span></div>')
  82 +
  83 + }
  84 + var r = function(retorno){
  85 + var camadas = ckCamada(retorno.data.temas,$("#templateCamadas").html());
  86 + corpo.html('<div class="panel-body">' + camadas + "</div>");
  87 + }
  88 + i3GEO.php.pegalistadetemas(r, idmenu, id_n1, id_n2);
  89 +}
44 function ckCamada(camadas,templateCamadas){ 90 function ckCamada(camadas,templateCamadas){
45 //remove as camadas que nao sao ogc 91 //remove as camadas que nao sao ogc
46 var ncamadas = []; 92 var ncamadas = [];
@@ -54,7 +54,9 @@ include &quot;../init/head.php&quot;; @@ -54,7 +54,9 @@ include &quot;../init/head.php&quot;;
54 <div id="corpoMenu{{idmenu}}" class="panel-collapse collapse" role="tabpanel" aria-multiselectable="true"> 54 <div id="corpoMenu{{idmenu}}" class="panel-collapse collapse" role="tabpanel" aria-multiselectable="true">
55 <div class="panel-body"> 55 <div class="panel-body">
56 {{{camadas}}} 56 {{{camadas}}}
57 - <div id="gruposMenu{{idmenu}}"></div> 57 + <div id="gruposMenu{{idmenu}}">
  58 + <i class="fa fa-spinner fa-pulse fa-2x fa-fw"></i><span class="sr-only">Aguarde</span>
  59 + </div>
58 </div> 60 </div>
59 </div> 61 </div>
60 </div> 62 </div>
@@ -73,12 +75,25 @@ include &quot;../init/head.php&quot;; @@ -73,12 +75,25 @@ include &quot;../init/head.php&quot;;
73 <div id="corpoGrupo{{id_n1}}" class="panel-collapse collapse" role="tabpanel" aria-multiselectable="true"> 75 <div id="corpoGrupo{{id_n1}}" class="panel-collapse collapse" role="tabpanel" aria-multiselectable="true">
74 <div class="panel-body"> 76 <div class="panel-body">
75 {{{camadas}}} 77 {{{camadas}}}
76 - <div id="subGruposGrupo{{id_n1}}">subgrupos</div> 78 + <div id="subGruposGrupo{{id_n1}}">{{grupos}}</div>
77 </div> 79 </div>
78 </div> 80 </div>
79 </div> 81 </div>
80 </div> 82 </div>
81 </script> 83 </script>
  84 +<script id="templateSubGrupos" type="x-tmpl-mustache">
  85 +<div class="panel panel-default">
  86 + <div onclick="listaCamadasSubgrupo('{{idmenu}}','{{id_n1}}','{{id_n2}}')" class="panel-heading" role="tab" id="tituloSubGrupo{{id_n2}}">
  87 + <h4 class="panel-title">
  88 + <a class="collapsed" role="button" data-toggle="collapse" data-parent="#corpoGrupo{{id_n1}}" href="#corpoSubGrupo{{id_n2}}" aria-expanded="false" aria-controls="corpoSubGrupo{{id_n2}}"> {{{nome}}} </a>
  89 + </h4>
  90 + </div>
  91 + <div class="panel-body">
  92 + <div id="corpoSubGrupo{{id_n2}}" class="panel-collapse collapse" role="tabpanel" aria-multiselectable="true">
  93 + </div>
  94 + </div>
  95 +</div>
  96 +</script>
82 <body style="background-color: #eeeeee; padding-top: 55px;"> 97 <body style="background-color: #eeeeee; padding-top: 55px;">
83 <nav class="navbar navbar-fixed-top navbar-inverse" role="navigation"> 98 <nav class="navbar navbar-fixed-top navbar-inverse" role="navigation">
84 <div class="container-fluid"> 99 <div class="container-fluid">
@@ -98,58 +113,7 @@ include &quot;../init/head.php&quot;; @@ -98,58 +113,7 @@ include &quot;../init/head.php&quot;;
98 <div class="container"> 113 <div class="container">
99 <div class="row center-block"> 114 <div class="row center-block">
100 <div class="col-sm-12" id="arvore"> 115 <div class="col-sm-12" id="arvore">
101 - <!-- Modelo de menu -->  
102 - <!--  
103 - <div class="panel-group" id="menu1" role="tablist" aria-multiselectable="true">  
104 - <div class="panel panel-default">  
105 - <div class="panel-heading" role="tab" id="tituloMenu1">  
106 - <h4 class="panel-title">  
107 - <a class="collapsed in" role="button" data-toggle="collapse" data-parent="#menu1" href="#corpoMenu1" aria-expanded="false" aria-controls="#corpoMenu1"> Collapsible Menu Item #1 </a>  
108 - </h4>  
109 - </div>  
110 - <div class="panel-body">  
111 - <div id="corpoMenu1" class="panel-collapse collapse" role="tabpanel" aria-multiselectable="true">  
112 - <div class="panel-body">  
113 - <div class="checkbox">  
114 - <label> <input type=checkbox name=criaLink /> Camada  
115 - </label>  
116 - </div>  
117 - </div>  
118 - <div class="panel panel-default">  
119 - <div class="panel-heading" role="tab" id="tituloGrupo1">  
120 - <h4 class="panel-title">  
121 - <a class="collapsed" role="button" data-toggle="collapse" data-parent="#corpoMenu1" href="#corpoGrupo1" aria-expanded="false" aria-controls="corpoGrupo1"> Collapsible Group Item #1 </a>  
122 - </h4>  
123 - </div>  
124 - <div class="panel-body">  
125 - <div id="corpoGrupo1" class="panel-collapse collapse" role="tabpanel" aria-labelledby="corpoMenu1">  
126 - <div class="checkbox">  
127 - <label> <input type=checkbox name=criaLink /> Camada  
128 - </label>  
129 - </div>  
130 - <div class="panel panel-default">  
131 - <div class="panel-heading" role="tab" id="tituloSubGrupo1">  
132 - <h4 class="panel-title">  
133 - <a class="collapsed" role="button" data-toggle="collapse" data-parent="#corpoGrupo1" href="#corpoSubGrupo1" aria-expanded="false" aria-controls="subGrupo1"> Collapsible Group Item #2 </a>  
134 - </h4>  
135 - </div>  
136 - <div id="corpoSubGrupo1" class="panel-collapse collapse" role="tabpanel" aria-labelledby="tituloSubGrupo1">  
137 - <div class="panel-body">  
138 - <div class="checkbox">  
139 - <label> <input type=checkbox name=criaLink /> Camada  
140 - </label>  
141 - </div>  
142 - </div>  
143 - </div>  
144 - </div>  
145 - </div>  
146 - </div>  
147 - </div>  
148 - </div>  
149 - </div>  
150 - </div>  
151 - </div>  
152 - --> 116 + <i class="fa fa-spinner fa-pulse fa-2x fa-fw"></i><span class="sr-only">Aguarde</span>
153 </div> 117 </div>
154 </div> 118 </div>
155 </div> 119 </div>
@@ -169,6 +133,7 @@ include &quot;../init/head.php&quot;; @@ -169,6 +133,7 @@ include &quot;../init/head.php&quot;;
169 listaDoNivelMenu( 133 listaDoNivelMenu(
170 $("#templateMenu").html(), 134 $("#templateMenu").html(),
171 $("#templateGrupos").html(), 135 $("#templateGrupos").html(),
  136 + $("#templateSubGrupos").html(),
172 $("#templateCamadas").html() 137 $("#templateCamadas").html()
173 ); 138 );
174 $(window).on("scroll click", 139 $(window).on("scroll click",