mapknitter/app/views/map/_new.html.erb

<div class="well">
  <h3 style="margin-top:0;">Make a new map</h3>

  <% unless logged_in? %><p>We strongly prefer that you <a href="/login">log in</a> or <a href="http://publiclab.org/signup">sign up for a Public Lab account</a> before making a map. However, if you wish to remain anonymous for privacy reasons, <a href="javascript:void();" onClick='$("#new-map-form").toggle();'>click here</a>.</p><% end %>

  <% unless logged_in? %>
    <div id="new-map-login">
    <% form_tag(session_path, {:class => "form"}) do -%>
 
      <%= text_field_tag 'login', @login, {:placeholder => "username"} %>
      <br />
      <input type="hidden" name="return_to" value="<%= params[:return_to] %>" />
     
      <%= submit_tag 'Log in', {:class => "btn btn-primary btn-large"} %>
      &nbsp; <%= check_box_tag 'remember_me', '1', @remember_me %><%= label_tag 'remember_me', 'Remember me', {:class => "checkbox inline", :style => "padding-left:5px;"} %>
    <% end %>
    </div>
  <% end %>

  <% unless logged_in? %>
    <hr />
    <div id="new-map-form" style="display:none;">
  <% end %>

  <% form_for :map, :html => {:id => "new_map", :class => "map"} do |f| %>

    <%= errors_for @map, "Oops, we were unable to save your map." %>  

    <label for="name">Map title/URL (you won't be able to change this)</label>
    <input class="text" type="text" name="name" value="<%= params[:name] %>" id="name">
    <label for="location">Place (to enter lat/lon, <a href="javascript:void(0);" onClick="$('#lat_lon').toggle()">click here</a>)</label>
    <input class="text" type="text" name="location" value="<%= params[:location] || 'Paris, France' %>" id="new_map_place">
    <div id="geocode_results">
      
    </div>
    <style>
    .ui-autocomplete {
      background-color: white;
      width: 300px;
      border: 1px solid #cfcfcf;
      list-style-type: none;
      padding-left: 0px;
    }
    </style>
    <script>
      /* JQuery search as you type
      * Overrides the action and method of the form
      *
      */
        var geocoder = new google.maps.Geocoder();

        $(document).ready(function() { 

          $("#new_map_place").autocomplete({
            //This bit uses the geocoder to fetch address values
            source: function(request, response) {
              geocoder.geocode( {'address': request.term }, function(results, status) {
                response($.map(results, function(item) {
                  return {
                    label:  item.formatted_address,
                    value: item.formatted_address,
                    latitude: item.geometry.location.lat(),
                    longitude: item.geometry.location.lng()
                  }
                }));
              })
            },
            //This bit is executed upon selection of an address
            select: function(event, ui) {
              $("#latitude").val(ui.item.latitude);
              $("#longitude").val(ui.item.longitude);
              //var location = new google.maps.LatLng(ui.item.latitude, ui.item.longitude);
              //marker.setPosition(location);
              //map.setCenter(location);
            }
          });

          });

    </script>
    <div id="lat_lon" style="display:none;">
      <p style='font-size:10px;font-family:lucida grande,lucida sans console,sans-serif;'>
        In decimal degress, i.e. '72.222 or -142.03441'</p>
      <label for="latitude">Latitude</label>
      <input id="latitude" type="text" name="latitude" />
      <label for="longitude">Longitude</label>
      <input id="longitude" type="text" name="longitude" />
    </div>
    <% if !logged_in? %>
      <label for="author">Author</label>
      <input class="text" type="text" name="author" value="<%= params[:author] || 'anonymous' %>" id="author">
      <label for="email">Email address</label>
      <input class="text" type="text" name="email" value="<%= params[:email] || '' %>" id="email">
    <% end %>
    <% if Rails.env.production? && !logged_in? %><p><%= recaptcha_tags :display => {:theme => "white"} %></p><% end %>
    <label for="description">Description (will be shown in an overlay on the map)</label>
    <textarea name="description" rows="8" cols="24"></textarea>
    
    <!--<label for="password">Password (optional)</label><br />
    <input class="text" type="password" name="password" value="" id="password"><br />-->
    
    <br />
    <label for="license">Allow others to use your map by dedicating it to the public domain or licensing it with an <a href="http://publiclaboratory.org/wiki/licenses">open source license</a></label>
    <select name="license">
      <option value="publicdomain">Public Domain</option>
      <option value="cc-by">Creative Commons Attribution</option>
      <option value="copyright">No license; copyright only</option>
    </select>

    <br />
    <label for="license">Select a background layer to stitch against. You'll be able to switch later.</label>
    <select name="tiles">
      <option value="google">Google Maps</option>
      <option value="bing">Bing Maps</option>
      <option value="mapbox">MapBox OpenStreetMap</option>
      <option value="osm">OpenStreetMap</option>
    </select>

    <p><input class="btn btn-large btn-primary" type="submit" value="Begin"></p>

  <% unless logged_in? %></div><% end %>
  <% end %>

</div>