Add option "none" for mutiple check and images. Issue #3823

7 files changed, 106 insertions, 4 deletions

diff --git a/webapp/js_tests/spec/DynamicStructureSpec.js b/webapp/js_tests/spec/DynamicStructureSpec.js
index edf0d66..f35a93d 100644
--- a/webapp/js_tests/spec/DynamicStructureSpec.js
+++ b/webapp/js_tests/spec/DynamicStructureSpec.js
@@ -270,6 +270,41 @@ describe("", function() {
 
         });
 
+        describe("Option none", function() {
+
+            it("should have a none attribute with value True", function() {
+
+                jasmine.getFixtures().fixturesPath = "fixtures/";
+                loadFixtures("container.html");
+
+                var option_mustache_template = $.ajax({
+                    type: "GET",
+                    url: '/jasmine/mustache_templates/option.html',
+                    cache: false,
+                    async: false
+                }).responseText;
+                $("#jasmine-fixtures").append(option_mustache_template);
+
+                Mustache.tags = ['[[', ']]'];
+
+                // Preparing mustache TEMPLATES
+                $('script[type="text/x-mustache-template"]').each(function(i, obj){
+                    TEMPLATES[$(obj).attr('name')] = $(obj).text();
+                });
+
+                factoryOption("1", {none: 'True'}, container, "0", "0");
+
+                options = container.children();
+                option_1_none = options.find(
+                    "[name='groups.0.fields.0.options.1.none']")[0];
+
+                expect(option_1_none).not.toBeUndefined();
+                expect($(option_1_none).val()).toBe('True');
+
+            });
+
+        });
+
         describe("TextInput widget type options", function() {
 
             it("option widget has an order", function() {
diff --git a/webapp/polls/models.py b/webapp/polls/models.py
index 005cac5..e6f3813 100644
--- a/webapp/polls/models.py
+++ b/webapp/polls/models.py
@@ -445,6 +445,7 @@ class Option(AbstractObject, ComponentStructure):
         self.img = data.get('img', None)
         self.img_name = data.get('img_name', None)
         self.order = data.get('order', None)
+        self.none = data.get('none', None)
 
         weight = data.get('weight', None)
         self.weight = int(weight) if weight else weight
@@ -531,6 +532,9 @@ class Option(AbstractObject, ComponentStructure):
         if self.weight is not None and self.weight != '':
             data[self.id].update({'weight': self.weight})
 
+        if self.none:
+            data[self.id].update({'none': self.none})
+
         return data
 
 
diff --git a/webapp/polls/templates/mustache/option.html b/webapp/polls/templates/mustache/option.html
index c303a0c..2076d6e 100644
--- a/webapp/polls/templates/mustache/option.html
+++ b/webapp/polls/templates/mustache/option.html
@@ -22,6 +22,13 @@
             name="groups.[[ group_order ]].fields.[[ field_order ]].options.[[ id ]].order"
             value="[[ order ]]"
             placeholder="order" />
+        [[#none]]
+        <input
+            type="hidden"
+            name="groups.[[ group_order ]].fields.[[ field_order ]].options.[[ id ]].none"
+            value="[[ none ]]"
+            placeholder="none" />
+        [[/none]]
         <button class="WFieldOptions_remove btn btn-danger">
             <i class="icon-trash icon-white"></i>
         </button>
@@ -37,4 +44,15 @@
             </button>
         </div>
     </div>
+</script>
+
+<!-- Template: Add Option None button -->
+<script type="text/x-mustache-template" name="field_add_option_none_button">
+    <div class="WFieldOptionsNone_add_button control-group">
+        <div class="controls">
+            <button class="btn btn-success">
+                <i class="icon-plus-sign icon-white"></i>&nbsp;Agregar opci&oacute;n "ninguna"
+            </button>
+        </div>
+    </div>
 </script>
\ No newline at end of file
diff --git a/webapp/polls/templates/mustache/option_image_thumbnail.html b/webapp/polls/templates/mustache/option_image_thumbnail.html
index ddcdc49..2859020 100644
--- a/webapp/polls/templates/mustache/option_image_thumbnail.html
+++ b/webapp/polls/templates/mustache/option_image_thumbnail.html
@@ -33,6 +33,13 @@
                 name="groups.[[ group_order ]].fields.[[ field_order ]].options.[[ id ]].order"
                 value="[[ order ]]"
                 placeholder="order" />
+            [[#none]]
+            <input
+                type="hidden"
+                name="groups.[[ group_order ]].fields.[[ field_order ]].options.[[ id ]].none"
+                value="[[ none ]]"
+                placeholder="none" />
+            [[/none]]
         </center>
     </div>
 </script>
\ No newline at end of file
diff --git a/webapp/polls/templates/mustache/option_image_upload.html b/webapp/polls/templates/mustache/option_image_upload.html
index f3f6380..477c86f 100644
--- a/webapp/polls/templates/mustache/option_image_upload.html
+++ b/webapp/polls/templates/mustache/option_image_upload.html
@@ -32,6 +32,13 @@
                 name="groups.[[ group_order ]].fields.[[ field_order ]].options.[[ id ]].order"
                 value="[[ order ]]"
                 placeholder="order" />
+            [[#none]]
+            <input
+                type="hidden"
+                name="groups.[[ group_order ]].fields.[[ field_order ]].options.[[ id ]].none"
+                value="[[ none ]]"
+                placeholder="none" />
+            [[/none]]
         </center>
             <span class="btn btn-file">
                 <span class="fileupload-new">Elegir</span>
diff --git a/webapp/polls/tests/option_tests.py b/webapp/polls/tests/option_tests.py
index 30793b5..fe42182 100644
--- a/webapp/polls/tests/option_tests.py
+++ b/webapp/polls/tests/option_tests.py
@@ -143,6 +143,22 @@ class OptionTests(MongoTestCase):
         self.assertTrue('img' in to_python.keys())
         self.assertIsNone(to_python['img'])
 
+    def test_option_none(self):
+        option_id = '1'
+        data = {
+            'none': True,
+            'type': 'img_input',
+            'text': 'text',
+            'weight': '2',
+            'order': '1',
+            'id': option_id
+        }
+        option = Option(data=data)
+
+        to_python = option.to_python()[option_id]
+        self.assertTrue('none' in to_python.keys())
+        self.assertTrue(to_python['none'])
+
     def test_to_python(self):
 
         order = 0
diff --git a/webapp/webapp/static/js/dynamic_structure.js b/webapp/webapp/static/js/dynamic_structure.js
index 33c3371..f9dce19 100644
--- a/webapp/webapp/static/js/dynamic_structure.js
+++ b/webapp/webapp/static/js/dynamic_structure.js
@@ -118,7 +118,8 @@ var factoryImageOptionUpload = function(id, value, container, group_order, field
                 "weight": value['weight'],
                 "group_order": group_order,
                 "field_order": field_order,
-                "order": order || value['order']
+                "order": order || value['order'],
+                "none": value['none'],
             })
         ),
         row_fluid = container.find('.row-fluid');
@@ -160,7 +161,8 @@ var factoryImageOptionThumbnail = function(id, value, container, group_order, fi
                 "weight": value['weight'],
                 "group_order": group_order,
                 "field_order": field_order,
-                "order": order || value['order']
+                "order": order || value['order'],
+                'none': value['none'],
             })
         ),
         row_fluid = container.find('.row-fluid');
@@ -210,7 +212,8 @@ var factoryOption = function(id, value, container, group_order, field_order, ord
                 "weight": value['weight'],
                 "group_order": group_order,
                 "field_order": field_order,
-                "order": order || value['order']
+                "order": order || value['order'],
+                "none": value['none'],
             })
         );
 
@@ -290,7 +293,7 @@ var bindFieldRemoveButton = function(remove_button) {
     });
 };
 
-var bindFieldAddOptionButton = function(add_option_button) {
+var bindFieldAddOptionButton = function(add_option_button, none) {
     $(add_option_button).find("button").on('click', function(event) {
         event.preventDefault();
 
@@ -305,6 +308,10 @@ var bindFieldAddOptionButton = function(add_option_button) {
         OFFSET_OPTION_ID++;
         empty_option_widget = {'name': ''};
 
+        if (none) {
+            empty_option_widget['none'] = 'True';
+        }
+
         // Get current selected widget type for current field
         var current_widget_type = field_widget.find(".WFieldWidgetType").attr('value');
 
@@ -462,6 +469,9 @@ var factoryField = function(order, value) {
     var add_option_button = field_widget.find('.WFieldOptions_add_button');
     bindFieldAddOptionButton(add_option_button);
 
+    var add_option_none_button = field_widget.find('.WFieldOptionsNone_add_button');
+    bindFieldAddOptionButton(add_option_none_button);
+
     // Bind change widget type event
     var widget_types_select_box = field_widget.find('.WFieldWidgetType');
     bindFieldWidgetTypeSelectBox(widget_types_select_box);
@@ -473,6 +483,11 @@ var factoryField = function(order, value) {
         buttons_container.append(add_option_button);
         bindFieldAddOptionButton(add_option_button);
     }
+    if (widget_type && $.inArray(widget_type, ["MultipleCheckBox", "ImageCheckBox"]) != -1) {
+        var add_option_none_button = $(Mustache.render(TEMPLATES['field_add_option_none_button'], {}));
+        buttons_container.append(add_option_none_button);
+        bindFieldAddOptionButton(add_option_none_button, {none: 'True'});
+    }
 
     // Render options
     if ($.inArray(widget_type, WITH_OPTIONS) != -1){