]> git.openstreetmap.org Git - rails.git/blob - app/assets/javascripts/index.js
AJAXy changeset history
[rails.git] / app / assets / javascripts / index.js
1 //= require_self
2 //= require leaflet.sidebar
3 //= require leaflet.locate
4 //= require leaflet.layers
5 //= require leaflet.key
6 //= require leaflet.note
7 //= require leaflet.share
8 //= require index/search
9 //= require index/browse
10 //= require index/export
11 //= require index/notes
12 //= require index/history
13 //= require router
14
15 $(document).ready(function () {
16   var params = OSM.mapParams();
17
18   var map = L.map("map", {
19     zoomControl: false,
20     layerControl: false
21   });
22
23   map.attributionControl.setPrefix('');
24
25   map.hash = L.hash(map);
26
27   $(window).on('popstate', function() {
28     map.hash.update();
29   });
30
31   var copyright = I18n.t('javascripts.map.copyright', {copyright_url: '/copyright'});
32
33   var layers = [
34     new L.OSM.Mapnik({
35       attribution: copyright,
36       code: "M",
37       keyid: "mapnik",
38       name: I18n.t("javascripts.map.base.standard")
39     }),
40     new L.OSM.CycleMap({
41       attribution: copyright + ". Tiles courtesy of <a href='http://www.opencyclemap.org/' target='_blank'>Andy Allan</a>",
42       code: "C",
43       keyid: "cyclemap",
44       name: I18n.t("javascripts.map.base.cycle_map")
45     }),
46     new L.OSM.TransportMap({
47       attribution: copyright + ". Tiles courtesy of <a href='http://www.opencyclemap.org/' target='_blank'>Andy Allan</a>",
48       code: "T",
49       keyid: "transportmap",
50       name: I18n.t("javascripts.map.base.transport_map")
51     }),
52     new L.OSM.MapQuestOpen({
53       attribution: copyright + ". Tiles courtesy of <a href='http://www.mapquest.com/' target='_blank'>MapQuest</a> <img src='http://developer.mapquest.com/content/osm/mq_logo.png'>",
54       code: "Q",
55       keyid: "mapquest",
56       name: I18n.t("javascripts.map.base.mapquest")
57     }),
58     new L.OSM.HOT({
59       attribution: copyright + ". Tiles courtesy of <a href='http://hot.openstreetmap.org/' target='_blank'>Humanitarian OpenStreetMap Team</a>",
60       code: "H",
61       keyid: "hot",
62       name: I18n.t("javascripts.map.base.hot")
63     })
64   ];
65
66   function updateLayers(params) {
67     var layerParam = params.layers || "M";
68     var layersAdded = "";
69
70     for (var i = layers.length - 1; i >= 0; i--) {
71       if (layerParam.indexOf(layers[i].options.code) >= 0) {
72         map.addLayer(layers[i]);
73         layersAdded = layersAdded + layers[i].options.code;
74       } else if (i == 0 && layersAdded == "") {
75         map.addLayer(layers[i]);
76       } else {
77         map.removeLayer(layers[i]);
78       }
79     }
80   }
81
82   updateLayers(params);
83
84   $(window).on("hashchange", function () {
85     updateLayers(OSM.mapParams());
86   });
87
88   map.on("baselayerchange", function (e) {
89     if (map.getZoom() > e.layer.options.maxZoom) {
90       map.setView(map.getCenter(), e.layer.options.maxZoom, { reset: true });
91     }
92   });
93
94   map.noteLayer = new L.LayerGroup();
95   map.noteLayer.options = {code: 'N'};
96
97   map.dataLayer = new L.OSM.DataLayer(null);
98   map.dataLayer.options.code = 'D';
99
100   if (OSM.STATUS != 'api_offline' && OSM.STATUS != 'database_offline') {
101     if (params.layers.indexOf(map.noteLayer.options.code) >= 0) {
102       map.addLayer(map.noteLayer);
103     }
104
105     if (params.layers.indexOf(map.dataLayer.options.code) >= 0) {
106       map.addLayer(map.dataLayer);
107     }
108   }
109
110   var position = $('html').attr('dir') === 'rtl' ? 'topleft' : 'topright';
111
112   L.OSM.zoom({position: position})
113     .addTo(map);
114
115   L.control.locate({
116     position: position,
117     strings: {
118       title: I18n.t('javascripts.map.locate.title'),
119       popup: I18n.t('javascripts.map.locate.popup')
120     }
121   }).addTo(map);
122
123   var sidebar = L.OSM.sidebar('#map-ui')
124     .addTo(map);
125
126   L.OSM.layers({
127     position: position,
128     layers: layers,
129     sidebar: sidebar
130   }).addTo(map);
131
132   L.OSM.key({
133     position: position,
134     sidebar: sidebar
135   }).addTo(map);
136
137   L.OSM.share({
138     position: position,
139     sidebar: sidebar,
140     short: true
141   }).addTo(map);
142
143   L.OSM.note({
144     position: position,
145     sidebar: sidebar
146   }).addTo(map);
147
148   L.control.scale()
149     .addTo(map);
150
151   $('.leaflet-control .control-button').tooltip({placement: 'left', container: 'body'});
152
153   map.on('moveend layeradd layerremove', function() {
154     updatelinks(
155       map.getCenter().wrap(),
156       map.getZoom(),
157       map.getLayersCode(),
158       map._object);
159
160     var expiry = new Date();
161     expiry.setYear(expiry.getFullYear() + 10);
162     $.cookie("_osm_location", cookieContent(map), { expires: expiry });
163
164     // Trigger hash update on layer changes.
165     map.hash.onMapMove();
166   });
167
168   if (OSM.PIWIK) {
169     map.on('layeradd', function (e) {
170       if (e.layer.options) {
171         var goal = OSM.PIWIK.goals[e.layer.options.keyid];
172
173         if (goal) {
174           $('body').trigger('piwikgoal', goal);
175         }
176       }
177     });
178   }
179
180   if (params.bounds) {
181     map.fitBounds(params.bounds);
182   } else {
183     map.setView([params.lat, params.lon], params.zoom);
184   }
185
186   var marker = L.marker([0, 0], {icon: getUserIcon()});
187
188   if (params.marker) {
189     marker.setLatLng([params.mlat, params.mlon]).addTo(map);
190   }
191
192   $("#homeanchor").on("click", function(e) {
193     e.preventDefault();
194
195     var data = $(this).data(),
196       center = L.latLng(data.lat, data.lon);
197
198     map.setView(center, data.zoom);
199     marker.setLatLng(center).addTo(map);
200   });
201
202   $("a[data-editor=remote]").click(function(e) {
203       remoteEditHandler(map.getBounds());
204       e.preventDefault();
205   });
206
207   if (OSM.preferred_editor == "remote" && $('body').hasClass("site-edit")) {
208     remoteEditHandler(map.getBounds());
209   }
210
211   if (OSM.params().edit_help) {
212     $('#editanchor')
213       .removeAttr('title')
214       .tooltip({
215         placement: 'bottom',
216         title: I18n.t('javascripts.edit_help')
217       })
218       .tooltip('show');
219
220     $('body').one('click', function() {
221       $('#editanchor').tooltip('hide');
222     });
223   }
224
225   initializeBrowse(map);
226   initializeNotes(map);
227
228   OSM.Index = function(map) {
229     var page = {}, minimized = false;
230
231     page.pushstate = page.popstate = function(path) {
232       if (minimized) $("#sidebar").addClass("minimized");
233       map.invalidateSize();
234       $("#view_tab").addClass("current");
235       $('#sidebar_content').load(path);
236     };
237
238     page.unload = function() {
239       $("#view_tab").removeClass("current");
240     };
241
242     page.minimizeSidebar = function() {
243       $("#sidebar").addClass("minimized");
244       map.invalidateSize();
245       minimized = true;
246     };
247
248     $(document).on("click", "#sidebar_content .close", page.minimizeSidebar);
249
250     return page;
251   };
252
253   OSM.Browse = function(map) {
254     var page = {};
255
256     page.pushstate = page.popstate = function(path, type, id) {
257       $("#sidebar").removeClass("minimized");
258       map.invalidateSize();
259       $('#sidebar_content').load(path, function() {
260         page.load(path, type, id);
261       });
262     };
263
264     page.load = function(path, type, id) {
265       if (OSM.STATUS === 'api_offline' || OSM.STATUS === 'database_offline') return;
266
267       if (type === 'note') {
268         map.noteLayer.showNote(parseInt(id));
269       } else {
270         map.addObject({type: type, id: parseInt(id)}, {zoom: true});
271       }
272     };
273
274     page.unload = function() {
275       map.removeObject();
276     };
277
278     return page;
279   };
280
281   var history = OSM.History(map);
282
283   OSM.route = OSM.Router({
284     "/":                           OSM.Index(map),
285     "/search":                     OSM.Search(map),
286     "/export":                     OSM.Export(map),
287     "/history":                    history,
288     "/user/:display_name/edits":   history,
289     "/browse/friends":             history,
290     "/browse/nearby":              history,
291     "/browse/:type/:id(/history)": OSM.Browse(map)
292   });
293
294   $(document).on("click", "a", function(e) {
295     if (e.isPropagationStopped()) return;
296     if (OSM.route(this.pathname + this.search + this.hash)) e.preventDefault();
297   });
298
299   $("#search_form").on("submit", function(e) {
300     e.preventDefault();
301     OSM.route("/search?query=" + encodeURIComponent($("#query").val()) + OSM.formatHash(map));
302   });
303
304   $("#describe_location").on("click", function(e) {
305     e.preventDefault();
306     OSM.route("/search?query=" + encodeURIComponent(map.getCenter().lat + "," + map.getCenter().lng));
307   });
308 });