From d5d5c63b558156d562d7aa236293e40a57055ec4 Mon Sep 17 00:00:00 2001
From: Seth Woodworth <seth@sethish.com>
Date: Thu, 21 Mar 2013 17:18:05 -0400
Subject: [PATCH] finish the add course partial form

---
 karmaworld/assets/css/global.css              |  4 +-
 karmaworld/assets/js/lightbox-add-course.js   | 14 ++++-
 karmaworld/templates/courses/course_list.html |  5 +-
 karmaworld/templates/partial/add_course.html  | 56 +++++++++++++++++++
 karmaworld/templates/partial/add_note.html    |  3 +-
 5 files changed, 72 insertions(+), 10 deletions(-)
 create mode 100644 karmaworld/templates/partial/add_course.html

diff --git a/karmaworld/assets/css/global.css b/karmaworld/assets/css/global.css
index c343f48..492bea7 100644
--- a/karmaworld/assets/css/global.css
+++ b/karmaworld/assets/css/global.css
@@ -518,6 +518,8 @@ a.activity_target:hover
 
 #add-note-btn, #add-course-btn, #save-btn
 {
+  border: none;
+  background-color: white;
   color: #f05a28;
   cursor: pointer;
   font: 30px/1.2em "MuseoSlab-300", serif;
@@ -533,7 +535,7 @@ a.activity_target:hover
   cursor: auto;
 }
 
-#add-note-form, #add-course
+#add-note-form, #add-course-form
 {
   display: none;
 }
diff --git a/karmaworld/assets/js/lightbox-add-course.js b/karmaworld/assets/js/lightbox-add-course.js
index 1424ee9..9cd9128 100644
--- a/karmaworld/assets/js/lightbox-add-course.js
+++ b/karmaworld/assets/js/lightbox-add-course.js
@@ -1,7 +1,15 @@
 // setup ajax based autocomplete for the school field in the add course lightbox
 $(function() {
 
-  // Dismiss on exit x click
+  // Show the add-course-form
+  $('#add-course-btn').click(function() {
+    // Show the add a course form
+    $('#add-course-form').show();
+    // Hide the add a course button
+    $('#add-course-btn').hide();
+  });
+
+  // Dismiss on exit x click FIXME
   $(".lightbox_close").click(function() {
     $(".modal_content").hide();
   });
@@ -13,7 +21,7 @@ $(function() {
       beforeSend: function(xhr, settings) {
         if (!(/^http:.*/.test(settings.url) || /^https:.*/.test(settings.url))) {
           // Only send the token to relative URLs i.e. locally.
-          xhr.setRequestHeader("X-CSRFToken", '{{ csrf_token }}');
+          xhr.setRequestHeader("X-CSRFToken", csrf_token);
         }
       }
     });
@@ -24,7 +32,7 @@ $(function() {
   $("#str_school").autocomplete({
     source: function(request, response){
       $.ajax({
-        url: "{% url 'json_school_list' %}",
+        url: json_course_list,
         data: {q: request.term},
         success: function(data) {
           console.log(data);
diff --git a/karmaworld/templates/courses/course_list.html b/karmaworld/templates/courses/course_list.html
index 240f8fa..d0307b9 100644
--- a/karmaworld/templates/courses/course_list.html
+++ b/karmaworld/templates/courses/course_list.html
@@ -83,10 +83,6 @@ $(document).ready(function() {
 </script>
 {% endblock %}
 
-{% block lightboxen %}
-  {% include 'lightbox/add_course.html' %}
-{% endblock %}
-
 {% block content %}
 <section id="home_content">
   <div id="page_header" class="">
@@ -142,6 +138,7 @@ $(document).ready(function() {
       <div id="add-course-btn">
         <i class=icon-upload></i> add a course
       </div>
+        {% include 'partial/add_course.html' %}
     </div><!-- .ten columns -->
   </div> <!-- .row -->
 
diff --git a/karmaworld/templates/partial/add_course.html b/karmaworld/templates/partial/add_course.html
new file mode 100644
index 0000000..edfcb97
--- /dev/null
+++ b/karmaworld/templates/partial/add_course.html
@@ -0,0 +1,56 @@
+{% load url from future %}
+<script>
+  var json_course_list = "{% url 'json_school_list' %}"
+  var csrf_token = "{{ csrf_token }}";
+</script>
+<script src="{{ STATIC_URL }}js/lightbox-add-course.js"></script>
+
+<section id="add-course-form">
+  <form method="POST" action="{% url 'api_course_post' %}">
+  {% csrf_token %}
+
+    <div class="row">
+      <div class="ten columns offset-by-one end">
+        <legend>
+          School
+        </legend>
+        <div>
+          <input id="str_school" class="" type="text" name="str_school"/>
+          <input id="id_school" name="school" type='hidden'/>
+        </div>
+      </div>
+    </div> <!-- .row -->
+
+    <div class="row">
+      <div class="ten columns offset-by-one end">
+        <legend> Title of Course: </legend>
+        <input id="id_name" class="" type="text" name="name" maxlength="255" />
+      </div>
+    </div> <!-- .row -->
+
+    <div class="row">
+      <div class="five columns offset-by-one">
+        <legend class="">
+          Instructor Name:
+        </legend><!-- -->
+        <input id="id_instructor_name" class="" type="text" name="instructor_name" maxlength="75" />
+      </div>
+
+      <div class="five columns end">
+        <legend class="">
+          Instructor Email:
+        </legend>
+        <input id="id_instructor_email" class="" type="text" name="instructor_email" maxlength="75" />
+      </div><!--  -->
+    </div> <!-- .row .lightbox_row -->
+
+    <div class="row">
+      <div class="three columns centered">
+        <button id="save-btn">
+          <i class=icon-save></i> Save
+        </div>
+      </div>
+    </div>
+
+  </form>
+</section>
diff --git a/karmaworld/templates/partial/add_note.html b/karmaworld/templates/partial/add_note.html
index 3e93632..f9a2ecd 100644
--- a/karmaworld/templates/partial/add_note.html
+++ b/karmaworld/templates/partial/add_note.html
@@ -8,6 +8,7 @@
   <div id=file-uploader style="display:none"></div>
   <form id=add-note method="POST">
     {% csrf_token %}
+
     <div class="row">
       <div class="four columns offset-by-one">
         <legend><span id=add-note-status>Uploading</span> <span id=filename>note</span>...</legend>
@@ -37,8 +38,6 @@
       </div>
     </div>
 
-
-
     <div class="row">
       <div class="three columns centered">
         <div id="save-btn">
-- 
2.25.1