Add option select for predefined verification type

dmnverifierfrontend/src/main/resources/META-INF/resources/css/stylesheets.css

@@ -129,14 +129,17 @@ select:focus::-ms-value {
 }
 
 .dmn-verifier-header-item {
-  margin: 8px 15px;
+  margin: 8px 12px;
 }
 
 .dmn-verifier-select {
-  position: relative;
   flex-grow: 4;
 }
 
+#dmn-verifier-types {
+  flex-grow: 1;
+  max-width: 200px;
+}
 
 .dmn-ERROR {
   list-style-image: url("img/ERROR.png");

dmnverifierfrontend/src/main/resources/META-INF/resources/js/dmnVerifier.js

@@ -7,15 +7,54 @@ let dmnApi = rootUrl + 'api/dmn/';
  */
 let verifierResults = {};
 
+/**
+ *
+ * @type {Array.<VerificationType>}
+ */
+let types = [];
+
+let $verifierTypes;
+
+// load types
+$.ajax({
+  url: dmnApi + 'verification/type',
+  type: 'GET',
+  contentType: 'text/xml',
+  success: function (data) {
+    types = data;
+    // sort types by classification and name
+    types.sort(function (
+        /** VerificationType */ firstEl, /** VerificationType */ secondEl) {
+      if (firstEl.classification.name
+          === secondEl.classification.name) {
+        if (firstEl.niceName === secondEl.niceName) {
+          return 0;
+        }
+        return firstEl.niceName < secondEl.niceName ? -1 : 1;
+      } else if (firstEl.classification.name
+          < secondEl.classification.name) {
+        return -1;
+      } else {
+        return 1;
+      }
+    });
+    $verifierTypes = renderTypeOptions();
+  }
+});
+
 function cleanDmnVerifierRoot() {
   let $root = $('#root-dmn-verifier').empty();
   let $header = $(`      
       <div id="dmn-verifier-header">
   `);
+  // add types
+  $header.append($verifierTypes);
+  // Add Button
   $header.append($(`
     <button class="clickable dmn-verifier-header-item" id="dmn-button-verify" onClick="checkVerifications()">
     Verify</button>
   `));
+  // add header to root
   $root.append($header);
   $root.append($(`<div id="dmn-verifier-content">`));
   return $root;
@@ -34,8 +73,13 @@ function getVerifications() {
     } else {
       console.log('Requesting dmn verifications..');
     }
+    let apiPath = dmnApi + 'verification';
+    // check, if a verifier is preselected
+    if ($verifierTypes[0].selectedOptions[0].value !== 'all') {
+      apiPath += "/type/" + $verifierTypes[0].selectedOptions[0].value;
+    }
     $.ajax({
-      url: dmnApi + 'verification',
+      url: apiPath,
       type: 'POST',
       contentType: 'text/xml',
       data: xml,
@@ -69,6 +113,35 @@ function getVerifications() {
   });
 }
 
+function renderTypeOptions() {
+  let $select = $(`
+    <select name="verifier" id="dmn-verifier-types"
+      class="dmn-verifier-header-item dmn-verifier-select clickable">
+  `);
+  $select.append($(`<option value="all">All verifier</option>`));
+  let currentOpt = '';
+  let $curGroup;
+  for (let i = 0; i < types.length; i++) {
+    let bolNewGroup = currentOpt
+        !== types[i].classification.niceName;
+    if (bolNewGroup) {
+      if (currentOpt === currentOpt) {
+        $select.append($curGroup);
+      }
+      $curGroup = ($(
+          `<optgroup label="${types[i].classification.niceName}">
+      `));
+      currentOpt = types[i].classification.niceName;
+    }
+    $curGroup.append($(`
+      <option value="${types[i].name}">${types[i].niceName}</option>`
+    ));
+
+  }
+  $select.append($curGroup);
+  return $select;
+}
+
 function renderDmnVerifierOptions() {
   let $header = $('#dmn-verifier-header');
   let $select = $(`
@@ -80,21 +153,33 @@ function renderDmnVerifierOptions() {
   let currentOpt = '';
   let $curGroup;
   for (let i = 0; i < verifierResults.verifier.length; i++) {
+    let verifier = verifierResults.verifier[i];
     let bolNewGroup = currentOpt
-        !== verifierResults.verifier[i].type.classification.niceName;
+        !== verifier.type.classification.niceName;
     if (bolNewGroup) {
       if (currentOpt === currentOpt) {
         $select.append($curGroup);
       }
       $curGroup = ($(
-          `<optgroup label="${verifierResults.verifier[i].type.classification.niceName}">
+          `<optgroup label="${verifier.type.classification.niceName}">
       `));
-      currentOpt = verifierResults.verifier[i].type.classification.niceName;
+      currentOpt = verifier.type.classification.niceName;
+    }
+    if (verifierResults.verifier.length === 1) {
+      $curGroup.append($(`
+      <option value="${verifier.type.name}" selected>${verifier.type.niceName} (${verifier.size})</option>
+    `));
+    } else {
+      $curGroup.append($(`
+      <option value="${verifier.type.name}">${verifier.type.niceName} (${verifier.size})</option>
+    `));
     }
-    $curGroup.append(renderSelectEntry(verifierResults.verifier[i]));
   }
   $select.append($curGroup);
   $header.append($select);
+  if (verifierResults.verifier.length === 1) {
+    renderVerifierResult($select[0].selectedOptions[0]);
+  }
 }
 
 /**