cleanup css, js, and update about + layout

Signed-off-by: franck cuny <franck@lumberjaph.net>

4 files changed, 57 insertions, 25 deletions

diff --git a/public/css/style.css b/public/css/style.css
index 555ac9f..ad1d061 100644
--- a/public/css/style.css
+++ b/public/css/style.css
@@ -1,4 +1,4 @@
-*{
+body{
 	margin: 0;
 	padding: 0;
 	font-family: Helvetica,Arial;
@@ -23,7 +23,7 @@
 #head_title{
 	float: left;
 	padding-left: 10px;
-	padding-top: 4px;
+	/* padding-top: 4px; */
 }
 
 #head a{
@@ -255,3 +255,15 @@ input.fisheye{
    font-size: 10px;
    border-bottom:1px solid #bedce7;   
 }
+
+/* static pages */
+#static {
+   margin: 0 auto;
+   width: 920px;
+   padding: 0 15px;
+   font-size: 14px;
+};
+
+h1 {
+   display:bl2ck;
+};
diff --git a/public/javascripts/stargit.js b/public/javascripts/stargit.js
index 3dacb46..7932329 100644
--- a/public/javascripts/stargit.js
+++ b/public/javascripts/stargit.js
@@ -120,8 +120,10 @@ var stargit=(function(){
 	// This function refreshes the graph from the login of
 	// a user:
 	function getGithubGraph(user){
+          $("#info_graph_desc").text("Loading a new graph for user "+ user);
           $("#user").hide();
           $("#error").hide();
+
 	  url = "/graph/local/"+user;
 	  $.ajax({
 	    url: url,
@@ -142,6 +144,7 @@ var stargit=(function(){
 	      resetGraph(json);
 	      if(document.getElementById("query_input").value)
                 document.getElementById("query_input").value = user;
+              getNodeDescription(user);
 	    }
 	  });
 	}
@@ -209,11 +212,32 @@ var stargit=(function(){
 			setLegend(colorAtts[0]["label"],colorAtts[0]);
 		}
 	}
-	
+
+  function getNodeDescription(user){
+    var url = "/profile/" + user;
+		    $.ajax({
+		      url: url,
+		      dataType: 'json',
+		      success:
+		      function(json){
+                        $("#error").hide();
+                        $("#user").show();
+                        var gravatar = "http://www.gravatar.com/avatar/" + json.gravatar;
+                        $("#gravatared").attr("src", gravatar);
+                        $("#gravatared").show();
+                        $("#user_name").text(json.name);
+                        $("#user_website").text(json.website);                        
+                        $("#user_indegree").text(json.indegree);                        
+                        $("#user_country").text(json.country);                        
+                        $("#user_language").text(json.language);                        
+		      }
+		    });
+  }
+  
 	// PUBLIC FUNCTIONS:
 	return {
 		loadUser: function(name){
-			getGithubGraph(name);
+		  getGithubGraph(name);
 		},
 		
 		setSize: function(e){
@@ -276,27 +300,9 @@ var stargit=(function(){
 		    document.getElementById("query_input").value = query;
 			}
 		},
-		
 		onOverNodes: function(nodesArray){
                   if (nodesArray[0]){
-		    var url = "/profile/" + nodesArray[0];
-		    $.ajax({
-		      url: url,
-		      dataType: 'json',
-		      success:
-		      function(json){
-                        $("#error").hide();
-                        $("#user").show();
-                        var gravatar = "http://www.gravatar.com/avatar/" + json.gravatar;
-                        $("#gravatared").attr("src", gravatar);
-                        $("#gravatared").show();
-                        $("#user_name").text(json.name);
-                        $("#user_website").text(json.website);                        
-                        $("#user_indegree").text(json.indegree);                        
-                        $("#user_country").text(json.country);                        
-                        $("#user_language").text(json.language);                        
-		      }
-		    });
+                    getNodeDescription(nodesArray[0]);
                   }
 		}
 	};
diff --git a/views/about.tt b/views/about.tt
index 2034762..4f5995c 100644
--- a/views/about.tt
+++ b/views/about.tt
@@ -1 +1,15 @@
-this is about!
+<div id="main">
+  <div id="static">
+    <h1>About</h1>
+
+    <ul>
+      <li><a href="#whatisstargit">What is StarGit</a></li>
+      <li><a href="#howtoread">How to read the graph</a></li>
+    </ul>
+
+    <h3 id="whatisstargit">What is StarGit</h3>
+
+    <h3 id="howtoread">How to read the graph</a></li>
+    
+  </div>
+</div>
diff --git a/views/layouts/main.tt b/views/layouts/main.tt
index 0588935..763e8e0 100644
--- a/views/layouts/main.tt
+++ b/views/layouts/main.tt
@@ -40,7 +40,7 @@
 
   <body>
     <div id="head">
-      <div id="head_title">Stargit - Browse the Github collaborations network</div>
+      <div id="head_title"><a href="/">Stargit - Browse the Github collaborations network</a></div>
       <a id="head_api" href="/api">API</a>
       <a id="head_about" href="/about">About</a>
     </div>