test: should respond a popover with question and option description

5 files changed, 116 insertions, 31 deletions

diff --git a/webapp/coffee/dependency_input.coffee b/webapp/coffee/dependency_input.coffee
index a5d3d1e..d67d430 100644
--- a/webapp/coffee/dependency_input.coffee
+++ b/webapp/coffee/dependency_input.coffee
@@ -21,9 +21,22 @@ class DependencyInput
         Mustache.tags = ['[[', ']]']
         widget = jQuery(Mustache.render @template, context)
         input = $(widget[3])
+        q_value = "ID no identificado"
+        opt_value = "ID inexistente o vacío"
+
+        opt_id = @value
+        opt_name = ".options.#{opt_id}.text"
+        opt_widget = $("input[name$='#{opt_name}']")
+        if opt_widget.length > 0
+            opt_value = opt_widget.val()
+            q_name = opt_widget.attr("name").replace(opt_name, ".name")
+            question_widget = $("input[name='#{q_name}']")
+            if question_widget.length > 0
+                q_value = question_widget.val()
+
         input.popover({
-            title: "title",
-            content: "content"
+            title: q_value,
+            content: opt_value
         })
         return widget
 
diff --git a/webapp/js_tests/spec/DependencyInputSpec.js b/webapp/js_tests/spec/DependencyInputSpec.js
index 28fe3e1..aa94ccc 100644
--- a/webapp/js_tests/spec/DependencyInputSpec.js
+++ b/webapp/js_tests/spec/DependencyInputSpec.js
@@ -36,6 +36,35 @@
       input.click();
       return expect(container).toContain(".popover");
     });
+    return it("should respond a popover with question and option description", function() {
+      var container, dependency_input, field_order, group_order, input, mock_field_order, mock_group_order, mock_option, mock_question, opt_id, opt_name, opt_value, popover_content, popover_title, q_name, q_value, widget;
+      setFixtures('<div id="container"></div>');
+      container = $('#container');
+      mock_group_order = "0";
+      mock_field_order = "0";
+      q_name = "groups." + mock_group_order + ".fields." + mock_field_order + ".name";
+      q_value = "Pregunta";
+      mock_question = "<input type=\"text\" name=\"" + q_name + "\" value=\"" + q_value + "\">";
+      container.append(mock_question);
+      opt_id = "1378749492016";
+      opt_value = "option value";
+      q_name = q_name.replace(".name", "");
+      opt_name = "" + q_name + ".options." + opt_id + ".text";
+      mock_option = "<input type=\"text\" name=\"" + opt_name + "\" value=\"" + opt_value + "\">";
+      container.append(mock_option);
+      group_order = "1";
+      field_order = "1";
+      dependency_input = new DependencyInput(group_order, field_order);
+      dependency_input.value = opt_id;
+      widget = dependency_input.render();
+      container.append(widget);
+      input = container.find("input.dependence_value");
+      input.click();
+      popover_title = $(".popover .popover-title");
+      expect(popover_title).toHaveText(q_value);
+      popover_content = $(".popover .popover-content");
+      return expect(popover_content).toHaveText(opt_value);
+    });
   });
 
 }).call(this);
diff --git a/webapp/js_tests/spec/coffee/DependencyInputSpec.coffee b/webapp/js_tests/spec/coffee/DependencyInputSpec.coffee
index d5b4d21..df1dc60 100644
--- a/webapp/js_tests/spec/coffee/DependencyInputSpec.coffee
+++ b/webapp/js_tests/spec/coffee/DependencyInputSpec.coffee
@@ -1,36 +1,29 @@
 describe "DependencyInput", ->
     it "should render html element", ->
-        expected = """
+        expected_span = """
             <span class="_parentesis _parentesis_open">(</span><span class="_parentesis _parentesis_close">)</span>
-            <input
-                class="span2 droppable dependence_value"
-                type="text"
-                name="groups.1.fields.1.dependence.values"
-                value=""
-                placeholder="nro. ID" />
-            <span class="_parentesis _parentesis_open">(</span><span class="_parentesis _parentesis_close">)</span>
-                   """
+                        """
+        expected_input = """
+            <input class="span2 droppable dependence_value" type="text" name="groups.1.fields.1.dependence.values" value="" placeholder="nro. ID"
+                         """
         group_order = "1"
         field_order = "1"
         dependency_input = new DependencyInput(group_order, field_order)
-        expect(dependency_input.render()).toBe(expected)
+        widget = dependency_input.render()
+        outer_html = $('<div></div>').append(widget)[0].outerHTML
+        expect(outer_html).toContain(expected_span)
+        expect(outer_html).toContain(expected_input)
 
     it "render should have group_order, field_order and value", ->
-        expected = """
-            <span class="_parentesis _parentesis_open">(</span><span class="_parentesis _parentesis_close">)</span>
-            <input
-                class="span2 droppable dependence_value"
-                type="text"
-                name="groups.0.fields.0.dependence.values"
-                value="a value"
-                placeholder="nro. ID" />
-            <span class="_parentesis _parentesis_open">(</span><span class="_parentesis _parentesis_close">)</span>
-                   """
+        expected_input = """
+            <input class="span2 droppable dependence_value" type="text" name="groups.0.fields.0.dependence.values" value="" placeholder="nro. ID"
+                         """
         group_order = "0"
         field_order = "0"
         dependency_input = new DependencyInput(group_order, field_order)
-        dependency_input.value = "a value"
-        expect(dependency_input.render()).toBe(expected)
+        widget = dependency_input.render()
+        outer_html = $('<div></div>').append(widget)[0].outerHTML
+        expect(outer_html).toContain(expected_input)
 
     it "should respond with popover on click", ->
         setFixtures('<div id="container"></div>');
@@ -45,3 +38,40 @@ describe "DependencyInput", ->
         input.click()
 
         expect(container).toContain(".popover")
+
+    it "should respond a popover with question and option description", ->
+        setFixtures('<div id="container"></div>');
+        container = $('#container');
+
+        mock_group_order = "0"
+        mock_field_order = "0"
+        q_name = "groups.#{mock_group_order}.fields.#{mock_field_order}.name"
+        q_value = "Pregunta"
+        mock_question = """
+            <input type="text" name="#{q_name}" value="#{q_value}">
+                        """
+        container.append(mock_question)
+
+        opt_id = "1378749492016"
+        opt_value = "option value"
+        q_name = q_name.replace(".name", "")
+        opt_name = "#{q_name}.options.#{opt_id}.text"
+        mock_option = """
+            <input type="text" name="#{opt_name}" value="#{opt_value}">
+                      """
+        container.append(mock_option)
+
+        group_order = "1"
+        field_order = "1"
+        dependency_input = new DependencyInput(group_order, field_order)
+        dependency_input.value = opt_id
+        widget = dependency_input.render()
+        container.append(widget)
+        input = container.find("input.dependence_value")
+        input.click()
+
+        popover_title = $(".popover .popover-title")
+        expect(popover_title).toHaveText(q_value)
+
+        popover_content = $(".popover .popover-content")
+        expect(popover_content).toHaveText(opt_value)
diff --git a/webapp/webapp/static/js/dependency_input.js b/webapp/webapp/static/js/dependency_input.js
index a97b1da..cfdff32 100644
--- a/webapp/webapp/static/js/dependency_input.js
+++ b/webapp/webapp/static/js/dependency_input.js
@@ -11,7 +11,7 @@
     }
 
     DependencyInput.prototype.render = function() {
-      var context, input, widget;
+      var context, input, opt_id, opt_name, opt_value, opt_widget, q_name, q_value, question_widget, widget;
       context = {
         "value": this.value,
         "order": this.field_order,
@@ -20,9 +20,22 @@
       Mustache.tags = ['[[', ']]'];
       widget = jQuery(Mustache.render(this.template, context));
       input = $(widget[3]);
+      q_value = "ID no identificado";
+      opt_value = "ID inexistente o vacío";
+      opt_id = this.value;
+      opt_name = ".options." + opt_id + ".text";
+      opt_widget = $("input[name$='" + opt_name + "']");
+      if (opt_widget.length > 0) {
+        opt_value = opt_widget.val();
+        q_name = opt_widget.attr("name").replace(opt_name, ".name");
+        question_widget = $("input[name='" + q_name + "']");
+        if (question_widget.length > 0) {
+          q_value = question_widget.val();
+        }
+      }
       input.popover({
-        title: "title",
-        content: "content"
+        title: q_value,
+        content: opt_value
       });
       return widget;
     };
diff --git a/webapp/webapp/static/js/dynamic_structure.js b/webapp/webapp/static/js/dynamic_structure.js
index b0a6d91..398ffd5 100644
--- a/webapp/webapp/static/js/dynamic_structure.js
+++ b/webapp/webapp/static/js/dynamic_structure.js
@@ -521,6 +521,10 @@ var factoryGroup = function(order, value) {
         })
     );
 
+    // Show the group widget
+    group.prepend("<hr />");
+    container.append(group);
+
     // Get remove group button and bind remove group widget envent
     var remove_button = group.find('.WGroup_remove');
     bindGroupRemoveButton(remove_button);
@@ -536,8 +540,4 @@ var factoryGroup = function(order, value) {
     // Get add field button and bind add field widget envent
     var add_field_button = group.find('.WGroup_add_field');
     bindGroupAddFieldButton(add_field_button);
-
-    // Show the group widget
-    group.prepend("<hr />");
-    container.append(group);
 };
\ No newline at end of file