Mercurial > public > sg101
changeset 702:1fd0f88480bc
Finalize user photos detail page. Disable upload button on form submit.
| author | Brian Neal <bgneal@gmail.com> |
|---|---|
| date | Sat, 14 Sep 2013 18:31:39 -0500 |
| parents | 094492e66eb9 |
| children | d7a0aaabc06c |
| files | sg101/templates/user_photos/photo_detail.html sg101/templates/user_photos/upload_form.html static/icons/picture_add.png |
| diffstat | 3 files changed, 53 insertions(+), 11 deletions(-) [+] |
line wrap: on
line diff
--- a/sg101/templates/user_photos/photo_detail.html Sat Sep 14 17:23:13 2013 -0500 +++ b/sg101/templates/user_photos/photo_detail.html Sat Sep 14 18:31:39 2013 -0500 @@ -1,18 +1,59 @@ {% extends 'base.html' %} {% block title %}User Photo Details{% endblock %} +{% block custom_js %} +<script> + $(document).ready(function() { + $("input[type='text']").click(function() { + $(this).select(); + }); + }); +</script> +{% endblock %} {% block content %} <h2>User Photo Details</h2> -<ul> - <li>Uploader: {{ object.user.username }}</li> - <li>Upload date: {{ object.upload_date|date }}</li> -</li> - <div> - <img src="{{ object.thumb_url }}" alt="thumbnail" /> + <a href="{{ object.url }}" title="Click to view full size"> + <img src="{{ object.thumb_url }}" alt="thumbnail" /></a> </div> -<div> - <img src="{{ object.url }}" alt="photo" /> -</div> +<h3>Photo Details</h3> +<table> +<tr> + <th>Uploader:</th> + <td>{{ object.user.username }}</td> +</tr> +<tr> + <th>Date:</th> + <td>{{ object.upload_date|date }}</td> +</tr> +</table> + +<h3>Image Codes</h3> +<p> +Use the SG101 code on this site. The BB Code will work on many other forums. +The direct link is useful for email. +</p> + +<table> +<tr> + <th>SG101 Code:</th> + <td><input type="text" class="title" value="" /></td> +</tr> +<tr> + <th>BB Code:</th> + <td><input type="text" class="title" value="[img]{{ object.url }}[/img]" /></td> +</tr> +<tr> + <th>Direct Link:</th> + <td><input type="text" class="title" value="{{ object.url }}" /></td> +</tr> +</table> + +<p> +<img src="{{ STATIC_URL }}icons/picture_add.png" alt="Photo" /> +<a href="{% url 'user_photos-upload' %}">Upload another photo</a> +</p> + + {% endblock %}
--- a/sg101/templates/user_photos/upload_form.html Sat Sep 14 17:23:13 2013 -0500 +++ b/sg101/templates/user_photos/upload_form.html Sat Sep 14 18:31:39 2013 -0500 @@ -9,11 +9,12 @@ resize your photo for you. When the process is complete we will return an image code you can paste into your post to display your photo. </p> - <form action="." method="post" enctype="multipart/form-data">{% csrf_token %} + <form action="." method="post" enctype="multipart/form-data" + onsubmit="submit.disabled = true; submit.value = 'Please wait...'; return true;">{% csrf_token %} <fieldset> <legend>Upload a photo:</legend> {{ form.as_p }} - <p><input type="submit" value="Upload Photo" /></p> + <p><input type="submit" name="submit" value="Upload Photo" /></p> </fieldset> </form> {% else %}