<h2>User details</h2>
<%= error_messages_for 'user' %>
<%= start_form_tag :controller => 'user', :action => 'edit', :display_name => @user.display_name %>
-<table>
- <tr><td>Email</td><td><%= @user.email %></td></tr>
+<table style="width : 100%">
+ <tr><td>Name</td><td><%= @user.email %></td></tr>
<tr><td>Mapper since</td><td><%= @user.creation_time %> (<%= time_ago_in_words(@user.creation_time) %> ago)</td></tr>
<tr><td>Display Name</td><td><%= text_field :user, :display_name, :value => @user.display_name %></td></tr>
<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>
+
+ <tr><td></td><td>
+ <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>
+ <div id="map" style="border: 1px solid black; position: relative; width : 90%; height : 300px;">
+ <% # This now just used to detect the width/height required for the popup. %>
+ <p id="highlightinfo"></p>
+ </div>
+ </td></tr>
+
<tr><td valign="top">Description</td><td><%= text_area :user, :description, :value => @user.description, :class => "editDescription" %></td></tr>
</table>
<%= submit_tag 'Save Changes' %>
<p>These users are mapping in your area:</p>
<table>
<tr>
- <th>Email</th>
<th>Name</th>
<th>Contact</th>
</tr>
<% @user.nearby(1,1).each do |nearby| %>
- <% nearest_str = "nearest.push( { 'display_name' : '#{nearby.display_name}', 'home_lat' : #{nearby.home_lat}, 'home_lon' : #{nearby.home_lon} } )" %>
+ <% nearest_str += "nearest.push( { 'display_name' : '#{nearby.display_name}', 'home_lat' : #{nearby.home_lat}, 'home_lon' : #{nearby.home_lon} } );\n" %>
<tr>
- <td><%= nearby.email %></td>
- <td><%= nearby.display_name %></td>
- <td><%= link_to 'send message', :controller => 'message', :action => 'new', :display_name => nearby.display_name %></td>
+ <td><%= link_to nearby.display_name, :controller => 'user', :action => 'view', :display_name => nearby.display_name %></td>
+ <td><%= link_to 'send message', :controller => 'message', :action => 'new', :user_id => nearby.id %></td>
</tr>
<%end%>
</table>
<%= nearest_str %>
</script>
-
-
-<div id="map" style="border: 1px solid black; position: relative; width : 90%; height : 300px;">
- <h3>Click on the map to (re)set your location</h3>
-</div>
-
<% if @user.home_lat and @user.home_lon %>
<% marker = true %>
<% mlon = @user.home_lon %>
<% mlat = @user.home_lat %>
<% lon = @user.home_lon %>
<% lat = @user.home_lat %>
- <% zoom = '14' %>
+ <% zoom = '12' %>
<script type="text/javascript">
var mlat = <%= mlat %>;
var mlon = <%= mlon %>;
<script type="text/javascript">
<!--
- var map, layer, markers, marker;
-
+ var map, layer, markers, marker, popup;
function mercator2lonlat( merc ) {
var lon_deg = (merc.lon / 20037508.34) * 180;
function init(){
OpenLayers.Util.onImageLoadError = function() {
- this.src = "http://www.openstreetmap.org/javascript/img/404.png";
+ this.src = "http://www.openstreetmap.org/javascripts/img/404.png";
}
map = new OpenLayers.Map( "map",
{maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34), maxZoomLevel:18, maxResolution:156543, units:'meters', projection: "EPSG:41001"} );
<% if marker %>
marker = new OpenLayers.Marker(new OpenLayers.LonLat(mlon,mlat));
+ marker.events.register("click", "marker", markerOnClick );
markers.addMarker(marker);
<%end%>
near_icon.url = OpenLayers.Util.getImagesLocation() + "marker-green.png";;
var i = nearest.length;
while( i-- ) {
- markers.addMarker( new OpenLayers.Marker( lonlat2mercator( new OpenLayers.LonLat( nearest[i].home_lon, nearest[i].home_lat ) ), near_icon ) );
+ var nearmarker = new OpenLayers.Marker( lonlat2mercator( new OpenLayers.LonLat( nearest[i].home_lon, nearest[i].home_lat ) ), near_icon.clone() );
+ markers.addMarker( nearmarker );
+ nearmarker.events.register("click", "nearmarker", makeMarkerFunction( i ) );
}
map.addControl(new OpenLayers.Control.LayerSwitcher());
map.events.register("click", map, setHome);
}
+ function makeMarkerFunction( i ) {
+ return function() { markerOnClick( i ); };
+ }
+
+ function markerOnClick( i ) {
+ var html, position;
+ if( typeof( i ) == 'number' ) {
+ html = '<p>Nearby mapper: <a href="/user/'+nearest[i].display_name+'">'+nearest[i].display_name+'</a></p>';
+ html += '<p style="text-align:right">(<a href="#" onclick="return closePopup();">close</a>)</p>';
+ position = lonlat2mercator( new OpenLayers.LonLat( nearest[i].home_lon, nearest[i].home_lat ) );
+ } else {
+ html = '<p>Your location (<a href="#" onclick="return closePopup()">close</a>)</p>';
+ position = new OpenLayers.LonLat(mlon,mlat);
+ }
+ var box = document.getElementById( 'highlightinfo' );
+ box.innerHTML = html;
+ closePopup();
+ popup = new OpenLayers.Popup.AnchoredBubble( 'popup', position, new OpenLayers.Size( box.offsetWidth, box.offsetHeight ), html, OpenLayers.Marker.defaultIcon(), true );
+ map.addPopup( popup );
+ }
+
+ function closePopup() {
+ if( popup ) {
+ map.removePopup( popup );
+ delete popup;
+ }
+ return false;
+ }
+
function setHome( e ) {
+ closePopup();
+ if( ! document.getElementById( 'updatehome' ).checked )
+ return;
var lonlat = map.getLonLatFromViewPortPx(e.xy)
var lon_deg = (lonlat.lon / 20037508.34) * 180;