Commit 6d49f419fc7cc3ef566c27b0f9bb4ba80fda084b

Authored by Edmar Moretti
1 parent 836f7d26

Pagina de exmplos em bootstrap

exemplos/index.js 0 → 100755
... ... @@ -0,0 +1,492 @@
  1 +botoesIni = [
  2 +{
  3 + "corpo":"Para ver os parâmetros de inicialização com ms_configura",
  4 + "link": "http://localhost/i3geo/ms_criamapa.php?ajuda",
  5 + "tag": "Inicialização"
  6 +},{
  7 + "link":"vinde.htm",
  8 + "corpo":"Navegador de WMS cadastrados na INDE Brasileira",
  9 + "tag":"IDE"
  10 +},{
  11 + "link":"vindegm.phtml",
  12 + "corpo":"Navegador de WMS cadastrados na INDE Brasileira com Google Maps",
  13 + "tag":"IDE"
  14 +},{
  15 + "link":"guiamovel1.htm",
  16 + "corpo":"Ícones inseridos no puxador lateral da guia móvel",
  17 + "tag":"Guias"
  18 +},{
  19 + "link":"guiamovel2.htm",
  20 + "corpo":"Puxador lateral da guia móvel sem ícones",
  21 + "tag":"Guias"
  22 +},{
  23 + "link":"guiaesquerda.htm",
  24 + "corpo":"Guias laterais posicionados à esquerda do mapa",
  25 + "tag":"Guias"
  26 +},{
  27 + "link":"../ms_criamapa.php?mapext=&perfil=&temasa=&layers=&restauramapa=8&interface=exemplos/painel1.htm",
  28 + "corpo":"Painel que abre um mapa e gráficos. O mapa é restaurado de um mapa salvo anteriormente e que contém dois gráficos",
  29 + "tag":"Painel"
  30 +},{
  31 + "link":"infodiv.htm",
  32 + "corpo":"Ao clicar no mapa (tip) as informações são mostradas em uma posição fixa no mapa",
  33 + "tag":"Identifica"
  34 +},{
  35 + "link":"dobra.htm",
  36 + "corpo":"Botão de troca de interface localizado no canto inferior direito",
  37 + "tag":"Dobra"
  38 +},{
  39 + "link":"semdobra.htm",
  40 + "corpo":"Botão de troca de interface localizado na guia móvel",
  41 + "tag":"Dobra"
  42 +},{
  43 + "link":"mashupol1.htm",
  44 + "corpo":"Openlayers em um iframe",
  45 + "tag":"Mashup"
  46 +},{
  47 + "link":"../mashups",
  48 + "corpo":"Mais sobre mashups",
  49 + "tag":"Mashup"
  50 +},
  51 +{
  52 + "corpo":"Carregamento do codigo",
  53 + "link":"codemirror.php?&pagina=cursodsv1.htm",
  54 + "tag":"Sequência"
  55 +},
  56 +{
  57 + "corpo":"Cria",
  58 + "link":"codemirror.php?&pagina=cursodsv2.htm",
  59 + "tag":"Sequência"
  60 +},
  61 +{
  62 + "corpo":"Cria e inicia o mapa",
  63 + "link":"codemirror.php?&pagina=cursodsv3.htm",
  64 + "tag":"Sequência"
  65 +},
  66 +{
  67 + "corpo":"Mostra o mapa",
  68 + "link":"codemirror.php?&pagina=cursodsv4.htm",
  69 + "tag":"Sequência"
  70 +},
  71 +{
  72 + "corpo":"Tamanho definido no estilo",
  73 + "link":"codemirror.php?&pagina=cursodsv5.htm",
  74 + "tag":"Sequência"
  75 +},
  76 +{
  77 + "corpo":"Posicionamento definido no estilo",
  78 + "link":"codemirror.php?&pagina=cursodsv6.htm",
  79 + "tag":"Sequência"
  80 +},
  81 +{
  82 + "corpo":"Inclusao da escala numerica",
  83 + "link":"codemirror.php?&pagina=cursodsv7.htm",
  84 + "tag":"Sequência"
  85 +},
  86 +{
  87 + "corpo":"Inclusao da arvore de camadas",
  88 + "link":"codemirror.php?&pagina=cursodsv8.htm",
  89 + "tag":"Sequência"
  90 +},
  91 +{
  92 + "corpo":"Controle da arvore com YUI",
  93 + "link":"codemirror.php?&pagina=cursodsv9.htm",
  94 + "tag":"Sequência"
  95 +},
  96 +{
  97 + "corpo":"Ajuste da arvore via parametros",
  98 + "link":"codemirror.php?&pagina=cursodsv10.htm",
  99 + "tag":"Sequência"
  100 +},
  101 +{
  102 + "corpo":"Mostra apenas a opcao de legenda na arvore",
  103 + "link":"codemirror.php?&pagina=cursodsv11.htm",
  104 + "tag":"Sequência"
  105 +},
  106 +{
  107 + "corpo":"Legenda aberta na arvore",
  108 + "link":"codemirror.php?&pagina=cursodsv12.htm",
  109 + "tag":"Sequência"
  110 +},
  111 +{
  112 + "corpo":"Exemplo de uso de templates na legenda",
  113 + "link":"codemirror.php?&pagina=cursodsv13.htm",
  114 + "tag":"Sequência"
  115 +},
  116 +{
  117 + "corpo":"Alteracao da arvore via JS ",
  118 + "link":"codemirror.php?&pagina=cursodsv14.htm",
  119 + "tag":"Sequência"
  120 +},
  121 +{
  122 + "corpo":"Arvore do catalogo",
  123 + "link":"codemirror.php?&pagina=cursodsv15.htm",
  124 + "tag":"Sequência"
  125 +},
  126 +{
  127 + "corpo":"Menu suspenso",
  128 + "link":"codemirror.php?&pagina=cursodsv16.htm",
  129 + "tag":"Sequência"
  130 +},
  131 +{
  132 + "corpo":"Alteracao no menu",
  133 + "link":"codemirror.php?&pagina=cursodsv17.htm",
  134 + "tag":"Sequência"
  135 +},
  136 +{
  137 + "corpo":"Componentes OpenLayers",
  138 + "link":"codemirror.php?&pagina=cursodsv18.htm",
  139 + "tag":"Sequência"
  140 +},
  141 +{
  142 + "corpo":"Barra de botoes",
  143 + "link":"codemirror.php?&pagina=cursodsv19.htm",
  144 + "tag":"Sequência"
  145 +},
  146 +{
  147 + "corpo":"Inclusao de um novo botao",
  148 + "link":"codemirror.php?&pagina=cursodsv20.htm",
  149 + "tag":"Sequência"
  150 +},
  151 +{
  152 + "corpo":"Barra de botoes em linha",
  153 + "link":"codemirror.php?&pagina=cursodsv21.htm",
  154 + "tag":"Sequência"
  155 +},
  156 +{
  157 + "corpo":"Botao com funcao Ajax",
  158 + "link":"codemirror.php?&pagina=cursodsv22.htm",
  159 + "tag":"Sequência"
  160 +},
  161 +{
  162 + "corpo":"Barra de botoes fora do mapa",
  163 + "link":"codemirror.php?&pagina=cursodsv23.htm",
  164 + "tag":"Sequência"
  165 +},
  166 +{
  167 + "corpo":"Legenda fora do mapa",
  168 + "link":"codemirror.php?&pagina=cursodsv24.htm",
  169 + "tag":"Sequência"
  170 +},
  171 +{
  172 + "corpo":"Altera a funcao de atualizacao da legenda",
  173 + "link":"codemirror.php?&pagina=cursodsv25.htm",
  174 + "tag":"Sequência"
  175 +},
  176 +{
  177 + "corpo":"Legenda sem alteracao da funcao de atualizacao",
  178 + "link":"codemirror.php?&pagina=cursodsv26.htm",
  179 + "tag":"Sequência"
  180 +},
  181 +{
  182 + "corpo":"Desenho de poligono",
  183 + "link":"codemirror.php?&pagina=cursodsv27.htm",
  184 + "tag":"Sequência"
  185 +},
  186 +{
  187 + "corpo":"Catalogo customizado",
  188 + "link":"codemirror.php?&pagina=cursodsv28.htm",
  189 + "tag":"Sequência"
  190 +},
  191 +{
  192 + "corpo":"Coordenadas no rodape do mapa e dobra de troca de API",
  193 + "link":"codemirror.php?&pagina=cursodsv29.htm",
  194 + "tag":"Sequência"
  195 +},
  196 +{
  197 + "link":"openlayers3.htm",
  198 + "corpo":"Modo TILE com uma área de entorno maior i3GEO.Interface.openlayers.BUFFER = 1",
  199 + "tag":"Tile"
  200 +},
  201 +{
  202 + "link":"openlayers4.htm",
  203 + "corpo":"Sem nenhum layer de fundo. A lista de layers de fundo e o controle sobre qual será mostrado no início do mapa é feito simplesmente modificando-se os parâmetros desses layers no HTML utilizado no mapa",
  204 + "tag":"Fundo"
  205 +},
  206 +{
  207 + "link":"openlayers5.htm",
  208 + "corpo":"Modifica a extensão geográfica máxima de apresentação i3GEO.Interface.openlayers.MAXEXTENT = [-63.712484, -20.765721, -42.385294, -9.136698]",
  209 + "tag":"Extensão"
  210 +},
  211 +{
  212 + "link":"controleol.htm",
  213 + "corpo":"Controle com a posição do mouse",
  214 + "tag":"Controles"
  215 +},
  216 +{
  217 + "link":"menus1.htm",
  218 + "corpo":"Modifica o menu suspenso",
  219 + "tag":"Menus"
  220 +},
  221 +{
  222 + "link":"menus2.htm",
  223 + "corpo":"Não mostra o menu de administração",
  224 + "tag":"Menus"
  225 +},
  226 +{
  227 + "link":"guias3.htm",
  228 + "corpo":"Modificação na guia que mostra o catálogo de dados. Uso de combo ao invés de árvore",
  229 + "tag":"Guias"
  230 +},
  231 +{
  232 + "link":"guias2.htm",
  233 + "corpo":"Guias do tipo sanfona",
  234 + "tag":"Guias"
  235 +},
  236 +{
  237 + "link":"guias4.htm",
  238 + "corpo":"Inicia com uma guia específica",
  239 + "tag":"Guias"
  240 +},
  241 +{
  242 + "link":"fotos1.htm",
  243 + "corpo":"Guias do tipo sanfona com fotos",
  244 + "tag":"Guias"
  245 +},
  246 +{
  247 + "link":"guias1.htm",
  248 + "corpo":"Retorna à guia padrão após adicionar um tema",
  249 + "tag":"Guias"
  250 +},
  251 +{
  252 + "link":"barraemlinha.htm",
  253 + "corpo":"Barra de botões em linha, com formatação livre",
  254 + "tag":"Botões"
  255 +},
  256 +{
  257 + "link":"barraemlinha1.htm",
  258 + "corpo":"Barra de botões em linha, posicionada dentro do corpo do mapa",
  259 + "tag":"Botões"
  260 +},
  261 +{
  262 + "link":"barraemlinha2.htm",
  263 + "corpo":"Barra de botões em linha, posicionada dentro do corpo do mapa e com aplicação de estilo transparente",
  264 + "tag":"Botões"
  265 +},
  266 +{
  267 + "link":"botoestop.htm",
  268 + "corpo":"Barra do tipo 'olho de peixe' posicionada na parte superior do mapa",
  269 + "tag":"Botões"
  270 +},
  271 +{
  272 + "link":"botoes6.htm",
  273 + "corpo":"Apenas alguns ícones são mostrados e com uma função alterada (binóculo)",
  274 + "tag":"Botões"
  275 +},
  276 +{
  277 + "link":"botoes1.htm",
  278 + "corpo":"Barra apenas com os ícones",
  279 + "tag":"Botões"
  280 +},
  281 +{
  282 + "link":"botoes5.htm",
  283 + "corpo":"Como inserir botões na barra de botões",
  284 + "tag":"Botões"
  285 +},
  286 +{
  287 + "link":"legenda1.htm",
  288 + "corpo":"Legenda com grupos",
  289 + "tag":"Legenda"
  290 +},
  291 +{
  292 + "link":"aplic2.htm",
  293 + "corpo":"Adiciona uma camada extra via javascript",
  294 + "tag":"Camadas"
  295 +},
  296 +{
  297 + "link":"camadas5.htm",
  298 + "corpo":"Vincula temas na árvore de camadas para ligar/desligar em bloco",
  299 + "tag":"Camadas"
  300 +},
  301 +{
  302 + "link":"mashup1.htm",
  303 + "corpo":"Exemplo 1 - Botões com destaque laranja, em dois grupos na parte superior e mapa com zoom",
  304 + "tag":"Mashup"
  305 +},
  306 +{
  307 + "link":"mashup2.htm",
  308 + "corpo":"Exemplo 2 - Botões com destaque laranja, em um único grupo na parte superior e mapa sem zoom",
  309 + "tag":"Mashup"
  310 +},
  311 +{
  312 + "link":"mashup3.htm",
  313 + "corpo":"Exemplo 3 - Sem as guias, com os botões na parte superior e a legenda em um outro local da página",
  314 + "tag":"Mashup"
  315 +},
  316 +{
  317 + "link":"mashup9.htm",
  318 + "corpo":"Exemplo 3a - O mesmo que o 3 mas usando o Open Street Map",
  319 + "tag":"Mashup"
  320 +},
  321 +{
  322 + "link":"mashup4.htm",
  323 + "corpo":"Exemplo 4 - Sem as guias, com os botões na parte superior e a legenda em uma janela flutuante",
  324 + "tag":"Mashup"
  325 +},
  326 +{
  327 + "link":"mashup5.htm",
  328 + "corpo":"Exemplo 5 - Sem as guias e apenas com os botões de naveção em uma janela flutuante",
  329 + "tag":"Mashup"
  330 +},
  331 +{
  332 + "link":"mashup6.htm",
  333 + "corpo":"Exemplo 6 - Mapa posicionado no canto superior esquerdo, sem as guias e apenas com os botões de naveção em uma janela flutuante",
  334 + "tag":"Mashup"
  335 +},
  336 +{
  337 + "link":"iframe1.htm",
  338 + "corpo":"Iframe Exemplo 1 - Sem controle de tamanho",
  339 + "tag":"IFRAME"
  340 +},
  341 +{
  342 + "link":"iframe2.htm",
  343 + "corpo":"Iframe Exemplo 2 - Com tamanho controlado",
  344 + "tag":"IFRAME"
  345 +},
  346 +{
  347 + "link":"../interface/googlemaps_noite.phtml",
  348 + "corpo":"Aplicação de estilo diferente",
  349 + "tag":"Google Maps"
  350 +},
  351 +{
  352 + "link":"gm1.php?&temasa=_lbiomashp,_llocali&layers=_lbiomashp&mapext=-76,-39,-29,9",
  353 + "corpo":"Sem nenhum componente adicional, apenas um botão 'legenda' com a árvore de camadas",
  354 + "tag":"Google Maps"
  355 +},
  356 +{
  357 + "link":"googlemapssanfona.phtml",
  358 + "corpo":"Guias do tipo sanfona",
  359 + "tag":"Google Maps"
  360 +},
  361 +{
  362 + "link":"googlemapscomogc.php",
  363 + "corpo":"Como adicionar uma camada WMS do i3Geo em um mapa normal do Google Maps",
  364 + "tag":"Google Maps"
  365 +},
  366 +{
  367 + "link":"adicionatema.htm",
  368 + "corpo":"Como definir as camadas que serão incluídas no mapa na inicialização por meio da configuração de propriedades via Javascript",
  369 + "tag":"Camadas"
  370 +},
  371 +{
  372 + "link":"janelas.htm",
  373 + "corpo":"Opções de criação de janelas flutuantes",
  374 + "tag":"Janelas"
  375 +},
  376 +{
  377 + "link":"arvoredetemas.htm",
  378 + "corpo":"Construtor de opções da árvore de adição de temas",
  379 + "tag":"Árvore"
  380 +},
  381 +{
  382 + "link":"arvoredecamadas.htm",
  383 + "corpo":"Construtor de opções da árvore de camadas",
  384 + "tag":"Árvore"
  385 +},
  386 +{
  387 + "link":"combos.htm",
  388 + "corpo":"Criação de combos baseados na árvore de camadas e lista de colunas de um tema",
  389 + "tag":"Árvore"
  390 +},
  391 +{
  392 + "link":"camadas1.htm",
  393 + "corpo":"Árvore expandida",
  394 + "tag":"Árvore"
  395 +},
  396 +{
  397 + "link":"camadas2.htm",
  398 + "corpo":"Legenda expandida",
  399 + "tag":"Árvore"
  400 +},
  401 +{
  402 + "link":"camadas3.htm",
  403 + "corpo":"Árvore simplificada",
  404 + "tag":"Árvore"
  405 +},
  406 +{
  407 + "link":"camadas4.htm",
  408 + "corpo":"Opção 'mais temas' na guia de camadas",
  409 + "tag":"Árvore"
  410 +},
  411 +{
  412 + "link":"legenda2.htm",
  413 + "corpo":"Árvore com grupos",
  414 + "tag":"Árvore"
  415 +},
  416 +{
  417 + "link":"calculo1.htm",
  418 + "corpo":"Distâncias",
  419 + "tag":"Cálculos"
  420 +},
  421 +{
  422 + "link":"login.htm",
  423 + "corpo":"Login simples Abre uma janela de diálogo para que o usuário faça login. Nesse exemplo não é considerado se o login já foi feito antes ou não. Essa técnica não oferece muita segurança pois o código javascript fica exposto e um usuário mais experiente pode burlar o login.",
  424 + "tag":"Login"
  425 +},
  426 +{
  427 + "link":"login1.htm",
  428 + "corpo":"Login simples com verificação Abre uma janela de diálogo para que o usuário faça login. Ao contrário do anterior nesse exemplo é considerado se o login já foi feito antes ou não. Essa técnica não oferece muita segurança pois o código javascript fica exposto e um usuário mais experiente pode burlar o login.",
  429 + "tag":"Login"
  430 +},
  431 +{
  432 + "link":"login2.htm",
  433 + "corpo":"Login com página de verificação anterior Abre uma janela de diálogo para que o usuário faça login. O código javascript só fica exposto após o login.",
  434 + "tag":"Login"
  435 +},
  436 +{
  437 + "link":"login3.php",
  438 + "corpo":"Exigência de login A página só é aberta se o usuário estiver logado.",
  439 + "tag":"Login"
  440 +},
  441 +{
  442 + "link":"login4.htm",
  443 + "corpo":"Exige login e verifica acesso à página O mapa só é aberto se o usuário estiver cadastrado em um dos papéis que pode acessar essa operação.",
  444 + "tag":"Login"
  445 +}
  446 +];
  447 +
  448 +function mostraBotoesBT(){
  449 + //
  450 + //essa funcao obtem a lista unica de tags para montar o indice
  451 + //
  452 + var m = "",html = "", novalista = [], n, nc, i, j, chaves = [], nchaves = [];
  453 +
  454 + n = botoesIni.length;
  455 + for(i=0; i<n; i++){
  456 + chaves.push(botoesIni[i].tag);
  457 + }
  458 + chaves = chaves.getUnique();
  459 + chaves.sort();
  460 + nc = chaves.length;
  461 + for(j=0;j<nc;j++){
  462 + m = "";
  463 + for(i=0; i<n; i++){
  464 + if(botoesIni[i].tag == chaves[j]){
  465 + if(m == ""){
  466 + botoesIni[i]["id"] = "a"+j;
  467 + }
  468 + else{
  469 + botoesIni[i]["id"] = "";
  470 + }
  471 + novalista.push(botoesIni[i]);
  472 + m = "ok";
  473 + }
  474 + }
  475 + }
  476 + html = Mustache.to_html(
  477 + "{{#d}}" + $("#botoesTpl").html() + "{{/d}}",
  478 + {"d":novalista}
  479 + );
  480 + $("#botoesTpl").html(html);
  481 +
  482 + for(j=0;j<nc;j++){
  483 + nchaves.push({"tag":chaves[j],"id":"a"+j});
  484 + }
  485 + html = Mustache.to_html(
  486 + "{{#d}}" + $("#tplLista").html() + "{{/d}}",
  487 + {"d":nchaves}
  488 + );
  489 + var r = new RegExp("&amp;","g");
  490 + $("#tplLista").html(html.replace(r,"&"));
  491 +
  492 +}
... ...
exemplos/index.php 0 → 100755
... ... @@ -0,0 +1,55 @@
  1 +<?php
  2 +define ( ONDEI3GEO, ".." );
  3 +include (dirname ( __FILE__ ) . "/../ms_configura.php");
  4 +error_reporting ( 0 );
  5 +include "../init/head.php";
  6 +?>
  7 +
  8 +<body style="background-color: #eeeeee; padding-top: 90px;">
  9 + <nav class="navbar navbar-fixed-top navbar-inverse" role="navigation">
  10 + <div class="container-fluid">
  11 + <div class="navbar-header">
  12 + <a class="navbar-brand" href="../init/index.php"><?php echo $mensagemInicia;?> <i
  13 + class="fa fa-home fa-1x"></i></a>
  14 + </div>
  15 + </div>
  16 + </nav>
  17 + <div class="container-fluid">
  18 + <div class="row center-block">
  19 + <div class="col-sm-10">
  20 + <!-- Template para criacao dos quadros ver index.js -->
  21 + <div id="botoesTpl" class="hidden">
  22 + <div id="{{id}}" class="col-xs-12 center-block"
  23 + style="width: 260px; min-width: 260px; max-width: 260px;">
  24 + <div class="panel panel-default">
  25 + <div class="panel-body" style="height: 100px; overflow: auto;">
  26 + <h4>{{{corpo}}}</h4>
  27 + </div>
  28 + <div class="panel-footer">
  29 + <span class="label label-info">{{{tag}}}</span> <a
  30 + class="pull-right" href="{{{link}}}" target="_blank"
  31 + role="button">Link</a>
  32 + </div>
  33 + </div>
  34 + </div>
  35 + </div>
  36 + </div>
  37 + <nav class="col-sm-2" id="listaTags">
  38 + <ul id="tplLista" class="nav nav-pills nav-stacked hidden">
  39 + <li><a href="#{{id}}">{{tag}}</a></li>
  40 + </ul>
  41 + </nav>
  42 + </div>
  43 + </div>
  44 + <script src='../classesjs/compactados/mustache.js'></script>
  45 + <script src='../classesjs/compactados/classe_util_compacto.js'></script>
  46 + <script src='index.js'></script>
  47 + <script>
  48 + $(document).ready(function(){
  49 + mostraBotoesBT();
  50 + $('.hidden').removeClass('hidden');
  51 + $.material.init();
  52 + });
  53 + </script>
  54 +</body>
  55 +</html>
... ...
init/index.js
... ... @@ -113,7 +113,7 @@ botoesIni = [
113 113 "target": "_self"
114 114 },{
115 115 "img":"folder-image.png",
116   - "href":"../exemplos",
  116 + "href":"../exemplos/index.php",
117 117 "titulo":$trad(14,g_traducao_init),
118 118 "subtitulo": $trad("14a",g_traducao_init),
119 119 "fa": "cogs",
... ...