Commit 2924ab6d6ccef6ee691e3ee3aebf06af6a80ad09

Authored by Edmar Moretti
1 parent 516e0e85

--no commit message

classesjs/classe_guias.js
... ... @@ -202,6 +202,9 @@ i3GEO.guias = {
202 202 Propriedade: TIPO
203 203  
204 204 Tipo de guia
  205 +
  206 + Quando TIPO = "movel", a inicialização da guia é feita em i3GEO.inicia
  207 + Isso é ne cessário pq a guia móvel só pode ser criada após o posicionamento do corpo do mapa
205 208  
206 209 Tipo:
207 210 {string}
... ... @@ -210,7 +213,7 @@ i3GEO.guias = {
210 213 {"guia"}
211 214  
212 215 Values:
213   - guia|sanfona|tablet
  216 + guia|sanfona|tablet|movel
214 217 */
215 218 TIPO: "guia",
216 219 /*
... ... @@ -698,15 +701,19 @@ i3GEO.guias = {
698 701 var molde = document.createElement("div"),
699 702 posMapa = i3GEO.util.pegaPosicaoObjeto($i(i3GEO.Interface.IDMAPA)),
700 703 larguraPuxador = 50;
701   - alturaGuiaMovel = i3GEO.parametros.h / 2,
  704 + alturaGuiaMovel = i3GEO.parametros.h / 1.5,
702 705 ins = "";
  706 + if(i3GEO.guias.ALTURACORPOGUIAS > 0)
  707 + {alturaGuiaMovel = i3GEO.guias.ALTURACORPOGUIAS;}
703 708 molde.id = "i3GEOguiaMovelMolde";
704 709 molde.style.position = "absolute";
705 710 molde.style.display = "block";
706   - molde.style.heigth = i3GEO.parametros.h / 2;
707   - molde.style.left = posMapa[0] + i3GEO.parametros.w - larguraPuxador;
708   - molde.style.top = posMapa[1] + alturaGuiaMovel - (alturaGuiaMovel / 2);
709   - ins += "<img width='"+larguraPuxador+"' src='"+i3GEO.configura.locaplic+"/imagens/openbars.png' >";
  711 + molde.style.height = alturaGuiaMovel;
  712 + molde.style.border = "1px solid white";
  713 + molde.style.left = posMapa[0] + i3GEO.parametros.w - larguraPuxador - 2;
  714 + molde.style.top = posMapa[1] + (i3GEO.parametros.h / 2) - (alturaGuiaMovel / 2) + 2;
  715 + ins += "<img style=top:0px width='"+larguraPuxador+"' src='"+i3GEO.configura.locaplic+"/imagens/openbars.png' >";
  716 +
710 717 molde.innerHTML = ins;
711 718 document.body.appendChild(molde);
712 719  
... ...
classesjs/classe_i3geo.js
... ... @@ -338,6 +338,8 @@ i3GEO = {
338 338 {i3GEO.finaliza.call();}
339 339 else
340 340 {eval(i3GEO.finaliza);}
  341 + if(i3GEO.guias.TIPO === "movel")
  342 + {i3GEO.guias.guiaMovel();}
341 343 }
342 344 catch(e){alert(e);}
343 345 };
... ...
interface/openlayers.htm
... ... @@ -7,51 +7,79 @@
7 7  
8 8 </head>
9 9 <body id="i3geo">
10   -
11 10 <table id='mst' summary="" style='display:none;' width=100% cellspacing='0'>
  11 + <tr style="border:0px">
  12 + <td id="barraSuperior" style="background-image:url('../imagens/visual/default/cabeca.png');height:10px"></td>
  13 + </tr>
  14 + <tr>
  15 + <td id="contemMenu" style="text-align:right;height:0px;border-width:0pt 0pt 1px;border-color:rgb(240,240,240)">
  16 + <!--menu suspenso-->
  17 + <div id="menus" ></div>
  18 + </td>
  19 + </tr>
  20 + <tr>
  21 + <td style="vertical-align:top;border-width:0px;">
  22 + <table width="100%" style="vertical-align:top;border-width:0px">
  23 + <tr>
  24 + <td class=verdeclaro id=contemImg >
  25 + <div id=corpoMapa style="position:relative;background-image:url('../imagens/i3geo1bw.jpg');"></div>
  26 + </td>
  27 + </tr>
  28 + </table>
  29 + </td>
  30 + </tr>
  31 + <tr>
  32 + <td>
  33 + <table width=100% >
  34 + <tr>
  35 + <td class=tdbranca >
  36 + <!--
  37 + Nesse div são incluídos os ícones que permitem ao usuário modificar o visual de cores dos ícones
  38 + <div id=visual ></div>
  39 + -->
  40 + <!-- botão de compartilhamento em redes sociais -->
  41 + <div id=i3GEOcompartilhar style="text-align:left;border-top:1px solid rgb(250,250,250);padding-top:1px" ></div>
  42 + <!-- aqui será incluído o contador de tempo quando o temporizador de redesenho do mapa estiver ativo -->
  43 + <div id=tempoRedesenho style=color:green;background-color:black;width:50px;display:none ></div>
  44 + </td>
  45 + <td class=tdbranca >
  46 + <!-- aqui será incluída a escala numérica -->
  47 + <div id=escala style="text-align:right;" ></div>
  48 + </td>
  49 + <td class=tdbranca >
  50 + <!-- aqui será incluído o gadget que mostra a coordenada geográfica da posição do mouse -->
  51 + <div id=localizarxy style="text-align:left;font-size:10px;display:inline-table"></div>
  52 + </td>
  53 + <!-- aqui serão incluídas as bandeiras que permitem a troca de idioma -->
  54 + <td class=tdbranca >
  55 + <div id=seletorIdiomas ></div>
  56 + </td>
  57 + </tr>
  58 + </table>
  59 + </td>
  60 + </tr>
  61 + <tr style="border:0px">
  62 + <td id="barraInferior" style="background-image:url('../imagens/visual/default/rodape.png');height:10px"></td>
  63 + </tr>
  64 +</table>
  65 +<center>
  66 +<table id="i3GEOlogoMarca">
  67 + <tr>
  68 + <td><center><h1 style="font-size:10px;font-family: Verdana, Arial, Helvetica, sans-serif;"><div id=versaoi3geo ></div><h2 style="font-size:10px;font-family: Verdana, Arial, Helvetica, sans-serif;">i3Geo - Software livre para criação de mapas interativos e geoprocessamento<h3 style="font-size:10px;font-family: Verdana, Arial, Helvetica, sans-serif;">Baseado no Mapserver, é licenciado sob GPL e integra o Portal do Software Público Brasileiro</h3></h2></h1></td>
  69 + </tr>
  70 + <tr>
  71 + <td style="padding:10px;"><center><img alt="logomarca" src='../imagens/logo_inicio.png'></td>
  72 + </tr>
  73 + <tr>
  74 + <td><center>
  75 + <!--
  76 + <script id="ohloh" type="text/javascript" src="http://www.ohloh.net/p/150688/widgets/project_users.js?style=red"></script>
  77 + -->
  78 + </td>
  79 + </tr>
  80 +</table>
12 81  
13   -<!--
14   - Inclui a barra superior. Se vc não quiser o menu, é só comentar o TR
15   --->
16   -<tr style="border:0px">
17   - <td colspan=2 id="barraSuperior" style="background-image:url('../imagens/visual/default/cabeca.png');height:10px"></td>
18   -</tr>
19   -<tr>
20   -<td>
21   - <table width=100% cellspacing=0 cellpadding=0 >
22   - <tr>
23   - <td></td>
24   - <td>
25   - <!--
26   - Guias principais, não mude o ID, apenas o nome se for desejado
27   - Para remover uma guia, basta comentar a linha
28   - -->
29   - <div class=verdeescuro style="top:0px;cursor:pointer;">
30   - <div id=guia1 class=guia ></div>
31   - <div id=guia2 class=guia ></div>
32   - <div id=guia4 class=guia ></div>
33   - <div id=guia5 class=guia ></div>
34   - </div>
35   - </td>
36   -
37   - </tr>
38   - </table>
39   -</td>
40   -<td id="contemMenu" style="text-align:right;height:0px;border-width:0pt 0pt 1px;border-color:rgb(240,240,240)">
41   - <!--
42   - menu suspenso
43   - -->
44   - <div id="menus" ></div>
45   -</td>
46   -</tr>
47   -<tr>
48   - <td class=tdbranca id=contemFerramentas style="vertical-align:top;width:300px;text-align:left;">
49   - <!--
50   - As divs guiaNobj guardam o conteúdo que é mostrado quando a guia é clicada
51   - Para cada botão na guia deve haver um div com o conteúdo, pe.
52   - o div com id=guia1 deve ter um div com id=guia1obj
53   - -->
54   - <div id='guia1obj' >
  82 + <div id='guia1obj' style='display:none;' >
55 83 <!-- Esta div acrescenta a opção de busca rápida, caso vc queira colocá-la em um lugar específico -->
56 84 <div style='left:5px;top:10px;' id=buscaRapida ></div>
57 85 <!-- Esta div acrescenta a lista de propriedades do mapa -->
... ... @@ -61,90 +89,11 @@
61 89 <!-- Esta div acrescenta a lista de de camadas disponíveis no mapa atual -->
62 90 <div id=listaTemas style='top:15px;'></div>
63 91 </div>
64   -
65   - <!-- se vc quiser colocar a arvore de adição de temas em um lugar específico,
66   - use o div abaixo, caso contrário, a árvore será colocada na guia definida em objmapa.guiaMenu, por default a guia2
67   - <div id=arvoreAdicionaTema style='top:25px;' ></div>
68   - <div id=outrasOpcoesAdiciona style='top:25px;' ></div>
69   - -->
70   -
71 92 <div id='guia2obj' style='display:none;'>Aguarde...<img alt="" src="../imagens/branco.gif" width=248 /></div>
72 93 <div id='guia4obj' style='display:none;text-align:left'><div id='legenda' style='text-align:left'></div></div>
73 94 <div id='guia5obj' style='display:none;text-align:left'><div id='banners' style='overflow:auto;text-align:left'>Aguarde...</div></div>
74   - </td>
75   - <td style="vertical-align:top;border-width:0px;">
76   - <table width="100%" style="vertical-align:top;border-width:0px">
77   - <tr><td class=verdeclaro id=contemImg >
78   - <div id=corpoMapa style="position:relative;background-image:url('../imagens/i3geo1bw.jpg');"></div>
79   - </td></tr>
80   - </table>
81   - </td>
82   - </tr>
83   -
84   -<tr>
85 95  
86   - <td class=tdbranca >
87   - <!--
88   - Nesse div são incluídos os ícones que permitem ao usuário modificar o visual de cores dos ícones
89   - <div id=visual ></div>
90   - -->
91   - <!-- botão de compartilhamento em redes sociais -->
92   - <div id=i3GEOcompartilhar style="text-align:left;border-top:1px solid rgb(250,250,250);padding-top:1px" ></div>
93   - <!-- aqui será incluído o contador de tempo quando o temporizador de redesenho do mapa estiver ativo -->
94   - <div id=tempoRedesenho style=color:green;background-color:black;width:50px;display:none ></div>
95   - </td>
96   - <td class=tdbranca >
97   - <table width=100% >
98   - <tr>
99   - <td class=tdbranca >
100   - <!-- aqui será incluída a escala numérica -->
101   - <div id=escala style="text-align:right;" ></div>
102   - </td>
103   - <td class=tdbranca >
104   - <!-- aqui será incluído o gadget que mostra a coordenada geográfica da posição do mouse -->
105   - <div id=localizarxy style="text-align:left;font-size:10px;display:inline-table">Aguarde...</div>
106   - </td>
107   - <!-- aqui serão incluídas as bandeiras que permitem a troca de idioma -->
108   - <td class=tdbranca ><div id=seletorIdiomas ></div></td>
109   - <!--
110   - A opção de localização 'onde estou?' baseia-se na identificação do IP do usuário. Para
111   - que esta opção funcione corretamente, deve estar instalado no I3Geo o pacote geoIP. Veja no
112   - SVN do portal do software público o diretório arquivos_versões/pacotes para maiores informações
113   - -->
114   - <td class=tdbranca ><div id=ondeestou ></div></td>
115   - </tr>
116   - <!-- esta div recebe o cálculo do posicionamento do mouse em coordenadas UTM
117   - As coordenadas UTM apenas serão mostradas nessa div se o parâmetro
118   - i3GEO.gadgets.mostraCoordenadasUTM.idhtml for diferente de i3GEO.gadgets.mostraCoordenadasGEO.idhtml
119   - se os IDs forem iguais, o tipo de coordenada mostrada será intercalada, ora UTM ora GEO.
120   - <tr><td></td><td class="tdbranca"><div style="text-align:left;font-size:8px;background-color:white;display:none;" id=mostraUTM ></div></td><td></td></tr>
121   - -->
122   - </table>
123   - </td>
124   -</tr>
125   -<tr style="border:0px"><td colspan=3 id="barraInferior" style="background-image:url('../imagens/visual/default/rodape.png');height:10px"></td></tr>
126   -<!-- aqui são mostradas imagens obtidas do metadata mensagem que pode existir em cada layer -->
127   -<!--<tr style="border:0px"><td colspan=3 style=background-color:black ><input style="border:0px none; background-color:black;color:white;font-size:12pt;" type="text" size="1" id="i3geo_letreiro" ></td></tr>-->
128   -<!-- esse elemento é preenchido automaticamente pelo i3Geo, conforme definido em ms_configura.php -->
129   -<!--<tr style="border:0px"><td colspan=3 style=background-color:black;color:white id="emailInstituicao">@</td></tr>-->
130 96  
131   -</table>
132   -<center>
133   -<table id="i3GEOlogoMarca">
134   -<tr>
135   - <td><center><h1 style="font-size:10px;font-family: Verdana, Arial, Helvetica, sans-serif;"><div id=versaoi3geo ></div><h2 style="font-size:10px;font-family: Verdana, Arial, Helvetica, sans-serif;">i3Geo - Software livre para criação de mapas interativos e geoprocessamento<h3 style="font-size:10px;font-family: Verdana, Arial, Helvetica, sans-serif;">Baseado no Mapserver, é licenciado sob GPL e integra o Portal do Software Público Brasileiro</h3></h2></h1></td>
136   -</tr>
137   -<tr>
138   - <td style="padding:10px;"><center><img alt="logomarca" src='../imagens/logo_inicio.png'></td>
139   -</tr>
140   -<tr>
141   - <td><center>
142   - <!--
143   - <script id="ohloh" type="text/javascript" src="http://www.ohloh.net/p/150688/widgets/project_users.js?style=red"></script>
144   - -->
145   - </td>
146   -</tr>
147   -</table>
148 97 <script src="../classesjs/i3geonaocompacto.js"></script>
149 98 <script src="../pacotes/openlayers/OpenLayers29.js.php"></script>
150 99 <!-- estilo necessário para a ferramenta de edição -->
... ... @@ -224,7 +173,7 @@ i3GEO.cria();
224 173 i3GEO.configura.mapaRefDisplay = "none";
225 174  
226 175 i3GEO.barraDeBotoes.TIPO = "olhodepeixe";
227   -i3GEO.barraDeBotoes.OFFSET = 0;
  176 +i3GEO.barraDeBotoes.OFFSET = 5;
228 177 i3GEO.scrollerWidth = 0; //permite ajustar o mapa até a borda do navegador
229 178 //i3GEO.barraDeBotoes.MAXBOTOES = 10;
230 179 i3GEO.configura.oMenuData["submenus"]["janelas"] = [];
... ... @@ -251,6 +200,7 @@ i3GEO.arvoreDeTemas.OPCOESADICIONAIS.comentarios = true;
251 200 i3GEO.arvoreDeCamadas.VERIFICAABRANGENCIATEMAS = true;
252 201 i3GEO.arvoreDeCamadas.MOSTRALISTAKML = false;
253 202 i3GEO.mapa.AUTORESIZE = true;
  203 +i3GEO.guias.TIPO = "movel";
254 204 //
255 205 //esta é uma variável interna do OpenLayers que define o endereço do diretório onde estão as imagens usadas nos ícones
256 206 //
... ... @@ -300,7 +250,6 @@ OpenLayers.ImgPath = &quot;../pacotes/openlayers/img/&quot;;
300 250 //
301 251 i3GEO.finaliza = function(){
302 252 $i("i3GEOlogoMarca").style.display = "none";
303   - i3GEO.guias.guiaMovel()
304 253 }
305 254 i3GEO.inicia();
306 255 </script>
... ...