From d3da28a2b3ef462a500146e37c98831b6524190c Mon Sep 17 00:00:00 2001 From: Jonas Blatt <jonasblatt@uni-koblenz.de> Date: Mon, 14 Oct 2019 23:51:09 +0200 Subject: [PATCH] Add option select for predefined verification type --- .../META-INF/resources/css/stylesheets.css | 7 +- .../META-INF/resources/js/dmnVerifier.js | 95 ++++++++++++++++++- 2 files changed, 95 insertions(+), 7 deletions(-) diff --git a/dmnverifierfrontend/src/main/resources/META-INF/resources/css/stylesheets.css b/dmnverifierfrontend/src/main/resources/META-INF/resources/css/stylesheets.css index e182b6b8..b1194f10 100644 --- a/dmnverifierfrontend/src/main/resources/META-INF/resources/css/stylesheets.css +++ b/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"); diff --git a/dmnverifierfrontend/src/main/resources/META-INF/resources/js/dmnVerifier.js b/dmnverifierfrontend/src/main/resources/META-INF/resources/js/dmnVerifier.js index e3b6f622..18e0afdb 100644 --- a/dmnverifierfrontend/src/main/resources/META-INF/resources/js/dmnVerifier.js +++ b/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]); + } } /** -- GitLab