JSONP no serviço json.php

Edmar Moretti
1 parent a527e229
Showing 3 changed files with 69 additions and 87 deletions Show diff stats
ferramentas/recline/default.php
json.php
pacotes/knightlab/recline/dist/recline.js
@@ -12,13 +12,14 @@
     <link href="../../pacotes/knightlab/recline/vendor/leaflet.markercluster/MarkerCluster.css" rel="stylesheet">
     <link href="../../pacotes/knightlab/recline/vendor/leaflet.markercluster/MarkerCluster.Default.css" rel="stylesheet">
     <link rel="stylesheet" href="../../pacotes/knightlab/recline/vendor/slickgrid/2.2/slick.grid.css">
+    <link rel="stylesheet" href="../../pacotes/knightlab/recline/vendor/timeline/css/timeline.css">
     <!-- recline css -->
     <link href="../../pacotes/knightlab/recline/css/map.css" rel="stylesheet">
-
     <link href="../../pacotes/knightlab/recline/css/multiview.css" rel="stylesheet">
     <link href="../../pacotes/knightlab/recline/css/slickgrid.css"rel="stylesheet">
     <link href="../../pacotes/knightlab/recline/css/flot.css" rel="stylesheet">
+    <link rel="stylesheet" href="../../pacotes/knightlab/recline/css/timeline.css">
     <!-- Vendor JS - general dependencies -->
     <script src="../../pacotes/knightlab/recline/vendor/jquery/1.7.1/jquery.js" type="text/javascript"></script>
@@ -34,6 +35,8 @@
     <script type="text/javascript" src="../../pacotes/knightlab/recline/vendor/flot/jquery.flot.js"></script>
     <script type="text/javascript" src="../../pacotes/knightlab/recline/vendor/flot/jquery.flot.time.js"></script>
     <script type="text/javascript" src="../../pacotes/knightlab/recline/vendor/moment/2.0.0/moment.js"></script>
+    <script type="text/javascript" src="../../pacotes/knightlab/recline/vendor/timeline/js/timeline.js"></script>
+    
     <script src="../../pacotes/knightlab/recline/vendor/slickgrid/2.2/jquery-ui-1.8.16.custom.min.js"></script>
     <script src="../../pacotes/knightlab/recline/vendor/slickgrid/2.2/jquery.event.drag-2.2.js"></script>
     <script src="../../pacotes/knightlab/recline/vendor/slickgrid/2.2/jquery.event.drop-2.2.js"></script>
@@ -63,45 +66,38 @@
       <div class="data-explorer-here"></div>
       <div style="clear: both;"></div>
+            
       <script>
-      jQuery(function($) {
-  window.multiView = null;
-  window.explorerDiv = $('.data-explorer-here');
+//define como variavel global
+var dadosJ;
+returnData = function(dataFromJsonp){
+	dadosJ = dataFromJsonp;
+	jQuery(function($) {
+		  window.multiView = null;
+		  window.explorerDiv = $('.data-explorer-here');
-  // create the demo dataset
-  var dataset = createDataset();
-  // now create the multiview
-  // this is rather more elaborate than the minimum as we configure the
-  // MultiView in various ways (see function below)
-  window.multiview = createMultiView(dataset);
+		  // create the demo dataset
+		  var dataset = createDataset(dadosJ);
+		  // now create the multiview
+		  // this is rather more elaborate than the minimum as we configure the
+		  // MultiView in various ways (see function below)
+		  window.multiview = createMultiView(dataset);
-  // last, we'll demonstrate binding to changes in the dataset
-  // this will print out a summary of each change onto the page in the
-  // changelog section
-  dataset.records.bind('all', function(name, obj) {
-    var $info = $('<div />');
-    $info.html(name + ': ' + JSON.stringify(obj.toJSON()));
-    $('.changelog').append($info);
-    $('.changelog').show();
-  });
-});
+		  // last, we'll demonstrate binding to changes in the dataset
+		  // this will print out a summary of each change onto the page in the
+		  // changelog section
+		  dataset.records.bind('all', function(name, obj) {
+		    var $info = $('<div />');
+		    $info.html(name + ': ' + JSON.stringify(obj.toJSON()));
+		    $('.changelog').append($info);
+		    $('.changelog').show();
+		  });
+		});
+};
 // create standard demo dataset
-function createDataset() {
-  var dataset = new recline.Model.Dataset(
-	<?php 
-		$format = "gdocs";
-		include("../../json.php");
-		/*
-		$curl = curl_init();
-		curl_setopt ($curl, CURLOPT_URL, "../../json.php?tema=_lreal&format=recline&");
-		curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
-		$result = curl_exec($curl);
-		curl_close ($curl);
-		echo $result;
-		*/
-	?>
-  );
+function createDataset(data) {
+  var dataset = new recline.Model.Dataset(data);
   return dataset;
 }
@@ -172,8 +168,12 @@ var createMultiView = function(dataset, state) {
   return multiView;
 }
-      
-      </script>
+</script>
+      <?php
+      //inclui os dados via jsonp
+      $url = "../../json.php?tema=".strip_tags($_GET["tema"])."&format=gdocs&jsonp=returnData";
+      echo "<script src='$url' ></script>";
+      ?>      
     </div>
   </body>
 </html>
 <?php
+//TODO incluir BBOX na obtencao dos dados
+//TODO gerar dados para id_medida_variavel
 /*
  Title: Gerador de dados JSON
@@ -28,13 +30,11 @@ Arquivo: i3geo/ogc.php
 Par&acirc;metros:
-ajuda - (opcional) mostra uma ajuda ao usu&aacute;rio
+tema - nome do tema existente em i3geo/temas ou na pasta temporaria do mapserver
-tema - (opcional) nome do tema que ser&aacute; mostrado no servi&ccedil;o. Se for definido, o web service conter&aacute; apenas esse tema. O tema &eacute; o nome do mapfile existente em i3geo/temas, mas pode ser especificado um mapfile existente em outra pasta. Nesse caso, deve-se especificar o caminho completo para o arquivo. Se n&atilde;o for definido, ser&atilde;o considerados todos os temas
+format -  storymap|gdocs
-format - (opcional) pode ser utilizado a op&ccedil;&atilde;o &format=application/openlayers para
-abrir o mashup do OpenLayers com as camadas definida em temas.
-Na gera&ccedil;&atilde;o da legenda pode ser utilizado text/html para gerar no formato html.
+No caso de storymap, o fornecimento dos dados depende dos parametros definidos no METADATA storymap existente no tema
 */
 $_GET = array_merge($_GET,$_POST);
@@ -42,13 +42,6 @@ include(dirname(__FILE__).&quot;/ms_configura.php&quot;);
 include(dirname(__FILE__)."/classesphp/pega_variaveis.php");
 include(dirname(__FILE__)."/classesphp/funcoes_gerais.php");
 //
-//imprime na tela a ajuda
-//
-if(isset($ajuda)){
-	imprimeAjuda();
-	exit;
-}
-//
 //pega os enderecos para compor a url de chamada do gerador de web services
 //
 $protocolo = explode("/",$_SERVER['SERVER_PROTOCOL']);
@@ -168,7 +161,7 @@ if($format == &quot;gdocs&quot;){
 	gdocs();
 }
 function gdocs(){
-	global $data, $nomeArq;
+	global $data, $nomeArq, $jsonp;
 	$items = $data["items"];
 	$n = count($items);
 	$dados = $data["features"];
@@ -186,8 +179,7 @@ function gdocs(){
 		//var_dump($dd["shape"].getcentroid());exit;
 		$c = $dd["shape"]->getcentroid();
-		$r["calcx"] = $c->x;
-		$r["calcy"] = $c->y;
+		$r["geo"] = array("lat"=>$c->y,"lon"=>$c->x);
 		$records[] = $r;
 	}
 	$fields = array();
@@ -199,29 +191,28 @@ function gdocs(){
 	}
 	$fields[] = array(
-			"id"=>"calcx",
-			"type"=>"number"
-	);
-	$fields[] = array(
-			"id"=>"calcy",
-			"type"=>"number"
+			"id"=>"geo",
+			"type"=>"geo"
 	);
 	$j = array(
 			"records"=>$records,
 			"fields"=>$fields
 	);
-	//echo "<pre>";var_dump($j);exit;
 	$contents = json_encode($j);
-	//var_dump($contents);exit;
-	file_put_contents($nomeArq.".json",$contents);
-	//envia para download
-	ob_clean();
-	header("Content-type: application/json");
-	echo $contents;
+	//envia
+	if(empty($jsonp)){
+		file_put_contents($nomeArq.".json",$contents);
+		header("Content-type: application/json");
+		echo $contents;
+	}
+	else{
+		file_put_contents($nomeArq.".json",$jsonp."(".$contents.");");
+		echo $jsonp."(".$contents.");";
+	}
 }
 function storymap($par){
-	global $data, $nomeArq;
+	global $data, $nomeArq, $jsonp;
 	$items = $data["items"];
 	$colunaTexto = array_search($par["coltexto"],$items);
@@ -309,24 +300,15 @@ function storymap($par){
 	$contents = json_encode($j);
 	//var_dump($contents);exit;
 	file_put_contents($nomeArq.".json",$contents);
-	//envia para download
+	//envia
 	ob_clean();
-	header("Content-type: application/json");
-	echo $contents;
-}
-function ogc_imprimeAjuda(){
-	echo "<pre><b>Construtor de web services do I3Geo.</b><br><br>";
-	echo "Esse programa usa os arquivos mapfiles existentes em <br>";
-	echo "i3geo/temas para gerar web services OGC.<br>";
-	echo "Para escolher um tema, utilize:<br>";
-	echo "ogc.php?lista=temas - para listar os temas dispon&iacute;veis<br>";
-	echo "Para usar esse web service voce pode usar o parametro &tema=,<br>";
-	echo "ou seja,http://[host]/i3geo/ogc.php?tema=[codigo do tema]<br>";
-	echo "no lugar do codigo pode ser especificado um arquivo mapfile qualquer. ";
-	echo "Nesse caso, deve ser digitado o caminho completo no servidor<br><br>";
-	echo "Utilize o sistema de administracao do i3Geo para configurar quais os temas da pasta i3geo/temas podem ser utilizados.<br><br>";
-	echo "Utilize o parametro restauramapa para indicar o ID de um mapa salvo no banco <br>";
-	echo "de dados de administracao para utiliza-lo como um WMS";
+	if(empty($jsonp)){
+		header("Content-type: application/json");
+		echo $contents;
+	}
+	else{
+		echo $jsonp."(".$contents.");";
+	}
 }
 function nomeRand($n=10)
 {
@@ -1065,9 +1065,9 @@ my.Flot = Backbone.View.extend({
     <div class="recline-flot"> \
       <div class="panel graph" style="display: block;"> \
         <div class="js-temp-notice alert alert-warning alert-block"> \
-          <h3 class="alert-heading">Hey there!</h3> \
-          <p>There\'s no graph here yet because we don\'t know what fields you\'d like to see plotted.</p> \
-          <p>Please tell us by <strong>using the menu on the right</strong> and a graph will automatically appear.</p> \
+          <h3 class="alert-heading">Olá!</h3> \
+          <p>Não tem nenhum gráfico aqui ainda. Você precisa definir quais colunas serão utilizadas.</p> \
+          <p>Por favor <strong>utilize as opções ao lado</strong> e o gráfico aparecerá automaticamente.</p> \
         </div> \
       </div> \
     </div> \
@@ -3679,7 +3679,7 @@ my.Timeline = Backbone.View.extend({
   // These are the default (case-insensitive) names of field that are used if found.
   // If not found, the user will need to define these fields on initialization
-  startFieldNames: ['date','startdate', 'start', 'start-date'],
+  startFieldNames: ['data','date','startdate', 'start', 'start-date'],
   endFieldNames: ['end','endDate'],
   elementId: '#vmm-timeline-id',