Download as
Browse Code »

Commit ed96bfad67b3a4e1b268da7394842273936a6265

Authored by Edmar Moretti
1 parent 08024467
Exists in master

Modificação no layout da lista de mapas salvos pelo usuário

Showing 2 changed files with 54 additions and 135 deletions   Show diff stats
mapas/index.js
  Diff comments   View file @ed96bfa
1   -function mostraBotoesBT(men){
2   - var html = "";
3   - //menu
4   - i3GEO.configura = {"locaplic" : ".."};
5   - html = Mustache.to_html(
6   - "{{#d}}" + $("#botoesTpl").html() + "{{/d}}",
7   - {"d":botoesIni,"abrir" : $trad(36,g_traducao_init)}
8   - );
9   - $("#botoesTpl").html(html);
10   -}
11 1 function mostraBotoesBT(){
12 2 var r, p;
13 3  
... ... @@ -19,21 +9,15 @@ function mostraBotoesBT(){
19 9 d.mapas[i] = verificaMapa(d.mapas[i]);
20 10 }
21 11 html = Mustache.to_html(
22   - "{{#mapas}}" + $("#botoesTpl").html() + "{{/mapas}}",
  12 + "{{#mapas}}" + $("#templateLista").html() + "{{/mapas}}",
23 13 d
24 14 );
25 15  
26   - $("#botoesTpl").html(html);
  16 + $("#corpo").html(html);
27 17 d.mapas.push({
28 18 "ID_MAPA": "topo",
29 19 "NOME": "Topo"
30 20 });
31   - //indice
32   - html = Mustache.to_html(
33   - "{{#mapas}}" + $("#indiceTpl").html() + "{{/mapas}}",
34   - d
35   - );
36   - $("#indice").html(html);
37 21 $('[data-toggle="quadroQrcode"]').popover({
38 22 html: true,
39 23 placement: "bottom",
... ... @@ -45,7 +29,7 @@ function mostraBotoesBT(){
45 29 }
46 30 });
47 31 };
48   - //cpJSON vem de class_php.js
  32 + //cpJSON vem de classe_php.js
49 33 cpJSON.call("../classesphp/mapa_controle.php?map_file=&funcao=pegaMapas&g_sid=", "foo", r);
50 34 }
51 35 function verificaMapa(mapa){
... ... @@ -107,6 +91,10 @@ function verificaMapa(mapa){
107 91 mapa.subtitulo = html;
108 92 return mapa;
109 93 }
  94 +function mostraLinks(id){
  95 + $(".modal-body").html($("#" + id).html());
  96 + $("#modal").modal('show');
  97 +}
110 98 function alerta(texto,d){
111 99 if(!d){
112 100 d = 500;
... ...
mapas/index.php
  Diff comments   View file @ed96bfa
... ... @@ -46,17 +46,6 @@ include "../init/head.php";
46 46 width: 100%;
47 47 }
48 48  
49   -#indice .bs-docs-sidebar .nav>.active:focus>a, .bs-docs-sidebar .nav>.active:hover>a,
50   - .bs-docs-sidebar .nav>.active>a {
51   - background-color: transparent;
52   - border-left-color: green;
53   - border-left-style: solid;
54   - border-left-width: 2px;
55   - color: green;
56   - font-weight: 700;
57   - padding-left: 18px;
58   -}
59   -
60 49 .panel-heading [data-toggle="collapse"]:after {
61 50 font-family: 'FontAwesome';
62 51 content: "\f054";
... ... @@ -103,75 +92,29 @@ include "../init/head.php";
103 92 }
104 93 </style>
105 94 <script id="templateLinks" type="x-tmpl-mustache">
106   -<div class="row">
107   - <div class="col-xs-12 col-sm-3 hidden-xs row-action-primary">
108   - <div class="btn-group-sm pull-right" style="height: 60px;">
109   - <a class="hidden-sm btn btn-primary btn-fab" href="{{{link}}}">
110   - <i class="material-icons">launch</i>
111   - </a>
112   - <button onclick="i3GEO.util.copyToClipboard('{{{link}}}');alerta('{{copiado}}');" class="btn btn-primary btn-fab" >
113   - <i class="material-icons">content_copy</i>
114   - </button>
115   - <button role="button" data-toggle="quadroQrcode" data-url="{{{link}}}" class="btn btn-primary btn-fab btn-fab-max" >
116   - <span class="glyphicon glyphicon-qrcode" aria-hidden="true"></span>
117   - </button>
118   - </div>
119   -
120   - </div>
121   - <div class="col-sm-9 row-content" >
122   - <h4 class="list-group-item-heading">
123   - <a href="{{{link}}}" target="_blank">{{{nome}}}</a>
124   - </h4>
125   - <p class="list-group-item-text hidden-xs">
126   - <a href="{{{link}}}" target="_blank">{{{link}}}</a>
127   - </p>
128   - <div class="list-group-separator"></div>
129   - </div>
130   -</div>
131   -
132   -</script>
133   -<script id="templateLinksX" type="x-tmpl-mustache">
134 95 <div class="list-group">
135   - <div class="hidden-xs row-action-primary">
136   - <div class="bs-component btn-group-sm pull-left">
137   - <a class="btn btn-primary btn-fab" href="{{{link}}}">
138   - <i class="material-icons">launch</i>
139   - </a>
140   - <button onclick="i3GEO.util.copyToClipboard('{{{link}}}');alerta('{{copiado}}');" class="btn btn-primary btn-fab" >
141   - <i class="material-icons">content_copy</i>
142   - </button>
143   - <button role="button" data-toggle="quadroQrcode" data-url="{{{link}}}" class="btn btn-primary btn-fab btn-fab-max" >
144   - <span class="glyphicon glyphicon-qrcode" aria-hidden="true"></span>
145   - </button>
146   - </div>
147   - </div>
148 96 <div class="row-content" >
149 97 <h4 class="list-group-item-heading">
150   - <a href="{{{link}}}" target="_blank">{{{nome}}}</a>
  98 + {{{nome}}}
151 99 </h4>
152 100 <p class="list-group-item-text hidden-xs hidden-sm">
153 101 <a href="{{{link}}}" target="_blank">{{{link}}}</a>
154 102 </p>
155 103 </div>
  104 + <div class="list-group-separator"></div>
156 105 </div>
157   -<div class="list-group-separator"></div>
158 106 </script>
159   -<script id="indiceTpl" type="x-tmpl-mustache">
160   -<li><a href="#affix-{{ID_MAPA}}">{{{NOME}}}</a></li>
161   -</script>
162   -<body style="padding-top: 55px; position: relative;" id="affix-topo" data-spy="scroll"
163   - data-target="#indiceSpy" data-offset="80">
  107 +<body style="padding-top: 55px; position: relative;" >
164 108 <nav class="navbar navbar-default navbar-fixed-top">
165 109 <div class="container-fluid">
166 110 <div class="navbar-header">
167   - <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
168   - data-target="#navbar" aria-expanded="false" aria-controls="navbar">
169   - <span class="sr-only"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span
170   - class="icon-bar"></span>
171   - </button>
172 111 <a class="navbar-brand" href="../init/index.php"><?php echo $mensagemInicia;?> <i
173 112 class="fa fa-home fa-1x"></i></a>
174 113 </div>
  114 + <ul class="nav navbar-nav">
  115 + <li><a title="RSS" href="../admin/rssmapas.php"><i class="material-icons ">rss_feed</i></a></li>
  116 + <li><a title="JSON" href="../admin/rssmapas.php?output=json"><i class="material-icons ">code</i></a></li>
  117 + </ul>
175 118 </div>
176 119 </nav>
177 120 <!--para as mensagens de alerta-->
... ... @@ -181,67 +124,55 @@ include &quot;../init/head.php&quot;;
181 124 <ol class="breadcrumb">
182 125 <li><a href="../init/index.php?home=">i3Geo</a></li>
183 126 <li class="active">Mapas de usu&aacute;rios</li>
184   - <li><a title="RSS" href="../admin/rssmapas.php"><i class="material-icons ">rss_feed</i></a>&nbsp;
185   - <a title="JSON" href="../admin/rssmapas.php?output=json"><i class="material-icons ">code</i></a>
186   - </li>
187 127 </ol>
188 128 </div>
189 129 </div>
  130 +
190 131 <div class="container">
191   - <!-- Template para criacao dos quadros ver index.js -->
192   - <div class="escondido hidden">
193   - <div class="row">
194   - <div class="col-xs-12 col-sm-9 center-block escondido hidden" id="botoesTpl">
195   - <div class="row" id="affix-{{ID_MAPA}}" style="padding-top: 90px; margin-top: -90px;">
196   - <div class="col-md-12 center-block">
197   - <div id="titulo{{ID_MAPA}}" class="panel-group" role="tablist" aria-multiselectable="true">
198   - <div class="panel panel-default">
199   - <div class="panel-heading" role="tab" style="background-color: #80cbc4;">
200   - <div class="thumbnail visible-xs">
201   - <a href="{{{LINK}}}"><img class="img-rounded" src="{{{IMAGEM}}}" /></a>
202   - </div>
203   - <div class="thumbnail hidden-xs">
204   - <a href="{{{LINK}}}"><img class="img-rounded" src="{{{IMAGEM}}}" /></a>
205   - </div>
206   - <h3 class="panel-title">
207   - &nbsp;<a data-parent="#titulo{{ID_MAPA}}" class="collapsed in pull-right" role="button"
208   - data-toggle="collapse" href="#corpo{{ID_MAPA}}" aria-expanded="false"
209   - aria-controls="#corpo{{ID_MAPA}}">{{{NOME}}}&nbsp;</a>
210   - </h3>
211   - <div class="bs-component btn-group-sm pull-left hidden-xs">
212   - &nbsp;<a target="_blank" class="btn btn-primary btn-fab" href="{{{LINK}}}"> <i
213   - class="material-icons">launch</i>
214   - </a>
215   - <button role="button" data-toggle="quadroQrcode" data-url="{{{LINK}}}"
216   - class="btn btn-primary btn-fab btn-fab-max">
217   - <span class="glyphicon glyphicon-qrcode" aria-hidden="true"></span>
218   - </button>
219   - </div>
220   - </div>
221   - <div class="clearfix"></div>
222   - <div class="panel-body">
223   - <div id="corpo{{ID_MAPA}}" class="panel-collapse collapse list-group" role="tabpanel"
224   - aria-multiselectable="true">
225   - <div class="list-group">{{{subtitulo}}}</div>
226   - </div>
227   - </div>
228   - </div>
229   - </div>
230   - </div>
231   - </div>
  132 + <div class="row center-block">
  133 + <div class="col-md-12">
  134 + <div class="well" id="corpo">
  135 + <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i> <span class="sr-only">Loading...</span>
232 136 </div>
233   - <div class="col-sm-3 hidden-xs">
234   - <nav class="bs-docs-sidebar affix" style="" id="indiceSpy">
235   - <ul class="nav nav-pills nav-stacked" role="tablist" id="indice">
236   -
237   - </ul>
238   - </nav>
  137 + </div>
  138 + </div>
  139 + </div>
  140 + <div id="modal" class="modal fade" tabindex="-1" role="dialog">
  141 + <div class="modal-dialog">
  142 + <div class="modal-content">
  143 + <div class="modal-header">
  144 + <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  145 + <span aria-hidden="true">&times;</span>
  146 + </button>
239 147 </div>
  148 + <div class="modal-body"></div>
240 149 </div>
241 150 </div>
242 151 </div>
243   - <script>
244   - </script>
  152 +<script id="templateLista" type="x-tmpl-mustache">
  153 +<div class="list-group-item" >
  154 + <div class="row-content" >
  155 + <h4 class="list-group-item-heading">
  156 + <span class="pull-right">&nbsp;&nbsp;</span>
  157 + <a onclick="mostraLinks('detalhe_{{ID_MAPA}}')" href="javascript:void(0)" class="btn btn-danger btn-fab btn-fab-mini pull-right" role="button">
  158 + <i class="material-icons md-18">more_horiz</i>
  159 + </a>
  160 + <span class="pull-right">&nbsp;&nbsp;</span>
  161 + <a title="default" href="{{{LINK}}}" class="btn btn-danger btn-fab btn-fab-mini pull-right" role="button">
  162 + <i class="material-icons md-18">launch</i>
  163 + </a>
  164 + <span class="pull-right">&nbsp;&nbsp;</span>
  165 + <a title="link" role="button" href="javascript:void(0)" data-toggle="quadroQrcode" data-url="{{{LINK}}}" class="btn btn-danger btn-fab btn-fab-mini pull-right">
  166 + <span class="glyphicon glyphicon-qrcode" aria-hidden="true"></span>
  167 + </a>
  168 + <a href="{{{LINK}}}"><img class="img-rounded" src="{{{IMAGEM}}}" />&nbsp;{{{NOME}}}</a>
  169 + </h4>
  170 + </div>
  171 + <div class="list-group-separator"></div>
  172 +</div>
  173 +<!-- dados para o modal -->
  174 +<div style="display:none" id="detalhe_{{ID_MAPA}}">{{{subtitulo}}}</div>
  175 +</script>
245 176 <script src='../pacotes/cpaint/cpaint2_compacto.inc.js'></script>
246 177 <script src='../classesjs/compactados/dicionario_compacto.js'></script>
247 178 <script src='../classesjs/compactados/classe_util_compacto.js'></script>
... ...