| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>Virtual Collection demo</title> |
| <meta charset="utf-8" /> |
| <script src="../src/vc.js"></script> |
| <link href="../../css/vc.css" rel="stylesheet" type="text/css"></link> |
| <style type="text/css" rel="stylesheet"> |
| .info { |
| background-color:white; |
| color: black; |
| padding: 1em; |
| font-family: mono; |
| } |
| </style> |
| </head> |
| <body> |
| <div id="vc"></div> |
| |
| <script> |
| var json = { |
| "@type":"korap:docGroup", |
| "operation":"operation:or", |
| "operands":[ |
| { |
| "@type":"korap:docGroup", |
| "operation":"operation:and", |
| "operands":[ |
| { |
| "@type":"korap:doc", |
| "key":"Titel", |
| "value":"Baum", |
| "match":"match:eq" |
| }, |
| { |
| "@type":"korap:doc", |
| "key":"Veröffentlichungsort", |
| "value":"hihi", |
| "match":"match:eq" |
| }, |
| { |
| "@type":"korap:docGroup", |
| "operation":"operation:or", |
| "operands":[ |
| { |
| "@type":"korap:doc", |
| "key":"Titel", |
| "value":"Baum", |
| "match":"match:eq" |
| }, |
| { |
| "@type":"korap:doc", |
| "key":"Veröffentlichungsort", |
| "value":"hihi", |
| "match":"match:eq" |
| } |
| ] |
| } |
| ] |
| }, |
| { |
| "@type":"korap:doc", |
| "key":"Untertitel", |
| "value":"huhu", |
| "match":"match:eq" |
| } |
| ] |
| }; |
| var vc = KorAP.VirtualCollection.render(json); |
| document.getElementById('vc').appendChild(vc.element()); |
| |
| function showJSON() { |
| document.getElementById("json").innerHTML = JSON.stringify(vc.root().toJson()); |
| }; |
| |
| function showString() { |
| document.getElementById("string").innerHTML = vc.root().toString(); |
| }; |
| |
| </script> |
| |
| <hr /> |
| |
| <p><a onclick="showJSON()" style="cursor:pointer">show JSON!</a></p> |
| <div id="json" class="info"></div> |
| |
| <hr /> |
| |
| <p><a onclick="showString()" style="cursor:pointer">show String!</a></p> |
| <div id="string" class="info"></div> |
| |
| </body> |
| </html> |