Add simple conditional element

src/main/java/org/gesis/dda/wizard/web/rest/ElementResource.java

@@ -110,7 +110,7 @@ public class ElementResource {
     }
 
     /**
-     * GET  /steps/wizard:id -> get the steps from wizard with the "id".
+     * GET  /step-elements/step:id -> get the elements from step with the "id".
      */
     @RequestMapping(value = "/step-elements/{id}",
         method = RequestMethod.GET,
@@ -122,6 +122,24 @@ public class ElementResource {
         return new ResponseEntity<>(elements, HttpStatus.OK);
     }
 
+    /**
+     * GET  /steps-elements/step:ids -> get the elements from steps with the "id".
+     */
+    @RequestMapping(value = "/steps-elements",
+        method = RequestMethod.POST,
+        produces = MediaType.APPLICATION_JSON_VALUE)
+    @Timed
+    public ResponseEntity<List<Element>> getElementsFromSteps(@RequestBody List<Long> ids) {
+        log.debug("REST request to get Elements from Step : {}", ids);
+
+        List<Element> elements = new ArrayList<>();
+        for(Long id : ids) {
+        	elements.addAll(elementRepository.findByStepIdOrderByFormRowAsc(id));
+        }
+
+        return new ResponseEntity<>(elements, HttpStatus.OK);
+    }
+
     /**
      * DELETE  /elements/:id -> delete the "id" element.
      */

src/main/webapp/index.html

@@ -147,6 +147,7 @@
     <script src="scripts/app/wizardEditor/wizardEditor-wizard-delete-dialog.controller.js"></script>
     <script src="scripts/components/wizardEditor/customElement/customElement.controller.js"></script>
     <script src="scripts/components/wizardEditor/nextStep/nextStep.controller.js"></script>
+    <script src="scripts/components/wizardEditor/simpleConditional/simpleConditional-directive.js"></script>
     <script src="scripts/components/wizardEditor/templateImporter/templateImporter.controller.js"></script>
     <script src="scripts/components/wizardEditor/form.service.js"></script>
     <script src="scripts/components/wizardEditor/tree.service.js"></script>

src/main/webapp/scripts/app/wizardEditor/wizardEditor.controller.js

@@ -23,6 +23,14 @@ angular.module('ddaApp')
         'displayName': 'Checkbox List'
       }
     },
+    {
+      'fieldName': 'simpleConditional',
+      'category': '- Development -',
+      'fieldOptions': {
+        'displayName': 'Conditional',
+        'hidden': true
+      }
+    },
     // {
     //   'fieldName': 'nextStep',
     //   'category': 'Development',

src/main/webapp/scripts/components/entities/step/step.service.js

@@ -29,6 +29,15 @@ angular.module('ddaApp')
                     return data;
                 }
             },
+            'elementsFromSteps': {
+                method: 'POST',
+                url:'api/steps-elements/',
+                isArray: true,
+                transformResponse: function (data) {
+                    data = angular.fromJson(data);
+                    return data;
+                }
+            },
             'update': { method:'PUT' }
         });
     });

src/main/webapp/scripts/components/wizardEditor/simpleConditional/simpleConditional-directive.js

+'use strict';
+
+angular.module('ddaApp').directive('ddaSimpleConditional', function(Wizard, Step, $state) {
+
+  function link(scope, element, attr) {
+    scope.steps = [];
+    scope.elements = [];
+    scope.formdata = {};
+
+    scope.$watch('field.element', function(newVal, oldVal) {
+      if(newVal !== oldVal) {
+        scope.field.value = null;
+      } else {
+        newVal.value = scope.field.value;
+      }
+
+      scope.myForm = {
+        schema: {
+          'fields': [newVal]
+        }
+      };
+    });
+
+    scope.$watch('formdata', function(newVal, oldVal) {
+      if(newVal[scope.field.element.name] && newVal[scope.field.element.name] !== null) {
+        scope.field.value = newVal[scope.field.element.name];
+      }
+    }, true);
+
+    Wizard.steps({
+      id: $state.params.id
+    }, function(steps) {
+
+      var selectedStep = steps.find(function(step) {
+        return step.id === Number($state.params.stepId);
+      });
+
+      scope.steps = steps.filter(function(step) {
+        return (step.id !== selectedStep.id) && (step.treeRow > selectedStep.treeRow);
+      });
+
+      var stepIds = steps.filter(function(step) {
+        return step.treeRow <= selectedStep.treeRow;
+      }).map(function(step) {
+        return step.id;
+      });
+
+      Step.elementsFromSteps(stepIds, function(elements) {
+        scope.elements = elements;
+      });
+    });
+  }
+
+  var directive = {
+    link: link,
+    // templateUrl: '/template/is/located/here.html',
+    // template: 'Test: {{ selectedStep }}',
+    // restrict: 'EA' default Angular 1.3+
+  };
+  return directive;
+});

src/main/webapp/scripts/components/wizardEditor/simpleConditional/simpleConditional-properties.ng.html

+<div>
+  <div fg-tabs-pane="Properties">
+    <div fg-property-field-common="{ fieldname: true }"></div>
+
+    <div dda-simple-conditional="">
+      <div fg-property-field="element" fg-property-field-label="If Element">
+        <select class="form-control" name="element" ng-model="field.element" ng-options="element as element.name group by element.step.name for element in elements  track by element.id">
+          <!-- <option value=""></option> -->
+        </select>
+      </div>
+
+      <div fg-property-field="fg-property-field-value" fg-property-field-label="Has value">
+        <!-- <form novalidate class="form-horizontal" name="exampleForm"> -->
+          <!-- <fieldset> -->
+            <div fg-form="" name="fieldValue" fg-form-data="formdata" fg-schema="myForm.schema"></div>
+          <!-- </fieldset> -->
+        <!-- </form> -->
+      </div>
+
+      <div fg-property-field="nextStep" fg-property-field-label="Then go to">
+        <select class="form-control" name="nextStep" ng-model="field.nextStep" ng-options="step as step.name for step in steps track by step.id">
+          <!-- <option value=""></option> -->
+        </select>
+      </div>
+
+      <div fg-property-field="hidden" fg-property-field-label="">
+        <div class="checkbox">
+          <label title="Set the initial value of this field.">
+            <input type="checkbox" name="hidden" ng-model="field.hidden"/>
+            Hide element in from preview
+          </label>
+        </div>
+      </div>
+    </div>
+
+
+  </div>
+</div>

src/main/webapp/scripts/components/wizardEditor/simpleConditional/simpleConditional-template.ng.html

+<div id="{{ field.$_id }}" style="margin-bottom: 0px; padding-top: 7px" >
+    IF <ins>{{ field.schema.element.name }}</ins>
+    HAS VALUE <ins>{{ field.schema.value }}</ins>
+    GO TO <ins>{{ field.schema.nextStep.name }}</ins>
+
+<!-- <div jsonify="form.schema.fields"></div> -->
+<!-- <div jsonify="field.schema"></div> -->
+<!-- <div jsonify="form.data[field.schema.name]"></div> -->
+<!-- <p>
+  <i class="fa" ng-class="{ 'fa-eye-slash': field.schema.hidden, 'fa-eye': !field.schema.hidden }"></i>
+</p> -->
+</div>
+
+<!-- TODO: Update step, when name of next step change -->
+<!-- TODO: See isolated scope http://onehungrymind.com/angularjs-sticky-notes-pt-2-isolated-scope/ http://stackoverflow.com/questions/14049480/what-are-the-nuances-of-scope-prototypal-prototypical-inheritance-in-angularjs -->
+<!-- TODO: Get steps from wizardEditor controller through attributs, don-t use wizard or step servoce -->