]> git.openstreetmap.org Git - rails.git/blob - app/views/user/account.rhtml
Make the map on the user account page work.
[rails.git] / app / views / user / account.rhtml
1 <h2>User details</h2>
2 <%= error_messages_for 'user' %>
3 <% form_tag :controller => 'user', :action => 'account', :display_name => @user.display_name do %>
4 <table style="width : 100%">
5   <tr><td>Name</td><td><%= @user.email %></td></tr>
6   <tr><td>Mapper since</td><td><%= @user.creation_time %> (<%= time_ago_in_words(@user.creation_time) %> ago)</td></tr>
7   <tr><td>Display Name</td><td><%= text_field :user, :display_name, :value => @user.display_name %></td></tr>
8   <tr><td>Password</td><td><%= password_field('user', 'pass_crypt',{:value => '', :size => 50, :maxlength => 255}) %></td></tr>
9   <tr><td>Confirm Password</td><td><%= password_field('user', 'pass_crypt_confirmation',{:value => '', :size => 50, :maxlength => 255}) %></td></tr>
10   <tr id="homerow" <% unless @user.home_lat and @user.home_lon %> class="nohome" <%end%> ><td>Your home</td><td><em class="message">You have not entered your home location.</em><span class="location">Latitude: <%= text_field :user, :home_lat, :value => @user.home_lat, :size => 20, :id => "home_lat" %> Longitude <%= text_field :user, :home_lon, :value => @user.home_lon, :size => 20, :id => "home_lon" %></span>  </td></tr>
11
12   <tr><td></td><td>
13   <p>Update home location when I click on the map? <input type="checkbox" value="1" <% unless @user.home_lat and @user.home_lon %> checked="checked" <% end %> id="updatehome" /> </p>
14   <div id="map" style="border: 1px solid black; position: relative; width : 90%; height : 300px;">
15     <% # This now just used to detect the width/height required for the popup. %>
16     <p id="highlightinfo"></p>
17   </div>
18   </td></tr>
19
20   <tr><td valign="top">Description</td><td><%= text_area :user, :description, :value => @user.description, :class => "editDescription" %></td></tr>
21 </table>
22 <%= submit_tag 'Save Changes' %>
23 <% end %>
24
25 <% nearest_str = "" %>
26 <% if @user.home_lat and @user.home_lon %>
27     <h2>Users in your area</h2>
28
29     <% if @user.nearby.empty? %>
30     There are no users who admit to mapping in your area.  Better go out and spread the word about OSM!
31     <% else %>
32
33     <p>These users are mapping in your area:</p>
34     <table>
35     <tr>
36     <th>Name</th>
37     <th>Contact</th>
38     </tr>
39     <% @user.nearby(1,1).each do |nearby| %>
40     <% nearest_str += "nearest.push( { 'display_name' : '#{nearby.display_name}', 'home_lat' : #{nearby.home_lat}, 'home_lon' : #{nearby.home_lon} } );\n" %>
41
42     <tr>
43     <td><%= link_to nearby.display_name, :controller => 'user', :action => 'view',  :display_name => nearby.display_name %></td>
44     <td><%= link_to 'send message', :controller => 'message', :action => 'new', :user_id => nearby.id %></td>
45     </tr>
46     <%end%>
47     </table>
48
49     <%end%>
50     <br />
51 <% end %>
52 <script type="text/javascript">
53     var nearest = [], friends = [];
54     <%= nearest_str %>
55 </script>
56
57 <% if @user.home_lat and @user.home_lon %>
58     <% marker = true %>
59     <% mlon = @user.home_lon %> 
60     <% mlat = @user.home_lat %>
61     <% lon =  @user.home_lon %>
62     <% lat =  @user.home_lat  %>
63     <% zoom =  '12' %>
64 <script type="text/javascript">
65   var mlat = <%= mlat %>;
66   var mlon = <%= mlon %>;
67 </script>
68 <% else %>
69     <% lon =  params['lon'] || '-0.1' %>
70     <% lat =  params['lat'] || '51.5' %>
71     <% zoom =  params['zoom'] || '4' %> 
72 <% end %>
73
74
75
76 <script type="text/javascript">
77   var lat = <%= lat %>;
78   var lon = <%= lon %>;
79   var zoom = <%= zoom %>;
80   var PI = 3.14159265358979323846;
81
82
83
84   <% if params['scale'] and params['scale'].length > 0 then %>
85   zoom = Math.log(360.0/(( <% print params['scale'].to_f() %> ) * 512.0)) / Math.log(2.0);
86   <% end %>
87   zoom = zoom;
88   lon = lon * 20037508.34 / 180;
89   lat = Math.log(Math.tan( (90 + lat) * PI / 360)) / (PI / 180);
90   lat = lat * 20037508.34 / 180;
91   <% if marker %>
92   mlon = mlon * 20037508.34 / 180;
93   mlat = Math.log(Math.tan( (90 + mlat) * PI / 360)) / (PI / 180);
94   mlat = mlat * 20037508.34 / 180;
95   <%end%>
96
97 </script>
98 <script type="text/javascript" src="/openlayers/OpenLayers.js"></script>
99
100 <script type="text/javascript">
101   <!--
102   var map, layer, markers, marker, popup;
103
104   function mercator2lonlat( merc ) {
105     var lon_deg = (merc.lon / 20037508.34) * 180;
106     var lat_deg = (merc.lat / 20037508.34) * 180;
107     var PI = 3.14159265358979323846;
108     lat_deg = 180/PI * (2 * Math.atan(Math.exp(lat_deg * PI / 180)) - PI / 2);
109     return new OpenLayers.LonLat(lon_deg,lat_deg);
110   }
111
112   function lonlat2mercator( ll ) {
113       var lon = ll.lon * 20037508.34 / 180;
114       var lat = Math.log(Math.tan( (90 + ll.lat) * PI / 360)) / (PI / 180);
115       lat = lat * 20037508.34 / 180;
116       return new OpenLayers.LonLat(lon,lat);
117   }
118
119   function init(){
120
121     OpenLayers.Util.onImageLoadError = function() {
122       this.src = OpenLayers.Util.getImagesLocation() + "404.png";
123     }
124     map = new OpenLayers.Map( "map", 
125         {maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34), maxZoomLevel:18, maxResolution:156543, units:'meters', projection: "EPSG:41001"} );
126     layer = new OpenLayers.Layer.TMS( "Mapnik", "http://tile.openstreetmap.org/", {type:'png', getURL:getTileURL} );
127     map.addLayer(layer);
128     layer = new OpenLayers.Layer.TMS( "Osmarender", "http://dev.openstreetmap.org/~ojw/Tiles/tile.php/", {type:'png', getURL:getTileURL} );
129     map.addLayer(layer);
130
131     //Marker stuff
132
133     markers = new OpenLayers.Layer.Markers("markers");
134     map.addLayer(markers); 
135
136     <% if marker %>
137     marker = new OpenLayers.Marker(new OpenLayers.LonLat(mlon,mlat));
138     marker.events.register("click", "marker", markerOnClick );
139     markers.addMarker(marker);
140     <%end%>
141
142     var near_icon = OpenLayers.Marker.defaultIcon();
143     near_icon.url = OpenLayers.Util.getImagesLocation() + "marker-green.png";;
144     var i = nearest.length;
145     while( i-- ) {
146         var nearmarker = new OpenLayers.Marker( lonlat2mercator( new OpenLayers.LonLat( nearest[i].home_lon, nearest[i].home_lat ) ), near_icon.clone() );
147         markers.addMarker( nearmarker );
148         nearmarker.events.register("click", "nearmarker", makeMarkerFunction( i ) );
149     }
150
151     map.addControl(new OpenLayers.Control.LayerSwitcher());
152     map.setCenter(new OpenLayers.LonLat(lon, lat), zoom);
153
154     map.events.register("click", map, setHome);
155   }        
156
157   function getTileURL( bounds ) {
158     var res = this.map.getResolution();
159     var x = Math.round ((bounds.left - this.maxExtent.left) / (res * this.tileSize.w));
160     var y = Math.round ((this.maxExtent.top - bounds.top) / (res * this.tileSize.h));
161     var z = this.map.getZoom();
162     return this.url + z + "/" + x + "/" + y + "." + this.type; 
163   }
164
165   function makeMarkerFunction( i ) {
166     return function() { markerOnClick( i ); };
167   }
168
169   function markerOnClick( i ) {
170     var html, position;
171     if( typeof( i ) == 'number'  ) {
172         html = '<p>Nearby mapper: <a href="/user/'+nearest[i].display_name+'">'+nearest[i].display_name+'</a></p>';
173         html += '<p style="text-align:right">(<a href="#" onclick="return closePopup();">close</a>)</p>';
174         position = lonlat2mercator( new OpenLayers.LonLat( nearest[i].home_lon, nearest[i].home_lat ) );
175     } else {
176         html = '<p>Your location (<a href="#" onclick="return closePopup()">close</a>)</p>';
177         position = new OpenLayers.LonLat(mlon,mlat);
178     }
179     var box = document.getElementById( 'highlightinfo' );
180     box.innerHTML = html;
181     closePopup();
182     popup = new OpenLayers.Popup.AnchoredBubble( 'popup', position, new OpenLayers.Size( box.offsetWidth, box.offsetHeight ), html, OpenLayers.Marker.defaultIcon(), true );
183     map.addPopup( popup );
184   }
185   
186     function closePopup() {
187         if( popup ) {
188             map.removePopup( popup );
189             delete popup;
190         }
191         return false;
192     }
193
194     function setHome( e ) { 
195         closePopup();
196         if( ! document.getElementById( 'updatehome' ).checked )
197             return;
198         var lonlat = map.getLonLatFromViewPortPx(e.xy)
199
200         var lon_deg = (lonlat.lon / 20037508.34) * 180;
201         var lat_deg = (lonlat.lat / 20037508.34) * 180;
202         var PI = 3.14159265358979323846;
203         lat_deg = 180/PI * (2 * Math.atan(Math.exp(lat_deg * PI / 180)) - PI / 2);
204         var homerow = document.getElementById( 'homerow' );
205         var home_lat = document.getElementById( 'home_lat' );
206         var home_lon = document.getElementById( 'home_lon' );
207         homerow.className = '';
208         home_lat.value = lat_deg;
209         home_lon.value = lon_deg;
210         if( marker ) {
211             markers.removeMarker(marker);
212         }
213         marker = new OpenLayers.Marker(lonlat);
214         markers.addMarker(marker);
215     }
216 window.onload = init;
217 // -->
218 </script>
219
220 <h2>Privacy</h2>
221 <% if @user.data_public? %>
222   All your edits are public.
223 <% else %>
224   Currently your edits are anonymous and people can't find out where you are located. To show what you edited and allow people to contact you through the website, click the button below. This action cannot be reversed.
225   <br /><br />
226   <% form_tag :controller => 'user', :action => 'go_public' do %>
227   <%= submit_tag 'Make all my edits public, forever' %>
228   <% end %>
229 <% end %>