Download as
Browse Code »

Commit 82b1c79ed10ce59abe62ddc0030bf4b03b7b4c8a

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

Barra de botões do tipo emlinha

Showing 3 changed files with 158 additions and 132 deletions   Show diff stats
classesjs/classe_barradebotoes.js
  Diff comments   View file @82b1c79
@@ -61,6 +61,10 @@ i3GEO.barraDeBotoes = { @@ -61,6 +61,10 @@ i3GEO.barraDeBotoes = {
61 Tipo de barra. 61 Tipo de barra.
62 62
63 Por padrão, utiliza a biblioteca YUI para construir a barra, opcionalmente pode-se utilizar o tipo "olho de peixe". 63 Por padrão, utiliza a biblioteca YUI para construir a barra, opcionalmente pode-se utilizar o tipo "olho de peixe".
  64 +
  65 + O tipo emlinha insere os botões em um elemento html qualquer já existente na página. Nesse caso a barra
  66 + não é iniciada automaticamente, sendo necessário usar a função
  67 + i3GEO.barraDeBotoes.inicializaBarra("","",false,0,0,onde)
64 68
65 Tipo: 69 Tipo:
66 {string} 70 {string}
@@ -69,7 +73,7 @@ i3GEO.barraDeBotoes = { @@ -69,7 +73,7 @@ i3GEO.barraDeBotoes = {
69 {yui} 73 {yui}
70 74
71 Valores: 75 Valores:
72 - {"yui","olhodepeixe"} 76 + {"yui","olhodepeixe","emlinha"}
73 */ 77 */
74 TIPO: "yui", 78 TIPO: "yui",
75 /* 79 /*
@@ -715,9 +719,15 @@ i3GEO.barraDeBotoes = { @@ -715,9 +719,15 @@ i3GEO.barraDeBotoes = {
715 if (temp){ 719 if (temp){
716 if(l[b].conteudo) 720 if(l[b].conteudo)
717 {temp.innerHTML = l[b].conteudo;} 721 {temp.innerHTML = l[b].conteudo;}
718 - if(l[b].dica){  
719 - eval('$i("'+l[b].iddiv+'").onmouseover = function(e){i3GEO.barraDeBotoes.mostraJanela(this,"'+l[b].dica+'",e);}');  
720 - eval('$i("'+l[b].iddiv+'").onmouseout = function(e){i3GEO.barraDeBotoes.mostraJanela(this,"",e);};'); 722 + if(l[b].dica && i3GEO.barraDeBotoes.TIPO != "emlinha"){
  723 + $i(l[b].iddiv).onmouseover = function(e){i3GEO.barraDeBotoes.mostraJanela(this,l[b].dica,e);};
  724 + $i(l[b].iddiv).onmouseout = function(e){i3GEO.barraDeBotoes.mostraJanela(this,"",e);};
  725 + }
  726 + if(l[b].titulo && i3GEO.barraDeBotoes.TIPO === "emlinha"){
  727 + new YAHOO.widget.Tooltip(l[b].iddiv+"_tip", {
  728 + context: l[b].iddiv,
  729 + text: l[b].titulo
  730 + });
721 } 731 }
722 if(l[b].funcaoonclick){ 732 if(l[b].funcaoonclick){
723 temp.onclick = l[b].funcaoonclick; 733 temp.onclick = l[b].funcaoonclick;
@@ -1012,6 +1022,18 @@ i3GEO.barraDeBotoes = { @@ -1012,6 +1022,18 @@ i3GEO.barraDeBotoes = {
1012 branco = i3GEO.configura.locaplic+'/imagens/branco.gif'; 1022 branco = i3GEO.configura.locaplic+'/imagens/branco.gif';
1013 if(navm) 1023 if(navm)
1014 {i3GEO.barraDeBotoes.TRANSICAOSUAVE = false;} 1024 {i3GEO.barraDeBotoes.TRANSICAOSUAVE = false;}
  1025 + if(i3GEO.barraDeBotoes.TIPO === "emlinha"){
  1026 + temp = "";
  1027 + chaves = i3GEO.util.listaChaves(i3GEO.barraDeBotoes.INCLUIBOTAO);
  1028 + n = chaves.length;
  1029 + for(i=0;i<n;i+=1){
  1030 + if(i3GEO.barraDeBotoes.INCLUIBOTAO[chaves[i]] === true){
  1031 + temp += i3GEO.barraDeBotoes.TEMPLATEBOTAO.replace("$$",chaves[i]);
  1032 + }
  1033 + }
  1034 + $i(onde).innerHTML = temp;
  1035 + i3GEO.barraDeBotoes.ativaBotoes();
  1036 + }
1015 if(this.AUTO === true){ 1037 if(this.AUTO === true){
1016 if(idconteudo === "barraDeBotoes1"){ 1038 if(idconteudo === "barraDeBotoes1"){
1017 novoel = document.createElement("div"); 1039 novoel = document.createElement("div");
@@ -1061,42 +1083,44 @@ i3GEO.barraDeBotoes = { @@ -1061,42 +1083,44 @@ i3GEO.barraDeBotoes = {
1061 } 1083 }
1062 wj = "36px"; 1084 wj = "36px";
1063 recuo = "0px"; 1085 recuo = "0px";
1064 - novoel = document.createElement("div");  
1065 - novoel.id = idconteudonovo;  
1066 - novoel.style.display="block";  
1067 - if(this.SOICONES === false){  
1068 - novoel.style.border="1px solid gray";  
1069 - novoel.style.background="white";  
1070 - }  
1071 - else  
1072 - {novoel.style.border="0px solid white";}  
1073 - if(i3GEO.barraDeBotoes.TRANSICAOSUAVE)  
1074 - {Dom.setStyle(novoel,"opacity",this.OPACIDADE / 100);}  
1075 - temp = "";  
1076 - if (barraZoom === true)  
1077 - {temp += i3GEO.navega.barraDeZoom.cria();}  
1078 - temp += '<div id="'+idconteudonovo+'_" style="left:'+recuo+';top:0px;" ></div>';  
1079 - novoel.innerHTML = temp;  
1080 - novoel.onmouseover = function(){  
1081 - YAHOO.util.Dom.setStyle("i3geo_rosa","display","none");  
1082 - if(i3GEO.barraDeBotoes.TRANSICAOSUAVE){  
1083 - YAHOO.util.Dom.setStyle(novoel,"opacity",1); 1086 + if(idconteudonovo != ""){
  1087 + novoel = document.createElement("div");
  1088 + novoel.id = idconteudonovo;
  1089 + novoel.style.display="block";
  1090 + if(this.SOICONES === false){
  1091 + novoel.style.border="1px solid gray";
  1092 + novoel.style.background="white";
1084 } 1093 }
1085 - if(i3GEO.Interface.TABLET === true){  
1086 - //i3GEO.barraDeBotoes.BARRAS[0].cfg.setProperty("height", "");  
1087 - //$i(i3GEO.barraDeBotoes.BARRAS[0].id+"_").style.top = "0px";  
1088 - }  
1089 - };  
1090 - novoel.onmouseout = function(){  
1091 - if(i3GEO.barraDeBotoes.TRANSICAOSUAVE){  
1092 - YAHOO.util.Dom.setStyle(novoel,"opacity",i3GEO.barraDeBotoes.OPACIDADE / 100);  
1093 - }  
1094 - if(i3GEO.Interface.TABLET === true){  
1095 - //i3GEO.barraDeBotoes.BARRAS[0].cfg.setProperty("height", "10px");  
1096 - //$i(i3GEO.barraDeBotoes.BARRAS[0].id+"_").style.top = "-200px";  
1097 - }  
1098 - };  
1099 - document.body.appendChild(novoel); 1094 + else
  1095 + {novoel.style.border="0px solid white";}
  1096 + if(i3GEO.barraDeBotoes.TRANSICAOSUAVE)
  1097 + {Dom.setStyle(novoel,"opacity",this.OPACIDADE / 100);}
  1098 + temp = "";
  1099 + if (barraZoom === true)
  1100 + {temp += i3GEO.navega.barraDeZoom.cria();}
  1101 + temp += '<div id="'+idconteudonovo+'_" style="left:'+recuo+';top:0px;" ></div>';
  1102 + novoel.innerHTML = temp;
  1103 + novoel.onmouseover = function(){
  1104 + YAHOO.util.Dom.setStyle("i3geo_rosa","display","none");
  1105 + if(i3GEO.barraDeBotoes.TRANSICAOSUAVE){
  1106 + YAHOO.util.Dom.setStyle(novoel,"opacity",1);
  1107 + }
  1108 + if(i3GEO.Interface.TABLET === true){
  1109 + //i3GEO.barraDeBotoes.BARRAS[0].cfg.setProperty("height", "");
  1110 + //$i(i3GEO.barraDeBotoes.BARRAS[0].id+"_").style.top = "0px";
  1111 + }
  1112 + };
  1113 + novoel.onmouseout = function(){
  1114 + if(i3GEO.barraDeBotoes.TRANSICAOSUAVE){
  1115 + YAHOO.util.Dom.setStyle(novoel,"opacity",i3GEO.barraDeBotoes.OPACIDADE / 100);
  1116 + }
  1117 + if(i3GEO.Interface.TABLET === true){
  1118 + //i3GEO.barraDeBotoes.BARRAS[0].cfg.setProperty("height", "10px");
  1119 + //$i(i3GEO.barraDeBotoes.BARRAS[0].id+"_").style.top = "-200px";
  1120 + }
  1121 + };
  1122 + document.body.appendChild(novoel);
  1123 + }
1100 if(this.ATIVAMENUCONTEXTO) 1124 if(this.ATIVAMENUCONTEXTO)
1101 {i3GEO.util.mudaCursor(i3GEO.configura.cursores,"contexto",idconteudonovo,i3GEO.configura.locaplic);} 1125 {i3GEO.util.mudaCursor(i3GEO.configura.cursores,"contexto",idconteudonovo,i3GEO.configura.locaplic);}
1102 //copia os botoes do HTML para a janela 1126 //copia os botoes do HTML para a janela
@@ -1105,7 +1129,7 @@ i3GEO.barraDeBotoes = { @@ -1105,7 +1129,7 @@ i3GEO.barraDeBotoes = {
1105 if(this.AUTOALTURA === true) 1129 if(this.AUTOALTURA === true)
1106 {alturadisponivel += 28;} 1130 {alturadisponivel += 28;}
1107 numerobotoes = parseInt(alturadisponivel / ticone,10); 1131 numerobotoes = parseInt(alturadisponivel / ticone,10);
1108 - if($i(idconteudo)) 1132 + if(idconteudo != "" && $i(idconteudo))
1109 { 1133 {
1110 $i(idconteudonovo+"_").innerHTML = $i(idconteudo).innerHTML; 1134 $i(idconteudonovo+"_").innerHTML = $i(idconteudo).innerHTML;
1111 $i(idconteudo).innerHTML = ""; 1135 $i(idconteudo).innerHTML = "";
@@ -1141,111 +1165,113 @@ i3GEO.barraDeBotoes = { @@ -1141,111 +1165,113 @@ i3GEO.barraDeBotoes = {
1141 Dom.setStyle(["sobeferramentas","desceferramentas"],"display","none"); 1165 Dom.setStyle(["sobeferramentas","desceferramentas"],"display","none");
1142 } 1166 }
1143 } 1167 }
1144 - YAHOO.namespace("i3GEO.janela.botoes");  
1145 - if(i3GEO.barraDeBotoes.ORIENTACAO === "horizontal"){  
1146 - YAHOO.i3GEO.janela.botoes = new YAHOO.widget.Panel(idconteudonovo, {zIndex:20000,height:40,width:i3GEO.barraDeBotoes.HORIZONTALW, fixedcenter: false, constraintoviewport: false, underlay:"none", close:i3GEO.barraDeBotoes.PERMITEFECHAR, visible:true, draggable:i3GEO.barraDeBotoes.PERMITEDESLOCAR, modal:false,iframe:false } );  
1147 - }  
1148 - else{  
1149 - if(this.AUTOALTURA === false || barraZoom === true || (elementos.length > numerobotoes))  
1150 - {YAHOO.i3GEO.janela.botoes = new YAHOO.widget.Panel(idconteudonovo, {zIndex:20000,width:wj, fixedcenter: false, constraintoviewport: false, underlay:"none", close:i3GEO.barraDeBotoes.PERMITEFECHAR, visible:true, draggable:i3GEO.barraDeBotoes.PERMITEDESLOCAR, modal:false,iframe:false } );}  
1151 - else  
1152 - {YAHOO.i3GEO.janela.botoes = new YAHOO.widget.Panel(idconteudonovo, {zIndex:20000,height:i3GEO.parametros.h - 4,width:wj, fixedcenter: false, constraintoviewport: false, underlay:"none", close:i3GEO.barraDeBotoes.PERMITEFECHAR, visible:true, draggable:i3GEO.barraDeBotoes.PERMITEDESLOCAR, modal:false,iframe:false } );}  
1153 - }  
1154 - if(this.SOICONES === true){  
1155 - Dom.setStyle(["i3geo_barra2","i3geo_barra1"],"borderWidth","0 0 0 0");  
1156 - }  
1157 - YAHOO.i3GEO.janela.botoes.render();  
1158 - YAHOO.i3GEO.janela.botoes.moveTo(x,y);  
1159 - if($i("sobeferramentas")){  
1160 - $i("sobeferramentas").onclick = function(){  
1161 - elementos = $i(idconteudonovo+"_").getElementsByTagName("div");  
1162 - nelementos = elementos.length;  
1163 - if(elementos[0].style.display === "inline" && elementos[0].id === "")  
1164 - {return;}  
1165 - if(nelementos > 0){  
1166 - mostra = elementos[0];  
1167 - i = 0;  
1168 - do{  
1169 - if(elementos[i].style){  
1170 - if(elementos[i].style.display === "inline" && elementos[i].id === "")  
1171 - {break;}  
1172 - if(elementos[i].style.display === "none" && elementos[i].id === "")  
1173 - {mostra = elementos[i];}  
1174 - }  
1175 - i = i + 1;  
1176 - }  
1177 - while(i < nelementos);  
1178 - mostra.style.display="inline";  
1179 - //esconde o &uacute;ltimo botao  
1180 - i = nelementos + 1;  
1181 - mostra = elementos[i];  
1182 - do{  
1183 - if(elementos[i]){  
1184 - if(elementos[i].style){  
1185 - if(elementos[i].style.display === "inline")  
1186 - {mostra = elementos[i];break;}  
1187 - }  
1188 - }  
1189 - i = i - 1;  
1190 - }  
1191 - while(i >= 0);  
1192 - mostra.style.display="none";  
1193 - }  
1194 - };  
1195 - }  
1196 - if($i("desceferramentas")){  
1197 - $i("desceferramentas").onclick = function(){  
1198 - tipo = "inline";  
1199 - if($i(idconteudonovo+"_")){ 1168 + if(i3GEO.barraDeBotoes.TIPO != "emlinha"){
  1169 + YAHOO.namespace("i3GEO.janela.botoes");
  1170 + if(i3GEO.barraDeBotoes.ORIENTACAO === "horizontal"){
  1171 + YAHOO.i3GEO.janela.botoes = new YAHOO.widget.Panel(idconteudonovo, {zIndex:20000,height:40,width:i3GEO.barraDeBotoes.HORIZONTALW, fixedcenter: false, constraintoviewport: false, underlay:"none", close:i3GEO.barraDeBotoes.PERMITEFECHAR, visible:true, draggable:i3GEO.barraDeBotoes.PERMITEDESLOCAR, modal:false,iframe:false } );
  1172 + }
  1173 + else{
  1174 + if(this.AUTOALTURA === false || barraZoom === true || (elementos.length > numerobotoes))
  1175 + {YAHOO.i3GEO.janela.botoes = new YAHOO.widget.Panel(idconteudonovo, {zIndex:20000,width:wj, fixedcenter: false, constraintoviewport: false, underlay:"none", close:i3GEO.barraDeBotoes.PERMITEFECHAR, visible:true, draggable:i3GEO.barraDeBotoes.PERMITEDESLOCAR, modal:false,iframe:false } );}
  1176 + else
  1177 + {YAHOO.i3GEO.janela.botoes = new YAHOO.widget.Panel(idconteudonovo, {zIndex:20000,height:i3GEO.parametros.h - 4,width:wj, fixedcenter: false, constraintoviewport: false, underlay:"none", close:i3GEO.barraDeBotoes.PERMITEFECHAR, visible:true, draggable:i3GEO.barraDeBotoes.PERMITEDESLOCAR, modal:false,iframe:false } );}
  1178 + }
  1179 + if(this.SOICONES === true){
  1180 + Dom.setStyle(["i3geo_barra2","i3geo_barra1"],"borderWidth","0 0 0 0");
  1181 + }
  1182 + YAHOO.i3GEO.janela.botoes.render();
  1183 + YAHOO.i3GEO.janela.botoes.moveTo(x,y);
  1184 + if($i("sobeferramentas")){
  1185 + $i("sobeferramentas").onclick = function(){
1200 elementos = $i(idconteudonovo+"_").getElementsByTagName("div"); 1186 elementos = $i(idconteudonovo+"_").getElementsByTagName("div");
1201 - if(elementos[elementos.length - 1].style.display === tipo)  
1202 - {return;}  
1203 nelementos = elementos.length; 1187 nelementos = elementos.length;
  1188 + if(elementos[0].style.display === "inline" && elementos[0].id === "")
  1189 + {return;}
1204 if(nelementos > 0){ 1190 if(nelementos > 0){
1205 - //esconde o primeiro botao 1191 + mostra = elementos[0];
1206 i = 0; 1192 i = 0;
1207 do{ 1193 do{
1208 - e = elementos[i];  
1209 - if(e.style){  
1210 - if((e.style.display === "block") || (e.style.display === "inline") || (e.style.display === "")){  
1211 - if(e.id === "")  
1212 - {e.style.display="none";break;}  
1213 - } 1194 + if(elementos[i].style){
  1195 + if(elementos[i].style.display === "inline" && elementos[i].id === "")
  1196 + {break;}
  1197 + if(elementos[i].style.display === "none" && elementos[i].id === "")
  1198 + {mostra = elementos[i];}
1214 } 1199 }
1215 i = i + 1; 1200 i = i + 1;
1216 } 1201 }
1217 while(i < nelementos); 1202 while(i < nelementos);
1218 - //mostra o &uacute;ltimo botao  
1219 - i = nelementos-1;  
1220 - var mostra = elementos[i]; 1203 + mostra.style.display="inline";
  1204 + //esconde o &uacute;ltimo botao
  1205 + i = nelementos + 1;
  1206 + mostra = elementos[i];
1221 do{ 1207 do{
1222 - e = elementos[i];  
1223 - if(e.style){  
1224 - if(e.style.display === tipo)  
1225 - {break;}  
1226 - if(e.style.display === "none")  
1227 - {mostra = e;} 1208 + if(elementos[i]){
  1209 + if(elementos[i].style){
  1210 + if(elementos[i].style.display === "inline")
  1211 + {mostra = elementos[i];break;}
  1212 + }
1228 } 1213 }
1229 i = i - 1; 1214 i = i - 1;
1230 } 1215 }
1231 while(i >= 0); 1216 while(i >= 0);
1232 - mostra.style.display=tipo; 1217 + mostra.style.display="none";
1233 } 1218 }
1234 - }  
1235 - };  
1236 - }  
1237 - this.BARRAS.push(YAHOO.i3GEO.janela.botoes);  
1238 - YAHOO.i3GEO.janela.botoes.show();  
1239 - if(i3GEO.Interface.TABLET === true){  
1240 - YAHOO.i3GEO.janela.botoes.moveTo((i3GEO.parametros.w / 2) - (i3GEO.barraDeBotoes.HORIZONTALW / 2),"");  
1241 - }  
1242 - //  
1243 - //menu de contexto  
1244 - //  
1245 - if(this.ATIVAMENUCONTEXTO){  
1246 - this.ativaMenuContexto(idconteudonovo); 1219 + };
  1220 + }
  1221 + if($i("desceferramentas")){
  1222 + $i("desceferramentas").onclick = function(){
  1223 + tipo = "inline";
  1224 + if($i(idconteudonovo+"_")){
  1225 + elementos = $i(idconteudonovo+"_").getElementsByTagName("div");
  1226 + if(elementos[elementos.length - 1].style.display === tipo)
  1227 + {return;}
  1228 + nelementos = elementos.length;
  1229 + if(nelementos > 0){
  1230 + //esconde o primeiro botao
  1231 + i = 0;
  1232 + do{
  1233 + e = elementos[i];
  1234 + if(e.style){
  1235 + if((e.style.display === "block") || (e.style.display === "inline") || (e.style.display === "")){
  1236 + if(e.id === "")
  1237 + {e.style.display="none";break;}
  1238 + }
  1239 + }
  1240 + i = i + 1;
  1241 + }
  1242 + while(i < nelementos);
  1243 + //mostra o &uacute;ltimo botao
  1244 + i = nelementos-1;
  1245 + var mostra = elementos[i];
  1246 + do{
  1247 + e = elementos[i];
  1248 + if(e.style){
  1249 + if(e.style.display === tipo)
  1250 + {break;}
  1251 + if(e.style.display === "none")
  1252 + {mostra = e;}
  1253 + }
  1254 + i = i - 1;
  1255 + }
  1256 + while(i >= 0);
  1257 + mostra.style.display=tipo;
  1258 + }
  1259 + }
  1260 + };
  1261 + }
  1262 + this.BARRAS.push(YAHOO.i3GEO.janela.botoes);
  1263 + YAHOO.i3GEO.janela.botoes.show();
  1264 + if(i3GEO.Interface.TABLET === true){
  1265 + YAHOO.i3GEO.janela.botoes.moveTo((i3GEO.parametros.w / 2) - (i3GEO.barraDeBotoes.HORIZONTALW / 2),"");
  1266 + }
  1267 + //
  1268 + //menu de contexto
  1269 + //
  1270 + if(this.ATIVAMENUCONTEXTO){
  1271 + this.ativaMenuContexto(idconteudonovo);
  1272 + }
  1273 + Dom.replaceClass(idconteudonovo+"_h","hd2");
1247 } 1274 }
1248 - Dom.replaceClass(idconteudonovo+"_h","hd2");  
1249 } 1275 }
1250 }, 1276 },
1251 /* 1277 /*
classesjs/classe_interface.js
  Diff comments   View file @82b1c79
@@ -463,7 +463,7 @@ i3GEO.Interface = { @@ -463,7 +463,7 @@ i3GEO.Interface = {
463 if (i3GEO.Interface.STATUS.trocando === false) { 463 if (i3GEO.Interface.STATUS.trocando === false) {
464 if (i3GEO.barraDeBotoes.TIPO === "olhodepeixe") { 464 if (i3GEO.barraDeBotoes.TIPO === "olhodepeixe") {
465 i3GEO.barraDeBotoes.inicializaBarra(); 465 i3GEO.barraDeBotoes.inicializaBarra();
466 - } else { 466 + } else if (i3GEO.barraDeBotoes.TIPO === "yui") {
467 i3GEO.Interface[i3GEO.Interface.ATUAL].ativaBotoes(); 467 i3GEO.Interface[i3GEO.Interface.ATUAL].ativaBotoes();
468 } 468 }
469 } 469 }
css/botoes2.css
  Diff comments   View file @82b1c79
@@ -724,7 +724,7 @@ @@ -724,7 +724,7 @@
724 cursor: pointer; 724 cursor: pointer;
725 margin-right: 3px; 725 margin-right: 3px;
726 } 726 }
727 -/*marcador de lista das op��es do tema*/ 727 +/*marcador de lista das opcoes do tema*/
728 .ticOpcoesTemas { 728 .ticOpcoesTemas {
729 background-image: URL('../imagens/visual/default/sprite.png'); 729 background-image: URL('../imagens/visual/default/sprite.png');
730 background-repeat: no-repeat; 730 background-repeat: no-repeat;
@@ -783,7 +783,7 @@ @@ -783,7 +783,7 @@
783 border: 1px solid #DCDCDC; 783 border: 1px solid #DCDCDC;
784 } 784 }
785 785
786 -.zoomAnterior { 786 +.zoomAnterior {
787 background-image: URL('../imagens/visual/default/sprite.png'); 787 background-image: URL('../imagens/visual/default/sprite.png');
788 background-repeat: no-repeat; 788 background-repeat: no-repeat;
789 background-position: 0px -1675px; 789 background-position: 0px -1675px;