Improve form layout

diff --git a/karmaworld/apps/courses/forms.py b/karmaworld/apps/courses/forms.py
index da68634492cbd554f6d504aeb6671ad12e85d981..d15bcda0112643767b031587181a84efef709dd6 100644 (file)
--- a/karmaworld/apps/courses/forms.py
+++ b/karmaworld/apps/courses/forms.py
@@ -124,7 +124,7 @@ class CourseForm(NiceErrorModelForm, DependentModelForm):
         # insert honeypot into a random order on the form.
         idx = random.randint(0, len(self.fields))
         self.fields.insert(idx, settings.HONEYPOT_FIELD_NAME,
-            CharField(required=False, label=settings.HONEYPOT_LABEL)
+            CharField(required=False, label=mark_safe(settings.HONEYPOT_LABEL))
         )
 
     class Meta:

diff --git a/karmaworld/apps/courses/views.py b/karmaworld/apps/courses/views.py
index e355525bbb08d028c4bcd957886aa566b47f3b72..08380472f30edf885d48a48d6b5a7b3c79e8917f 100644 (file)
--- a/karmaworld/apps/courses/views.py
+++ b/karmaworld/apps/courses/views.py
@@ -4,7 +4,6 @@
 """ Views for the KarmaNotes Courses app """
 
 import json
-g
 from django.conf import settings
 from django.core import serializers
 from django.core.exceptions import MultipleObjectsReturned
@@ -51,6 +50,7 @@ class CourseListView(View):
             ret = self.get(request, *args, **kwargs)
             # Replace blank form with invalid form.
             ret.context_data['course_form'] = badform
+            ret.context_data['jump_to_form'] = True
         return ret
 
 

diff --git a/karmaworld/assets/css/home.css b/karmaworld/assets/css/home.css
index bec3a491d73a6f85f399f0062798df95d66d35ae..8b0be412f55d218f0a61aff7364c0a4c97636c6f 100644 (file)
--- a/karmaworld/assets/css/home.css
+++ b/karmaworld/assets/css/home.css
@@ -42,3 +42,27 @@ select.course-sort {
   padding: 5px 5px 5px 5px;
 }
 
+#add-course-form p {
+  margin: 0 0 0 0;
+}
+
+#add-course-form .results_on_deck {
+  margin-top: -10px;
+}
+
+.required-field {
+  opacity: 0.5;
+}
+
+ul.validation_error {
+  margin: 0 0 0 0;
+  list-style-type: none;
+}
+
+label.validation_error {
+  color: #F04124;
+}
+
+.add-course-field {
+  min-height: 100px;
+}

diff --git a/karmaworld/settings/common.py b/karmaworld/settings/common.py
index 45569143312e8d48d2aea55feaafb3bc4b779115..5792d31c159e56729591167e6de803088f19e637 100644 (file)
--- a/karmaworld/settings/common.py
+++ b/karmaworld/settings/common.py
@@ -387,7 +387,7 @@ TAGGIT_STOPWORDS = [u'a', u'an', u'and', u'be', u'from', u'of']
 # https://github.com/sunlightlabs/django-honeypot
 HONEYPOT_FIELD_NAME = "instruction_url" # see that "_url"? bots gotta want that.
 HONEYPOT_VALUE = ""
-HONEYPOT_LABEL = "Do not fill in this field (we need to make sure you're not a robot)"
+HONEYPOT_LABEL = "Do not fill in this field <span class='required-field'>(we need to make sure you're not a robot)</span>"
 HONEYPOT_ERROR = "You did not follow directions."
 ########## END HONEYPOT CONFIGURATION
 

diff --git a/karmaworld/templates/courses/course_list.html b/karmaworld/templates/courses/course_list.html
index d817f90e48d854140f22ddcbcc89c413f767cb7b..230684de3106060a5c6fb08e7b668c30143baeeb 100644 (file)
--- a/karmaworld/templates/courses/course_list.html
+++ b/karmaworld/templates/courses/course_list.html
@@ -13,10 +13,7 @@
 {% block pagescripts %}
   <script>
     // If there were form errors, open the form and jump to it
-    var jump_to_form = {% if jump_to_form %}true{% else%}false{% endif %};
-    var json_school_list = "{% url 'json_school_list' %}"
-    var json_school_course_list = "{% url 'json_school_course_list' %}"
-    var json_school_course_instructor_list = "{% url 'json_school_course_instructor_list' %}"
+    var jump_to_form = {% if jump_to_form %} true {% else%} false {% endif %};
     var csrf_token = "{{ csrf_token }}";
     var dataTable_sDom = '<"top">rt<"bottom"p><"clear">';
   </script>

diff --git a/karmaworld/templates/partial/add_course.html b/karmaworld/templates/partial/add_course.html
index fc9327aa56c0b189a2c99a3e3ad760e33460c043..f109a484fb1ec120585c20efdc0b71b517f66a90 100644 (file)
--- a/karmaworld/templates/partial/add_course.html
+++ b/karmaworld/templates/partial/add_course.html
@@ -4,8 +4,11 @@
 
 <section id="add-course-form" class="reveal-modal" data-reveal>
   <a class="close-reveal-modal">&#215;</a>
+
+  <h2>Add a new course to KarmaNotes</h2>
+
   <form method="POST" action="{% url 'home' %}">
-  {% csrf_token %}
+    {% csrf_token %}
 
     {% if course_form.non_field_errors %}
       <div class="row">
@@ -17,7 +20,32 @@
       </div>
     {% endif %}
 
-    {{ course_form.as_p|safe }}
+
+    <div class="row">
+      {% for form in course_form.get_forms.itervalues %}
+        {% for hidden in form.hidden_fields %}
+          {{ hidden }}
+        {% endfor %}
+        {% for field in form.visible_fields %}
+            <div class="small-6 columns add-course-field">
+              {{ field.errors|safe }}
+              <label for="{{ field.id_for_label }}">{{ field.label }}:</label>
+              {{ field }}
+            </div>
+        {% endfor %}
+      {% endfor %}
+
+      {% for hidden in course_form.hidden_fields %}
+        {{ hidden }}
+      {% endfor %}
+      {% for field in course_form.visible_fields %}
+        <div class="small-6 columns end add-course-field">
+          {{ field.errors|safe }}
+          <label for="{{ field.id_for_label }}">{{ field.label }}:</label>
+          {{ field }}
+        </div>
+      {% endfor %}
+    </div>
 
 
     <div class="row">

diff --git a/karmaworld/utils/forms.py b/karmaworld/utils/forms.py
index 4025870613d3b1d69bbbd6f495f93e1223753682..5bb6b11e53c69e244a0926f1e73fc7f7a74158c3 100644 (file)
--- a/karmaworld/utils/forms.py
+++ b/karmaworld/utils/forms.py
@@ -101,7 +101,7 @@ class DependentModelForm(ModelForm):
         self.dependent_modelforms_data = {}
         super(DependentModelForm, self).__init__(*args, **kwargs)
 
-    def _get_forms(self):
+    def get_forms(self):
         """ Memoize dependent form objects. """
         # Determine if there is data.
         with_data = True if self.data else False
@@ -128,7 +128,7 @@ class DependentModelForm(ModelForm):
             selfmedia = superself.media
 
         # search through each dependent form for media
-        for modelform in self._get_forms().itervalues():
+        for modelform in self.get_forms().itervalues():
             if inspect.ismethod(modelform.media):
                 media = modelform.media()
             else:
@@ -148,7 +148,7 @@ class DependentModelForm(ModelForm):
         """ Check all subforms for validity and then this form. """
         all_valid = True
         # Perform validation and error checking for each ModelForm.
-        for attribute, modelform in self._get_forms().iteritems():
+        for attribute, modelform in self.get_forms().iteritems():
             if not modelform.is_valid():
                 all_valid = False
 
@@ -172,7 +172,7 @@ class DependentModelForm(ModelForm):
             return
 
         # create foreign model object and associate it internally here
-        for attribute, modelform in self._get_forms().iteritems():
+        for attribute, modelform in self.get_forms().iteritems():
             # handle ManyToMany versus ForeignKey
             if not is_m2m(self, attribute):
                 # Handle Foreign Key, assign object directly to attribute
@@ -185,7 +185,7 @@ class DependentModelForm(ModelForm):
         # Check for and update any M2M model_fields
         if hasattr(self.instance, 'pk') and self.instance.pk:
             # objects were created during commit. associate M2M now.
-            for attribute, modelform in self._get_forms().iteritems():
+            for attribute, modelform in self.get_forms().iteritems():
                 # handle ManyToMany versus ForeignKey
                 if is_m2m(self, attribute):
                     # use add() to create association between models.
@@ -200,7 +200,7 @@ class DependentModelForm(ModelForm):
                 # call "super"
                 old_save_m2m()
                 # associate M2M objects with self instance
-                for attribute, modelform in self._get_forms().iteritems():
+                for attribute, modelform in self.get_forms().iteritems():
                     # ManyToMany contract test.
                     # use add() to create association between models.
                     objattr = getattr(instance, attribute, None)
@@ -217,7 +217,7 @@ class DependentModelForm(ModelForm):
         """ Render dependent forms prior to rendering this form. """
         html = ''
         # render each form
-        for modelform in self._get_forms().itervalues():
+        for modelform in self.get_forms().itervalues():
             html += getattr(modelform, method)(*args, **kwargs)
         # render this form
         supermethod = getattr(super(DependentModelForm, self), method)