Skip to content
Snippets Groups Projects
Commit f0ee5a4a authored by Jonas Blatt's avatar Jonas Blatt :ant:
Browse files

Merge branch 'develop' into 'master'

Develop

See merge request jonasblatt/ma-jonasblatt-dmn-verifier!36
parents fd973af3 8bd2f77d
No related branches found
No related tags found
No related merge requests found
......@@ -2,6 +2,7 @@
<html lang="en">
<head>
<meta charset="UTF-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>DMN App</title>
<link href="https://unpkg.com/dmn-js@7.0.1/dist/assets/diagram-js.css" rel="stylesheet">
<link href="https://unpkg.com/dmn-js@7.0.1/dist/assets/dmn-js-shared.css" rel="stylesheet">
......
......@@ -2,6 +2,10 @@ let rootUrl = 'http://' + window.location.hostname + ':8080/';
let dmnApi = rootUrl + 'api/dmn/';
let inactiveBackend = true;
$(document).ready(function () {
// load types
loadAvailableTypes();
});
/**
* Global definition for verification results
* @type {VerifierResultSet}
......@@ -15,75 +19,97 @@ let verifierResults = {};
let types = [];
let $verifierTypes;
let lastTypeSelect = undefined;
let $select = $(`
<select name="verifier" id="verifier"
class="dmn-verifier-header-item dmn-verifier-select clickable"
title="Select calculated verification"
onchange="renderVerifierResult(this)">
`);
function handleStatus() {
let $dot = $('#backend-status');
if (inactiveBackend) {
verifierResults = {};
$dot.removeClass('active');
$dot.addClass('inactive');
alert(
"Error: The backend is currently not available. Please try again later.")
} else {
$dot.removeClass('inactive');
$dot.addClass('active');
}
cleanDmnVerifierRoot();
}
// load types
$.ajax({
timeout: 500,
url: dmnApi + 'verification/types',
type: 'GET',
contentType: 'text/xml',
error: function (err) {
verifierResults = {};
inactiveBackend = true;
handleStatus();
},
success: function (data) {
inactiveBackend = false;
handleStatus();
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;
function loadAvailableTypes() {
$.ajax({
timeout: 1000,
url: dmnApi + 'verification/types',
type: 'GET',
contentType: 'text/xml',
error: function (err) {
inactiveBackend = true;
handleStatus();
},
success: function (data) {
inactiveBackend = false;
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;
}
return firstEl.niceName < secondEl.niceName ? -1 : 1;
} else if (firstEl.classification.name
< secondEl.classification.name) {
return -1;
} else {
return 1;
}
});
$verifierTypes = renderTypeOptions();
}
});
});
$verifierTypes = renderTypeOptions();
handleStatus();
}
});
}
function cleanDmnVerifierRoot() {
let $root = $('#root-dmn-verifier').empty();
let $header = $(`
<div id="dmn-verifier-header">
`);
// add types
$header.append($verifierTypes);
$verifierTypes.select2({
containerCssClass: "dmn-verifier-header-item dmn-verifier-select clickable",
placeholder: {
id: -1,
text: "All verifier"
},
allowClear: true
});
// Add Button
$header.append($(`
<button class="clickable dmn-verifier-header-item" id="dmn-button-verify"
title="Request verifications" onClick="checkVerifications()">
Verify</button>
`));
// add header to root
// check, if backend is available
if ($verifierTypes === undefined) {
$header.append($(`
<button class="clickable dmn-verifier-header-item" id="dmn-button-reload-verifier"
title="Reconnect backend" onClick="loadAvailableTypes()">
Reconnect verification backend</button>
`));
} else {
$header.append($verifierTypes);
$verifierTypes.select2({
containerCssClass: "dmn-verifier-header-item dmn-verifier-select clickable",
placeholder: {
id: -1,
text: "All verifier"
},
allowClear: true
});
// Add Button
$header.append($(`
<button class="clickable dmn-verifier-header-item" id="dmn-button-verify"
title="Request verifications" onClick="checkVerifications()">
Verify</button>
`));
$select.empty();
$header.append($select);
}
// add header to root
$root.append($header);
$root.append($(`<div id="dmn-verifier-content">`));
return $root;
......@@ -97,8 +123,7 @@ function checkVerifications() {
function getVerifications() {
dmnModeler.saveXML({format: true}, function (err, xml) {
if (err) {
return console.log(
'There is an error in requesting the dmn verifications.. ' + err);
return alert(err);
} else {
console.log('Requesting dmn verifications..');
}
......@@ -122,6 +147,10 @@ function getVerifications() {
contentType: 'text/xml',
data: xml,
error: function (err) {
alert(
'Error: There was a fatal error while parsing the xml of the dmn.');
},
success: function (data) {
console.log('successful dmn verification request:');
console.log(data);
......@@ -181,16 +210,10 @@ function renderTypeOptions() {
}
function renderDmnVerifierOptions() {
let $header = $('#dmn-verifier-header');
let $select = $(`
<select name="verifier" id="verifier"
class="dmn-verifier-header-item dmn-verifier-select clickable"
title="Select calculated verification"
onchange="renderVerifierResult(this)">
`);
$select.append($(`<option>Select a verifier</option>`));
let currentOpt = '';
let $curGroup;
let selOpt = false;
for (let i = 0; i < verifierResults.verifier.length; i++) {
let verifier = verifierResults.verifier[i];
let bolNewGroup = currentOpt
......@@ -199,58 +222,79 @@ function renderDmnVerifierOptions() {
if (currentOpt === currentOpt) {
$select.append($curGroup);
}
$curGroup = ($(
`<optgroup label="${verifier.type.classification.niceName}">
$curGroup = ($(`
<optgroup label="${verifier.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>
`));
let $option;
if (verifierResults.verifier.length === 1 ||
lastTypeSelect !== undefined && lastTypeSelect === verifier.type.name) {
selOpt = true;
$option = $(`
<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>
`));
$option = $(`
<option value="${verifier.type.name}">${verifier.type.niceName} (${verifier.size})</option>
`);
}
if (verifier.size === 0) {
$option.css('color', '#999')
}
$curGroup.append($option);
}
$select.append($curGroup);
$header.append($select);
if (verifierResults.verifier.length === 1) {
if (selOpt) {
renderVerifierResult($select[0].selectedOptions[0]);
}
}
/**
*
* @param verifier
* @type VerifierResult
* @param verifierSelect
* @Type option
*/
function renderSelectEntry(verifier) {
return $(`
<option value="${verifier.type.name}">${verifier.type.niceName} (${verifier.size})</option>
`);
function renderVerifierResult(verifierSelect) {
let verifier = findVerifierByName(verifierSelect.value);
if (verifier === undefined) {
lastTypeSelect = undefined;
} else {
lastTypeSelect = verifier.type.name;
renderVerifier(verifier);
}
}
/**
*
* @param verifierSelect
* @Type option
* @param verifier
* @Type VerifierResult
*/
function renderVerifierResult(verifierSelect) {
let verifier = findVerifierByName(verifierSelect.value);
let $verifierEntries = $('#dmn-verifier-content');
$verifierEntries.empty();
if (verifier !== undefined) {
$verifierEntries.append($(`
<div>${verifier.type.niceName}: ${verifier.type.description}</div>
function renderVerifier(verifier) {
let $verifierContent = $('#dmn-verifier-content');
$verifierContent.empty();
$verifierContent.css('display', 'none');
let $verifierType = $(`<div class="verifier-type"></div>`);
let $verifierEntries = $(`<div class="verifier-entries"></div>`);
// Add name and description of verifier
$verifierType.append($(`
<div class="verifier-type-name"><h2>${verifier.type.niceName}</h2></div>
`));
$verifierType.append($(`
<div class="verifier-type-description"><p>${verifier.type.description}</p></div>
`));
let $entryList = $(`<ul>`);
$verifierEntries.append($entryList);
// Add entries if min 1 result
if (verifier.entries.length > 0) {
for (let i = 0; i < verifier.entries.length; i++) {
$entryList.append(renderVerificationEntry(verifier.entries[i]));
$verifierEntries.append(renderVerificationEntry(verifier.entries[i]));
}
}
$verifierContent.append($verifierType);
$verifierContent.append($verifierEntries);
$verifierContent.fadeIn(250);
}
/**
......@@ -259,10 +303,25 @@ function renderVerifierResult(verifierSelect) {
* @Type VerificationEntry
*/
function renderVerificationEntry(verificationEntry) {
console.log(verificationEntry);
return $(`
<li class="dmn-${verificationEntry.verificationClassification}">${verificationEntry.message}</li>
`);
let $entryContainer = $(`<div class="verification-container"></div>`);
$entryContainer.append($(`
<span class="dmn-verification-icon dmn-${verificationEntry.verificationClassification}"/>
`));
$entryContainer.append($(`
<div class="verification-message">${verificationEntry.message}</div>
`));
// "dmn-${verificationEntry.verificationClassification}"
let $fixButtons = $(`<div class="verification-container-fix-buttons"></div>`);
/*
$fixButtons.append(
$(`<button class="verification-fix-button clickable">Show</button>`));
$fixButtons.append(
$(`<button class="verification-fix-button clickable">Fix</button>`));
$fixButtons.append(
$(`<button class="verification-fix-button clickable">Fix</button>`)); */
$entryContainer.append($fixButtons); // TODO: render buttons
return $entryContainer;
}
/**
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment