]> git.openstreetmap.org Git - rails.git/blob - app/assets/javascripts/index.js
Add clearer close action, refactor base layer code
[rails.git] / app / assets / javascripts / index.js
1 //= require_self
2 //= require leaflet.sidebar
3 //= require leaflet.customzoom
4 //= require leaflet.locate
5 //= require leaflet.layers
6 //= require leaflet.key
7 //= require leaflet.note
8 //= require leaflet.share
9 //= require index/browse
10 //= require index/export
11 //= require index/notes
12
13 $(document).ready(function () {
14   var params = OSM.mapParams();
15
16   var map = L.map("map", {
17     zoomControl: false,
18     layerControl: false
19   });
20
21   map.attributionControl.setPrefix('');
22
23   var layers = [
24     new L.OSM.Mapnik({
25       attribution: '',
26       code: "M",
27       keyid: "mapnik",
28       name: I18n.t("javascripts.map.base.standard")
29     }),
30     new L.OSM.CycleMap({
31       attribution: "Tiles courtesy of <a href='http://www.opencyclemap.org/' target='_blank'>Andy Allan</a>",
32       code: "C",
33       keyid: "cyclemap",
34       name: I18n.t("javascripts.map.base.cycle_map")
35     }),
36     new L.OSM.TransportMap({
37       attribution: "Tiles courtesy of <a href='http://www.opencyclemap.org/' target='_blank'>Andy Allan</a>",
38       code: "T",
39       keyid: "transportmap",
40       name: I18n.t("javascripts.map.base.transport_map")
41     }),
42     new L.OSM.MapQuestOpen({
43       attribution: "Tiles courtesy of <a href='http://www.mapquest.com/' target='_blank'>MapQuest</a> <img src='http://developer.mapquest.com/content/osm/mq_logo.png'>",
44       code: "Q",
45       keyid: "mapquest",
46       name: I18n.t("javascripts.map.base.mapquest")
47     })
48   ];
49
50   layers[0].addTo(map);
51
52   map.noteLayer = new L.LayerGroup({code: 'N'});
53   map.dataLayer = new L.OSM.DataLayer(null);
54
55   $("#map").on("resized", function () {
56     map.invalidateSize();
57   });
58
59   L.control.customZoom({position: 'topright'})
60     .addTo(map);
61
62   L.control.locate({position: 'topright'})
63     .addTo(map);
64
65   var sidebar = L.OSM.sidebar('#map-ui');
66
67   L.OSM.layers({
68     position: 'topright',
69     layers: layers,
70     sidebar: sidebar
71   }).addTo(map);
72
73   L.OSM.key({
74     position: 'topright',
75     sidebar: sidebar
76   }).addTo(map);
77
78   L.OSM.note({
79     position: 'topright',
80     sidebar: sidebar
81   }).addTo(map);
82
83   L.OSM.share({
84     getShortUrl: getShortUrl,
85     getUrl: getUrl,
86     sidebar: sidebar,
87     short: true
88   }).addTo(map);
89
90   L.control.scale()
91     .addTo(map);
92
93   map.on('moveend layeradd layerremove', updateLocation);
94
95   map.markerLayer = L.layerGroup().addTo(map);
96
97   if (!params.object_zoom) {
98     if (params.bbox) {
99       var bbox = L.latLngBounds([params.minlat, params.minlon],
100                                 [params.maxlat, params.maxlon]);
101
102       map.fitBounds(bbox);
103
104       if (params.box) {
105         L.rectangle(bbox, {
106           weight: 2,
107           color: '#e90',
108           fillOpacity: 0
109         }).addTo(map);
110       }
111     } else {
112       map.setView([params.lat, params.lon], params.zoom);
113     }
114   }
115
116   if (params.layers) {
117     var foundLayer = false;
118     for (var i = 0; i < layers.length; i++) {
119       if (params.layers.indexOf(layers[i].options.code) >= 0) {
120         map.addLayer(layers[i]);
121         foundLayer = true;
122       } else {
123         map.removeLayer(layers[i]);
124       }
125     }
126     if (!foundLayer) {
127       map.addLayer(layers[0]);
128     }
129   }
130
131   if (params.marker) {
132     L.marker([params.mlat, params.mlon], {icon: getUserIcon()}).addTo(map.markerLayer);
133   }
134
135   if (params.object) {
136     addObjectToMap(params.object, map, { zoom: params.object_zoom });
137   }
138
139   handleResize();
140
141   $("body").on("click", "a.set_position", setPositionLink(map));
142
143   $("a[data-editor=remote]").click(function(e) {
144       remoteEditHandler(map.getBounds());
145       e.preventDefault();
146   });
147
148   if (OSM.preferred_editor == "remote" && $('body').hasClass("site-edit")) {
149     remoteEditHandler(map.getBounds());
150   }
151
152   $(window).resize(handleResize);
153
154   $("#search_form").submit(submitSearch(map));
155
156
157   if ($("#query").val()) {
158     $("#search_form").submit();
159   }
160
161   // Focus the search field for browsers that don't support
162   // the HTML5 'autofocus' attribute
163   if (!("autofocus" in document.createElement("input"))) {
164     $("#query").focus();
165   }
166
167   initializeExport(map);
168   initializeBrowse(map);
169   initializeNotes(map);
170 });
171
172 function updateLocation() {
173   updatelinks(this.getCenter().wrap(),
174       this.getZoom(),
175       this.getLayersCode(),
176       this.getBounds().wrap(), {});
177
178   var expiry = new Date();
179   expiry.setYear(expiry.getFullYear() + 10);
180   $.cookie("_osm_location", cookieContent(this), { expires: expiry });
181 }
182
183 function setPositionLink(map) {
184   return function(e) {
185       var data = $(this).data(),
186           center = L.latLng(data.lat, data.lon);
187
188       if (data.minLon && data.minLat && data.maxLon && data.maxLat) {
189         map.fitBounds([[data.minLat, data.minLon],
190                        [data.maxLat, data.maxLon]]);
191       } else {
192         map.setView(center, data.zoom);
193       }
194
195       if (data.type && data.id) {
196         addObjectToMap(data, map, { zoom: true, style: { opacity: 0.2, fill: false } });
197       }
198
199       map.markerLayer.clearLayers();
200       L.marker(center, {icon: getUserIcon()}).addTo(map.markerLayer);
201
202       return e.preventDefault();
203   };
204 }
205
206 function submitSearch(map) {
207   return function(e) {
208     var bounds = map.getBounds();
209
210     $("#sidebar_title").html(I18n.t('site.sidebar.search_results'));
211     $("#sidebar_content").load($(this).attr("action"), {
212       query: $("#query").val(),
213       minlon: bounds.getWestLng(),
214       minlat: bounds.getSouthLat(),
215       maxlon: bounds.getEastLng(),
216       maxlat: bounds.getNorthLat()
217     }, openSidebar);
218
219     return e.preventDefault();
220   };
221 }