Commit 558382806eaf79d8cc7d0e7e428a92980777a19c
1 parent
d3873c5d
Exists in
master
and in
7 other branches
Inclusão de exemplo de customização da barra de botoes
Showing
3 changed files
with
75 additions
and
34 deletions
Show diff stats
exemplos/cursodsv20.htm
@@ -9,16 +9,16 @@ | @@ -9,16 +9,16 @@ | ||
9 | <link rel="stylesheet" type="text/css" href="../css/black.css"> | 9 | <link rel="stylesheet" type="text/css" href="../css/black.css"> |
10 | </head> | 10 | </head> |
11 | <body style='background:white;' class=yui-skin-sam > | 11 | <body style='background:white;' class=yui-skin-sam > |
12 | +<div style="left:150px;top:100px"> | ||
13 | + <div id="menuSuspenso" style="width:750px;left:50px;"> | ||
14 | + </div> | ||
12 | 15 | ||
13 | -<div id="menuSuspenso" style="width:750px;"> | ||
14 | -</div> | ||
15 | - | ||
16 | -<div > | ||
17 | <div id=i3geo > | 16 | <div id=i3geo > |
18 | - <div id=corpoMapa style="top:1px;width:750px;height:400px;background-image:url('../imagens/i3geo1bw.jpg');"> | 17 | + <div id=corpoMapa style="width:750px;height:400px;background-image:url('../imagens/i3geo1bw.jpg');"> |
19 | </div> | 18 | </div> |
20 | </div> | 19 | </div> |
21 | </div> | 20 | </div> |
21 | + | ||
22 | <style> | 22 | <style> |
23 | #menuSuspenso .bd{ | 23 | #menuSuspenso .bd{ |
24 | background: black; | 24 | background: black; |
@@ -26,15 +26,19 @@ | @@ -26,15 +26,19 @@ | ||
26 | </style> | 26 | </style> |
27 | <script> | 27 | <script> |
28 | /************ | 28 | /************ |
29 | -A barra de botoes inclui as principais funcionalidades que interagem diretamente com o mapa, exigindo cliques ou | ||
30 | -outros movimentos do mouse | 29 | +A barra de botoes e controlada por diversos parametros. |
30 | + | ||
31 | +A lista de botoes e definido no objeto: | ||
31 | 32 | ||
32 | -Um dos tipos de barra e a "olhodepeixe1" que usa o efeito de lente quando o usuario passa o mouse sobre o icone. | 33 | + i3GEO.barraDeBotoes.INCLUIBOTAO |
33 | 34 | ||
34 | -Quando i3GEO.barraDeBotoes.TIPO = "olhodepeixe1" a barra e construida sem a necessidade de inserir elementos | ||
35 | -HTML especificos. | 35 | +Determinados parametros atuam sobre tipos diferentes de barras. |
36 | 36 | ||
37 | -A posicao da barra pode ser ajustada definindo-se um OFFSET em relacao ao topo da pagina | 37 | +Mais detalhes em: |
38 | + | ||
39 | + http://localhost/i3geo/documentacao/files/classesjs/classe_barradebotoes-js.html | ||
40 | + | ||
41 | +Nesse exemplo um novo botao e adicionado a barra | ||
38 | 42 | ||
39 | ************/ | 43 | ************/ |
40 | i3GEO.idioma.MOSTRASELETOR = false; //para nao mostrar as bandeiras de escolha do idioma | 44 | i3GEO.idioma.MOSTRASELETOR = false; //para nao mostrar as bandeiras de escolha do idioma |
@@ -75,9 +79,59 @@ i3GEO.configura.oMenuData = { | @@ -75,9 +79,59 @@ i3GEO.configura.oMenuData = { | ||
75 | }; | 79 | }; |
76 | 80 | ||
77 | i3GEO.cria(); | 81 | i3GEO.cria(); |
82 | +// | ||
78 | //parametros da barra de botoes | 83 | //parametros da barra de botoes |
84 | +// | ||
79 | i3GEO.barraDeBotoes.TIPO = "olhodepeixe1"; | 85 | i3GEO.barraDeBotoes.TIPO = "olhodepeixe1"; |
80 | -i3GEO.barraDeBotoes.OFFSET = -400 + -24; | 86 | +//altera um dos icones de botoes ja existentes |
87 | +i3GEO.barraDeBotoes.ICONEBOTAO.abreJanelaLegenda = "/imagens/gisicons/legend-add.png"; | ||
88 | +//adiciona um botao novo com suas funcoes especificas | ||
89 | +i3GEO.barraDeBotoes.adicionaBotao( | ||
90 | + { | ||
91 | + iddiv:"meubotao", | ||
92 | + tipo:"", | ||
93 | + dica:"Meu Botão", | ||
94 | + titulo: "Meu Botão", | ||
95 | + icone: "/imagens/oxygen/22x22/user-online.png", | ||
96 | + funcaoonclick:function(){ | ||
97 | + alert("Meu novo botao com ID = meubotao"); | ||
98 | + } | ||
99 | + } | ||
100 | +); | ||
101 | +//define quais os botoes serao mostrados | ||
102 | +i3GEO.barraDeBotoes.INCLUIBOTAO = { | ||
103 | + meubotao : true, //botao novo | ||
104 | + abreJanelaLegenda: true, | ||
105 | + localizar: true, | ||
106 | + zoomanterior: true, | ||
107 | + zoomli: true, | ||
108 | + zoomproximo: true, | ||
109 | + zoomiauto: false, | ||
110 | + zoomoauto: false, | ||
111 | + pan: false, | ||
112 | + zoomtot: false, | ||
113 | + identifica: false, | ||
114 | + identificaBalao: false, | ||
115 | + mede: false, | ||
116 | + area: false, | ||
117 | + selecao: false, | ||
118 | + barraedicao: false, | ||
119 | + imprimir: false, | ||
120 | + google: false, | ||
121 | + referencia: false, | ||
122 | + exten: false, | ||
123 | + inserexy: false, | ||
124 | + textofid: false, | ||
125 | + reinicia: false, | ||
126 | + buscafotos: false, | ||
127 | + wiki: false, | ||
128 | + metar: false, | ||
129 | + lentei: false, | ||
130 | + confluence: false, | ||
131 | + inseregrafico: false, | ||
132 | + v3d: false | ||
133 | +}; | ||
134 | + | ||
81 | i3GEO.inicia(); | 135 | i3GEO.inicia(); |
82 | 136 | ||
83 | </script> | 137 | </script> |
exemplos/index.html
@@ -97,6 +97,8 @@ body,td { | @@ -97,6 +97,8 @@ body,td { | ||
97 | <a href="codemirror.php?&pagina=cursodsv18.htm" target="_blank">[18]</a> | 97 | <a href="codemirror.php?&pagina=cursodsv18.htm" target="_blank">[18]</a> |
98 | | 98 | |
99 | <a href="codemirror.php?&pagina=cursodsv19.htm" target="_blank">[19]</a> | 99 | <a href="codemirror.php?&pagina=cursodsv19.htm" target="_blank">[19]</a> |
100 | + | ||
101 | + <a href="codemirror.php?&pagina=cursodsv20.htm" target="_blank">[20]</a> | ||
100 | </p> | 102 | </p> |
101 | </fieldset> | 103 | </fieldset> |
102 | <fieldset> | 104 | <fieldset> |
interface/openlayersdebug.htm
@@ -213,36 +213,21 @@ i3GEO.configura.mapaRefDisplay = "none"; | @@ -213,36 +213,21 @@ i3GEO.configura.mapaRefDisplay = "none"; | ||
213 | //tipo de barra de botões | 213 | //tipo de barra de botões |
214 | i3GEO.barraDeBotoes.TIPO = "olhodepeixe1"; | 214 | i3GEO.barraDeBotoes.TIPO = "olhodepeixe1"; |
215 | //ajusta o deslocamento da barra de botoes | 215 | //ajusta o deslocamento da barra de botoes |
216 | -i3GEO.barraDeBotoes.OFFSET = 11; | 216 | +//i3GEO.barraDeBotoes.OFFSET = 11; |
217 | //ajusta a posicao da barra de botoes no IE | 217 | //ajusta a posicao da barra de botoes no IE |
218 | -if(navm){ | ||
219 | - i3GEO.barraDeBotoes.OFFSET = 5; | ||
220 | -} | ||
221 | -if(chro){ | ||
222 | - i3GEO.barraDeBotoes.OFFSET = 15; | ||
223 | -} | 218 | +//if(navm){ |
219 | +// i3GEO.barraDeBotoes.OFFSET = 5; | ||
220 | +//} | ||
221 | +//if(chro){ | ||
222 | +// i3GEO.barraDeBotoes.OFFSET = 15; | ||
223 | +//} | ||
224 | 224 | ||
225 | //número máximo de botões na barra de botões inicial | 225 | //número máximo de botões na barra de botões inicial |
226 | //i3GEO.barraDeBotoes.MAXBOTOES = 10; | 226 | //i3GEO.barraDeBotoes.MAXBOTOES = 10; |
227 | //remove itens dos menus que não são necessários, já que estão como ícones na barra de botões | 227 | //remove itens dos menus que não são necessários, já que estão como ícones na barra de botões |
228 | i3GEO.configura.oMenuData["submenus"]["janelas"] = []; | 228 | i3GEO.configura.oMenuData["submenus"]["janelas"] = []; |
229 | i3GEO.gadgets.PARAMETROS.mostraMenuSuspenso.permiteLogin = true; | 229 | i3GEO.gadgets.PARAMETROS.mostraMenuSuspenso.permiteLogin = true; |
230 | -// | ||
231 | -//barra de botoes normal. descomente para usar | ||
232 | -/* | ||
233 | -i3GEO.barraDeBotoes.TIPO = "yui"; | ||
234 | -i3GEO.barraDeBotoes.AUTOALTURA = true; | ||
235 | -i3GEO.barraDeBotoes.ATIVAMENUCONTEXTO = false; | ||
236 | -i3GEO.barraDeBotoes.PERMITEFECHAR = false; | ||
237 | -i3GEO.barraDeBotoes.PERMITEDESLOCAR = false; | ||
238 | -i3GEO.barraDeBotoes.AUTO = true; | ||
239 | -i3GEO.barraDeBotoes.COMPORTAMENTO = "laranja"; | ||
240 | 230 | ||
241 | -i3GEO.Interface.BARRABOTOESLEFT = 0; | ||
242 | -i3GEO.Interface.BARRABOTOESTOP = 2; | ||
243 | -i3GEO.Interface.BARRADEZOOMTOP = 10; | ||
244 | -i3GEO.Interface.BARRADEZOOMLEFT = 40; | ||
245 | -*/ | ||
246 | i3GEO.ajuda.ATIVAJANELA = false; | 231 | i3GEO.ajuda.ATIVAJANELA = false; |
247 | i3GEO.idioma.IDSELETOR = "seletorIdiomas"; | 232 | i3GEO.idioma.IDSELETOR = "seletorIdiomas"; |
248 | i3GEO.Interface.ATIVAMENUCONTEXTO = false; | 233 | i3GEO.Interface.ATIVAMENUCONTEXTO = false; |