]> git.openstreetmap.org Git - rails.git/blob - app/views/directions/search.html.erb
Add km/mi buttons to directions
[rails.git] / app / views / directions / search.html.erb
1 <% content_for(:content_class) { "overlay-sidebar" } %>
2
3 <svg width="20" height="20" class="d-none">
4   <symbol id="routing-sprite-start" fill="none" stroke="currentColor" stroke-width="2">
5     <path d="M10 16 a1 1 0 1 0 0 -2 1 1 0 1 0 0 2 m0 -4 v-8 m2.5 2 l-2.5 -2.5 -2.5 2.5 z" />
6   </symbol>
7   <symbol id="routing-sprite-destination" fill="none" stroke="currentColor" stroke-width="2">
8     <path d="M10 5 a1 1 0 1 0 0 -2 1 1 0 1 0 0 2 m0 12 v-8 m2.5 2 l-2.5 -2.5 -2.5 2.5 z" />
9   </symbol>
10
11   <symbol id="routing-sprite-straight" fill="none" stroke="currentColor" stroke-width="2">
12     <path d="M10 17 v-13 m2.5 2 l-2.5 -2.5 -2.5 2.5 z" />
13   </symbol>
14   <symbol id="routing-sprite-slight-right" fill="none" stroke="currentColor" stroke-width="2">
15     <path d="M7 17 v-3 q0 -2 2 -4 l5 -5 m0 0 h-3 l3 3 z" />
16   </symbol>
17   <symbol id="routing-sprite-right" fill="none" stroke="currentColor" stroke-width="2">
18     <path d="M8 17 v-5 q0 -3 3 -3 h4 m-2 2.5 l2.5 -2.5 -2.5 -2.5 z" />
19   </symbol>
20   <symbol id="routing-sprite-sharp-right" fill="none" stroke="currentColor" stroke-width="2">
21     <path d="M8 17 v-7 q0 -6 6 0 l2 2 m0 0 v-3 l-3 3 z" />
22   </symbol>
23   <symbol id="routing-sprite-u-turn-right" fill="none" stroke="currentColor" stroke-width="2">
24     <path d="M4 17 v-7 a4.5 4.5 0 0 1 9 0 v5 m2.5 -2 l-2.5 2.5 -2.5 -2.5 z" />
25   </symbol>
26   <symbol id="routing-sprite-slight-left">
27     <use href="#routing-sprite-slight-right" transform="matrix(-1 0 0 1 20 0)" />
28   </symbol>
29   <symbol id="routing-sprite-left">
30     <use href="#routing-sprite-right" transform="matrix(-1 0 0 1 21 0)" />
31   </symbol>
32   <symbol id="routing-sprite-sharp-left">
33     <use href="#routing-sprite-sharp-right" transform="matrix(-1 0 0 1 21 0)" />
34   </symbol>
35   <symbol id="routing-sprite-u-turn-left">
36     <use href="#routing-sprite-u-turn-right" transform="matrix(-1 0 0 1 20 0)" />
37   </symbol>
38
39   <symbol id="routing-sprite-roundabout" fill="none" stroke="currentColor" stroke-width="2">
40     <path d="M8 17 v-3 a 3 3 0 1 0 0 -6 3 3 0 1 0 0 6 m2 -4 l5 -5 m0 0 h-3 l3 3 z" />
41   </symbol>
42
43   <symbol id="routing-sprite-fork-right" fill="none" stroke="currentColor" stroke-width="2">
44     <path d="M9 14 q0 -2 -2 -4 l-3 -3" opacity=".5" />
45     <path d="M9 17 v-3 q0 -2 2 -4 l5 -5 m0 0 h-3 l3 3 z" />
46   </symbol>
47   <symbol id="routing-sprite-fork-left">
48     <use href="#routing-sprite-fork-right" transform="matrix(-1 0 0 1 20 0)" />
49   </symbol>
50   <symbol id="routing-sprite-merge-left" fill="none" stroke="currentColor" stroke-width="2">
51     <path d="M8 7 q0 2 -2 4 l-3 3" opacity=".5" />
52     <path d="M8 4 v3 q0 2 2 4 l5 5 m-5 -5 h3 l-3 3 z" />
53   </symbol>
54   <symbol id="routing-sprite-merge-right">
55     <use href="#routing-sprite-merge-left" transform="matrix(-1 0 0 1 20 0)" />
56   </symbol>
57   <symbol id="routing-sprite-end-of-road-right" fill="none" stroke="currentColor" stroke-width="2">
58     <path d="M2 9 h10" opacity=".5" />
59     <path d="M9 17 v-5 q0 -3 3 -3 h4 m-2 2.5 l2.5 -2.5 -2.5 -2.5 z" />
60   </symbol>
61   <symbol id="routing-sprite-end-of-road-left">
62     <use href="#routing-sprite-end-of-road-right" transform="matrix(-1 0 0 1 20 0)" />
63   </symbol>
64   <symbol id="routing-sprite-exit-right" fill="none" stroke="currentColor" stroke-width="2">
65     <path d="M9 14 v-8" opacity=".5" />
66     <path d="M9 17 v-3 q0 -2 2 -4 l5 -5 m0 0 h-3 l3 3 z" />
67   </symbol>
68   <symbol id="routing-sprite-exit-left">
69     <use href="#routing-sprite-exit-right" transform="matrix(-1 0 0 1 20 0)" />
70   </symbol>
71
72   <symbol id="routing-sprite-ferry" fill="none" stroke="currentColor" stroke-width="1">
73     <path d="M10.5 8 l-6 2 l2.5 2 v1.5 a2.828 2.828 0 0 1 1.5 1 a2.828 2.828 0 0 1 4 0 a2.828 2.828 0 0 1 1.5 -1 v-1.5 l2.5 -2 z" fill="currentColor" />
74     <path d="M6.5 9.5 v-5 h8 v5 m-5.5 -6 h3" />
75     <path d="M5.5 16.5 a1.414 2.828 0 0 1 2 0 a1.414 2.828 0 0 0 2 0 a1.414 2.828 0 0 1 2 0 a1.414 2.828 0 0 0 2 0 a1.414 2.828 0 0 1 2 0" />
76   </symbol>
77 </svg>
78
79 <%= render "sidebar_header", :title => t(".title") %>
80
81 <div id="directions_loader" hidden>
82   <div class="text-center loader">
83     <div class="spinner-border" role="status">
84       <span class="visually-hidden"><%= t("browse.start_rjs.loading") %></span>
85     </div>
86   </div>
87 </div>
88
89 <div id="directions_error" hidden></div>
90
91 <div id="directions_route" hidden>
92   <div class="d-flex align-items-end mb-3">
93     <div class="flex-grow-1 text-truncate">
94       <span>
95         <%= t ".distance" %>: <output id="directions_route_distance"></output>.
96         <%= t ".time" %>: <output id="directions_route_time"></output>.
97       </span>
98       <br>
99       <span id="directions_route_ascend_descend">
100         <%= t ".ascend" %>: <output id="directions_route_ascend"></output>.
101         <%= t ".descend" %>: <output id="directions_route_descend"></output>.
102       </span>
103     </div>
104
105     <div class="btn-group btn-group-sm">
106       <input type="radio" class="btn-check" name="directions_distance_units" id="directions_distance_units_km" autocomplete="off" checked>
107       <label class="btn btn-outline-secondary p-0 px-1" for="directions_distance_units_km"><%= t ".button_km" %></label>
108
109       <input type="radio" class="btn-check" name="directions_distance_units" id="directions_distance_units_mi" autocomplete="off">
110       <label class="btn btn-outline-secondary p-0 px-1" for="directions_distance_units_mi"><%= t ".button_mi" %></label>
111     </div>
112   </div>
113
114   <table class='table table-hover table-sm mb-3'>
115     <tbody id="directions_route_steps"></tbody>
116   </table>
117
118   <p class="text-center">
119     <%= tag.a t(".download"), :id => "directions_route_download", :download => t(".filename") %>
120   </p>
121
122   <p class="text-center">
123     <%= t ".directions_courtesy_html", :link => tag.a("", :id => "directions_route_credit", :target => "_blank") %>
124   </p>
125 </div>