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 function mostraBotoesBT(){ 1 function mostraBotoesBT(){
12 var r, p; 2 var r, p;
13 3
@@ -19,21 +9,15 @@ function mostraBotoesBT(){ @@ -19,21 +9,15 @@ function mostraBotoesBT(){
19 d.mapas[i] = verificaMapa(d.mapas[i]); 9 d.mapas[i] = verificaMapa(d.mapas[i]);
20 } 10 }
21 html = Mustache.to_html( 11 html = Mustache.to_html(
22 - "{{#mapas}}" + $("#botoesTpl").html() + "{{/mapas}}", 12 + "{{#mapas}}" + $("#templateLista").html() + "{{/mapas}}",
23 d 13 d
24 ); 14 );
25 15
26 - $("#botoesTpl").html(html); 16 + $("#corpo").html(html);
27 d.mapas.push({ 17 d.mapas.push({
28 "ID_MAPA": "topo", 18 "ID_MAPA": "topo",
29 "NOME": "Topo" 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 $('[data-toggle="quadroQrcode"]').popover({ 21 $('[data-toggle="quadroQrcode"]').popover({
38 html: true, 22 html: true,
39 placement: "bottom", 23 placement: "bottom",
@@ -45,7 +29,7 @@ function mostraBotoesBT(){ @@ -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 cpJSON.call("../classesphp/mapa_controle.php?map_file=&funcao=pegaMapas&g_sid=", "foo", r); 33 cpJSON.call("../classesphp/mapa_controle.php?map_file=&funcao=pegaMapas&g_sid=", "foo", r);
50 } 34 }
51 function verificaMapa(mapa){ 35 function verificaMapa(mapa){
@@ -107,6 +91,10 @@ function verificaMapa(mapa){ @@ -107,6 +91,10 @@ function verificaMapa(mapa){
107 mapa.subtitulo = html; 91 mapa.subtitulo = html;
108 return mapa; 92 return mapa;
109 } 93 }
  94 +function mostraLinks(id){
  95 + $(".modal-body").html($("#" + id).html());
  96 + $("#modal").modal('show');
  97 +}
110 function alerta(texto,d){ 98 function alerta(texto,d){
111 if(!d){ 99 if(!d){
112 d = 500; 100 d = 500;
mapas/index.php
  Diff comments   View file @ed96bfa
@@ -46,17 +46,6 @@ include "../init/head.php"; @@ -46,17 +46,6 @@ include "../init/head.php";
46 width: 100%; 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 .panel-heading [data-toggle="collapse"]:after { 49 .panel-heading [data-toggle="collapse"]:after {
61 font-family: 'FontAwesome'; 50 font-family: 'FontAwesome';
62 content: "\f054"; 51 content: "\f054";
@@ -103,75 +92,29 @@ include "../init/head.php"; @@ -103,75 +92,29 @@ include "../init/head.php";
103 } 92 }
104 </style> 93 </style>
105 <script id="templateLinks" type="x-tmpl-mustache"> 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 <div class="list-group"> 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 <div class="row-content" > 96 <div class="row-content" >
149 <h4 class="list-group-item-heading"> 97 <h4 class="list-group-item-heading">
150 - <a href="{{{link}}}" target="_blank">{{{nome}}}</a> 98 + {{{nome}}}
151 </h4> 99 </h4>
152 <p class="list-group-item-text hidden-xs hidden-sm"> 100 <p class="list-group-item-text hidden-xs hidden-sm">
153 <a href="{{{link}}}" target="_blank">{{{link}}}</a> 101 <a href="{{{link}}}" target="_blank">{{{link}}}</a>
154 </p> 102 </p>
155 </div> 103 </div>
  104 + <div class="list-group-separator"></div>
156 </div> 105 </div>
157 -<div class="list-group-separator"></div>  
158 </script> 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 <nav class="navbar navbar-default navbar-fixed-top"> 108 <nav class="navbar navbar-default navbar-fixed-top">
165 <div class="container-fluid"> 109 <div class="container-fluid">
166 <div class="navbar-header"> 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 <a class="navbar-brand" href="../init/index.php"><?php echo $mensagemInicia;?> <i 111 <a class="navbar-brand" href="../init/index.php"><?php echo $mensagemInicia;?> <i
173 class="fa fa-home fa-1x"></i></a> 112 class="fa fa-home fa-1x"></i></a>
174 </div> 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 </div> 118 </div>
176 </nav> 119 </nav>
177 <!--para as mensagens de alerta--> 120 <!--para as mensagens de alerta-->
@@ -181,67 +124,55 @@ include &quot;../init/head.php&quot;; @@ -181,67 +124,55 @@ include &quot;../init/head.php&quot;;
181 <ol class="breadcrumb"> 124 <ol class="breadcrumb">
182 <li><a href="../init/index.php?home=">i3Geo</a></li> 125 <li><a href="../init/index.php?home=">i3Geo</a></li>
183 <li class="active">Mapas de usu&aacute;rios</li> 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 </ol> 127 </ol>
188 </div> 128 </div>
189 </div> 129 </div>
  130 +
190 <div class="container"> 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 </div> 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 </div> 147 </div>
  148 + <div class="modal-body"></div>
240 </div> 149 </div>
241 </div> 150 </div>
242 </div> 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 <script src='../pacotes/cpaint/cpaint2_compacto.inc.js'></script> 176 <script src='../pacotes/cpaint/cpaint2_compacto.inc.js'></script>
246 <script src='../classesjs/compactados/dicionario_compacto.js'></script> 177 <script src='../classesjs/compactados/dicionario_compacto.js'></script>
247 <script src='../classesjs/compactados/classe_util_compacto.js'></script> 178 <script src='../classesjs/compactados/classe_util_compacto.js'></script>