Commit 2924ab6d6ccef6ee691e3ee3aebf06af6a80ad09
1 parent
516e0e85
Exists in
master
and in
7 other branches
--no commit message
Showing
3 changed files
with
88 additions
and
130 deletions
Show diff stats
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
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 = "../pacotes/openlayers/img/"; |
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> | ... | ... |