3fcc2f79054faeaa05840971500b388613e9e6c8
[rails.git] / app / assets / javascripts / index / history.js
1 //= require jquery.simulate
2
3 OSM.History = function(map) {
4   var page = {};
5
6   $("#sidebar_content")
7     .on("click", ".changeset_more a", loadMore)
8     .on("mouseover", "[data-changeset]", function () {
9       highlightChangeset($(this).data("changeset").id);
10     })
11     .on("mouseout", "[data-changeset]", function () {
12       unHighlightChangeset($(this).data("changeset").id);
13     })
14     .on("mousedown", "[data-changeset]", function () {
15       var moved = false;
16       $(this).one("click", function (e) {
17         if (!moved && !$(e.target).is('a')) {
18           clickChangeset($(this).data("changeset").id, e);
19         }
20       }).one("mousemove", function () {
21         moved = true;
22       });
23     });
24
25   var group = L.featureGroup()
26     .on("mouseover", function (e) {
27       highlightChangeset(e.layer.id);
28     })
29     .on("mouseout", function (e) {
30       unHighlightChangeset(e.layer.id);
31     })
32     .on("click", function (e) {
33       clickChangeset(e.layer.id, e);
34     });
35
36   group.getLayerId = function(layer) {
37     return layer.id;
38   };
39
40   function highlightChangeset(id) {
41     group.getLayer(id).setStyle({fillOpacity: 0.3});
42     $("#changeset_" + id).addClass("selected");
43   }
44
45   function unHighlightChangeset(id) {
46     group.getLayer(id).setStyle({fillOpacity: 0});
47     $("#changeset_" + id).removeClass("selected");
48   }
49
50   function clickChangeset(id, e) {
51     $("#changeset_" + id).find("a.changeset_id").simulate("click", e);
52   }
53
54   function update() {
55     var data = {list: '1'};
56
57     if (window.location.pathname === '/history') {
58       data.bbox = map.getBounds().wrap().toBBoxString();
59     }
60
61     $.ajax({
62       url: window.location.pathname,
63       method: "GET",
64       data: data,
65       success: function(html) {
66         $('#sidebar_content .changesets').html(html);
67         updateMap();
68       }
69     });
70
71     var feedLink = $('link[type="application/atom+xml"]'),
72       feedHref = feedLink.attr('href').split('?')[0];
73
74     feedLink.attr('href', feedHref + '?bbox=' + data.bbox);
75   }
76
77   function loadMore(e) {
78     e.preventDefault();
79     e.stopPropagation();
80
81     var div = $(this).parents(".changeset_more");
82
83     $(this).hide();
84     div.find(".loader").show();
85
86     $.get($(this).attr("href"), function(data) {
87       div.replaceWith(data);
88       updateMap();
89     });
90   }
91
92   function updateMap() {
93     group.clearLayers();
94
95     var changesets = [];
96
97     $("[data-changeset]").each(function () {
98       var changeset = $(this).data('changeset');
99       if (changeset.bbox) {
100         var minProjection = map.project(L.latLng(changeset.bbox.minlat, changeset.bbox.minlon)),
101             maxProjection = map.project(L.latLng(changeset.bbox.maxlat, changeset.bbox.maxlon)),
102             xGap = maxProjection.x - minProjection.x,
103             yGap = minProjection.y - maxProjection.y,
104             minXGap = 40,  // Min width/height of changeset in pixels
105             minYGap = 40;
106
107         if (xGap < minXGap) {
108           minProjection.x -= ((minXGap - xGap) / 2);
109           maxProjection.x += ((minXGap - xGap) / 2);
110         }
111
112         if (yGap < minYGap) {
113           minProjection.y += ((minYGap - yGap) / 2);
114           maxProjection.y -= ((minYGap - yGap) / 2);
115         }
116
117         var minUnProjection = map.unproject(minProjection),
118             maxUnProjection = map.unproject(maxProjection),
119             bounds = [minUnProjection,
120                       maxUnProjection];
121
122         changeset.bounds = L.latLngBounds(bounds);
123         changesets.push(changeset);
124       }
125     });
126
127     changesets.sort(function (a, b) {
128       return b.bounds.getSize() - a.bounds.getSize();
129     });
130
131     for (var i = 0; i < changesets.length; ++i) {
132       var changeset = changesets[i],
133         rect = L.rectangle(changeset.bounds,
134           {weight: 2, color: "#FF9500", opacity: 1, fillColor: "#FFFFBF", fillOpacity: 0});
135       rect.id = changeset.id;
136       rect.addTo(group);
137     }
138
139     if (window.location.pathname !== '/history') {
140       var bounds = group.getBounds();
141       if (bounds.isValid()) map.fitBounds(bounds);
142     }
143   }
144
145   page.pushstate = page.popstate = function(path) {
146     $("#history_tab").addClass("current");
147     OSM.loadSidebarContent(path, page.load);
148   };
149
150   page.load = function() {
151     map.addLayer(group);
152
153     if (window.location.pathname === '/history') {
154       map.on("moveend", update);
155     }
156
157     update();
158   };
159
160   page.unload = function() {
161     map.removeLayer(group);
162     map.off("moveend", update);
163
164     $("#history_tab").removeClass("current");
165   };
166
167   return page;
168 };