Gitiles
Code Review Sign In
korap.ids-mannheim.de / KorAP / Kalamar / 24866cfab7fae7ac30eceb86ea5147dc9de69e6c / . / dev / demo / relationsdemo.js
blob: 7519ffebcecca38bd3c19e47edb70e9799538c7e [file] [log] [blame]
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 relSnippet =
"<span class=\"context-left\"></span>" +
"<span class=\"match\">" +
" <span xml:id=\"token-GOE/AGA/01784-p199\">" +
" <span xlink:title=\"malt/d:ADV\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p199\">dann</span>" +
" </span>" +
" zog " +
" <span xlink:title=\"malt/d:SUBJ\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p199\">ich</span>" +
" <span xml:id=\"token-GOE/AGA/01784-p202\">" +
" <span xlink:title=\"malt/d:OBJA\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p199\">mich</span>" +
" </span>" +
" <span xlink:title=\"malt/d:PP\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p199\">gegen</span>" +
" <span xml:id=\"token-GOE/AGA/01784-p204\">" +
" <span xlink:title=\"malt/d:DET\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p204\">das</span>" +
" </span>" +
" <span xlink:title=\"malt/d:PN\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p202\">Regiment</span>" +
" <span xml:id=\"token-GOE/AGA/01784-p206\">" +
" <span xlink:title=\"malt/d:AVZ\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p199\">zurück</span>" +
" </span>" +
" <span xml:id=\"token-GOE/AGA/01784-p207\">" +
" <span xlink:title=\"malt/d:KON\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p199\">und</span>" +
" </span>" +
" <span xml:id=\"token-GOE/AGA/01784-p208\">" +
" <span xlink:title=\"malt/d:CJ\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p206\">war</span>" +
" </span>" +
" <span xlink:title=\"malt/d:AUX\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p207\">bemüht</span>" +
"," +
" <span xlink:title=\"malt/d:DET\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p211\">einige</span>" +
" <span xml:id=\"token-GOE/AGA/01784-p211\">" +
" <span xlink:title=\"malt/d:ATTR\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p211\">genaue</span>" +
" </span>" +
" <span xml:id=\"token-GOE/AGA/01784-p212\">" +
" <span xlink:title=\"malt/d:OBJA\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p215\">Umrisse</span>" +
" </span>" +
" <span xlink:title=\"malt/d:OBJP\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p215\">aufs</span>" +
" <span xlink:title=\"malt/d:PN\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p212\">Papier</span>" +
" <span xml:id=\"token-GOE/AGA/01784-p215\">" +
" <span xlink:title=\"malt/d:PART\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p215\">zu</span>" +
" </span>" +
" <span xlink:title=\"malt/d:OBJI\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p208\">bringen</span>" +
", um mir " +
" <span xml:id=\"token-GOE/AGA/01784-p219\">" +
" <span xlink:title=\"malt/d:DET\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p219\">die</span>" +
" </span>" +
" <span xml:id=\"token-GOE/AGA/01784-p220\">Bezüge</span>" +
" <span xlink:title=\"malt/d:KON\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p219\">und</span>" +
" <span xml:id=\"token-GOE/AGA/01784-p222\">" +
" <span xlink:title=\"malt/d:DET\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p222\">die</span>" +
" </span>" +
" <span xlink:title=\"malt/d:CJ\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p220\">Distanzen</span>" +
" <mark>" +
" <span xlink:title=\"malt/d:DET\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p225\">der</span>" +
" </mark>" +
" <span xml:id=\"token-GOE/AGA/01784-p225\">" +
" <span xlink:title=\"malt/d:ATTR\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p225\">landschaftlichen</span>" +
" </span>" +
" <span xml:id=\"token-GOE/AGA/01784-p226\">" +
" <span xlink:title=\"malt/d:GMOD\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p222\">Gegenstände</span>" +
" </span>" +
" <span xlink:title=\"malt/d:KON\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p219\">desto</span>" +
" <span xlink:title=\"malt/d:ADV\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p229\">besser</span>" +
" <span xml:id=\"token-GOE/AGA/01784-p229\">" +
" <span xlink:title=\"malt/d:PART\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p229\">zu</span>" +
" </span>" +
" <span xlink:title=\"malt/d:CJ\" xlink:type=\"simple\" xlink:href=\"#token-GOE/AGA/01784-p226\">imprimieren</span>" +
"</span>" +
"<span class=\"context-right\"></span>";
/*
* ___OBJA____
* |_________|____DET________
* |_________|____ |
* |_SUBJ_ | | |
* ___|_____|__ADV_ | ___PP____|
* | Y | | Y Y | Y|
* -|------ | -|-----|-- ----------
* dann zog ich mich gegen das Altern
* 1 2 3 4 5 6 7
*/
relSnippet =
// var relSnippetSimple =
"<span class=\"context-left\"></span>" +
"<span class=\"match\">" +
" <span xml:id=\"token-1\">" +
" <span xlink:title=\"malt/d:ADV\" xlink:type=\"simple\" xlink:href=\"#token-4\">dann</span>" +
" zog " +
" </span>" +
" <span xlink:title=\"malt/d:SUBJ\" xlink:type=\"simple\" xlink:href=\"#token-1\">ich</span>" +
" <span xml:id=\"token-4\">" +
" <span xlink:title=\"malt/d:OBJA\" xlink:type=\"simple\" xlink:href=\"#token-1\">mich</span>" +
" <span xlink:title=\"malt/d:PP\" xlink:type=\"simple\" xlink:href=\"#token-3\">gegen</span>" +
" </span>" +
" <span xml:id=\"token-3\">" +
" <span xlink:title=\"malt/d:DET\" xlink:type=\"simple\" xlink:href=\"#token-1\">" +
" das" +
" <span xml:id=\"token-2\">Altern</span>" +
" </span>" +
" </span>" +
"</span>" +
"<span class=\"context-right\"></span>";
// This is just a temprary example
var relSnippet3 =
"<span class=\"context-left\"></span>"+
"<span class=\"match\">"+
"<span xml:id=\"token-WDD17/982/72848-p15836-15839\">"+
"<span xlink:title=\"lwc/d:NK\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15838\">Ein</span>"+
" "+
"<span xlink:title=\"lwc/d:NK\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15838\">letztes</span>"+
" "+
"<span xml:id=\"token-WDD17/982/72848-p15838\">"+
"<span xlink:title=\"lwc/d:--\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15836-15839\">mal</span>"+
"</span>"+
": "+
"<span xml:id=\"token-WDD17/982/72848-p15839-15840\">"+
"<span xlink:title=\"lwc/d:--\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15839-15840\">AL</span>"+
"</span>"+
"</span>"+
// Here is a double given id, that should use a join instead!
"<span xml:id=\"token-WDD17/982/72848-p15839-15840\">"+
":"+
"<span xml:id=\"token-WDD17/982/72848-p15840-15846\">"+
"<span xml:id=\"token-WDD17/982/72848-p15840\">"+
"<span xlink:title=\"lwc/d:--\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15840-15846\">halt</span>"+
"</span>"+
"</span>"+
"</span>"+
"<span xml:id=\"token-WDD17/982/72848-p15840-15846\">"+
" "+
"<span xlink:title=\"lwc/d:NK\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15842\">den</span>"+
" "+
"<span xml:id=\"token-WDD17/982/72848-p15842\">"+
"<span xlink:title=\"lwc/d:OA\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15843\">Ball</span>"+
"</span>"+
" "+
"<span xml:id=\"token-WDD17/982/72848-p15843\">"+
"<span xlink:title=\"lwc/d:PD\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15840\">flach</span>"+
"</span>"+
", "+
"<mark>"+
"<span xlink:title=\"lwc/d:MO\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15845\">ganz</span>"+
" "+
"<span xml:id=\"token-WDD17/982/72848-p15845\">"+
"<span xlink:title=\"lwc/d:CJ\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15843\">flach</span>"+
"</span>"+
"</mark>"+
"</span>"+
"</span>"+
"<span class=\"context-right\"></span>";
relSnippet3 =
"<span class=\"context-left\"></span>"+
"<span class=\"match\">"+
"<span xml:id=\"token-WDD17/982/72848-p15836-15839\">"+
"<span xlink:title=\"lwc/d:NK\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15838\">Ein</span>"+
" "+
"<span xlink:title=\"lwc/d:NK\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15838\">letztes</span>"+
" "+
"<span xml:id=\"token-WDD17/982/72848-p15838\">"+
"<span xlink:title=\"lwc/d:--\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15836-15839\">mal</span>"+
"</span>"+
": "+
"<span xml:id=\"token-WDD17/982/72848-p15839-15840\">"+
"<span xlink:title=\"lwc/d:--\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15839-15840\">AL</span>"+
"</span>"+
"</span>"+
"<span xlink:type=\"join\" xlink:href=\"#token-WDD17/982/72848-p15839-15840\">"+
":"+
"<span xml:id=\"token-WDD17/982/72848-p15840-15846\">"+
"<span xml:id=\"token-WDD17/982/72848-p15840\">"+
"<span xlink:title=\"lwc/d:--\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15840-15846\">halt</span>"+
"</span>"+
"</span>"+
"</span>"+
// "<span xml:id=\"token-WDD17/982/72848-p15840-15846\">"+
"<span xlink:type=\"join\" xlink:href=\"#token-WDD17/982/72848-p15840-15846\">"+
" "+
"<span xlink:title=\"lwc/d:NK\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15842\">den</span>"+
" "+
"<span xml:id=\"token-WDD17/982/72848-p15842\">"+
"<span xlink:title=\"lwc/d:OA\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15843\">Ball</span>"+
"</span>"+
" "+
"<span xml:id=\"token-WDD17/982/72848-p15843\">"+
"<span xlink:title=\"lwc/d:PD\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15840\">flach</span>"+
"</span>"+
", "+
"<mark>"+
"<span xlink:title=\"lwc/d:MO\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15845\">ganz</span>"+
" "+
"<span xml:id=\"token-WDD17/982/72848-p15845\">"+
"<span xlink:title=\"lwc/d:CJ\" xlink:type=\"simple\" xlink:href=\"#token-WDD17/982/72848-p15843\">flach</span>"+
"</span>"+
"</mark>"+
"</span>"+
"</span>"+
"<span class=\"context-right\"></span>";
// xlink conformant
relSnippet3 =
"<span class=\"context-left\"></span>"+
"<span class=\"match\">"+
" <span xml:id=\"token-WDD17/982/72848-p15836-15839\">"+
" <span xlink:title=\"lwc/d:NK\" xlink:show=\"none\" xlink:href=\"#token-WDD17/982/72848-p15838\">Ein</span>"+
" "+
" <span xlink:title=\"lwc/d:NK\" xlink:show=\"none\" xlink:href=\"#token-WDD17/982/72848-p15838\">letztes</span>"+
" "+
" <span xml:id=\"token-WDD17/982/72848-p15838\">"+
// s1464_n2 "ein" -> ":"
" <span xlink:title=\"lwc/d:--\" xlink:show=\"none\" xlink:href=\"#token-WDD17/982/72848-p15836-15839\">mal</span>"+
" </span>"+
": "+
" <span xml:id=\"token-WDD17/982/72848-p15839-15840\">"+
" <span xlink:title=\"lwc/d:--\" xlink:show=\"none\" xlink:href=\"#token-WDD17/982/72848-p15839-15840\">AL</span>"+
" </span>"+
" </span>"+
" <span xlink:show=\"other\" data-action=\"join\" xlink:href=\"#token-WDD17/982/72848-p15839-15840\">"+
":"+
" <span xml:id=\"token-WDD17/982/72848-p15840-15846\">"+
" <span xml:id=\"token-WDD17/982/72848-p15840\">"+
" <span xlink:title=\"lwc/d:--\" xlink:show=\"none\" xlink:href=\"#token-WDD17/982/72848-p15840-15846\">halt</span>"+
" </span>"+
" </span>"+
" </span>"+
" <span xlink:show=\"other\" data-action=\"join\" xlink:href=\"#token-WDD17/982/72848-p15840-15846\">"+
" "+
" <span xlink:title=\"lwc/d:NK\" xlink:show=\"none\" xlink:href=\"#token-WDD17/982/72848-p15842\">den</span>"+
" "+
" <span xml:id=\"token-WDD17/982/72848-p15842\">"+
" <span xlink:title=\"lwc/d:OA\" xlink:show=\"none\" xlink:href=\"#token-WDD17/982/72848-p15843\">Ball</span>"+
" </span>"+
" "+
" <span xml:id=\"token-WDD17/982/72848-p15843\">"+
" <span xlink:title=\"lwc/d:PD\" xlink:show=\"none\" xlink:href=\"#token-WDD17/982/72848-p15840\">flach</span>"+
" </span>"+
", "+
" <mark>"+
" <span xlink:title=\"lwc/d:MO\" xlink:show=\"none\" xlink:href=\"#token-WDD17/982/72848-p15845\">ganz</span>"+
" "+
" <span xml:id=\"token-WDD17/982/72848-p15845\">"+
" <span xlink:title=\"lwc/d:CJ\" xlink:show=\"none\" xlink:href=\"#token-WDD17/982/72848-p15843\">flach</span>"+
" </span>"+
" </mark>"+
" </span>"+
"</span>"+
"<span class=\"context-right\"></span>";
requirejs.config({
baseUrl: '../js/src',
paths : {
'lib': '../lib'
}
});
require(['match/relations', 'match/tree'], function (relClass, treeClass) {
var rel = relClass.create();
/*
* Start and end may be spans, i.e. arrays
*/
rel
.addToken("Der")
.addToken("alte")
.addToken("Mann")
.addToken("ging")
.addToken("über")
.addToken("die")
.addToken("breite")
.addToken("nasse")
.addToken("Straße")
;
rel
.addRel({ start: 0, end: 1, label: "a", direction: "uni"})
.addRel({ start: 0, end: 1, label: "b", direction: "uni" })
.addRel({ start: 1, end: 2, label: "c", direction: "bi" })
.addRel({ start: 0, end: 2, label: "dreizehn", direction: "uni" })
.addRel({ start: [2,4], end: 5, label: "e", direction: "uni" })
.addRel({ start: [5,6], end: 7, direction: "uni" })
.addRel({ start: 4, end: [6,8], label: "f", direction: "bi" })
.addRel({ start: 8, end: 8, label: "self", direction: "uni"})
;
document.getElementById("treeRel").appendChild(rel.element());
// Todo: Probably rename to rel.draw()
rel.show();
var rel2 = relClass.create(relSnippet);
document.getElementById("treeRel2").appendChild(rel2.element());
rel2.show();
var rel3 = relClass.create(relSnippet3);
document.getElementById("treeRel3").appendChild(rel3.element());
rel3.show();
var tree = treeClass.create(treeSnippet);
document.getElementById("treeHier").appendChild(tree.element());
});