Survey editing/taking Javascript and CSS fixes.
authorJames Levy <jamesalexanderlevy@gmail.com>
Sat, 04 Jul 2009 13:53:17 +0200
changeset 2526 8f29bfb9eb52
parent 2525 7df431ddcfd3
child 2527 ce657149b90a
Survey editing/taking Javascript and CSS fixes. This patch adds some cosmetic changes and functional fixes: - UI now removes all of the field content when a field is deleted, - CSS tweaks, and jQuery hack to specialize comment CSS, - fixed JS path in take.html. Reviewed by: Pawel Solyga (with some small changes)
app/soc/content/css/soc-090627.css
app/soc/content/js/survey-edit-090703.js
app/soc/content/js/survey-take-090627.js
app/soc/templates/soc/survey/take.html
app/soc/views/helper/surveys.py
--- a/app/soc/content/css/soc-090627.css	Sat Jul 04 12:07:27 2009 +0200
+++ b/app/soc/content/css/soc-090627.css	Sat Jul 04 13:53:17 2009 +0200
@@ -714,7 +714,8 @@
 }
 
 div #survey_widget a.delete {
-  margin: 0 7px;
+  float:left;
+  margin:-1px 7px;
 }
 
 div #survey_widget th label {
@@ -750,6 +751,28 @@
   max-width:700px;
 }
 
+div #survey_widget td {
+  display: block;
+}
+
+div #survey_widget label {
+  font-size: 18px;
+}
+
+div #survey_widget fieldset select {
+  display:block;
+}
+
+div #survey_widget fieldset textarea,
+div #survey_widget fieldset input {
+  margin: 10px;
+}
+
+div #survey_widget td > fieldset > label {
+  font-size: 11px;
+}
+
+
 #dialog {
   font-size: 62.5%;
 }
--- a/app/soc/content/js/survey-edit-090703.js	Sat Jul 04 12:07:27 2009 +0200
+++ b/app/soc/content/js/survey-edit-090703.js	Sat Jul 04 13:53:17 2009 +0200
@@ -192,7 +192,8 @@
                 });
                 edit_form.append(deleted_input);
               }
-              this_field.remove();
+              this_field.next('tr').remove().end()
+                        .remove();
             }
           }
         );
@@ -572,13 +573,13 @@
                            '" name="required_for_', field_name,
                            '"><option value="True" selected="selected">True',
                            '</option>', '<option value="False">False</option>',
-                           '</select><br/>', '<label for="comment_for_',
+                           '</select>', '<label for="comment_for_',
                            field_name, '">Allow Comments</label>',
                            '<select id="comment_for_', field_name,
                            '" name="comment_for_', field_name, '">',
                            '<option value="True" selected="selected">',
                            'True</option>', '<option value="False">',
-                           'False</option>', '</select><br/>',
+                           'False</option>', '</select>',
                           "<input type='text' ",
                            "class='short_answer'>", "</fieldset>"
                           ].join("");
@@ -592,13 +593,13 @@
                            '" name="required_for_', field_name,
                            '"><option value="True" selected="selected">True',
                            '</option>', '<option value="False">False</option>',
-                           '</select><br/>', '<label for="comment_for_',
+                           '</select>', '<label for="comment_for_',
                            field_name, '">Allow Comments</label>',
                            '<select id="comment_for_', field_name,
                            '" name="comment_for_', field_name, '">',
                            '<option value="True" selected="selected">',
                            'True</option>', '<option value="False">',
-                           'False</option>', '</select><br/>',
+                           'False</option>', '</select>',
                            "<textarea cols='40' rows='", MIN_ROWS,
                            "' class='long_answer'/>", '</fieldset>'
                           ].join("");
@@ -638,12 +639,12 @@
                   '<select id="required_for_', name, '" name="required_for_',
                   name, '"><option value="True" selected="selected">True',
                   '</option>', '<option value="False">False</option>',
-                  '</select><br/>', '<label for="comment_for_', name,
+                  '</select>', '<label for="comment_for_', name,
                   '">Allow Comments</label>', '<select id="comment_for_', name,
                   '" name="comment_for_', name, '">',
                   '<option value="True" selected="selected">True</option>',
                   '<option value="False">False</option>',
-                  '</select><br/>',
+                  '</select>',
                   '<label for="render_for_', name,
                   '">Render as</label>', '\n  <select id="render_for_', name,
                   '" name="render_for_', name, '">', '\n    <option',
@@ -726,7 +727,7 @@
                   'for',
                   'id_' + formatted_name
                 )
-                .append(question_content + ":").end()
+                .append(question_content).end()
                 .find(
                   'td'
                 )
--- a/app/soc/content/js/survey-take-090627.js	Sat Jul 04 12:07:27 2009 +0200
+++ b/app/soc/content/js/survey-take-090627.js	Sat Jul 04 13:53:17 2009 +0200
@@ -19,9 +19,9 @@
 * @author <a href="mailto:jamesalexanderlevy@gmail.com">James Levy</a>
 */
 
-(function ($) {
+(function ($) { 
   $(function () {
-
+  
     /*
     * == Setup Survey on Page Load ==
     *
@@ -148,5 +148,18 @@
         );
       }
     );
+  
+   /*
+   * == Customize Comment Appearance ==
+   */
+   
+   var comments = widget.find('td > .comment');
+   comments.each(function(){
+     $(this).parents('tr:first')
+           .css({'margin-top': '-10px', 'margin-bottom': '10px'})
+           .prev().css({'margin-top': '-10px'})
+           .find('label').css({'font-size': '11px'});
+   });
+    
   });
 }(jQuery));
--- a/app/soc/templates/soc/survey/take.html	Sat Jul 04 12:07:27 2009 +0200
+++ b/app/soc/templates/soc/survey/take.html	Sat Jul 04 13:53:17 2009 +0200
@@ -16,7 +16,7 @@
 {% block scripts %}
 {{ block.super }}
 <script type="text/javascript" src="/soc/content/js/survey-default-text-090627.js"></script>
-<script type="text/javascript" src="/soc/content/survey-take-090627.js"></script>
+<script type="text/javascript" src="/soc/content/js/survey-take-090627.js"></script>
 <script type="text/javascript" src="/jquery/jquery-growfield.js"></script>
 {% endblock %}
 
--- a/app/soc/views/helper/surveys.py	Sat Jul 04 12:07:27 2009 +0200
+++ b/app/soc/views/helper/surveys.py	Sat Jul 04 13:53:17 2009 +0200
@@ -56,7 +56,7 @@
      >True</option>
     <option value="False" {% if not is_required %} selected='selected'
      {% endif %}>False</option>
-  </select><br/>
+  </select>
 
   <label for="comment_for_{{ name }}">Allow Comments</label>
   <select id="comment_for_{{ name }}" name="comment_for_{{ name }}">
@@ -64,7 +64,7 @@
      >True</option>
     <option value="False" {% if not has_comment %} selected='selected'
      {% endif %}>False</option>
-  </select><br/>
+  </select>
 """
 
 
@@ -379,9 +379,10 @@
       attrs: the attrs for the widget
       tip: tooltip text for this field
     """
+    attrs['class'] = 'comment'
     widget = widgets.Textarea(attrs=attrs)
-    comment_field = CharField(help_text=tip, required=False, label='Comments',
-                              widget=widget, initial=comment)
+    comment_field = CharField(help_text=tip, required=False, 
+        label='Add a Comment (optional)', widget=widget, initial=comment)
     self.survey_fields[COMMENT_PREFIX + field] = comment_field