update_rack.html

{% extends "base.html" %}
{% block title %} fixcity.org {% endblock %}

{% block extra_header %}

<script type="text/javascript" src="/site_media/openlayers/OpenLayers.js"></script>
<script type="text/javascript">
  // Settings needed by rackmap.js.
  var pointRadius = "10";
  var externalGraphic = "/site_media/img/rack.png";
  var WKT = "{{ request.POST.location|default:rack.location.wkt }}";
  function post_loadmap(map, geom) {
    map.setCenter(geom.getBounds().getCenterLonLat(), 16);
  };
</script>
<script type="text/javascript" src="/site_media/js/rackmap.js"></script>

<script type="text/javascript">
//<![CDATA[
if (jQuery.browser.msie) {
 jQuery(window).load(function() {loadMap();});
} else {
jQuery(document).ready(function() {loadMap();});
}
//]]>
</script>
{% endblock %}
{% block menu %}
{% endblock %}


{% block content %}
<form id="addrack-form" action="." method="POST" enctype="multipart/form-data">
    <label for="address">Street Address</label>
    <div class="required"><input id="address" name="address" type="text"
                                 title="Enter an address or click a point on the map"
                                 value="{{request.POST.address|default:rack.address}}" />
    <input type="hidden" id="location" name="location" value="{{wkt}}" />
        {{ form.address.errors }} {{ form.location.errors }}
    </div>
    <label for="title">Establishment</label>
    <div class="required"><input id="title" name="title" type="text"
                                 title="What are you trying to get to? i.e. Key Foods, PS 121, restaurants"
                                 value="{{request.POST.title|default:rack.title}}"
                           />{{ form.title.errors }}</div>

    <label for="description">Description</label>
      <textarea id="description" name="description"
                  title="Why are bike racks needed here? Other details?">{{ request.POST.description|default:rack.description }}</textarea>
    {{ form.description.errors }}
    <label for="browse">Photo</label>
    {% if rack.photo %}
      <img src="{{rack.photo.extra_thumbnails.large}}" />
      <br />
    {% else %}
      <div>No photo uploaded.</div>
    {% endif %}
    {{ form.photo.errors }}
    
    <div id="photo-wrap">
      <label for="fakebrowseinput">{% if rack.photo %}Replace{% else %}Add{% endif %} Photo</label>
      <input id="browse" name="photo" type="file" value="{{request.FILES.photo.name}}" size="20" />
      <div id="fakebrowse" class="selfclear"><input name="fakebrowseinput" id="fakebrowseinput" type="text" title="JPG, GIF or PNG files - 5MB maximum" /><span class="fakebutton">browse</span></div>
    </div><!-- /#photo-wrap -->
    
    <div id="statement-wrap">
      <label for="statement">Statement of Support <small class="optional">(<a href="/site_media/resources/SupportStatement.pdf">optional</a>)</small></label>
      <input id="statement" name="statement" type="file" value="" size="20" />
      <div id="fakestatement" class="selfclear"><input name="fakestatementinput" id="fakestatementinput" type="text" title="" /><span class="fakebutton">browse</span></div>
    </div><!-- /#statement-wrap -->
     
    <!-- XXX Do we want to update date on edit? -->
    <input type="hidden" name="date" value="{{rack.date}}"/>

    <div id="email-wrap">
     <label>Created By</label>
     <div>{{creator}}</div>
    </div>
    <!-- These flags will trigger server-side processing of location
    if set to zero. We use this to hack around
    the impossibility of knowing if asynch functions have finished
    when the form submits.  Also provides a bit of graceful
    degrading... not like we have a lot of that in a map-heavy
    site. -->
    <input type="hidden" id="geocoded" name="geocoded" value="0" />

    <div id="verified-wrap">
     <label for="verified">Verified</label>
    
    {% if rack.verified %}
     <input type="checkbox" name="verified" checked="checked" />
    {% else %}
     <input type="checkbox" name="verified" />
    {% endif %}
    </div>

    <input type="submit" value="Save" />

<!--  errors for debugging
 {{ form.errors }}
-->
</form>
<div class="suggest">
	<div id="request-map">
	</div>
	<div id="quick-check">
	  <p>Suggestions must have a photo matching the <a class="photo-guidelines" href="#">guidelines</a> and meeting <a class="location-guidelines" href="#">placement requirements</a> to be verified. Support statements are optional for non-residential buildings.</p>
  </div><!-- /#quick-check -->
</div><!-- /#suggest -->
{% endblock %}

{% block lede %}
<h1>Edit Rack</h1>
{% endblock %}

{% block extra_footer %}
<script type="text/javascript">
//<![CDATA[
  jQuery(document).ready(function($) {
    $('input#address, input#title, textarea#description, input#email, input#fakebrowseinput').inlineInfoTextify();
    $('input#browse').change(function( objEvent ){$('#fakebrowseinput').val($(this).val()).removeClass("overlabel");});
    $('input#statement').change(function( objEvent ){$('#fakestatementinput').val($(this).val()).removeClass("overlabel");});
    expandOnce('#photo-wrap', '{% if rack.photo %}Replace{% else %}Add{% endif %} Photo');
    expandOnce('#statement-wrap', 'Add Statement of Support');
    $('textarea#description').maxLength(300);
    $('input#address, input#title, textarea#description, input#fakebrowseinput').infoSuffixify();
//]]>
</script>
{% endblock %}