]> git.openstreetmap.org Git - nominatim.git/blobdiff - lib/template/search-html.php
projects / nominatim.git / blobdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | inline | side by side
Merge remote-tracking branch 'upstream/master'
[nominatim.git] / lib / template / search-html.php
diff --git a/lib/template/search-html.php b/lib/template/search-html.php
index 0952974d3e4be7498092edc82f3f0b48b752d9a1..b270e02fb9a2bfdb8fd5dcd2f01126fd91283d87 100644 (file)
--- a/lib/template/search-html.php
+++ b/lib/template/search-html.php
@@ -1,205 +1,40 @@
 <?php
        header("content-type: text/html; charset=UTF-8");
 ?>
 <?php
        header("content-type: text/html; charset=UTF-8");
 ?>
-<html>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
        <title>OpenStreetMap Nominatim: Search</title>
 
        <base href="<?php echo CONST_Website_BaseURL;?>" />
        <link href="nominatim.xml" rel="search" title="Nominatim Search" type="application/opensearchdescription+xml" />
 <head>
        <title>OpenStreetMap Nominatim: Search</title>
 
        <base href="<?php echo CONST_Website_BaseURL;?>" />
        <link href="nominatim.xml" rel="search" title="Nominatim Search" type="application/opensearchdescription+xml" />
+       <link href="css/search.css" rel="stylesheet" type="text/css" />
 
 
-       <script src="OpenLayers.js"></script>
-       <script src="http://www.openstreetmap.org/openlayers/OpenStreetMap.js"></script>
-       <script src="prototype-1.6.0.3.js"></script>
-
-       <style>
-* {-moz-box-sizing: border-box;}
-body {
-  margin:0px;
-  padding:0px;
-  overflow: hidden;
-  background:#ffffff;
-  height: 100%;
-  font: normal 12px/15px arial,sans-serif;
-}
-#seachheader {
-  position:absolute;
-  z-index:5;
-  top:0px;
-  left:0px;
-  width:100%;
-  height:38px;
-  background:#F0F7FF;
-  border-bottom: 2px solid #75ADFF;
-}
-#q {
-  width:300px;
-}
-#seachheaderfade1, #seachheaderfade2, #seachheaderfade3, #seachheaderfade4{
-  position:absolute;
-  z-index:4;
-  top:0px;
-  left:0px;
-  width:100%;
-  opacity: 0.15;
-  filter: alpha(opacity = 15);
-  background:#000000;
-  border: 1px solid #000000;
-}
-#seachheaderfade1{
-  height:39px;
-}
-#seachheaderfade2{
-  height:40px;
-}
-#seachheaderfade3{
-  height:41px;
-}
-#seachheaderfade4{
-  height:42px;
-}
-#searchresultsfade1, #searchresultsfade2, #searchresultsfade3, #searchresultsfade4 {
-  position:absolute;
-  z-index:2;
-  top:0px;
-  left:200px;
-  height: 100%;
-  opacity: 0.2;
-  filter: alpha(opacity = 20);
-  background:#ffffff;
-  border: 1px solid #ffffff;
-}
-#searchresultsfade1{
-  width:1px;
-}
-#searchresultsfade2{
-  width:2px;
-}
-#searchresultsfade3{
-  width:3px;
-}
-#searchresultsfade4{
-  width:4px;
-}
-
-#searchresults{
-  position:absolute;
-  z-index:3;
-  top:41px;
-  width:200px;
-  height: 100%;
-  background:#ffffff;
-  border: 1px solid #ffffff;
-  overflow: auto;
-}
-#map{
-  position:absolute;
-  z-index:1;
-  top:38px;
-  left:200px;
-  width:100%;
-  height:100%;
-  background:#eee;
-}
-#report{
-  position:absolute;
-  z-index:2;
-  top:38px;
-  left:200px;
-  width:100%;
-  height:100%;
-  background:#eee;
-  font: normal 12px/15px arial,sans-serif;
-  padding:20px;
-}
-#report table {
-  margin-left:20px;
-}
-#report th {
-  vertical-align:top;
-  text-align:left;
-}
-#report td.button {
-  text-align:right;
-}
-.result {
-  margin:5px;
-  margin-bottom:0px;
-  padding:2px;
-  padding-left:4px;
-  padding-right:4px;
-  border-radius: 5px;
-  -moz-border-radius: 5px;
-  -webkit-border-radius: 5px;
-  background:#F0F7FF;
-  border: 2px solid #D7E7FF;
-  font: normal 12px/15px arial,sans-serif;
-  cursor:pointer;
-}
-.result img{
-  float:right;
-}
-.result .latlon{
-  display: none;
-}
-.result .place_id{
-  display: none;
-}
-.result .type{
-  color: #999;
-  text-align:center;
-  font: normal 9px/10px arial,sans-serif;
-  padding-top:4px;
-}
-.result .details, .result .details a{
-  color: #999;
-  text-align:center;
-  font: normal 9px/10px arial,sans-serif;
-  padding-top:4px;
-}
-.noresults{
-  color: #000;
-  text-align:center;
-  font: normal 12px arial,sans-serif;
-  padding-top:4px;
-}
-.more{
-  color: #ccc;
-  text-align:center;
-  padding-top:4px;
-}
-.disclaimer{
-  color: #ccc;
-  text-align:center;
-  font: normal 9px/10px arial,sans-serif;
-  padding-top:4px;
-}
-form{
-  margin:0px;
-  padding:0px;
-}
-       </style>
+       <script src="js/OpenLayers.js" type="text/javascript"></script>
+       <script src="js/tiles.js" type="text/javascript"></script>
+       <script src="js/prototype-1.6.0.3.js" type="text/javascript"></script>
 
        <script type="text/javascript">
 
        <script type="text/javascript">
-        
+
                var map;
 
                function handleResize()
                {
                        if ($('searchresults'))
                        {
                var map;
 
                function handleResize()
                {
                        if ($('searchresults'))
                        {
-                               $('map').style.width = (document.documentElement.clientWidth > 0?document.documentElement.clientWidth:document.documentElement.offsetWidth) - 200;
-                               $('report').style.width = (document.documentElement.clientWidth > 0?document.documentElement.clientWidth:document.documentElement.offsetWidth) - 200;
+                               var viewwidth = ((document.documentElement.clientWidth > 0?document.documentElement.clientWidth:document.documentElement.offsetWidth) - 200) + 'px';
+                               $('map').style.width = viewwidth;
+                               $('report').style.width = viewwidth;
                        }
                        else
                        {
                        }
                        else
                        {
-                               $('map').style.width = (document.documentElement.clientWidth > 0?document.documentElement.clientWidth:document.documentElement.offsetWidth) - 0;
-                               $('map').style.left = 0;
+                               $('map').style.width = ((document.documentElement.clientWidth > 0?document.documentElement.clientWidth:document.documentElement.offsetWidth) - 0) + 'px';
+                               $('map').style.left = '0px';
                        }
                        }
-                       
-                       if ($('map')) $('map').style.height = (document.documentElement.clientHeight > 0?document.documentElement.clientHeight:document.documentElement.offsetHeight) - 38;
-                       if ($('searchresults')) $('searchresults').style.height = (document.documentElement.clientHeight > 0?document.documentElement.clientHeight:document.documentElement.offsetHeight) - 38;
-                       if ($('report')) $('report').style.height = (document.documentElement.clientHeight > 0?document.documentElement.clientHeight:document.documentElement.offsetHeight) - 38;
+
+                       if ($('map')) $('map').style.height = ((document.documentElement.clientHeight > 0?document.documentElement.clientHeight:document.documentElement.offsetHeight) - 38) + 'px';
+                       if ($('searchresults')) $('searchresults').style.height = ((document.documentElement.clientHeight > 0?document.documentElement.clientHeight:document.documentElement.offsetHeight) - 38) + 'px';
+                       if ($('report')) $('report').style.height = ((document.documentElement.clientHeight > 0?document.documentElement.clientHeight:document.documentElement.offsetHeight) - 38) + 'px';
                }
                window.onresize = handleResize;
 
                }
                window.onresize = handleResize;
 
@@ -208,7 +43,7 @@ form{
                        map.panTo(lonLat, <?php echo $iZoom ?>);
                }
 
                        map.panTo(lonLat, <?php echo $iZoom ?>);
                }
 
-               function panToLatLonZoom(lat,lon, zoom) {
+               function panToLatLonZoom(lat, lon, zoom) {
                        var lonLat = new OpenLayers.LonLat(lon, lat).transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject());
                        if (zoom != map.getZoom())
                                map.setCenter(lonLat, zoom);
                        var lonLat = new OpenLayers.LonLat(lon, lat).transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject());
                        if (zoom != map.getZoom())
                                map.setCenter(lonLat, zoom);
@@ -216,38 +51,34 @@ form{
                                map.panTo(lonLat, 10);
                }
 
                                map.panTo(lonLat, 10);
                }
 
-               function panToLatLonBoundingBox(lat,lon,minlat,maxlat,minlon,maxlon,points) {
-                       var proj_EPSG4326 = new OpenLayers.Projection("EPSG:4326");
-                       var proj_map = map.getProjectionObject();
-                        map.zoomToExtent(new OpenLayers.Bounds(minlon,minlat,maxlon,maxlat).transform(proj_EPSG4326, proj_map));
+               function panToLatLonBoundingBox(lat,lon,minlat,maxlat,minlon,maxlon,wkt) {
+                       vectorLayer.destroyFeatures();
+                       var proj_EPSG4326 = new OpenLayers.Projection("EPSG:4326");
+                       var proj_map = map.getProjectionObject();
+                       map.zoomToExtent(new OpenLayers.Bounds(minlon,minlat,maxlon,maxlat).transform(proj_EPSG4326, proj_map));
+                       var lonLat = new OpenLayers.LonLat(lon, lat).transform(proj_EPSG4326, proj_map);
+                       map.panTo(lonLat, <?php echo $iZoom ?>);
 
 
-                        var pointList = [];
-                        var style = {
-                                strokeColor: "#75ADFF",
-                                fillColor: "#F0F7FF",
-                                strokeWidth: 2,
-                                strokeOpacity: 0.75,
-                                fillOpacity: 0.75
-                        };
-                        var proj_EPSG4326 = new OpenLayers.Projection("EPSG:4326");
-                        var proj_map = map.getProjectionObject();
-                       if (points)
-                       {
-                               points.each(function(p){
-                                       pointList.push(new OpenLayers.Geometry.Point(p[0],p[1]));
-                                       });
-                               var linearRing = new OpenLayers.Geometry.LinearRing(pointList).transform(proj_EPSG4326, proj_map);;
-                               var polygonFeature = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Polygon([linearRing]),null,style);
-                               vectorLayer.destroyFeatures();
-                               vectorLayer.addFeatures([polygonFeature]);
-                       }
-                       else
+                       if (wkt)
                        {
                        {
-                               var lonLat = new OpenLayers.LonLat(lon, lat).transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject());
-                               var point = new OpenLayers.Geometry.Point(lonLat.lon, lonLat.lat);
-                               var pointFeature = new OpenLayers.Feature.Vector(point,null,style);
-                               vectorLayer.destroyFeatures();
-                               vectorLayer.addFeatures([pointFeature]);
+                               var freader = new OpenLayers.Format.WKT({
+                                               'internalProjection': proj_map,
+                                               'externalProjection': proj_EPSG4326
+                                               });
+
+                               var feature = freader.read(wkt);
+                               if (feature)
+                               {
+                                       feature.style = {
+                                                       strokeColor: "#75ADFF",
+                                                       fillColor: "#F0F7FF",
+                                                       strokeWidth: 2,
+                                                       strokeOpacity: 0.75,
+                                                       fillOpacity: 0.75,
+                                                       pointRadius: 100
+                    };
+                                       vectorLayer.addFeatures([feature]);
+                               }
                        }
                }
 
                        }
                }
 
@@ -280,7 +111,6 @@ form{
                 controls:[
                                                                                new OpenLayers.Control.Navigation(),
                                                                                new OpenLayers.Control.PanZoomBar(),
                 controls:[
                                                                                new OpenLayers.Control.Navigation(),
                                                                                new OpenLayers.Control.PanZoomBar(),
-                                                                               new OpenLayers.Control.MouseDefaults(),
                                                                                new OpenLayers.Control.MousePosition(),
                                                                                new OpenLayers.Control.Attribution()],
                 maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34),
                                                                                new OpenLayers.Control.MousePosition(),
                                                                                new OpenLayers.Control.Attribution()],
                 maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34),
@@ -290,10 +120,10 @@ form{
                 projection: new OpenLayers.Projection("EPSG:900913"),
                 displayProjection: new OpenLayers.Projection("EPSG:4326"),
                 eventListeners: {
                 projection: new OpenLayers.Projection("EPSG:900913"),
                 displayProjection: new OpenLayers.Projection("EPSG:4326"),
                 eventListeners: {
-                                                                       "moveend": mapEventMove,
+                                                                       "moveend": mapEventMove
                                                                }
                } );
                                                                }
                } );
-                       map.addLayer(new OpenLayers.Layer.OSM.Mapnik("Mapnik"));
+                       map.addLayer(new OpenLayers.Layer.OSM.<?php echo CONST_Tile_Default;?>("Default"));
 
                        var layer_style = OpenLayers.Util.extend({}, OpenLayers.Feature.Vector.style['default']);
                        layer_style.fillOpacity = 0.2;
 
                        var layer_style = OpenLayers.Util.extend({}, OpenLayers.Feature.Vector.style['default']);
                        layer_style.fillOpacity = 0.2;
@@ -317,27 +147,27 @@ form{
        <div id="seachheaderfade1"></div><div id="seachheaderfade2"></div><div id="seachheaderfade3"></div><div id="seachheaderfade4"></div>
 
        <div id="seachheader">
        <div id="seachheaderfade1"></div><div id="seachheaderfade2"></div><div id="seachheaderfade3"></div><div id="seachheaderfade4"></div>
 
        <div id="seachheader">
-               <form action="<?php echo CONST_Website_BaseURL; ?>search.php" method="get">
-                       <table border="0" width="100%">
+               <form accept-charset="UTF-8" action="<?php echo CONST_Website_BaseURL; ?>search.php" method="get">
+                       <table border="0" width="100%" summary="header">
                                <tr>
                                <tr>
-                                       <td valign="center" style="width:30px;"><img src="images/logo.gif"></td>
-                                       <td valign="center" style="width:400px;"><input id="q" name="q" value="<?php echo htmlspecialchars($sQuery); 
-?>" style="width:270px;"><input type="text" id="viewbox" style="width:130px;" name="viewbox"></td>
-                                       <td style="width:80px;"><input type="submit" value="Search"></td>
-<?php if (CONST_Search_AreaPolygons) { ?>                                      <td style="width:100px;"><input type="checkbox" value="1" name="polygon" <?php if ($bShowPolygons) echo "checked"; ?>> Highlight</td>
+                                       <td valign="middle" style="width:30px;"><img alt="logo" src="images/logo.gif" /></td>
+                                       <td valign="middle" style="width:400px;"><input id="q" name="q" value="<?php echo htmlspecialchars($sQuery); 
+?>" style="width:270px;" /><input type="text" id="viewbox" style="width:120px;" name="viewbox" /></td>
+                                       <td style="width:80px;"><input type="submit" value="Search"/></td>
+<?php if (CONST_Search_AreaPolygons) { ?>                                      <td style="width:100px;"><input type="checkbox" value="1" name="polygon" <?php if ($bAsText) echo "checked='checked'"; ?>/> Highlight</td>
 <td style="text-align:right;">Data: <?php echo $sDataDate; ?></td>
 <td style="text-align:right;">
 <a href="http://wiki.openstreetmap.org/wiki/Nominatim" target="_blank">Documentation</a> | <a href="http://wiki.openstreetmap.org/wiki/Nominatim/FAQ" 
 target="_blank">FAQ</a></td>
 
 <td style="text-align:right;">Data: <?php echo $sDataDate; ?></td>
 <td style="text-align:right;">
 <a href="http://wiki.openstreetmap.org/wiki/Nominatim" target="_blank">Documentation</a> | <a href="http://wiki.openstreetmap.org/wiki/Nominatim/FAQ" 
 target="_blank">FAQ</a></td>
 
-<?php } ?>                                     <td style="text-align:right;"><?php if ($sQuery) { if ($sReportDescription) {?><div style="text-align:center;"><b>Thank you for your problem report</b></div><?php } else { ?><input type="button" value="Report Problem With Results" onclick="$('report').style.visibility=($('report').style.visibility=='hidden'?'visible':'hidden')"><?php }} ?></td>
+<?php } ?>                                     <td style="text-align:right;"><?php if ($sQuery) { ?><input type="button" value="Report Problem With Results" onclick="$('report').style.visibility=($('report').style.visibility=='hidden'?'visible':'hidden')"/><?php } ?></td>
                                </tr>
                        </table>
                </form>
        </div>
 
 <?php
                                </tr>
                        </table>
                </form>
        </div>
 
 <?php
-       if ($sQuery || sizeof($aSearchResults))
+       if ($sQuery)
        {
 ?>
        <div id="searchresultsfade1"></div><div id="searchresultsfade2"></div><div id="searchresultsfade3"></div><div id="searchresultsfade4"></div>
        {
 ?>
        <div id="searchresultsfade1"></div><div id="searchresultsfade2"></div><div id="searchresultsfade3"></div><div id="searchresultsfade4"></div>
@@ -356,8 +186,8 @@ target="_blank">FAQ</a></td>
                        echo ', '.$aResult['aBoundingBox'][1];
                        echo ', '.$aResult['aBoundingBox'][2];
                        echo ', '.$aResult['aBoundingBox'][3];
                        echo ', '.$aResult['aBoundingBox'][1];
                        echo ', '.$aResult['aBoundingBox'][2];
                        echo ', '.$aResult['aBoundingBox'][3];
-                       echo ', '.javascript_renderData($aResult['aPolyPoints']);
-                       echo ');\'>';
+                       if (isset($aResult['astext'])) echo ', "'.$aResult['astext'].'"';
+                       echo ");'>\n";
                }
                elseif (isset($aResult['zoom']))
                {
                }
                elseif (isset($aResult['zoom']))
                {
@@ -368,11 +198,14 @@ target="_blank">FAQ</a></td>
                        echo '<div class="result" onClick="panToLatLon('.$aResult['lat'].', '.$aResult['lon'].');">';
                }
 
                        echo '<div class="result" onClick="panToLatLon('.$aResult['lat'].', '.$aResult['lon'].');">';
                }
 
-               echo ($aResult['icon']?'<img src="'.$aResult['icon'].'">':'');
+               echo (isset($aResult['icon'])?'<img alt="icon" src="'.$aResult['icon'].'"/>':'');
                echo ' <span class="name">'.$aResult['name'].'</span>';
                echo ' <span class="name">'.$aResult['name'].'</span>';
-               echo ' <span class="latlon">'.round($aResult['lat'],3).','.round($aResult['lat'],3).'</span>';
+               echo ' <span class="latlon">'.round($aResult['lat'],3).','.round($aResult['lon'],3).'</span>';
                echo ' <span class="place_id">'.$aResult['place_id'].'</span>';
                echo ' <span class="place_id">'.$aResult['place_id'].'</span>';
-               echo ' <span class="type">('.ucwords(str_replace('_',' ',$aResult['type'])).')</span>';
+               if (isset($aResult['label']))
+                       echo ' <span class="type">('.$aResult['label'].')</span>';
+               else
+                       echo ' <span class="type">('.ucwords(str_replace('_',' ',$aResult['type'])).')</span>';
                echo ' <span class="details">(<a href="details.php?place_id='.$aResult['place_id'].'">details</a>)</span>';
                echo '</div>';
        }
                echo ' <span class="details">(<a href="details.php?place_id='.$aResult['place_id'].'">details</a>)</span>';
                echo '</div>';
        }
@@ -380,7 +213,7 @@ target="_blank">FAQ</a></td>
        {
                if ($sMoreURL)
                {
        {
                if ($sMoreURL)
                {
-                       echo '<div class="more"><a href="'.$sMoreURL.'">Search for more results</a></div>';
+                       echo '<div class="more"><a href="'.htmlentities($sMoreURL).'">Search for more results</a></div>';
                }
        }
        else
                }
        }
        else
@@ -390,7 +223,7 @@ target="_blank">FAQ</a></td>
 
 ?>
                <div class="disclaimer">Addresses and postcodes are approximate
 
 ?>
                <div class="disclaimer">Addresses and postcodes are approximate
-                       <input type="button" value="Report Problem" onclick="$('report').style.visibility=($('report').style.visibility=='hidden'?'visible':'hidden')">
+                       <input type="button" value="Report Problem" onclick="$('report').style.visibility=($('report').style.visibility=='hidden'?'visible':'hidden')"/>
                </div>
        </div>
 <?php
                </div>
        </div>
 <?php
@@ -405,12 +238,12 @@ href="http://wiki.openstreetmap.org/wiki/Nominatim/FAQ">FAQ</a>.  If your proble
 to check how the address was generated before reporting a problem.</p>
                <p>Please use <a href="http://trac.openstreetmap.org/newticket?component=nominatim">trac.openstreetmap.org</a> to report problems 
 making sure to set 
 to check how the address was generated before reporting a problem.</p>
                <p>Please use <a href="http://trac.openstreetmap.org/newticket?component=nominatim">trac.openstreetmap.org</a> to report problems 
 making sure to set 
-the component to 'nominatim'.  You can search for existing bug reports <a href="http://trac.openstreetmap.org/query?status=new&status=assigned&status=reopened&component=nominatim&order=priority">here</a>.</p>
+the component to 'nominatim'.  You can search for existing bug reports <a href="http://trac.openstreetmap.org/query?status=new&amp;status=assigned&amp;status=reopened&amp;component=nominatim&amp;order=priority">here</a>.</p>
                <p>Please ensure that you include a full description of the problem, including the search query that you used, the problem with the result and, if 
 the problem relates to missing data, the osm id of the item that is missing.  Problems that contain enough detail are likely to get looked at before ones that 
 require significant research!</p>
                </div>
                <p>Please ensure that you include a full description of the problem, including the search query that you used, the problem with the result and, if 
 the problem relates to missing data, the osm id of the item that is missing.  Problems that contain enough detail are likely to get looked at before ones that 
 require significant research!</p>
                </div>
-               
+
 <!--
                <p>Please use this form to report problems with the search results.  Of particular interest are items missing, but please also use this form to 
 report any other problems.</p>
 <!--
                <p>Please use this form to report problems with the search results.  Of particular interest are items missing, but please also use this form to 
 report any other problems.</p>
@@ -445,7 +278,7 @@ init();
                        echo ', '.$aResult['aBoundingBox'][1];
                        echo ', '.$aResult['aBoundingBox'][2];
                        echo ', '.$aResult['aBoundingBox'][3];
                        echo ', '.$aResult['aBoundingBox'][1];
                        echo ', '.$aResult['aBoundingBox'][2];
                        echo ', '.$aResult['aBoundingBox'][3];
-                       echo ', '.javascript_renderData($aResult['aPolyPoints']);
+                       if (isset($aResult['astext'])) echo ", '".$aResult['astext']."'";
                        echo ');'."\n";
                }
                else
                        echo ');'."\n";
                }
                else
Open Source search based on OpenStreetMap data