src/templates/searchpage.hbs

   1 {{#*inline "partial_one_result"}}
   2   <div class="result" data-position="{{iResNum}}">
   3     {{formatMapIcon aResult}}
   4
   5     <span class="name">{{aResult.display_name}}</span>
   6     <span class="type">({{formatLabel aResult}})</span>
   7     <p class="coords">{{aResult.lat}},{{aResult.lon}}</p>
   8
   9     <a class="details btn btn-outline-secondary btn-sm" href="{{detailsURL aResult}}">details</a>
  10   </div>
  11 {{/inline}}
  12
  13 <div class="top-bar">
  14   <ul class="nav nav-tabs">
  15     <li class="nav-item">
  16       <a class="nav-link {{#unless hStructured}}active{{/unless}}" data-toggle="tab" href="#simple">simple</a>
  17     </li>
  18     <li class="nav-item">
  19       <a class="nav-link {{#if hStructured}}active{{/if}}" data-toggle="tab" href="#structured">structured</a>
  20     </li>
  21     <div class="search-type-link">
  22       <a href="details.html" class="mr-2">search by id</a>
  23       <a id="switch-to-reverse" href="/reverse.html">reverse search</a>
  24     </div>
  25   </ul>
  26   <div class="tab-content p-2">
  27     <div class="tab-pane {{#unless hStructured}}active{{/unless}}" id="simple" role="tabpanel">
  28       <form class="form-inline" role="search" accept-charset="UTF-8" action="">
  29         <input id="q"
  30                name="q"
  31                type="text"
  32                class="form-control form-control-sm"
  33                placeholder="Search"
  34                value="{{sQuery}}" />
  35
  36         <div class="form-group search-button-group">
  37           <button type="submit" class="btn btn-primary btn-sm mx-1">Search</button>
  38           <input type="hidden" name="viewbox" value="{{sViewBox}}" />
  39           <input type="hidden" name="dedupe" value="{{sDedupe}}" />
  40           <input type="hidden" name="bounded" value="{{sBounded}}" />
  41           <input type="hidden" name="accept-language" value="{{sLang}}" />
  42           <input type="hidden" name="countrycodes" value="{{sCCode}}" />
  43           <input type="hidden" name="limit" value="{{sLimit}}" />
  44           <input type="hidden" name="polygon_threshold" value="{{sPolyThreshold}}" />
  45         </div>
  46       </form>
  47     </div>
  48     <div class="tab-pane {{#if hStructured}}active{{/if}}" id="structured" role="tabpanel">
  49       <form class="form-inline" role="search" accept-charset="UTF-8" action="">
  50         <input name="street" type="text" class="form-control form-control-sm mr-1"
  51                placeholder="House number/Street"
  52                value="{{hStructured.street}}" />
  53         <input name="city" type="text" class="form-control form-control-sm mr-1"
  54                placeholder="City"
  55                value="{{hStructured.city}}" />
  56         <input id="county" name="county" type="text" class="form-control form-control-sm mr-1"
  57                placeholder="County"
  58                value="{{hStructured.county}}" />
  59         <input name="state" type="text" class="form-control form-control-sm mr-1"
  60                placeholder="State"
  61                value="{{hStructured.state}}" />
  62         <input name="country" type="text" class="form-control form-control-sm mr-1"
  63                placeholder="Country"
  64                value="{{hStructured.country}}" />
  65         <input name="postalcode" type="text" class="form-control form-control-sm mr-1"
  66                placeholder="Postal Code"
  67                value="{{hStructured.postalcode}}" />
  68
  69         <div class="form-group search-button-group">
  70           <button type="submit" class="btn btn-primary btn-sm mx-1">Search</button>
  71           <input type="hidden" name="viewbox" value="{{sViewBox}}" />
  72           <input type="hidden" name="dedupe" value="{{#unless sDedupe}}0{{/unless}}" />
  73           <input type="hidden" name="bounded" value="{{#if sBounded}}1{{/if}}" />
  74           <input type="hidden" name="accept-language" value="{{sLang}}" />
  75           <input type="hidden" name="countrycodes" value="{{sCCode}}" />
  76           <input type="hidden" name="limit" value="{{sLimit}}" />
  77           <input type="hidden" name="polygon_threshold" value="{{sPolyThreshold}}" />
  78         </div>
  79       </form>
  80     </div>
  81     <!-- Additional options -->
  82     <a class="btn btn-outline-secondary btn-sm" data-toggle="collapse" data-target="#searchAdvancedOptions" role="button" aria-expanded="false" aria-controls="collapseAdvancedOptions">
  83       Advanced options
  84     </a>
  85     <div class="collapse" id="searchAdvancedOptions">
  86       <div id="searchAdvancedOptionsContent">
  87           <div class="form-check form-check-inline">
  88             <span><input type="checkbox" class="form-check-input api-param-setting"
  89                    id="use_viewbox" {{#if sViewBox}}checked="checked"{{/if}}>
  90             <label class="form-check-label" for="use_viewbox">apply viewbox</label></span>
  91             <span><input type="checkbox" class="form-check-input api-param-setting"
  92                    id="option_bounded" {{#if sBounded}}checked="checked"{{/if}}>
  93             <label class="form-check-label" for="option_bounded">bounded to viewbox</label></span>
  94             <span><input type="checkbox" class="form-check-input api-param-setting"
  95                    id="option_dedupe" {{#unless sDedupe}}checked="checked"{{/unless}}>
  96             <label class="form-check-label" for="option_dedupe">deduplicate results</label></span>
  97           </div>
  98           <div class="form-check form-check-inline">
  99             <span><label class="form-check-label" for="option_limit">Maximum number of results: </label>
 100             <input type="number" class="form-check-input api-param-setting" data-api-param="limit" id="option_limit" size="5" min="1" max="50" value="{{sLimit}}"></span>
 101             <span><label class="form-check-label" for="option_polygon_threashold">Polygon simplification: </label>
 102             <input type="number" class="form-check-input api-param-setting" data-api-param="polygon_threshold" id="option_polygon_threshold" size="5" min="0.0" step="0.01" value="{{sPolyThreshold}}"></span>
 103           </div>
 104           <div class="form-check form-check-inline">
 105             <span><label class="form-check-label" for="accept_lang">Languages: </label>
 106             <input type="text" placeholder="e.g. en,zh-Hant" class="form-check-input api-param-setting" data-api-param="accept-language" id="accept_lang" size="15" value="{{sLang}}"></span>
 107             <span><label class="form-check-label" for="option_ccode">Countries: </label>
 108             <input type="text" placeholder="e.g. de,gb" class="form-check-input api-param-setting" data-api-param="countrycodes" id="option_ccode" size="15" value="{{sCCode}}"></span>
 109           </div>
 110        </div>
 111     </div>
 112   </div> <!-- /tab-content -->
 113 </div> <!-- /top-bar -->
 114
 115 <div id="content">
 116
 117   {{#if bSearchRan}}
 118     <div id="searchresults" class="sidebar">
 119       {{#each aSearchResults as |aResult|}}
 120         {{>partial_one_result iResNum=@index aResult=aResult env=env}}
 121       {{/each}}
 122
 123       {{#if aSearchResults}}
 124         {{#if sMoreURL}}
 125           <div class="more">
 126             <a class="btn btn-primary" href="{{sMoreURL}}">
 127               Search for more results
 128             </a>
 129           </div>
 130         {{/if}}
 131       {{else}}
 132         <div class="noresults">No search results found</div>
 133       {{/if}}
 134     </div>
 135
 136   {{else}}
 137
 138     <div id="intro" class="sidebar">
 139       <h2>Welcome to Nominatim</h2>
 140
 141       <p>
 142         Nominatim is a search engine for
 143         <a href="https://www.openstreetmap.org">OpenStreetMap</a> data. This
 144         is the debugging interface. You may search for a name or address
 145         (forward search) or look up data by its geographic coordinate (reverse
 146         search). Each result comes with a link to a details page where you
 147         can inspect what data about the object is saved in the database and
 148         investigate how the address of the object has been computed.
 149       </p>
 150
 151       For more information visit the
 152       <a href="https://nominatim.org">Nominatim home page</a>.
 153     </div>
 154
 155   {{/if}}
 156
 157   <div id="map-wrapper">
 158     <div id="map-position">
 159       <div id="map-position-inner"></div>
 160       <div id="map-position-close"><a href="#">hide</a></div>
 161     </div>
 162     <div id="map"></div>
 163   </div>
 164 </div>