]> git.openstreetmap.org Git - nominatim-ui.git/blob - dist/details.html
Merge pull request #31 from lonvia/bigger-map
[nominatim-ui.git] / dist / details.html
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4   <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
5   <title>OpenStreetMap Nominatim</title>
6   <meta name="viewport" content="width=device-width, initial-scale=1">
7
8   <link rel="icon" type="image/png" href="/assets/images/favicon-194x194.png" sizes="194x194" />
9   <link rel="icon" type="image/png" href="/assets/images/favicon-16x16.png" sizes="16x16" />
10
11   <link href="assets/css/leaflet.css" rel="stylesheet" />
12   <link href="assets/css/Control.MiniMap.min.css" rel="stylesheet" />
13   <link href="assets/css/bootstrap.min.css" rel="stylesheet" />
14   <link href="assets/css/common.css" rel="stylesheet" />
15   <link href="assets/css/search.css" rel="stylesheet" type="text/css" />
16   <link href="assets/css/details.css" rel="stylesheet" type="text/css" />
17 </head>
18 <body id="BODYID">
19
20   <div id="error-overlay"></div>
21
22   <header class="container-fluid">
23     <div class="row">
24       <div class="col-4">
25         <div class="brand">
26           <a href="search.html">
27             <img alt="logo" src="assets/images/osm_logo.120px.png" width="30" height="30"/>
28             <h1>Nominatim</h1>
29           </a>
30         </div>
31       </div>
32       <div id="last-updated" class="col-4 text-center">
33         <div id="loading">loading...</div>
34         Data from <a id="api-request-link" href="">API request</a>
35         <br>
36         Data last updated:
37         <span id="data-date"></span>
38       </div>
39       <div class="col-4 text-right">
40         <div class="dropdown">
41           <button class="dropdown-toggle btn btn-sm btn-outline-secondary" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
42             About &amp; Help
43           </button>
44           <div class="dropdown-menu dropdown-menu-right">
45             <a class="dropdown-item" href="https://nominatim.org/release-docs/develop/api/Overview/" target="_blank">API Reference</a>
46             <a class="dropdown-item" href="https://nominatim.org/release-docs/develop/api/Faq/" target="_blank">FAQ</a>
47             <a class="dropdown-item" href="https://help.openstreetmap.org/tags/nominatim/">OpenStreetMap Help</a>
48             <a class="dropdown-item" href="https://github.com/osm-search/Nominatim">Nominatim on Github</a>
49             <a class="dropdown-item" href="https://github.com/osm-search/nominatim-ui">This frontend on Github</a>
50             <div class="dropdown-divider"></div>
51             <a class="dropdown-item" href="#" data-toggle="modal" data-target="#report-modal">Report problem with results</a>
52           </div>
53         </div>
54       </div>
55     </div>
56   </header>
57
58   <div class="modal fade" id="report-modal">
59     <div class="modal-dialog">
60       <div class="modal-content">
61         <div class="modal-header">
62           <h4 class="modal-title">Report a problem</h4>
63           <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
64         </div>
65         <div class="modal-body">
66           <p>
67             Before reporting problems please read the <a target="_blank" href="https://nominatim.org/release-docs/develop/api/Overview/">user documentation</a>
68             and
69             <a target="_blank" href="https://nominatim.org/release-docs/develop/api/Faq/">FAQ</a>.
70
71             If your problem relates to the address of a particular search result please use the 'details' link 
72             to check how the address was generated before reporting a problem.
73           </p>
74           <p>
75             Use <a target="_blank" href="https://github.com/osm-search/Nominatim/issues">Nominatim issues on github</a>
76             to report problems.
77           </p>
78           <p>
79             Please ensure that you include a full description of the problem, including the search
80             query that you used, the problem with the result and, if the problem relates to missing data,
81             the osm type (node, way, relation) and id of the item that is missing.
82           </p>
83           <p>
84             Problems that contain enough detail are likely to get looked at before ones that require
85             significant research.
86           </p>
87         </div>
88         <div class="modal-footer">
89           <button type="button" class="btn btn-outline-secondary" data-dismiss="modal">OK</button>
90         </div>
91       </div>
92     </div>
93   </div>
94
95   <main>
96   </main>
97
98   <footer>
99     <p class="disclaimer">
100       Addresses and postcodes are approximate
101     </p>
102     <p class="copyright">
103       &copy; <a href="https://osm.org/copyright">OpenStreetMap</a> contributors
104     </p>
105   </footer>
106
107   <script src="assets/js/jquery.min.js"></script>
108   <script src="assets/js/bootstrap.bundle.min.js"></script>
109   <script src="assets/js/leaflet.js"></script>
110   <script src="assets/js/Control.MiniMap.min.js"></script>
111   <script src="assets/js/handlebars.min.js"></script>
112   <script src="assets/js/url-search-params.js"></script>
113
114   <script src="config.js"></script>
115   <script src="handlebar_helpers.js"></script>
116
117   <script src="assets/js/nominatim-ui.js"></script>
118 <script id="searchpage-template" type="text/x-handlebars-template">
119 {{#*inline "partial_one_result"}}
120   <div class="result" data-position="{{iResNum}}">
121     {{formatMapIcon aResult}}
122
123     <span class="name">{{aResult.display_name}}</span>
124     <span class="type">({{formatLabel aResult}})</span>
125     <p class="coords">{{aResult.lat}},{{aResult.lon}}</p>  
126
127     <a class="details btn btn-outline-secondary btn-sm"
128        href="details.html?osmtype={{shortOSMType aResult.osm_type}}&osmid={{aResult.osm_id}}">details</a>
129   </div>
130 {{/inline}}
131
132 <div class="top-bar">
133   <ul class="nav nav-tabs">
134     <li class="nav-item">
135       <a class="nav-link {{#unless hStructured}}active{{/unless}}" data-toggle="tab" href="#simple">simple</a>
136     </li>
137     <li class="nav-item">
138       <a class="nav-link {{#if hStructured}}active{{/if}}" data-toggle="tab" href="#structured">structured</a>
139     </li>
140     <div class="search-type-link">
141       <a id="switch-to-reverse" href="/reverse.html">reverse search</a>
142     </div>
143   </ul>
144   <div class="tab-content p-2">
145     <div class="tab-pane {{#unless hStructured}}active{{/unless}}" id="simple" role="tabpanel">
146       <form class="form-inline" role="search" accept-charset="UTF-8" action="">
147         <input id="q"
148                name="q"
149                type="text"
150                class="form-control form-control-sm"
151                placeholder="Search"
152                value="{{sQuery}}" />
153
154         <div class="form-group search-button-group">
155           <button type="submit" class="btn btn-primary btn-sm mx-1">Search</button>
156           <input type="hidden" name="viewbox" value="{{sViewBox}}" />
157           <div class="form-check form-check-inline">
158             <input type="checkbox" class="form-check-input"
159                    id="use_viewbox" {{#if sViewBox}}checked="checked"{{/if}}>
160             <label class="form-check-label" for="use_viewbox">apply viewbox</label>
161           </div>
162         </div>
163       </form>
164     </div>
165     <div class="tab-pane {{#if hStructured}}active{{/if}}" id="structured" role="tabpanel">
166       <form class="form-inline" role="search" accept-charset="UTF-8" action="">
167         <input name="street" type="text" class="form-control form-control-sm mr-1"
168                placeholder="House number/Street"
169                value="{{hStructured.street}}" />
170         <input name="city" type="text" class="form-control form-control-sm mr-1"
171                placeholder="City"
172                value="{{hStructured.city}}" />
173         <input id="county" name="county" type="text" class="form-control form-control-sm mr-1"
174                placeholder="County"
175                value="{{hStructured.county}}" />
176         <input name="state" type="text" class="form-control form-control-sm mr-1"
177                placeholder="State"
178                value="{{hStructured.state}}" />
179         <input name="country" type="text" class="form-control form-control-sm mr-1"
180                placeholder="Country"
181                value="{{hStructured.country}}" />
182         <input name="postalcode" type="text" class="form-control form-control-sm mr-1"
183                placeholder="Postal Code"
184                value="{{hStructured.postalcode}}" />
185
186         <div class="form-group search-button-group">
187           <button type="submit" class="btn btn-primary btn-sm mx-1">Search</button>
188           <input type="hidden" name="viewbox" value="{{sViewBox}}" />
189           <div class="form-check form-check-inline">
190             <input type="checkbox" class="form-check-input"
191                    id="use_viewbox" {{#if sViewBox}}checked="checked"{{/if}}>
192             <label class="form-check-label" for="use_viewbox">apply viewbox</label>
193           </div>
194         </div>
195       </form>
196     </div>
197   </div> <!-- /tab-content -->
198 </div> <!-- /top-bar -->
199
200 <div id="content">
201
202   {{#if bSearchRan}}
203     <div id="searchresults" class="sidebar">
204       {{#each aSearchResults as |aResult|}}
205         {{>partial_one_result iResNum=@index aResult=aResult env=env}}
206       {{/each}}
207
208       {{#if aSearchResults}}
209         {{#if sMoreURL}}
210           <div class="more">
211             <a class="btn btn-primary" href="{{sMoreURL}}">
212               Search for more results
213             </a>
214           </div>
215         {{/if}}
216       {{else}}
217         <div class="noresults">No search results found</div>
218       {{/if}}
219     </div>
220
221   {{else}}
222
223     <div id="intro" class="sidebar">
224       <h2>Welcome to Nominatim</h2>
225
226       <p>
227         Nominatim is a search engine for
228         <a href="https://www.openstreetmap.org">OpenStreetMap</a> data. This
229         is the debugging interface. You may search for a name or address
230         (forward search) or look up data by its geographic coordinate (reverse
231         search). Each result comes with a link to a details page where you
232         can inspect what data about the object is saved in the database and
233         investigate how the address of the object has been computed.
234       </p>
235
236       For more information visit the
237       <a href="https://nominatim.org">Nominatim home page</a>.
238     </div>
239
240   {{/if}}
241
242   <div id="map-wrapper">
243     <div id="map-position">
244       <div id="map-position-inner"></div>
245       <div id="map-position-close"><a href="#">hide</a></div>
246     </div>
247     <div id="map"></div>
248   </div>
249 </div>
250 </script>
251 <script id="reversepage-template" type="text/x-handlebars-template">
252
253 {{#*inline "partial_one_result"}}
254   <div class="result" data-position="{{iResNum}}">
255     {{formatMapIcon aResult}}
256
257     <span class="name">{{aResult.display_name}}</span>
258     <span class="type">{{formatLabel aResult}}</span>
259     <p class="coords">{{aResult.lat}},{{aResult.lon}}</p>  
260
261     <a class="details btn btn-outline-secondary btn-sm"
262        href="details.html?osmtype={{shortOSMType aResult.osm_type}}&osmid={{aResult.osm_id}}">details</a>
263   </div>
264 {{/inline}}
265
266 <div class="top-bar">
267   <form class="form-inline" role="search" accept-charset="UTF-8" action="">
268     <div class="form-group">
269       <input name="format" type="hidden" value="html">
270       <label>lat</label>
271       <input name="lat"
272              type="text"
273              class="form-control form-control-sm"
274              placeholder="latitude"
275              value="{{fLat}}" />
276       <a id="switch-coords" class="btn btn-outline-secondary btn-sm" title="switch lat and lon">&lt;&gt;</a>
277       <label>lon</label>
278       <input name="lon"
279              type="text"
280              class="form-control form-control-sm"
281              placeholder="longitude"
282              value="{{fLon}}" />
283       <label>max zoom</label>
284       <select name="zoom" class="form-control form-control-sm" value="{{iZoom}}">
285         {{zoomLevels iZoom}}
286       </select>
287       <button type="submit" class="btn btn-primary btn-sm mx-1">
288         Search
289       </button>
290     </div>
291     <div class="search-type-link">
292       <a href="search.html">forward search</a>
293     </div>
294   </form>
295 </div>
296
297 <div id="content">
298   {{#if aPlace}}
299     <div id="searchresults" class="sidebar">
300       {{>partial_one_result iResNum=0 aResult=aPlace env=env}}
301     </div>
302   {{else}}
303     <div id="intro" class="sidebar">
304       Search for coordinates or click anywhere on the map.
305     </div>
306   {{/if}}
307
308   <div id="map-wrapper">
309     <div id="map-position">
310       <div id="map-position-inner"></div>
311       <div id="map-position-close"><a href="#">hide</a></div>
312     </div>
313     <div id="map"></div>
314   </div>
315 </div>
316 </script>
317 <script id="detailspage-template" type="text/x-handlebars-template">
318
319 {{#*inline "partial_details_one_row"}}
320   <tr class="{{#unless this.isaddress}}notused{{/unless}}">
321     <td class="name">
322       {{#if this.localname}}
323         {{this.localname}}
324       {{else}}
325         <span class="noname">No Name</span>
326       {{/if}}
327     </td>
328     <td>{{formatPlaceType this}}</td>
329     <td>{{osmLink this}}</td>
330     <td>{{this.rank_address}}</td>
331     <td>{{formatAdminLevel this.admin_level}}</td>
332     <td>{{formatDistance this.distance bDistanceInMeters}}</td>
333     <td>{{detailsPermaLink this 'details >'}}</td>
334   </tr>
335 {{/inline}}
336
337 {{#*inline "partial_details_keyword_one_row"}}
338   <tr>
339     <td>{{formatKeywordToken this.token}}</td>
340     {{#if this.id}}
341       <td>word id: {{this.id}}</td>
342     {{/if}}
343   </tr>
344 {{/inline}}
345
346
347 {{#*inline "partial_h2"}}
348   <tr class="all-columns"><td colspan="6"><h2>{{this}}</h2></td></tr>
349 {{/inline}}
350
351 {{#*inline "partial_h3"}}
352   <tr class="all-columns"><td colspan="6"><h3>{{this}}</h3></td></tr>
353 {{/inline}}
354
355 <div class="container">
356   <div class="row">
357     <div class="col-sm-10">
358       <h1>
359         {{aPlace.localname}}
360         <small>{{detailsPermaLink aPlace 'link to this page'}}</small>
361       </h1>
362     </div>
363     <div class="col-sm-2 text-right">
364       {{formatMapIcon aPlace}}
365     </div>
366   </div>
367   <div class="row">
368     <div class="col-md-6">
369       <table id="locationdetails" class="table table-striped">
370         <tr>
371           <td>Name</td>
372           <td>
373             {{#each aPlace.names}}
374               <div class="line">
375                 <span class="name">{{this}}</span> ({{@key}})
376               </div>
377             {{/each}}
378           </td>
379         </tr>
380         <tr>
381           <td>Type</td>
382           <td>{{aPlace.category}}:{{aPlace.type}}</td>
383         </tr>
384         <tr>
385           <td>Last Updated</td>
386           <td>{{aPlace.indexed_date}}</td>
387         </tr>
388         <tr>
389           <td>Admin Level</td>
390           <td>{{aPlace.admin_level}}</td>
391         </tr>
392         <tr>
393           <td>Rank</td>
394           <td>{{formatSearchRank aPlace.rank_search}}</td>
395         </tr>
396         {{#if aPlace.calculated_importance}}
397           <tr>
398             <td>Importance</td>
399             <td>
400               {{aPlace.calculated_importance}}
401               {{#unless aPlace.importance}} (estimated){{/unless}}
402             </td>
403           </tr>
404         {{/if}}
405         <tr>
406           <td>Coverage</td>
407           <td>{{coverageType aPlace}}</td>
408         </tr>
409         <tr>
410           <td>Centre Point (lat,lon)</td>
411           <td>
412             {{aPlace.centroid.coordinates.[1]}},{{aPlace.centroid.coordinates.[0]}}
413           </td>
414         </tr>
415         <tr>
416           <td>OSM</td>
417           <td>{{osmLink aPlace}}
418         </tr>
419         <tr>
420           <td>
421             Place Id
422             (<a href="https://nominatim.org/release-docs/develop/api/Output/#place_id-is-not-a-persistent-id">on this server</a>)
423           </td>
424           <td>{{aPlace.place_id}}</td>
425         </tr>
426         {{#if aPlace.calculated_wikipedia}}
427           <tr>
428             <td>Wikipedia Calculated</td>
429             <td>{{wikipediaLink aPlace}}</td>
430           </tr>
431         {{/if}}
432         <tr>
433           <td>Computed Postcode</td>
434           <td>{{aPlace.calculated_postcode}}</td>
435         </tr>
436         <tr>
437           <td>Address Tags</td>
438           <td>
439             {{#each aPlace.addresstags}}
440               <div class="line">
441                 <span class="name">{{this}}</span> ({{@key}})
442               </div>
443             {{/each}}
444           </td>
445         </tr>
446         <tr>
447           <td>Extra Tags</td>
448           <td>
449             {{#each aPlace.extratags}}
450               <div class="line">
451                 <span class="name">{{this}}</span> ({{@key}})
452               </div>
453             {{/each}}
454           </td>
455         </tr>
456       </table>
457     </div>
458     <div class="col-md-6">
459       <div id="map"></div>
460     </div>
461   </div>
462   <div class="row">
463     <div class="col-md-12">
464       <h2>Address</h2>
465        <table id="address" class="table table-striped table-small">
466         <thead>
467           <tr>
468             <th>Local name</th>
469             <th>Type</th>
470             <th>OSM</th>
471             <th>Address rank</th>
472             <th>Admin level</th>
473             <th>Distance</th>
474             <th></th>
475           </tr>
476         </thead>
477         <tbody>
478           {{#if aPlace.address}}
479             {{#each aPlace.address}}
480               {{> partial_details_one_row bDistanceInMeters=false}}
481             {{/each}}
482           {{/if}}
483
484           {{#if aPlace.linked_places}}
485             {{> partial_h2 'Linked Places'}}
486             {{#each aPlace.linked_places}}
487               {{> partial_details_one_row bDistanceInMeters=true}}
488             {{/each}}
489           {{/if}}
490
491           {{#if aPlace.keywords}}
492             {{> partial_h2 'Name Keywords'}}
493             {{#each aPlace.keywords.name}}
494               {{> partial_details_keyword_one_row}}
495             {{/each}}
496
497             {{> partial_h2 'Address Keywords'}}
498             {{#each aPlace.keywords.address}}
499               {{> partial_details_keyword_one_row}}
500             {{/each}}
501           {{/if}}
502
503           {{> partial_h2 'Parent Of'}}
504           {{#if aPlace.hierarchy}}
505
506             {{#each aPlace.hierarchy as |lines type|}}
507               {{> partial_h3 type}}
508               {{#each lines}}
509                 {{> partial_details_one_row bDistanceInMeters=true}}
510               {{/each}}
511             {{/each}}
512           {{else}}
513             <tr>
514               <td>
515                 <a class="btn btn-outline-secondary btn-sm"
516                   href="{{base_url}}&hierarchy=1">display child places</a>
517               </td>
518             </tr>
519           {{/if}}
520           {{tooManyHierarchyLinesWarning aPlace}}
521         </tbody>
522       </table>
523     </div>
524   </div>
525 </div>
526
527 </script>
528 <script id="detailspage-index-template" type="text/x-handlebars-template">
529 <div class="container" id="details-index-page">
530   <div class="row">
531     <div class="col-md-12">
532
533       <h1>Show details for place</h1>
534
535       <div class="search-form">
536         <h4>Search by place id</h4>
537
538         <form class="form-inline" action="details.html">
539           <input type="edit"
540                  class="form-control input-sm"
541                  pattern="^[0-9]+$"
542                  name="place_id"
543                  placeholder="12345" />
544           <input type="submit"
545                  class="btn btn-primary btn-sm"
546                  value="Show" />
547         </form>
548       </div>
549
550       <div class="search-form">
551         <h4>Search by OSM type and OSM id</h4>
552
553         <form id="form-by-type-and-id"
554               class="form-inline"
555               action="details.html">
556           <input type="edit"
557                  class="form-control input-sm"
558                  pattern="^[NWR][0-9]+$"
559                  placeholder="N123 or W123 or R123" />
560           <input type="hidden" name="osmtype" />
561           <input type="hidden" name="osmid" />
562           <input type="submit" class="btn btn-primary btn-sm" value="Show" />
563         </form>
564       </div>
565
566       <div class="search-form">
567         <h4>Search by openstreetmap.org URL</h4>
568
569         <form id="form-by-osm-url"
570               class="form-inline"
571               action="details.html">
572           <input type="edit"
573                  class="form-control input-sm"
574                  pattern=".*openstreetmap.*"
575                  placeholder="https://www.openstreetmap.org/relation/123" />
576           <input type="hidden" name="osmtype" />
577           <input type="hidden" name="osmid" />
578           <input type="submit" class="btn btn-primary btn-sm" value="Show" />
579         </form>
580       </div>
581
582     </div>
583   </div>
584 </div></script>
585 <script id="deletable-template" type="text/x-handlebars-template">
586 <div class="container">
587   <div class="row">
588     <div class="col-sm-12">
589       <h1>Deletable</h1>
590
591       <p>
592           {{aPolygons.length}} objects have been deleted in OSM but are still in the Nominatim database.
593       </p>
594
595       <table class="table table-striped table-hover">
596         <thead>
597           <th>Place id</th>
598           <th>Country Code</th>
599           <th>Name</th>
600           <th>OSM id</th>
601           <th>OSM type</th>
602           <th>Class</th>
603           <th>Type</th>
604         </thead>
605         <tbody>
606           {{#each aPolygons}}
607           <tr>
608             <td>{{detailsLink this place_id}}</td>
609             <td>{{country_code}}</td>
610             <td>{{name}}</td>
611             <td>{{osmLink this}}</td>
612             <td>{{osm_type}}</td>
613             <td>{{class}}</td>
614             <td>{{type}}</td>
615           </tr>
616           {{/each}}
617         </tbody>
618       </table>
619
620
621     </div>
622   </div>
623 </div
624
625 </script>
626 <script id="polygons-template" type="text/x-handlebars-template">
627 <div class="container">
628   <div class="row">
629     <div class="col-sm-12">
630       <h1>Broken polygons</h1>
631
632       <p>
633           Total number of broken polygons: {{aPolygons.length}}.
634       </p>
635
636       <table class="table table-striped table-hover">
637         <thead>
638           <th>OSM type</th>
639           <th>OSM id</th>
640           <th>Class</th>
641           <th>Type</th>
642           <th>Name</th>
643           <th>Country Code</th>
644           <th>Error message</th>
645           <th>Updated</th>
646           <th>&nbsp;</th>
647         </thead>
648         <tbody>
649           {{#each aPolygons}}
650           <tr>
651             <td>{{osm_type}}</td>
652             <td>{{osmLink this}}</td>
653             <td>{{class}}</td>
654             <td>{{type}}</td>
655             <td>{{name}}</td>
656             <td>{{country_code}}</td>
657             <td>{{errormessage}}</td>
658             <td>{{updated}}</td>
659             <td>
660               <a href="http://localhost:8111/import?url=https://www.openstreetmap.org/api/0.6/{{formatOSMType osm_type}}/{{osm_id}}/full" target="josm">josm</a>
661             </td>
662           </tr>
663           {{/each}}
664         </tbody>
665       </table>
666
667
668     </div>
669   </div>
670 </div
671
672 </script>
673 </body>
674 </html>