Rework notes interface using OpenLayers and rails
[rails.git] / app / views / browse / _map.html.erb
1 <%= javascript_include_tag '/openlayers/OpenLayers.js' %>
2 <%= javascript_include_tag '/openlayers/OpenStreetMap.js' %>
3 <%= javascript_include_tag 'map.js' %>
4
5 <iframe id="linkloader" style="display: none">
6 </iframe>
7
8 <div id="browse_map">
9   <% if map.instance_of? Changeset or (map.instance_of? Node and map.version > 1) or map.visible? %>
10   <div id="small_map">
11   </div>
12   <span id="loading"><%= t 'browse.map.loading' %></span>
13   <% if map.instance_of? Note -%>
14   <%= link_to(t("browse.map.larger.area"), { :controller => :site, :action => :index, :notes => "yes" }, { :id => "area_larger_map", :class => "geolink bbox" }) %>
15   <% else -%>
16   <%= link_to(t("browse.map.larger.area"), { :controller => :site, :action => :index, :box => "yes" }, { :id => "area_larger_map", :class => "geolink bbox" }) %>
17   <% end -%>
18   <br />
19   <%= link_to(t("browse.map.edit.area"), { :controller => :site, :action => :edit }, { :id => "area_edit", :class => "geolink bbox" }) %>
20   <% unless map.instance_of? Changeset or map.instance_of? Note %>
21     <br />
22     <%= link_to("", { :controller => :site, :action => :index }, { :id => "object_larger_map", :class => "geolink object" }) %>
23     <br />
24     <%= link_to("", { :controller => :site, :action => :edit }, { :id => "object_edit", :class => "geolink object" }) %>
25   <% end %>
26   <% else %>
27     <%= t 'browse.map.deleted' %>
28   <% end %>
29 </div>
30
31 <div id="area_edit_menu" class="menu">
32   <ul>
33     <% Editors::ALL_EDITORS.each do |editor| %>
34       <li><%= link_to t('layouts.edit_with', :editor => t("editor.#{editor}.description")), { :controller => :site, :action => :edit, :editor => editor }, { :id => "#{editor}_area_edit", :class => "geolink bbox" } %></li>
35     <% end %>
36   </ul>
37 </div>
38
39 <div id="object_edit_menu" class="menu">
40   <ul>
41     <% Editors::ALL_EDITORS.each do |editor| %>
42       <li><%= link_to t('layouts.edit_with', :editor => t("editor.#{editor}.description")), { :controller => :site, :action => :edit, :editor => editor }, { :id => "#{editor}_object_edit", :class => "geolink object" } %></li>
43     <% end %>
44   </ul>
45 </div>
46
47 <% if map.instance_of? Changeset or (map.instance_of? Node and map.version > 1) or map.visible? %>
48   <script type="text/javascript">
49     OpenLayers.Lang.setCode("<%= I18n.locale.to_s %>");
50
51     function remoteEditHandler(event, bbox, select) {
52       var left = bbox.left - 0.0001;
53       var top = bbox.top + 0.0001;
54       var right = bbox.right + 0.0001;
55       var bottom = bbox.bottom - 0.0001;
56       var loaded = false;
57
58       $("linkloader").observe("load", function () { loaded = true; });
59
60       if (select) {
61         $("linkloader").src = "http://127.0.0.1:8111/load_and_zoom?left=" + left + "&top=" + top + "&right=" + right + "&bottom=" + bottom + "&select=" + select;
62       } else {
63         $("linkloader").src = "http://127.0.0.1:8111/load_and_zoom?left=" + left + "&top=" + top + "&right=" + right + "&bottom=" + bottom;
64       }
65
66       setTimeout(function () {
67         if (!loaded) alert("<%= escape_javascript(t('site.index.remote_failed')) %>");
68       }, 1000);
69
70       event.stop();
71     }
72
73     function init() {
74       var map = createMap("small_map", {
75         controls: [ new OpenLayers.Control.Navigation() ]
76       });
77
78       <% if map.instance_of? Changeset %>
79         var minlon = <%= map.min_lon / GeoRecord::SCALE.to_f %>;
80         var minlat = <%= map.min_lat / GeoRecord::SCALE.to_f %>;
81         var maxlon = <%= map.max_lon / GeoRecord::SCALE.to_f %>;
82         var maxlat = <%= map.max_lat / GeoRecord::SCALE.to_f %>;
83         var bbox = new OpenLayers.Bounds(minlon, minlat, maxlon, maxlat);
84         var centre = bbox.getCenterLonLat();
85
86         setMapExtent(bbox);
87         addBoxToMap(bbox);
88
89         $("loading").style.display = "none";
90
91         $$("#browse_map .geolink").each(function (link) {
92           link.style.display = "inline";
93         });
94
95         $("remote_area_edit").observe("click", function (event) {
96           remoteEditHandler(event, bbox);
97         });
98
99         <% if preferred_editor == "remote" %>
100           $("area_edit").observe("click", function (event) {
101             remoteEditHandler(event, bbox);
102           });
103         <% end %>
104
105         updatelinks(centre.lon, centre.lat, 16, null, minlon, minlat, maxlon, maxlat)
106       <% elsif map.instance_of? Note %>
107         var centre = new OpenLayers.LonLat(<%= map.lon %>, <%= map.lat %>);
108
109         setMapCenter(centre, 16);
110         addMarkerToMap(centre);
111
112         var bbox = getMapExtent();
113
114         $("loading").style.display = "none";
115
116         $$("#browse_map .geolink").each(function (link) {
117           link.style.display = "inline";
118         });
119
120         $("remote_area_edit").observe("click", function (event) {
121           remoteEditHandler(event, bbox);
122         });
123
124         <% if preferred_editor == "remote" %>
125           $("area_edit").observe("click", function (event) {
126             remoteEditHandler(event, bbox);
127           });
128         <% end %>
129
130         updatelinks(centre.lon, centre.lat, 16, null, bbox.left, bbox.bottom, bbox.right, bbox.top)
131       <% else %>
132         var obj_type = "<%= map.class.name.downcase %>";
133         var obj_id = <%= map.id %>;
134         var obj_version = <%= map.version %>;
135         var obj_visible = <%= map.visible %>;
136         var url = "/api/<%= "#{API_VERSION}" %>/<%= map.class.name.downcase %>/<%= map.id %>";
137
138         if (obj_type != "node") {
139           url += "/full";
140         } else if (!obj_visible) {
141           var previous_version = obj_version - 1;
142           url += "/" + previous_version;
143         }
144
145         addObjectToMap(url, true, function(extent) {
146           $("loading").style.display = "none";
147
148           $$("#browse_map .geolink").each(function (link) {
149             link.style.display = "inline";
150           });
151
152           if (extent) {
153             extent.transform(map.getProjectionObject(), map.displayProjection);
154
155             var centre = extent.getCenterLonLat();
156
157             $("remote_area_edit").observe("click", function (event) {
158               remoteEditHandler(event, extent);
159             });
160
161             <% if preferred_editor == "remote" %>
162               $("area_edit").observe("click", function (event) {
163                 remoteEditHandler(event, extent);
164               });
165             <% end %>
166
167             <% unless map.instance_of? Changeset %>
168               $("remote_object_edit").observe("click", function (event) {
169                 remoteEditHandler(event, extent, "<%= map.class.to_s.downcase + map.id.to_s %>");
170               });
171
172               $("object_larger_map").innerHTML = "<%= t('browse.map.larger.' + map.class.to_s.downcase) %>";
173               $("object_edit").innerHTML = "<%= t('browse.map.edit.' + map.class.to_s.downcase) %>";
174             <% end %>
175
176             updatelinks(centre.lon, centre.lat, 16, null, extent.left, extent.bottom, extent.right, extent.top, "<%= map.class.to_s.downcase %>", <%= map.id %>)
177           } else {
178             $("small_map").style.display = "none";
179           }
180         });
181       <% end %>
182
183       createMenu("area_edit", "area_edit_menu", 1000, "right");
184       createMenu("object_edit", "object_edit_menu", 1000, "right");
185     }
186
187     window.onload = init;
188   </script>
189 <% end %>