Merge branch 'master' of https://github.com/gnowgi/gnowsys-studio

3 files changed, 182 insertions, 244 deletions

diff --git a/gstudio/templates/gstudio/base.html b/gstudio/templates/gstudio/base.html
index 94a72eb..0b70311 100644
--- a/gstudio/templates/gstudio/base.html
+++ b/gstudio/templates/gstudio/base.html
@@ -20,8 +20,8 @@
 {% endblock %}
 
 {% block sidebar %}
- <img src="{{ STATIC_URL }}objectapp/img/rss.png" alt="?" width="20" height="" />
- <a href="{% url objectapp_gbobject_latest_feed %}" class="feeds"><h4>Rssfeed</h4></a>
+ <img src="{{ STATIC_URL }}gstudio/img/rss.png" alt="?" width="20" height="" />
+ <a href="{% url gstudio_nodetype_latest_feed %}" class="feeds"><h4>Rssfeed</h4></a>
 
 <div class="search">
   <h3>{% trans "Search" %}</h3>
diff --git a/gstudio/templates/gstudio/graph1.html b/gstudio/templates/gstudio/graph1.html
index 587b703..ab66e51 100644
--- a/gstudio/templates/gstudio/graph1.html
+++ b/gstudio/templates/gstudio/graph1.html
@@ -94,7 +94,7 @@ $(function() {
     success : function(json) {
 
       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) {
diff --git a/gstudio/templates/gstudio/skeleton.html b/gstudio/templates/gstudio/skeleton.html
index 1fcf9cc..3b945f4 100644
--- a/gstudio/templates/gstudio/skeleton.html
+++ b/gstudio/templates/gstudio/skeleton.html
@@ -10,20 +10,20 @@
 			}
 			.nodetext {
 				#pointer-events: none;
-				font: 10px Serif;
+				font: 12px Serif;
 				font-style:italic;
 			}
 			.mainnode{
 
  				font: 15px sans-serif;
-			           fill:"red";
+			           fill:"black";
 				border-width: 1px;
 				font-weight:bold;
 				border-color: gray;
 
 			}
 			.relnode {
- 				font: 10px sans-serif;
+ 				font: 12px sans-serif;
 				font-weight:bold;
 			           fill:#000;
 			}
@@ -32,8 +32,9 @@
 			.node {
 				border-width: 1px;
 				border-color: gray;
-			        fill:"green";
- 				font: 10px sans-serif;
+			      	font: 12px sans-serif;
+					fill:#25587E;
+				font-weight:bold;
 			}
 			body {
 				background-color: white;
@@ -45,7 +46,7 @@
 				display: block;
 			}
 			svg {
-				margin-left: 10%;
+				margin-left: 0%;
 				margin-right: 10%;
 				display: block;
 				position: absolute;
@@ -168,52 +169,18 @@
 <script type="text/javascript" >
 			//alert(s)
 	//if ( parseInt(s) > 0 ){
-    			var a = 25 * s;
-	
-			if ( a > 700 )
-				{
-	   				 var w = 700;
-				}
-			else
-				{ 
-				          var w = a;
-				} 
     			
-   			var h = 24 * s,
 		//	}
 //	else{
   //  			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");
-
-
-
-	
-var gid={{object.id}};
-$(function fgraph(gid) {
 
+function init(a,b)
+{
+ 
   
- $.ajax({
-    url: '/nodetypes/graphs/graph_json/{{object.id}}',
-    //crossDomain: true,
-    dataType: 'json',
-    success : function (json) {
-
-	
-      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) {
+  nodes_by_id = _.reduce(a, function(acc, n) {
         acc[n._id] = n;
         return acc;
       }, {});
@@ -222,184 +189,71 @@ $(function fgraph(gid) {
 	all_edges=new Array();  
 
 	//this contains all the links between the nodes
-  all_edges =_(json.relations).chain().map(function(e) {
+  all_edges =_(b).chain().map(function(e) {
         e.source = nodes_by_id[e.from];
         e.target = nodes_by_id[e.to];
-
+	//`e.type = nodes_by_id[e.type]
         return e;
       }).filter(function(e){
-        return nodes_by_id[e.from] && nodes_by_id[e.to]&& e.type!="title"
+        return nodes_by_id[e.from] && nodes_by_id[e.to]&& e.type!="title" && e.type!="content" 
       }).value();
 
 
-	nodes_by_id[{{object.id}}].x = w/2.0;
-	nodes_by_id[{{object.id}}].y = h/2.0;
-      
- 
-
-	       
-   /*  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();
-      
+$(function fgraph() {
+		  
 
-      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();
-      
+$.getJSON('/nodetypes/graphs/graph_json/' + {{object.id}}, function (json1) { 
+										metadata=json1.node_metadata;
+  										relations=json1.relations;
+										relnset=json1.relset
+										init(metadata,relations);
+										load({{object.id}}) });
 
-       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();
+function load(key)
+{
+  
+			if (s > 0 ){
+			var a = 50 * s;
+			var w = 700;
+	   		var p = 100 + "%";
+			var h = 600;
+   			var q = 3 * s + 35 + "%";
+			}else{
+			var w = 700;
+	   		var p = 100 + "%";
+			var h = 600;
+   			var q = 110 + "%";			
+			}
+        fill = d3.scale.category20();
+ 
+  var vis = d3.select("#chart")
+        .append("svg:svg")
+	.attr("id", "amazingViz") 
+        .attr("width", p)
+        .attr("height", q);
 
+    vis.append("svg:g").attr("class", "edges");        
+    vis.append("svg:g").attr("class", "nodes");
+  
 
-       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 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) {
-        e.source = nodes_by_id[e.from];
-        e.target = nodes_by_id[e.to];
-        e.type = 'type_of';
-        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();
+	nodes_by_id[key].x = w/2.0;
+	nodes_by_id[key].y = h/2.0;
       
+ 
 
-       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();
-
-       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();
-
-
-       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();
-      */
-
-	
-        			
- //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, 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()
+	       
+    var force = d3.layout.force()
               .linkStrength(0.5)
-              .charge(-2000)
+              .charge(-5000)
               .friction(0.7)
               .gravity(0.7)
-              .linkDistance(13)
+              .linkDistance(50)
               .nodes([])
               .links([])
               .size([w, h])
@@ -425,7 +279,10 @@ $(function fgraph(gid) {
         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")
@@ -448,41 +305,131 @@ $(function fgraph(gid) {
                 .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=={{ object.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;})
+              .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"; })   	      
+	    
 	      .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=={{ object.id }}) return 8; else if (isNaN(d._id) || (d._id)<0) return 1; else return 7 })
-                       .style("fill", function color(d) { if (d._id=={{ object.id }}) return "red"; else if (isNaN(d._id) || (d._id)<0) return "white" ; else return "green"});
 
+
+		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"); 
+
+
+
+$(window).bind('keydown',function(event){
+	if(17==event.keyCode){
+         new_g.on("click",function(d){ 
+                         if(d._id>0 && d.expanded=="false")
+			{ 
+			d3.select("#amazingViz").remove();  
+			d.expanded="true";
+     			$.getJSON('/nodetypes/graphs/graph_json/' + d._id , function (json2) {
+    			new_metadata=json2.node_metadata;
+  			new_relations=json2.relations;	
+			new_relnset=json2.relset		
+			metadata=_.union(new_metadata,metadata);
+			relations=_.union(new_relations,relations);			
+			init(metadata,relations);
+			load(d._id)
+			})
+			}
 			
-		new_g.append("svg:text")
-			.attr("class",function(d) {  if (d._id=={{ object.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"}) 
+                    });
+
+}
+});
+
+
 
-//                        .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.on("click", function(d) {
+
+		new_g.attr("xlink:href",function(d){return d.url;});
+		});	
+
+
+  	  /*new_g.append("svg:ellipse")
+			.attr("cx", function(d) { return d.x - w/2.0 +15; })
+			.attr("cy", function(d) { return d.y - h/2.0 +15 ; })
+			.call(force.drag)
+			.attr("rx", function(d) { return ((d.screen_name).length) +10 })
+			.attr("ry", function(d) {  if (d._id==key) return 8; else if (isNaN(d._id) || (d._id)<0) return 1; else return 7 });
+                       //.style("fill", function color(d) { if (d._id==key) return "red"; else if (isNaN(d._id) || (d._id)<0) return "white" ; else return "green"});*/
+			
+
+
+
+			
+		var 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) 
+			.attr("dy", ".35em")
+                        .attr("text-anchor","middle") 
+			
+                       // .attr("style",function text(d) { if ((d._id)>0) return "font-size:9.00pt;fill:blue;" ; else return "font-size:9.00pt;fill:black;"}) 
     
                         .text(function(d) {
                           return d.screen_name;
                         });  
 			
-                node.exit().remove();
-        
+               var bbox = text1.node().getBBox();
+
+
+		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 color(d) {var e=(d._id).charAt(0); if (d.expanded=="true") return "red";  else return "none"});
+
+
+
+
+
+           	node.exit().remove();
 	
 
         force.on("tick", function() {
@@ -509,27 +456,18 @@ $(function fgraph(gid) {
               .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)});
-});
 
 
-</script>
+
+}
 
 
+});
+//fgraph({{object.id}});
+
+</script>
+
 				</div>
 				<div id="sidebar">
 				  {% block sidebar %}
@@ -537,7 +475,7 @@ $(function fgraph(gid) {
 				</div>
 				
 				
-				<div id="footer" class="span-24 last">
+				<div id="footer">
 					<p> 
 
 						<a rel="license"
@@ -550,6 +488,6 @@ $(function fgraph(gid) {
 					</p>
 				</div>
 		
-		
+		</div>
 	</body>
 </html>