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 31ef494c2fee25c5d762b65c70b893e5cf9d4c9a..412557706280e27045e6ecbcdb462a1887663306 100644 --- a/dmnverifierfrontend/src/main/resources/META-INF/resources/js/dmnVerifier.js +++ b/dmnverifierfrontend/src/main/resources/META-INF/resources/js/dmnVerifier.js @@ -29,26 +29,96 @@ function getVerifications() { console.log('successful dmn verification request:'); console.log(data); verifierResults = data; + // sort the list 1. classification, 2. size of entries + verifierResults.verifier.sort(function ( + /** VerifierResult */ firstEl, /** VerifierResult */ secondEl) { + if (firstEl.type.classification.name + === secondEl.type.classification.name) { + if (firstEl.size === secondEl.size) { + return firstEl.type.name < secondEl.type.name ? -1 : 1; + } else if (firstEl.size < secondEl.size) { + return 1; + } else { + return -1; + } + } else if (firstEl.type.classification.name + < secondEl.type.classification.name) { + return -1; + } else { + return 1; + } + }); renderDmnVerifierOptions(); } }); }); } -var i = 0; - function renderDmnVerifierOptions() { // reset div - let root = $('#root-dmn-verifier'); - root.html('verifier' + i++); + let $root = $('#root-dmn-verifier'); + let $select = $(` + <select name="verifier" id="verifier" onchange="renderVerifierResult(this)"> + `); + $select.append($(`<option>Select a verifier</option>`)); + let currentOpt = ''; + let $curGroup; for (let i = 0; i < verifierResults.verifier.length; i++) { - console.log(verifierResults.verifier[i]); - let verifier = verifierResults.verifier[i]; - let verifierTab = $(` - <button class="but-verifier"> - ${verifier.type.name} - </button> + let bolNewGroup = currentOpt + !== verifierResults.verifier[i].type.classification.name; + if (bolNewGroup) { + if (currentOpt === currentOpt) { + $select.append($curGroup); + } + $curGroup = ($( + `<optgroup label="${verifierResults.verifier[i].type.classification.name}"> + `)); + currentOpt = verifierResults.verifier[i].type.classification.name; + } + $curGroup.append(renderSelectEntry(verifierResults.verifier[i])); + } + $root.html($select); + $root.append($(`<div id="verifier-entries">`)); +} + +/** + * + * @param verifier + * @type VerifierResult + */ +function renderSelectEntry(verifier) { + return $(` + <option value="${verifier.type.name}">${verifier.type.name} (${verifier.size})</option> `); - root.append(verifierTab); +} + +/** + * + * @param verifierSelect + * @Type option + */ +function renderVerifierResult(verifierSelect) { + let verifier = findVerifierByName(verifierSelect.value); + let $verifierEntries = $('#verifier-entries'); + $verifierEntries.empty(); + if (verifier !== undefined) { + $verifierEntries.append($(` + <div>${verifier.type.name}: ${verifier.type.description}</div> + `)); + } +} + +/** + * + * @param verifierName + * @type string + * @return VerifierResult + */ +function findVerifierByName(verifierName) { + for (let i = 0; i < verifierResults.verifier.length; i++) { + if (verifierResults.verifier[i].type.name === verifierName) { + return verifierResults.verifier[i]; + } } + return undefined; } diff --git a/dmnverifierfrontend/src/main/resources/META-INF/resources/js/dmnViewer.js b/dmnverifierfrontend/src/main/resources/META-INF/resources/js/dmnViewer.js index e1bc061e0857bce3581b09d8599277b9bf009562..a0beb7a56c28ae8b5983498cca8adc3cad3ee2bc 100644 --- a/dmnverifierfrontend/src/main/resources/META-INF/resources/js/dmnViewer.js +++ b/dmnverifierfrontend/src/main/resources/META-INF/resources/js/dmnViewer.js @@ -18,7 +18,7 @@ $tabs.delegate('.tab', 'click', function (e) { */ let dmnModeler = new DmnJS({ container: $container, - height: 600, + height: 450, width: '100%', keyboard: { bindTo: window