Merged graph code

2 files changed, 110 insertions, 229 deletions

diff --git a/gstudio/templates/gstudio/display.html b/gstudio/templates/gstudio/display.html
index 751c8de..90b5b27 100644
--- a/gstudio/templates/gstudio/display.html
+++ b/gstudio/templates/gstudio/display.html
@@ -153,206 +153,61 @@
 				Javascript for Object type force graph
 				-->
    <script type="text/javascript" >
+function init(a,b)
+{
 
-    var w = 700,
-        h = 300,
-        fill = d3.scale.category20();
-
-    var vis = d3.select("#chart")
-        .append("svg:svg")
-        .attr("width", w)
-        .attr("height", h);
-
-    vis.append("svg:g").attr("class", "edges");
-    vis.append("svg:g").attr("class", "nodes");
-
-$(function() {
-  $.ajax({
-    url: '/nodetypes/graphs/version_graph_json/{{ ssid }}',
-    //crossDomain: true,
-    dataType: 'json',
-    success : function(json) {
-
-	//var node = NID.objects.get(slug='{{ slug }}');
-      var force;
-      
-	// this contains all the nodes as a dict with _id as the key
-
-      var nodes_by_id = _.reduce(json.node_metadata, function(acc, n) {
-        acc[n._id] = n;
+ 
+  nodes_by_id = _.reduce(a, function(acc, n) {
+   acc[n._id] = n;
         return acc;
       }, {});
 								       
-      var  member_of = _(json.member_of).chain().map(function(e) {
-        e.source = nodes_by_id[e.from];
-        e.target = nodes_by_id[e.to];
-        e.type = 'member_of';
-        return e;
-      }).filter(function(e){
-        return nodes_by_id[e.from] && nodes_by_id[e.to]
-      }).value();
-
-      		
-       var contains_subtypes = _(json.contains_subtypes).chain().map(function(e) {
-        e.source = nodes_by_id[e.from];
-        e.target = nodes_by_id[e.to];
-        e.type = 'contains_subtypes';
-        return e;
-      }).filter(function(e){
-        return nodes_by_id[e.from] && nodes_by_id[e.to]
-      }).value();
-      
-       var contains_members = _(json.contains_members).chain().map(function(e) {
-        e.source = nodes_by_id[e.from];
-        e.target = nodes_by_id[e.to];
-        e.type = 'contains_members';
-        return e;
-      }).filter(function(e){
-        return nodes_by_id[e.from] && nodes_by_id[e.to]
-      }).value();
-      
-
-      var  left_subjecttype_of  = _(json.left_subjecttype_of).chain().map(function(e) {
-        e.source = nodes_by_id[e.from];
-        e.target = nodes_by_id[e.to];
-        e.type = 'left_subjecttype_of';
-        return e;
-      }).filter(function(e){
-        return nodes_by_id[e.from] && nodes_by_id[e.to]
-      }).value();
-      
-
-       var subjecttype_of = _(json.subjecttype_of).chain().map(function(e) {
-        e.source = nodes_by_id[e.from];
-        e.target = nodes_by_id[e.to];
-        e.type = 'subjecttype_of';
-        return e;
-      }).filter(function(e){
-        return nodes_by_id[e.from] && nodes_by_id[e.to]
-      }).value();
-
-       var plural = _(json.plural).chain().map(function(e) {
-        e.source = nodes_by_id[e.from];
-        e.target = nodes_by_id[e.to];
-        e.type = 'plural';
-        return e;
-      }).filter(function(e){
-        return nodes_by_id[e.from] && nodes_by_id[e.to]
-      }).value();
-
-
-       var altnames = _(json.altnames).chain().map(function(e) {
-        e.source = nodes_by_id[e.from];
-        e.target = nodes_by_id[e.to];
-        e.type = 'altnames';
-        return e;
-      }).filter(function(e){
-        return nodes_by_id[e.from] && nodes_by_id[e.to]
-      }).value();
-
-	var content = _(json.content).chain().map(function(e) {
-        e.source = nodes_by_id[e.from];
-        e.target = nodes_by_id[e.to];
-        e.type = 'content';
-        return e;
-      }).filter(function(e){
-        return nodes_by_id[e.from] && nodes_by_id[e.to]
-      }).value();
-
-       var contains_members = _(json.contains_members).chain().map(function(e) {
-        e.source = nodes_by_id[e.from];
-        e.target = nodes_by_id[e.to];
-        e.type = 'contains_members';
-        return e;
-      }).filter(function(e){
-        return nodes_by_id[e.from] && nodes_by_id[e.to]
-      }).value();
-
-
-      
-       var type_of = _(json.type_of).chain().map(function(e) {
+     all_edges=new Array();
+     //this contains all the links between the nodes
+  all_edges =_(b).chain().map(function(e) {
         e.source = nodes_by_id[e.from];
         e.target = nodes_by_id[e.to];
-        e.type = 'type_of';
+	//`e.type = nodes_by_id[e.type]
         return e;
       }).filter(function(e){
-        return nodes_by_id[e.from] && nodes_by_id[e.to]
-      }).value();
-      
-      
-      var  right_subjecttype_of = _(json.right_subjecttype_of).chain().map(function(e) {
-        e.source = nodes_by_id[e.from];
-        e.target = nodes_by_id[e.to];
-        e.type = 'right_subjecttype_of';
-        return e;
-      }).filter(function(e){
-        return nodes_by_id[e.from] && nodes_by_id[e.to]
-      }).value();
-      
-
-       var follows_edges = _(json.is_followed_by).chain().map(function(e) {
-        e.source = nodes_by_id[e.from];
-        e.target = nodes_by_id[e.to];
-        e.type = 'follows_edges';
-        return e;
-      }).filter(function(e){
-        return nodes_by_id[e.from] && nodes_by_id[e.to]
-      }).value();
-      
-
-
-       var prior_nodes = _(json.prior_nodes).chain().map(function(e) {
-        e.source = nodes_by_id[e.from];
-        e.target = nodes_by_id[e.to];
-        e.type = 'prior_node';
-        return e;
-      }).filter(function(e){
-        return nodes_by_id[e.from] && nodes_by_id[e.to]
-      }).value();
+        return nodes_by_id[e.from] && nodes_by_id[e.to]&& e.type!="title" && e.type!="content" && e.type!="authors"
+      }).value();  
+ 
+$(function fgraph() {
 
-       var posterior_nodes = _(json.posterior_nodes).chain().map(function(e) {
-        e.source = nodes_by_id[e.from];
-        e.target = nodes_by_id[e.to];
-        e.type = 'posterior_node';
-        return e;
-      }).filter(function(e){
-        return nodes_by_id[e.from] && nodes_by_id[e.to]
-      }).value();
 
+$.getJSON('/nodetypes/graphs/version_graph_json/{{ ssid }}', function (json1) { 
+										metadata=json1.node_metadata;
+  										relations=json1.relations;
+									
+										init(metadata,relations);
+										load({{ssid}}) });
 
-       var mentions_edges = _(json.is_mentioned_by).chain().map(function(e) {
-        e.source = nodes_by_id[e.from];
-        e.target = nodes_by_id[e.to];
-        e.type = 'mentions_edges';
-        return e;
-      }).filter(function(e){
-        return nodes_by_id[e.from] && nodes_by_id[e.to]
-      }).value();
-      
+           
+function load(key)
+{
+   var w = 700,
+        h = 500,
+        fill = d3.scale.category20();
+ 
+  var vis = d3.select("#chart")
+        .append("svg:svg")
+	.attr("width", w)
+        .attr("height", h);       
+    vis.append("svg:g").attr("class", "edges");        
+    vis.append("svg:g").attr("class", "nodes");
+  
 
-	nodes_by_id[{{ nt.id }}].x = w/2.0;
-	nodes_by_id[{{ nt.id }}].y = h/2.0;
+	
+	nodes_by_id[{{nt.id}}].x = w/2.0;
+	nodes_by_id[{{nt.id}}].y = h/2.0;       
       
-        all_edges = new Array();
-	all_edges = all_edges.concat(follows_edges, member_of, contains_members, contains_subtypes, mentions_edges, right_subjecttype_of, left_subjecttype_of, subjecttype_of, type_of,plural,altnames,contains_members,content, prior_nodes, posterior_nodes);
-	/* all_edges.concat(follows_edges);
-         all_edges.concat(member_of_metatype);
-         all_edges.concat(contains_members);
-	 all_edges.concat(contains_subtypes);
-         all_edges.concat(mentions_edges);
-        
-
-	document.getElementById('debugbox1').value= follows_edges;  //member_of_metatype
-	document.getElementById('debugbox2').value= mentions_edges;
-        //document.getElementById('debugbox2').value= member_of_metatype;
-	document.getElementById('debugbox3').value= all_edges;
-	*/
-      var force = d3.layout.force()
-              .linkStrength(0.5)
-              .charge(-2000)
+         var force = d3.layout.force()
+              .linkStrength(0.3)
+              .charge(-5000)
               .friction(0.7)
               .gravity(0.7)
-              .linkDistance(13)
+              .linkDistance(10)
               .nodes([])
               .links([])
               .size([w, h])
@@ -378,9 +233,10 @@ $(function() {
         force.links(edges);
         force.start();
 
-        link = d3.select("#chart g.edges").selectAll("line.link")
+       link = d3.select("#chart g.edges").selectAll("line.link").select(this.arrowhead)
                 .data(edges, function(e){return e.from + "-" + e.to + "-" + e.type});
                 
+                
                 link.enter().append("svg:line")
                 .attr("class", "link")
                 .style("stroke-width", 2 /* function(d) {
@@ -401,43 +257,80 @@ $(function() {
                 .attr("text", function(d) {
                   return d.type;
                 })
+               .attr("marker-end", "url(#arrowhead)");
 
-	      .append("a")
-               .text(function(d) { return d.type; });
+	      
 	     
           
 	  var node = d3.select("#chart g.nodes").selectAll("g.node").data(nodes);
     
-          var new_g = node.enter().append("svg:a")
-              .attr("class", function(d) {  if (d._id=={{ nt.id }}) return "mainnode"; else if (isNaN(d._id)) return "relnode"; else if ((d._id)<0) return "nodetext"; else return "node"; })
-	      .attr("xlink:href",function(d){return d.url;})
-	      .call(force.drag);
-
-
-
-				  
-  	  new_g.append("svg:circle")
-			.attr("cx", function(d) { return d.x - w/2.0 + 15; })
-			.attr("cy", function(d) { return d.y - h/2.0 + 15; })
-			.attr("r", function(d) {  if (d._id=={{ nt.id }}) return 8; else if (isNaN(d._id) || (d._id)<0) return 1; else return 7 })
-                       .style("fill", function color(d) { if (d._id=={{ nt.id }}) return "red"; else if (isNaN(d._id) || (d._id)<0) return "white" ; else return "green"});
+          
 
-			
-		new_g.append("svg:text")
-			.attr("class",function(d) {  if (d._id=={{ nt.id }}) return "mainnode"; else if (isNaN(d._id)) return "relnode"; else if ((d._id)<0) return "nodetext"; else return "node"; })
-                        .attr("dy", 20)
-	                .attr("dx", 25)
-                        .attr("text-anchor",function text(d) { if (isNaN(d._id) || (d._id)<0) return "middle" ; else return "left"})
+var new_g = node.enter().append("svg:a")
+              .attr("class", function(d) { var e=(d._id).charAt(0); if (d._id=={{nt.id}}) return "mainnode"; else if (e=="-") return "nodetext"; else if (isNaN(d._id)) return "relnode"  ; else return "node"; })   	      
+	    
+	      .call(force.drag);
 
-//                        .attr("style",function text(d) { if (isNaN(d._id)) return "font-size:9.00pt;fill:#333;" ; else return "font-size:9.00pt;fill:black;"})
+			new_g.append("svg:marker")
+                                .attr("id", "arrowhead")
+                                .attr("viewBox","0 0 10 10")
+                                .attr("refX","20")
+                                .attr("refY","5")
+                                .attr("markerUnits","strokeWidth")
+                                .attr("markerWidth","9")
+                                .attr("markerHeight","5")
+                                .attr("orient","auto")
+                                .append("svg:path")
+                                .attr("d","M 0 0 L 10 5 L 0 10 z")
+                                .attr("fill", "#6D6666"); 
+
+
+					
+		text1 = new_g.append("svg:text")
+			.attr("class",function(d) {var e=(d._id).charAt(0);  if (d._id=={{nt.id}}) return "mainnode";else if (e=="-") return "nodetext"; else if (isNaN(d._id)) return "relnode";  else return "node"; })
+                        .attr("y", 20)
+	                .attr("x", 25) 
+			.attr("dy", ".35em")
+                        .attr("text-anchor","middle") 	  
+  	
     
                         .text(function(d) {
                           return d.screen_name;
                         });
 			
-                node.exit().remove();
+           bbox = text1.node().getBBox();
+		console.log(bbox);
+
         
-	
+	new_g.filter(function(d) { return (d._id).charAt(0)=="-"; }).append("svg:rect")
+                                                      .attr("x",bbox.x-22)
+						      .attr("y", bbox.y)	
+						       .attr("width", function(d) {var ttx=d.screen_name ; return (ttx.length+bbox.width+40)})
+							.attr("height", bbox.height)
+						      .call(force.drag)
+				    		      .style("fill-opacity", ".1")
+				                      .style("stroke", "#000")
+				 		      .style("stroke-width","1px"  );
+				    		      
+new_g.filter(function(d) { return (d._id)>0;}).append("svg:ellipse")
+				    .attr("cx", bbox.x+25)
+				    .attr("cy", bbox.y+13)
+				    .call(force.drag)
+				    .attr("rx",function(d) {var ttx=d.screen_name ; return (ttx.length + 40)})
+				    .attr("ry",13)
+				    .style("fill-opacity", ".2")
+				    .style("stroke", "#666")
+				    .style("stroke-width", "1.5px")
+				    .style("fill", function(d) {if (d.refType=="Objecttype") return "blue"; else if(d.refType=="Gbobject") return "red"; else return "none"});
+
+
+
+
+
+           	node.exit().remove();							
+
+
+
 
         force.on("tick", function() {
 
@@ -460,21 +353,10 @@ $(function() {
               .duration(1000)
               .style("opacity", 1);
       
-   /*   $('input#follows').change(function(){
-        update(all_edges);
-      });
-     */
+   
      
- /*	$('input#mentions').change(function(){
-        update(all_edges);
-      }); */
-    }
-  });
-  
-//  $("#relation_type").buttonset();
-  
-//  $('input#mentions').change(function(){console.log(this)});
-//  $('input#follows').change(function(){console.log(this)});
+ 
+  }
 });
 
 
diff --git a/gstudio/templates/gstudio/skeleton.html b/gstudio/templates/gstudio/skeleton.html
index 6bb3d46..c99bab9 100644
--- a/gstudio/templates/gstudio/skeleton.html
+++ b/gstudio/templates/gstudio/skeleton.html
@@ -502,7 +502,7 @@ $(window).bind('keydown',function(event) {
 
 
 			
-		var text1 = new_g.append("svg:text")
+		text1 = new_g.append("svg:text")
 			.attr("class",function(d) {var e=(d._id).charAt(0);  if (d._id==key) return "mainnode";else if (e=="-") return "nodetext"; else if (isNaN(d._id)) return "relnode";  else return "node"; })
                         .attr("y", 20)
 	                .attr("x", 25) 
@@ -514,12 +514,11 @@ $(window).bind('keydown',function(event) {
                           return d.screen_name;
                         });  
 			
-               var bbox = text1.node().getBBox();
-
+                bbox = text1.node().getBBox();
+		console.log(bbox);
 
 		new_g.filter(function(d) { return (d._id).charAt(0)=="-"; }).append("svg:rect")
-                                                      .attr("x",bbox.x-22
- )
+                                                      .attr("x",bbox.x-22)
 						      .attr("y", bbox.y)	
 						       .attr("width", function(d) {var ttx=d.screen_name ; return (ttx.length+bbox.width+40)})
 							.attr("height", bbox.height)