<html xmlns:py="http://genshi.edgewall.org/" 
  xmlns:xi="http://www.w3.org/2001/XInclude"
  py:strip=""
  >

  <py:def function="page_title">Graph</py:def> 

  <py:def function="optional_head">
<!--    <link type="text/css" href="/css/overcast/jquery-ui-1.8.1.custom.css" rel="stylesheet" />	-->
    <link type="text/css" href="/css/fresnel.css" rel="stylesheet" />	
    <style>
        div.fresnel_controls {
            display: block;
        }
        div.fresnel_edit_controls {
            float: right;
        }
        div.fresnel_value_editor label {
            font-size: 10pt;
            float: left;
        }
        div.fresnel_value_editor_value {
            clear: both;
        }
        div.fresnel_value_editor_options {
            clear: both;
        }
        div.fresnel_controls ul {
            margin: 0;
            padding: 0;
        }
        div.fresnel_controls li {
            margin: 2px;
            position: relative;
            padding: 4px 0;
            cursor: pointer;
            float: left;
            list-style: none;
        }
        div.fresnel_controls span.ui-icon {
            float: left;
            margin: 0 4px;
        }
    </style>
    <script type="text/javascript" src="/js/jquery-ui-1.8.1.custom.min.js"></script>
    <script type="text/javascript" src="/js/jquery.rdfquery.rules.min-1.0.js"></script>
    <script type="text/javascript" src="/js/jquery.ordf.js"></script>
    <script type="text/javascript" src="/js/jquery.aggregation.js"></script>
    <script type="text/javascript" src="/js/jquery.fresnel.js"></script>
    <script type="text/javascript" src="/js/jquery.fresnel.widgets.js"></script>
    <script type="text/javascript">
      var default_lens = "http://ordf.org/lens/rdfs";
      $(function(){
          var base_uri = "http://bibliographica.org/resource/";
          var graph_uri = "${c.graph.identifier if c.graph else ''}";
          var fresnel = new $.rdf.fresnel();
          var store = new $.ordf();
          var obp = new $.obp({ fresnel: fresnel, ordf: store, lens: default_lens });
          var load_graph = function() {
              store.new_resource({ base_uri: base_uri,
                                   callback: function (bank) { fresnel.addData(bank) } });
          }
          var load_aggregate = function(g) {
              obp.loadAggregate(g);
          }
          if (!graph_uri) {
              fresnel.addFresnel({ uri: default_lens, callback: load_graph });
          } else {
              store.recv({ uri: graph_uri, callback: load_aggregate });
          }
          $("#viewer")
              .Fresnel({ fresnel: fresnel, editable: true })
              .FresnelControls({ fresnel: fresnel, base_uri: base_uri });
      });
    </script>
  </py:def>

  <div py:match="content">
    <div id="viewer"></div>
  </div>

  <xi:include href="base.html" />
</html>


