Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse code

added sub concepts and expand

  • Loading branch information...
commit dcfe5c85aa55c296ec20a474d580ae8d55e2841f 1 parent b6dc9e6
Michael Hausenblas authored February 29, 2012
44  sandbox/schema-org-nav/rdfa.css
... ...
@@ -1,3 +1,7 @@
  1
+body {
  2
+	padding: 5px;
  3
+}
  4
+
1 5
 span.h {
2 6
 	padding-left: 0px;
3 7
 	font-weight: bold;
@@ -9,24 +13,39 @@ span {
9 13
 }
10 14
 
11 15
 #nav {
12  
-	position: absolute;
  16
+	font-family: Helvetica;
  17
+	position: fixed;
13 18
 	right: 10px;
14 19
 	top: 10px;
  20
+	border: 1px solid #e0e0e0;
  21
+	background: #f0f0f0;
15 22
 	display: none;
16 23
 }
17 24
 
18 25
 #nav-output {
19  
-	position: absolute;
  26
+	font-family: Helvetica;
  27
+	position: fixed;
20 28
 	right: 10px;
21 29
 	top: 10px;
22  
-	font-size: 90%;
23 30
 	border: 1px solid #e0e0e0;
24  
-	padding: 10px;
25  
-	width: 200px;
26 31
 	background: #f0f0f0;
  32
+	padding: 10px;
  33
+	width: 300px;
27 34
 	display: none;
28 35
 }
29 36
 
  37
+#nav-output h3 {
  38
+	font-size: 90%;
  39
+	border-bottom: 1px solid #e0e0e0;
  40
+	padding: 5px;
  41
+}
  42
+
  43
+#nav-output div {
  44
+	font-size: 80%;
  45
+	padding: 2px;
  46
+}
  47
+
  48
+
30 49
 #explore {
31 50
 	color: #00e;
32 51
 	cursor: pointer;
@@ -41,4 +60,19 @@ span {
41 60
 }
42 61
 
43 62
 .lnk {
  63
+	margin: 10px;
  64
+}
  65
+
  66
+.lnk span {
  67
+	width: 200px;
  68
+}
  69
+
  70
+.lnk span.expand {
  71
+	font-size: 100%;
  72
+	border: 1px solid #e0e0e0;
  73
+	width: 10px;
  74
+	float: left;
  75
+	margin-right: 5px;
  76
+	cursor: pointer;
  77
+	padding: 0 0 0 2px;
44 78
 }
4  sandbox/schema-org-nav/rdfa.html
@@ -13,7 +13,7 @@
13 13
   xmlns:doap="http://usefulinc.com/ns/doap#">
14 14
   <head>
15 15
 	<title>RDFa Lite Reflection</title>
16  
-	<link rel="stylesheet" href="rdfa.css">
  16
+	<link rel="stylesheet" href="rdfa.css" />
17 17
   </head>
18 18
 
19 19
   <body>
@@ -3216,7 +3216,7 @@
3216 3216
 
3217 3217
 	<!-- local libs to boost performance: -->
3218 3218
 	<script src="lib/jquery.min.js"></script>
3219  
-	<script src="lib/jquery-ui.min.js"></script>
  3219
+	<!-- <script src="lib/jquery-ui.min.js"></script> -->
3220 3220
 	<script src="lib/jquery.rdfquery.rdfa.min-1.0.js"></script>
3221 3221
 	<script src="schema-org-nav.js"></script>
3222 3222
   </body>
46  sandbox/schema-org-nav/schema-org-nav.js
... ...
@@ -1,13 +1,12 @@
1 1
 var SCHEMA_ORG_BASE = 'http://schema.org/';
2  
-var rdf;
  2
+var rdf; // see http://code.google.com/p/rdfquery/wiki/RdfPlugin for documentation
3 3
 var num_triples = 0;
4 4
 
5 5
 $(function() {
6  
-	// init - see http://code.google.com/p/rdfquery/wiki/RdfPlugin for documentation
7 6
 	rdf = $('div').rdf(); // extract all RDFa markup from any div
8 7
 	all_triples(rdf, false); // generic processing of all triples; currently just counts it
9  
-	$('#nav').slideDown('slow');
10  
-
  8
+	show_nav();
  9
+	
11 10
 	$('#explore').click(function() {
12 11
  		render_toplevel_things(rdf);
13 12
 		hide_nav();
@@ -18,9 +17,39 @@ $(function() {
18 17
 		$('#'+targetID).css('border', '1px solid #ff3333');
19 18
 //		return true;
20 19
 	});
  20
+	
  21
+	$(".lnk .expand").live("click", function(){
  22
+		var conceptID = $(this).attr('id').toString().substring('expand___'.length);
  23
+		render_concept(rdf, conceptID, 'Thing');
  24
+	});
  25
+	
21 26
 });
22 27
 
23  
-function render_toplevel_things(rdf, do_log){
  28
+
  29
+function render_concept(rdf, conceptID, parentID){
  30
+	var things = []; // the things (direct sub-classes of concept)
  31
+	
  32
+	$('#subconcepts').html('<h3>' + parentID + ' : ' + conceptID + "</h3>");
  33
+	
  34
+	rdf
  35
+	.prefix('rdfs', 'http://www.w3.org/2000/01/rdf-schema#')
  36
+	.where('?s rdfs:subClassOf <http://schema.org/'+ conceptID + '>')
  37
+	.each(function () {
  38
+		if($.inArray(this.s.value, things) == -1){ // not already in the seen list, remember each subject only once
  39
+			things.push(this.s.value);
  40
+		}
  41
+	});
  42
+	// present things in alphabetical order
  43
+	things.sort(); 
  44
+	for(i=0; i < things.length; i++){
  45
+		var t = things[i].toString().substring(SCHEMA_ORG_BASE.length);
  46
+		var t_id = '__'+ t;
  47
+		$('<div class="dynanchor" id="' + t_id + '" >&middot;</div>').insertBefore('div[about|="'+ things[i]  + '"]'); // find the div and add an @id before
  48
+		$('#subconcepts').append('<div class="lnk"><span class="expand" id="expand_' +  t_id + '" title="expand this concept">&laquo;</span><span><a href="#' + t_id +'">' + t + '</a></span></div>'); // build result
  49
+	}
  50
+}
  51
+
  52
+function render_toplevel_things(rdf){
24 53
 	var toplevel_things = []; // the top level things (direct sub-classes of schema:Thing)
25 54
 	$('#nav-output').html('<h3>Top-level concepts</h3>');
26 55
 	$('#nav-output').slideDown('slow');
@@ -38,14 +67,19 @@ function render_toplevel_things(rdf, do_log){
38 67
 		var t = toplevel_things[i].toString().substring(SCHEMA_ORG_BASE.length);
39 68
 		var t_id = '__'+ t;
40 69
 		$('<div class="dynanchor" id="' + t_id + '" >&middot;</div>').insertBefore('div[about|="'+ toplevel_things[i]  + '"]'); // find the div and add an @id before
41  
-		$('#nav-output').append('<div class="lnk"><a href="#' + t_id +'">' + t + '</a></div>'); // build result
  70
+		$('#nav-output').append('<div class="lnk"><span class="expand" id="expand_' +  t_id + '" title="expand this concept">&laquo;</span><span><a href="#' + t_id +'">' + t + '</a></span></div>'); // build result
42 71
 	}
  72
+	$('#nav-output').append('<div id="subconcepts" />');
43 73
 }
44 74
 
45 75
 function hide_nav(){
46 76
 	$('#nav').slideUp('fast');
47 77
 }
48 78
 
  79
+function show_nav(){
  80
+	$('#nav').slideDown('slow');
  81
+}
  82
+
49 83
 function all_triples(rdf, do_log){
50 84
 	rdf
51 85
 	.where('?s ?p ?o')

0 notes on commit dcfe5c8

Please sign in to comment.
Something went wrong with that request. Please try again.