Gitiles
Code Review Sign In
korap.ids-mannheim.de / KorAP / Kalamar / ea23674fb1d8457b1138596da151db2d746fc367 / . / public / js / demo / matchInfo.html
blob: c79642b2cbe5adee78605c3589e50fd388abc0b8 [file] [log] [blame]
<!DOCTYPE html>
<html>
<head>
<title>MatchInfo demo</title>
<meta charset="utf-8" />
<script src="../lib/dagre/dagre.min.js"></script>
<script src="../src/menu.js"></script>
<script src="../src/matchInfo.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'
};
// 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.MatchInfo.create(match, available);
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>