view service/reasoning/index.html @ 1043:5d5106570128

style /reasoning/ page Ignore-this: e5633a0ed89f61f5f099a46c44ecc32c darcs-hash:4dd415f974e69a1a9f90a637d6cff56aa1a02d83
author drewp <drewp@bigasterisk.com>
date Mon, 01 Feb 2016 02:54:30 -0800
parents aabb6ef60042
children 3f355dd1687c
line wrap: on
line source

<!DOCTYPE html>
<html>
  <head>
    <title>reasoning</title>
    <script src="/lib/polymer/1.0.9/webcomponentsjs/webcomponents.min.js"></script>
    <link rel="import" href="/lib/polymer/1.0.9/iron-collapse/iron-collapse.html"
    <link rel="import" href="https://bigasterisk.com/supdebug/bang/service-rows/main.html">
    <style type="text/css" media="all">
     /* <![CDATA[ */
     body {
       font-family: sans-serif;
       font-size: 12px;
     }
     pre {
       font-family: sans-serif;
     } 
     pre div {
       border-bottom: 1px solid #ccc;
     }
     .pred {
       background: #e7e6f8;
     }
     .obj {
       background: #ccf
     }
     .pane {
       position: relative;
       display: flex;
       flex-direction: column;
     }
     .pane pre {
       overflow: auto;
       flex-grow: 1;
     }
     /* ]]> */
    </style>

  </head>
  <body layout vertical fit>

    <div style="flex: 0 0 auto">
      <service-rows nameSubstrs="reasoning"></service-rows>
    </div>
    
    <div class="pane">
      <h2>Input</h2>
      <div><input id="inputQ"></div>
      <div style="max-height: 600px; margin-right: 30px; overflow: auto">
        <pre id="input"></pre>
      </div>
    </div>


    <div  class="pane">
      <h2>Rules</h2>
      <div style="max-height: 300px; margin-right: 30px; overflow: auto">
        <pre id="rules"></pre>
      </div>
    </div>


    <div  class="pane">
      <h2>Output</h2>
      <div><input id="outputQ"></div>
      <div style="max-height: 300px; margin-right: 30px; overflow: auto">
        <pre id="output"></pre>
      </div>
    </div>

    <div>
      <label><input id="auto" type="checkbox"> auto refresh</label>
    </div>

    <script src="//bigasterisk.com/lib/jquery-2.0.3.min.js"></script>
    <script>
     window.NS = {
       room: "http://projects.bigasterisk.com/room/", 
       dev: "http://projects.bigasterisk.com/device/", 
       dcterms: "http://purl.org/dc/terms/", 
       rdfs: "http://www.w3.org/2000/01/rdf-schema#", 
       map: "http://bigasterisk.com/map#", 
       rdf: "http://www.w3.org/1999/02/22-rdf-syntax-ns#", 
     };
    </script>
    <link rel="import" href="/rdf/rdf-uri.html">
    <script type="text/javascript">
     // <![CDATA[
     $(function () { 

       function makeAddStmts(elem, q) {
	 return function (stmts) {
	   elem.empty();
	   $.each(stmts, function (i, stmt) {
             var s = BigastUri.compactUri(stmt[0]);
             var p = BigastUri.compactUri(stmt[1]);
             var o = BigastUri.compactUri(stmt[2]);

             if (q.toLowerCase() &&
                 s.toLowerCase().indexOf(q) == -1 &&
                 p.toLowerCase().indexOf(q) == -1 &&
                 o.toLowerCase().indexOf(q) == -1) {
               return;
             }
             
	     elem.append(
               $("<div>")
                  .append($("<span>").text(s))
                  .append(" ")
                  .append($("<span>").addClass("pred").text(p))
                  .append(" ")
                  .append($("<span>").addClass("obj").text(o)));
	   })
	 }
       }

       function updateIn() {
$.get("lastInputGraph", makeAddStmts($("#input"), $("#inputQ").val()));
       }
       function updateOut() {
$.get("lastOutputGraph", makeAddStmts($("#output"), $("#outputQ").val()));
         }
       
       function update() {
	 updateIn();
         updateOut();
	 $.get("rules", function (txt) { 
	   $("#rules").empty().text(txt);
	 });
       }
       $("#inputQ").on('keyup', updateIn);
       function loop() {
	 update();
	 if ($("input#auto").is(":checked")) {
	   setTimeout(loop, 2000);
	 }
       }
       loop();
       $("input#auto").click(loop);
     });
     // ]]>
    </script>
  </body>
</html>