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 b356d7ad4b8c0b948bd5b06d322347db5a6c1439..77f5a214b132a654accb40ff57b2cd582fb0f594 100644
--- a/dmnverifierfrontend/src/main/resources/META-INF/resources/css/stylesheets.css
+++ b/dmnverifierfrontend/src/main/resources/META-INF/resources/css/stylesheets.css
@@ -101,11 +101,29 @@ span.select2 {
/** Top-line configuration */
-.dmn-root {
- margin: -2px;
+#dmn-root {
+
+}
+
+.dmn-js-parent {
+ width: 100%;
+ height: 900px;
+}
+
+.fullscreen {
+ z-index: 9999;
+ width: 100%;
+ height: 100%;
+ position: fixed !important;
+ top: 0;
+ left: 0;
+}
+
+.hidden {
+ display: none !important;
}
-.dmn-top {
+#dmn-top {
padding-left: 6px;
padding-top: 6px;
display: flex;
diff --git a/dmnverifierfrontend/src/main/resources/META-INF/resources/index.html b/dmnverifierfrontend/src/main/resources/META-INF/resources/index.html
index d09c9f692541e92fe8fe18201712d8a3934630f5..b42a109f530023361c6350f4a0380da749db57e1 100644
--- a/dmnverifierfrontend/src/main/resources/META-INF/resources/index.html
+++ b/dmnverifierfrontend/src/main/resources/META-INF/resources/index.html
@@ -22,8 +22,8 @@
<link href="css/dmnEditorTabs.css" rel="stylesheet" type="text/css"/>
</head>
<body>
-<div class="dmn-root">
- <div class="dmn-top">
+<div id="dmn-root">
+ <div id="dmn-top">
<div class="dmn-top-item dmn-upload">
<label class="clickable" for="dmn-file-upload" title="Upload dmn">
</label>
@@ -45,7 +45,7 @@
</label>
</div>
<div class="dmn-top-item">
- <h1>Verification for Decision Modeling Notation</h1>
+ <h1 id="heading">Verification for Decision Modeling Notation</h1>
</div>
<div class="dmn-top-item">
<span class="status-dot" id="backend-status" title="Backend status"/>
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 d5037a8278b07c318130e83f43bc87d5fc9c9def..f81817efa86b00cd04d8c94e4c35a551e7aec6fd 100644
--- a/dmnverifierfrontend/src/main/resources/META-INF/resources/js/dmnViewer.js
+++ b/dmnverifierfrontend/src/main/resources/META-INF/resources/js/dmnViewer.js
@@ -6,6 +6,28 @@ let CLASS_NAMES = {
literalExpression: 'dmn-icon-literal-expression'
};
+// Fullscreen functionality for dmn table
+$(document).ready(function () {
+ $(".dmn-js-parent").dblclick(function () {
+ $(".dmn-js-parent").toggleClass('fullscreen');
+ $("#root-dmn-verifier").toggleClass('hidden');
+ $("#dmn-top").toggleClass('hidden');
+ $(".editor-tabs").toggleClass('hidden');
+ // calc height
+ if ($(".dmn-js-parent").hasClass('fullscreen')) {
+ $(".dmn-js-parent").css('height', '');
+ var activeEditor = dmnModeler.getActiveViewer();
+ // access active editor components
+ var canvas = activeEditor.get('canvas');
+ // zoom to fit full viewport
+ canvas.zoom('fit-viewport');
+ } else {
+ let dmnModelerHeight = $(window).height() / 2.5;
+ $(".dmn-js-parent").css('height', dmnModelerHeight + 'px');
+ }
+ });
+});
+
$tabs.delegate('.tab', 'click', function (e) {
var viewIdx = parseInt(this.getAttribute('data-id'), 10);
var view = dmnModeler.getViews()[viewIdx];
@@ -21,7 +43,6 @@ let dmnModelerHeight = $(window).height() / 2.5;
let dmnModeler = new DmnJS({
container: $container,
height: dmnModelerHeight,
- width: '100%',
keyboard: {
bindTo: window
}