Added lwc relation example

Change-Id: I5ece17297a39ceff815e648d189ddbf3110371b7
diff --git a/dev/demo/relations.html b/dev/demo/relations.html
index fc4ce98..7ef6687 100644
--- a/dev/demo/relations.html
+++ b/dev/demo/relations.html
@@ -16,6 +16,7 @@
             <div class="matchtree">
               <div id="treeRel"></div>
               <div id="treeRel2"></div>
+              <div id="treeRel3"></div>
               <div id="treeHier"></div>
             </div>
           </div>
diff --git a/dev/demo/relationsdemo.js b/dev/demo/relationsdemo.js
index 5faa359..9c2b38f 100644
--- a/dev/demo/relationsdemo.js
+++ b/dev/demo/relationsdemo.js
@@ -158,6 +158,57 @@
   "<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>";
+
+
 requirejs.config({
   baseUrl: '../js/src',
   paths : {
@@ -204,6 +255,10 @@
   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());
 });