view light9/rdfdb/web/index.xhtml @ 842:c0025b69a73f

fix web ui abbrevs for xs: Ignore-this: 8fa2219e81e33840f839230f0526ed44
author drewp@bigasterisk.com
date Tue, 26 Mar 2013 07:08:44 +0000
parents 321fc6150ee3
children a4632a7b2e17
line wrap: on
line source

<?xml version="1.0" encoding="utf8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>rdfdb</title>
    <link rel="stylesheet" type="text/css" href="style.css"/>
  </head>
  <body>
    <h1>rdfdb</h1>
    <p>status: <span id="status">starting...</span></p>
    
    <section>
      <h2>Edits</h2>
      <div id="patches"></div>
    </section>

    <p>Clients: <span id="clients"/></p>

    <fieldset>
      <legend>Messages</legend>
      <div id="out"></div>
    </fieldset>

    <script type="text/javascript" src="lib/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="websocket.js"></script>
    <script type="text/javascript">
      // <![CDATA[
      $(function(){

          function collapseCuries(s) {
            // this is temporary. The correct thing is to parse the quad (or receive it as a tree) and then make links to the full URIs and display curies of them

              return s
                  .replace(/<http:\/\/www.w3.org\/2001\/XMLSchema#(.*?)>/g, function (match, short) { return "xsd:"+short; })
                  .replace(/<http:\/\/light9.bigasterisk.com\/(.*?)>/g, function (match, short) { return "light9:"+short; })
                  .replace(/<http:\/\/light9.bigasterisk.com\/show\/dance2012\/sessions\/(.*?)>/g, function (match, short) { return "kcsession:"+short });
          }

          function onMessage(d) {
              if (d.clients !== undefined) {
                  $("#clients").empty().text(JSON.stringify(d.clients));
              }
              if (d.patch !== undefined) {
                  $("#patches").prepend(
                      $("<fieldset>").addClass("patch")
                          .append($("<legend>").text("Patch"))
                          .append($("<div>").addClass("deletes").text(collapseCuries(d.patch.deletes)))
                          .append($("<div>").addClass("adds").text(collapseCuries(d.patch.adds)))
                  );
              }

              $('#out').append($('<div>').text(JSON.stringify(d)));
          }
          reconnectingWebSocket("ws://localhost:8051/live", onMessage);
      });
      // ]]>
    </script>

  </body>
</html>