Strabon

changeset 1239:469141eefa5f

When the result set contains both a geometry and a timestamp, then they are both projected in a map and a timeline respectively, using the Timemap js library (https://code.google.com/p/timemap/)
author Konstantina Bereta <Konstantina.Bereta@di.uoa.gr>
date Mon Jul 29 21:46:50 2013 +0300 (2013-07-29)
parents 981b55a32ec8
children 89d7b54da9b1
files endpoint/WebContent/query.jsp endpoint/src/main/java/eu/earthobservatory/org/StrabonEndpoint/QueryBean.java
line diff
     1.1 --- a/endpoint/WebContent/query.jsp	Mon Jul 29 15:26:08 2013 +0300
     1.2 +++ b/endpoint/WebContent/query.jsp	Mon Jul 29 21:46:50 2013 +0300
     1.3 @@ -17,6 +17,13 @@
     1.4  	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
     1.5  	<script type="text/javascript" src="js/more_link.js"></script>
     1.6  	<link rel="stylesheet" href="style.css" type="text/css" />
     1.7 +	    <script type="text/javascript" src="js/timemap/jquery-1.6.2.min.js"></script>
     1.8 +    <script type="text/javascript" src="js/timemap/mxn.js?(googlev3)"></script>
     1.9 +    <script type="text/javascript" src="js/timemap/timeline-1.2.js"></script>
    1.10 +    <script src="js/timemap/timemap.js" type="text/javascript"></script>
    1.11 +    <script src="js/timemap/param.js" type="text/javascript"></script>
    1.12 +    <script src="js/timemap/xml.js" type="text/javascript"></script>
    1.13 +    <script src="js/timemap/kml.js" type="text/javascript"></script>
    1.14  	<script type="text/javascript">
    1.15  		function toggleMe(a) {
    1.16  			var e = document.getElementById(a);
    1.17 @@ -115,13 +122,14 @@
    1.18  	if (request.getAttribute("pathToKML") != null) {
    1.19  	if ("map_local".equals(request.getAttribute("handle"))) {
    1.20  %>
    1.21 +	<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
    1.22 +	<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
    1.23  	<script type="text/javascript" src="js/geoxml3-kmz.js"></script>
    1.24  	<script type="text/javascript" src="js/ProjectedOverlay.js"></script>	
    1.25  <%
    1.26  	}
    1.27  %>
    1.28 -	<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
    1.29 -	<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
    1.30 +
    1.31  	<script type="text/javascript">
    1.32  		
    1.33  		//listener for the event 'bounds_changed'
    1.34 @@ -155,16 +163,17 @@
    1.35  		function initialize() {
    1.36  			var myOptions = {
    1.37  				zoom: 11,
    1.38 -				mapTypeId: google.maps.MapTypeId.ROADMAP
    1.39 +				//mapTypeId: google.maps.MapTypeId.ROADMAP
    1.40  			};
    1.41  						
    1.42  			// get KML filename
    1.43  			var kml = '<%=request.getAttribute("pathToKML")%>';
    1.44  			
    1.45  			// create map
    1.46 -			var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    1.47 +			//var map = new google.maps.Map(document.getElementById("map"), myOptions);
    1.48 +			var map = tm.map;
    1.49  			<% if (request.getAttribute("pathToKML") == null) {%>
    1.50 -				// center at Brahames
    1.51 +				center at Brahames
    1.52  				map.setCenter(new google.maps.LatLng(37.92253, 23.72275));
    1.53  			<%}%>
    1.54  		
    1.55 @@ -235,6 +244,57 @@
    1.56  		ul#icons li {margin: 1px; position: relative; padding: 1px 0; cursor: pointer; float: left;  list-style: none;}
    1.57  		ul#icons span.ui-icon {float: left; margin: 0 1px;}
    1.58  	</style>
    1.59 +	
    1.60 +		<script type="text/javascript">
    1.61 +
    1.62 +var tm;
    1.63 +$(function() {
    1.64 +    tm = TimeMap.init({
    1.65 +        mapId: "map",               // Id of map div element (required)
    1.66 +        timelineId: "timeline",     // Id of timeline div element (required) 
    1.67 +        options: {
    1.68 +            eventIconPath: "../images/"
    1.69 +        },
    1.70 +        datasets: [
    1.71 +            {
    1.72 +                title: "Visualization of timestamps",
    1.73 +                theme: "red",
    1.74 +                type: "kml",     // Data to be loaded in KML - must be a local URL
    1.75 +                options: {
    1.76 +                    url: <% if(request.getAttribute("pathToKML") != null){
    1.77 +                    out.println("\""+request.getAttribute("pathToKML")+"\"");
    1.78 +                    }%> // KML file to load
    1.79 +                }
    1.80 +            }
    1.81 +        ],
    1.82 +        bandInfo: [
    1.83 +            {
    1.84 +               width:          "85%", 
    1.85 +               intervalUnit:   Timeline.DateTime.DAY, 
    1.86 +		       intervalPixels: 210
    1.87 +            },
    1.88 +            {
    1.89 +               width:          "15%", 
    1.90 +               intervalUnit:   Timeline.DateTime.WEEK, 
    1.91 +		       intervalPixels: 150,
    1.92 +               showEventText:  false,
    1.93 +               trackHeight:    0.2,
    1.94 +               trackGap:       0.2
    1.95 +            }
    1.96 +        ]
    1.97 +    });
    1.98 +});
    1.99 +
   1.100 +
   1.101 +    </script>
   1.102 +    
   1.103 +     </script>
   1.104 +    <link href="js/timemap/examples.css" type="text/css" rel="stylesheet"/>
   1.105 +    <style>
   1.106 +    div#timelinecontainer{ height: 310px; }
   1.107 +    div#mapcontainer{ height: 300px; }
   1.108 +    </style>
   1.109 +    
   1.110   	<!-- jQuery end -->
   1.111   
   1.112  	<title>TELEIOS: Strabon Endpoint</title>
   1.113 @@ -271,6 +331,8 @@
   1.114          <%}}%>
   1.115        }
   1.116      </script>
   1.117 +    
   1.118 +    
   1.119  </head>
   1.120  <body topmargin="0" leftmargin="0" link="#FFFFFF" vlink="#FFFFFF" alink="#FFFFFF" onload="initialize()">
   1.121  
   1.122 @@ -426,7 +488,14 @@
   1.123  <%}}%>
   1.124  	<!-- Response -->
   1.125  <% if (request.getAttribute("pathToKML") != null) { %>
   1.126 -	<div id="map_canvas"></div>
   1.127 +  <div id="timemap">
   1.128 +        <div id="timelinecontainer">
   1.129 +          <div id="timeline"></div>
   1.130 +        </div>
   1.131 +        <div id="mapcontainer">
   1.132 +          <div id="map"></div>
   1.133 +        </div>
   1.134 +    </div>
   1.135  <%}%>
   1.136  <div id="divResultsEnd" style="height: 1px; width 1px"></div>
   1.137   <div id="chart_div"></div>
     2.1 --- a/endpoint/src/main/java/eu/earthobservatory/org/StrabonEndpoint/QueryBean.java	Mon Jul 29 15:26:08 2013 +0300
     2.2 +++ b/endpoint/src/main/java/eu/earthobservatory/org/StrabonEndpoint/QueryBean.java	Mon Jul 29 21:46:50 2013 +0300
     2.3 @@ -116,10 +116,11 @@
     2.4  		appName = context.getContextPath().replace("/", "");
     2.5  		
     2.6  		// fix the temporary directory for this web application
     2.7 -		tempDirectory = appName + "-temp";
     2.8 +		tempDirectory =  "js/timemap";
     2.9  		
    2.10  		// get the absolute path of the temporary directory
    2.11 -		basePath = context.getRealPath("/") + "/../ROOT/" + tempDirectory + "/";
    2.12 +		//basePath = context.getRealPath("/") + "/../ROOT/" + tempDirectory + "/";
    2.13 +		basePath = context.getRealPath("/") + tempDirectory + "/";
    2.14  	}
    2.15  
    2.16  	public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    2.17 @@ -289,35 +290,38 @@
    2.18  					try{
    2.19  						Date date = new Date();
    2.20  
    2.21 -						FileUtils.forceMkdir(new File(basePath));
    2.22 +						//FileUtils.forceMkdir(new File(basePath));
    2.23  
    2.24  						@SuppressWarnings("unchecked")
    2.25 -						Iterator<File> it = FileUtils.iterateFiles(new File(basePath), null, false);
    2.26 +					/*	Iterator<File> it = FileUtils.iterateFiles(new File(basePath), null, false);
    2.27  						while(it.hasNext()){
    2.28  							File tbd = new File((it.next()).getAbsolutePath());
    2.29  							if (FileUtils.isFileOlder(new File(tbd.getAbsolutePath()), date.getTime())){
    2.30  								FileUtils.forceDelete(new File(tbd.getAbsolutePath()));
    2.31  							}
    2.32 -						}
    2.33 +						}*/
    2.34  						
    2.35  						// create temporary KML/KMZ file
    2.36  						File file = new File(basePath + tempKMLFile);
    2.37 -
    2.38 +						//File file = new File(tempKMLFile);
    2.39  						// if file does not exist, then create it
    2.40  						if(!file.exists()){
    2.41 +							System.out.println("FILE PATH"+basePath + tempKMLFile);
    2.42  							file.createNewFile();
    2.43  						}
    2.44  						
    2.45  						try {
    2.46  							// query and write the result in the temporary KML/KMZ file
    2.47 +							//FileOutputStream fos = new FileOutputStream(basePath + tempKMLFile);
    2.48  							FileOutputStream fos = new FileOutputStream(basePath + tempKMLFile);
    2.49  							strabonWrapper.query(query, format, fos);
    2.50  							fos.close();
    2.51  						
    2.52 -							request.setAttribute("pathToKML", 
    2.53 +							/*request.setAttribute("pathToKML", 
    2.54  									request.getScheme() + "://" +  
    2.55  									request.getServerName() + ":" + request.getServerPort() + 
    2.56 -									"/" + tempDirectory + "/" + tempKMLFile);
    2.57 +									"/" + tempDirectory + "/" + tempKMLFile);*/
    2.58 +							request.setAttribute("pathToKML", tempDirectory+"/"+ tempKMLFile);
    2.59  							
    2.60  						} catch (MalformedQueryException e) {
    2.61  							logger.error("[StrabonEndpoint.QueryBean] Error during querying. {}", e.getMessage());