email experiences and we're done

vurbanism/flyovers/views.py

@@ -1,9 +1,17 @@
 # Create your views here.
 from django.shortcuts import render_to_response
+from django.http import HttpResponse
 from django.shortcuts import get_object_or_404
 from oxdjango.shortcuts import render_to_json_response
+from django.core.mail import send_mail
 from models import *
 
+QUESTIONS = {
+  '1problems': 'What problems do flyover and skywalk projects create?',
+  '2like': 'What do you like about these projects?',
+  '3stories': 'Do you have any stories about flyovers or skywalks in Mumbai or elsewhere?'
+}
+
 def geojson(request):
   features = []
   for f in Flyover.objects.all():
@@ -15,7 +23,8 @@ def geojson(request):
   return render_to_json_response(d)
     
 def index(request):
-  return render_to_response('flyovers.html', {})
+  
+  return render_to_response('flyovers.html', {'questions': QUESTIONS})
 
 def flyover(request):
   i = request.GET['id']
@@ -26,6 +35,21 @@ def flyover(request):
   }
   return render_to_json_response(d)
 
+def email_experiences(request):
+  if not request.POST:
+    return HttpResponse("0")
+  if request.is_ajax():
+    a = request.POST
+    eml_txt = "Name: %s\n Email: %s\n\n" % (a['name'], a['email'],)
+    for key, val in QUESTIONS.items():
+      eml_txt += "%s %s" % (val, a[key],)
+      eml_txt += "\n\n"
+    send_mail("Vertical Urbanism Questions", eml_txt, "do-not-reply@verticalurbanism.com", ['sanjaybhangar@gmail.com', 'andrew.harris@ucl.ac.uk'])
+    return HttpResponse("1")
+  else:
+    return HttpResponse("0")    
+  
+
 def category(request):
   cat_id = request.GET['id']
   cat_type = request.GET['type']

vurbanism/static/css/vurbanism.css

@@ -153,9 +153,6 @@ a img {
   
 }
 
-.navContent {
-  display: none;
-}
 
 .contentWrapper {
   height: 96%;
@@ -167,3 +164,12 @@ a img {
   margin-right: auto;
   font-family: Arial, Verdana, Georgia, sans-serif;
 }
+
+.questionWrapper {
+  margin-bottom: 8px;
+}
+
+.answer textarea {
+  width: 80%;
+  height: 100px;
+}

vurbanism/static/js/vurbanism.js

@@ -200,7 +200,8 @@ $(function() {
     $('.selected').removeClass('selected');
     $('.navSelected').removeClass('navSelected');
     $(this).addClass('navSelected');
-    var html = $('#' + $(this).attr("data-target")).html();
+//    var html = $('#' + $(this).attr("data-target")).html();
+    var html = tmpl('tmpl_' + $(this).attr('data-target'), {});
     $('#media').html(html);    
   });
 
@@ -230,3 +231,16 @@ $('.flyoverImage').live("mouseout", function() {
   mapControl.unselect(currentlySelectedFeature);  
 });
 
+$('#submitQuestions').live("click", function() {
+  $(this).attr("disabled", "disabled");
+  $(this).text("Thanks!");
+  $.post("/email_experiences", {
+    '1problems': $('#1problems').val(),
+    '2like': $('#2like').val(),
+    '3stories': $('#3stories').val(),
+    'name': $('#name').val(),
+    'email': $('#email').val()     
+    }, function(response) {
+    $('#media').html("Thanks! Your response has been emailed to andrew dot harris at ucl.ac.uk");
+  });
+});

vurbanism/templates/flyovers.html

@@ -54,6 +54,58 @@
 </div>
   </script>
 
+<script type="text/html" id="tmpl_about">
+  <div class="navContent" id="about">
+    <div class="contentWrapper about">
+
+<p>This site maps the landscapes of elevated road highways – flyovers – and
+elevated pedestrian walkways – skywalks – across the Mumbai Metropolitan
+Region in Western India.
+
+<p>Both flyovers and skywalks have become a highly visible feature of Mumbai’s
+recent rapid urbanisation. The number of flyovers increased from 13 in 1997
+to over 60 by 2009, while the first skywalks were constructed in 2008. Many
+more projects are ongoing and proposed.
+
+<p>By assembling and categorising photographs, videos, audio-clips and text,
+this site allows users to explore some of the new and diverse urban worlds
+created through flyover and skywalk construction.
+
+<p>All material was collected between April 2009 and January 2010 by Andrew
+Harris with the assistance of Savitri Medhatul. The website was devised by
+Andrew Harris and created by Sanjay Bhangar.The research was funded by
+the UK’s Economic and Social Research Council and the Urban Laboratory of
+University College London.</p>
+      <img src="/static/images/urbanlablogo.jpg" alt="Urban Lab Logo" title="Urban Lab" />
+      <img src="/static/images/esrclogo.jpg" alt="ESRC Logo" title="Economic and Social Research Council" />
+    </div>
+  </div>
+</script>
+
+<script type="text/html" id="tmpl_questions">
+  <div class="navContent" id="questions">
+    <div class="contentWrapper questions">
+    {% for key, value in questions.items %}
+      <div class="questionWrapper">
+        <div class="question">
+          {{ value }}      
+        </div>
+        <div class="answer">
+          <textarea id="{{ key }}"></textarea>
+        </div>
+      </div>
+    {% endfor %}
+
+    <div class="questionWrapper">
+      Name (optional): <input type="text" id="name" /><br />
+      E-Mail (optional): <input type="text" id="email" /><br />
+    </div>
+    <div class="questionWrapper">
+      <button id="submitQuestions">Submit</button>
+    </div>
+ </div>
+</script> 
+
   <div id="wrapper">
     <div id="categories">
       <table>
@@ -100,43 +152,14 @@
     </div>
     <div id="buttons">
       <a class="navButton" href="Javascript:$.noop()" data-target="about" id="aboutBtn">About</a>
-      <a class="navButton" href="Javascript:$.noop()" data-target="questions" id="questionsBtn">Questions</a>
+      <a class="navButton" href="Javascript:$.noop()" data-target="questions" id="questionsBtn">Experiences</a>
     </div>
     <div id="media">
       
     </div>
   </div>
 
-  <div class="navContent" id="about">
-    <div class="contentWrapper about">
 
-<p>This site maps the landscapes of elevated road highways – flyovers – and
-elevated pedestrian walkways – skywalks – across the Mumbai Metropolitan
-Region in Western India.
-
-<p>Both flyovers and skywalks have become a highly visible feature of Mumbai’s
-recent rapid urbanisation. The number of flyovers increased from 13 in 1997
-to over 60 by 2009, while the first skywalks were constructed in 2008. Many
-more projects are ongoing and proposed.
-
-<p>By assembling and categorising photographs, videos, audio-clips and text,
-this site allows users to explore some of the new and diverse urban worlds
-created through flyover and skywalk construction.
-
-<p>All material was collected between April 2009 and January 2010 by Andrew
-Harris with the assistance of Savitri Medhatul. The website was devised by
-Andrew Harris and created by Sanjay Bhangar.The research was funded by
-the UK’s Economic and Social Research Council and the Urban Laboratory of
-University College London.</p>
-      <img src="/static/images/urbanlablogo.jpg" alt="Urban Lab Logo" title="Urban Lab" />
-      <img src="/static/images/esrclogo.jpg" alt="ESRC Logo" title="Economic and Social Research Council" />
-    </div>
-  </div>
-  <div class="navContent" id="questions">
-    <div class="contentWrapper questions">
-      Soon.
-    </div>
-  </div> 
 </body>
 
 </html>

vurbanism/urls.py

@@ -16,6 +16,7 @@ urlpatterns = patterns('',
     (r'^geojson$', 'flyovers.views.geojson'),
     (r'^flyover$', 'flyovers.views.flyover'),
     (r'^category$', 'flyovers.views.category'),
+    (r'^email_experiences$', 'flyovers.views.email_experiences'),
     # Uncomment the next line to enable the admin:
     (r'^admin/', include(admin.site.urls)),
 )