Major redesign of JS and Sass assets
diff --git a/public/js/demo/match.html b/public/js/demo/match.html
new file mode 100644
index 0000000..373b0ee
--- /dev/null
+++ b/public/js/demo/match.html
@@ -0,0 +1,238 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>Match demo</title>
+ <meta charset="utf-8" />
+ <script src="../lib/dagre/dagre.min.js"></script>
+ <script src="../src/menu.js"></script>
+ <script src="../src/match.js"></script>
+ <link type="text/css"
+ rel="stylesheet"
+ href="../../css/font-awesome.min.css"></link>
+ <link type="text/css"
+ rel="stylesheet"
+ href="../../css/build/kalamar.css"></link>
+ <style type="text/css"
+ rel="stylesheet">
+
+body {
+ background-color: #ffa500;
+}
+
+body, text {
+ font-family: tahoma, verdana, arial;
+ color: #444;
+}
+
+text {
+ fill: #444;
+}
+
+ </style>
+ </head>
+ <body>
+
+ <script>
+var snippet = "<span title=\"cnx/l:meist\">" +
+ " <span title=\"cnx/p:ADV\">" +
+ " <span title=\"cnx/syn:@PREMOD\">" +
+ " <span title=\"mate/l:meist\">" +
+ " <span title=\"mate/p:ADV\">" +
+ " <span title=\"opennlp/p:ADV\">meist</span>" +
+ " </span>" +
+ " </span>" +
+ " </span>" +
+ " </span>" +
+ "</span>" +
+ "<span title=\"cnx/l:deutlich\">" +
+ " <span title=\"cnx/p:A\">" +
+ " <span title=\"cnx/syn:@PREMOD\">" +
+ " <span title=\"mate/l:deutlich\">" +
+ " <span title=\"mate/m:degree:pos\">" +
+ " <span title=\"mate/p:ADJD\">" +
+ " <span title=\"opennlp/p:ADJD\">deutlich</span>" +
+ " </span>" +
+ " </span>" +
+ " </span>" +
+ " </span>" +
+ " </span>" +
+ "</span>" +
+ "<span title=\"cnx/l:fähig\">" +
+ " <span title=\"cnx/l:leistung\">" +
+ " <span title=\"cnx/p:A\">" +
+ " <span title=\"cnx/syn:@NH\">" +
+ " <span title=\"mate/l:leistungsfähig\">" +
+ " <span title=\"mate/m:degree:comp\">" +
+ " <span title=\"mate/p:ADJD\">" +
+ " <span title=\"opennlp/p:ADJD\">leistungsfähiger</span>" +
+ " </span>" +
+ " </span>" +
+ " </span>" +
+ " </span>" +
+ " </span>" +
+ " </span>" +
+ "</span>";
+
+var treeSnippet =
+ "<span class=\"context-left\"></span>" +
+ "<span class=\"match\">" +
+ " <span title=\"xip/c:MC\">" +
+ " <span title=\"xip/c:TOP\">" +
+ " <span title=\"xip/c:PP\">" +
+ " <span title=\"xip/c:PREP\">Mit</span>" +
+ " <span title=\"xip/c:NP\">" +
+ " <span title=\"xip/c:DET\">dieser</span>" +
+ " <span title=\"xip/c:NPA\">" +
+ " <span title=\"xip/c:NOUN\">Methode</span>" +
+ " </span>" +
+ " </span>" +
+ " </span>" +
+ " <span title=\"xip/c:VERB\">ist</span>" +
+ " <span title=\"xip/c:NP\">" +
+ " <span title=\"xip/c:PRON\">es</span>" +
+ " </span>" +
+ " <span title=\"xip/c:AP\">" +
+ " <span title=\"xip/c:ADV\">nun</span>" +
+ " <span title=\"xip/c:ADJ\">möglich</span>" +
+ " </span>" +
+ " <span title=\"xip/c:ADV\">z. B.</span>" +
+ " <span title=\"xip/c:NPA\">" +
+ " <span title=\"xip/c:NP\">" +
+ " <span title=\"xip/c:NOUN\">Voice</span>" +
+ " </span>" +
+ " </span>" + "(" +
+ " <span title=\"xip/c:INS\">" +
+ " <span title=\"xip/c:NPA\">" +
+ " <span title=\"xip/c:NP\">" +
+ " <span title=\"xip/c:NOUN\">Sprache</span>" +
+ " </span>" +
+ " </span>" +
+ " </span>" + ")" +
+ " <span title=\"xip/c:VERB\">bevorzugt</span>" +
+ " <span title=\"xip/c:PP\">" +
+ " <span title=\"xip/c:PREP\">in</span>" +
+ " <span title=\"xip/c:NP\">" +
+ " <span title=\"xip/c:PRON\">der</span>" +
+ " </span>" +
+ " <span title=\"xip/c:NPA\">" +
+ " <span title=\"xip/c:NP\">" +
+ " <span title=\"xip/c:NOUN\">Bridge</span>" +
+ " </span>" +
+ " </span>" +
+ " </span>" +
+ " <span title=\"xip/c:INFC\">" +
+ " <span title=\"xip/c:INS\">" +
+ " <span title=\"xip/c:VERB\">weiterzugeben</span>" +
+ " </span>" +
+ " </span>" +
+ " </span>" +
+ " </span>" +
+ "</span>" +
+ "<span class=\"context-right\"></span>";
+
+var available =[
+ 'base/s=spans',
+ 'corenlp/c=spans',
+ 'corenlp/ne=tokens',
+ 'corenlp/p=tokens',
+ 'corenlp/s=spans',
+ 'glemm/l=tokens',
+ 'mate/l=tokens',
+ 'mate/m=tokens',
+ 'mate/p=tokens',
+ 'opennlp/p=tokens',
+ 'opennlp/s=spans',
+ 'tt/l=tokens',
+ 'tt/p=tokens',
+ 'tt/s=spans'
+];
+
+var match = {
+ 'corpusID' : 'WPD',
+ 'docID' : 'UUU',
+ 'textID' : '01912',
+ 'pos' : 'p121-122',
+ 'available' : available
+};
+
+// Parse and show the table
+// Override getMatchInfo API call
+KorAP.API.getMatchInfo = function(match, callObj) {
+ if (callObj["spans"] !== undefined && callObj["spans"] === true) {
+ return { "snippet": treeSnippet };
+ }
+ else {
+ return { "snippet": snippet };
+ }
+};
+
+var e = KorAP.Match.create(match).open();
+
+document.getElementsByTagName('body')[0].appendChild(e.element());
+
+e.addTree('cnx', 'c');
+
+
+
+/*
+var t = KorAP.MatchInfo.create(match, available).getTable();
+document.getElementsByClassName('matchtable')[0]
+.appendChild(t.element());
+
+// parse and show the tree
+KorAP.API.getMatchInfo = function() {
+ return { "snippet": treeSnippet };
+};
+
+var tree = KorAP.MatchInfo.create(match, available).getTree();
+document.getElementsByClassName('matchtree')[0]
+.getElementsByTagName('div')[0]
+.appendChild(tree.element());
+
+tree.center();
+*/
+ </script>
+
+ <!--
+ <div class="matchinfo">
+ <div class="matchtable">
+ <table>
+ <thead>
+ <tr>
+ <th>Foundry</th>
+ <th>Layer</th>
+ <th>Ich</th>
+ <th>Du</th>
+ <th>Er</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr tabindex="0">
+ <th>Hallo</th>
+ <th>X</th>
+ <td>ABC DEF GHI JKL MNO PQR STU VWX YZ ABC DEF GHI JKL MNO PQR STU VWX YZ</td>
+ <td>ABC DEF GHI JKL MNO PQR STU VWX YZ ABC DEF GHI JKL MNO PQR STU VWX YZ<br />ABC DEF GHI JKL MNO PQR STU VWX YZ ABC DEF GHI JKL MNO PQR STU VWX YZ</td>
+ <td>ABC DEF GHI JKL MNO PQR STU VWX YZ ABC DEF GHI JKL MNO PQR STU VWX YZ</td>
+ </tr>
+ <tr tabindex="0">
+ <th>geht</th>
+ <th>y</th>
+ <td>ABC DEF GHI JKL MNO PQR STU VWX YZ ABC DEF GHI JKL MNO PQR STU VWX YZ</td>
+ <td>ABC DEF GHI JKL MNO PQR STU VWX YZ ABC DEF GHI JKL MNO PQR STU VWX YZ</td>
+ <td>ABC DEF GHI JKL MNO PQR STU VWX YZ ABC DEF GHI JKL MNO PQR STU VWX YZ<br />ABC DEF GHI JKL MNO PQR STU VWX YZ ABC DEF GHI JKL MNO PQR STU VWX YZ<br />ABC DEF GHI JKL MNO PQR STU VWX YZ ABC DEF GHI JKL MNO PQR STU VWX YZ</td>
+ </tr>
+ <tr tabindex="0">
+ <th>es</th>
+ <th>z</th>
+ <td>ABC DEF GHI JKL MNO PQR STU VWX YZ ABC DEF GHI JKL MNO PQR STU VWX YZ</td>
+ <td>ABC DEF GHI JKL MNO PQR STU VWX YZ ABC DEF GHI JKL MNO PQR STU VWX YZ</td>
+ <td>ABC DEF GHI JKL MNO PQR STU VWX YZ ABC DEF GHI JKL MNO PQR STU VWX YZ<br />ABC DEF GHI JKL MNO PQR STU VWX YZ ABC DEF GHI JKL MNO PQR STU VWX YZ<br />ABC DEF GHI JKL MNO PQR STU VWX YZ ABC DEF GHI JKL MNO PQR STU VWX YZ</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+ -->
+
+ </body>
+</html>