routing setup

FlaskTest/app.py

 from flask import Flask, render_template
 app = Flask (__name__)
 
-@app.route("/dashboard")
-def dashboard():
 
-	data= {
-		"main_repo_name" : "Main Project Name",
-		"main_repo_summary" : "Summary: This project is about making Zebra really fast and efficient",
-		"main_repo_description" : "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
-		"heatmap" : {
-			"divID" : "heatmap",
-			"title" : "Commits by Hour of Week - dummy data",
-			# NOTE these paths are relative to where the script.js file is
-			"data_path1" : "../static/data/data_dummy.tsv",
-			"data_path2" : "../static/data/data2_dummy.tsv",
-			"summary" : "This data shows cool stuff",
-			"description" : "As you van see, this data focuses on business hours",
-			"timestamp" : "System last updated at 11:34am"
-		},
-		"barchart" : {
-			"divID" : "day_of_week",
-			"title" : "# Commits by day - real data",
-			"data_path" : "../static/data/day_of_week_copy.tsv",
-			"summary" : "Bar Chart",
-			"description" : "What week is this from? Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
-			"timestamp" : "System last updated at 11:34am"
-		},
-		"linegraph1" : {
-			"divID" : "lineChart1",
-			"title" : "Commits per Author - real data",
-			"data_path" : "../static/data/commits_by_author_copy.tsv",
-			"summary" : "Multi Series Line Chart",
-			"description" : "Theres a few authors on this project but 1 stands out",
-			"timestamp" : "System last updated at 11:34am"
+data= {
+	"main_repo" : 
+	[{
+		"name" : "Simul-scan",
+		"summary" : "Summary: This project is about making Zebra really fast and efficient",
+		"description" : "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
+		"visualizations" : 
+		[
+			{
+				"heatmap" : {
+					"divID" : "heatmap",
+					"title" : "Commits by Hour of Week - dummy data",
+					# NOTE these paths are relative to where the script.js file is
+					"data_path1" : "../static/data/data_dummy.tsv",
+					"data_path2" : "../static/data/data2_dummy.tsv",
+					"summary" : "This data shows cool stuff",
+					"description" : "As you van see, this data focuses on business hours",
+					"timestamp" : "System last updated at 11:34am"
+				},
+				"barchart" : {
+					"divID" : "day_of_week",
+					"title" : "# Commits by day - real data",
+					"data_path" : "../static/data/day_of_week_copy.tsv",
+					"summary" : "Bar Chart",
+					"description" : "What week is this from? Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
+					"timestamp" : "System last updated at 11:34am"
+				},
+				"linegraph1" : {
+					"divID" : "lineChart1",
+					"title" : "Commits per Author - real data",
+					"data_path" : "../static/data/commits_by_author_copy.tsv",
+					"summary" : "Multi Series Line Chart",
+					"description" : "Theres a few authors on this project but 1 stands out",
+					"timestamp" : "System last updated at 11:34am"
+				},
+				"linegraph2" : {
+					"divID" : "lineChart2",
+					"title" : "Commits per Author - real data",
+					"data_path" : "../static/data/lines_of_code_by_author_copy.tsv",
+					"summary" : "Multi Series Line Chart",
+					"description" : "Theres a few authors on this project but 1 stands out",
+					"timestamp" : "System last updated at 11:34am"
+				}
+			}
+		]
+	}],
+
+	"sub_repos" : 
+	[
+		# each of these is going to be a sub-repo
+		{
+			"name" : "sub-1",
+			"summary" : "Test Summary1",
+			"description" : "Test Description 1",
+			"visualizations" : 
+			[
+				{
+					"heatmap" : {
+						"divID" : "heatmap",
+						"title" : "Commits by Hour of Week - dummy data",
+						# NOTE these paths are relative to where the script.js file is
+						"data_path1" : "../static/data/data_dummy.tsv",
+						"data_path2" : "../static/data/data2_dummy.tsv",
+						"summary" : "This data shows cool stuff",
+						"description" : "As you van see, this data focuses on business hours",
+						"timestamp" : "System last updated at 11:34am"
+					},
+					"barchart" : {
+						"divID" : "day_of_week",
+						"title" : "# Commits by day - real data",
+						"data_path" : "../static/data/day_of_week_copy.tsv",
+						"summary" : "Bar Chart",
+						"description" : "What week is this from? Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
+						"timestamp" : "System last updated at 11:34am"
+					},
+					"linegraph1" : {
+						"divID" : "lineChart1",
+						"title" : "Commits per Author - real data",
+						"data_path" : "../static/data/commits_by_author_copy.tsv",
+						"summary" : "Multi Series Line Chart",
+						"description" : "Theres a few authors on this project but 1 stands out",
+						"timestamp" : "System last updated at 11:34am"
+					},
+					"linegraph2" : {
+						"divID" : "lineChart2",
+						"title" : "Commits per Author - real data",
+						"data_path" : "../static/data/lines_of_code_by_author_copy.tsv",
+						"summary" : "Multi Series Line Chart",
+						"description" : "Theres a few authors on this project but 1 stands out",
+						"timestamp" : "System last updated at 11:34am"
+					}
+				}
+			]
 		},
-		"linegraph2" : {
-			"divID" : "lineChart2",
-			"title" : "Commits per Author - real data",
-			"data_path" : "../static/data/lines_of_code_by_author_copy.tsv",
-			"summary" : "Multi Series Line Chart",
-			"description" : "Theres a few authors on this project but 1 stands out",
-			"timestamp" : "System last updated at 11:34am"
+		{
+			"name" : "sub-2",
+			"summary" : "Test Summary 2",
+			"description" : "Test Description 2",
+			"visualizations" : 
+			[
+				{
+					"heatmap" : {
+						"divID" : "heatmap",
+						"title" : "Commits by Hour of Week - dummy data",
+						# NOTE these paths are relative to where the script.js file is
+						"data_path1" : "../static/data/data_dummy.tsv",
+						"data_path2" : "../static/data/data2_dummy.tsv",
+						"summary" : "This data shows cool stuff",
+						"description" : "As you van see, this data focuses on business hours",
+						"timestamp" : "System last updated at 11:34am"
+					},
+					"barchart" : {
+						"divID" : "day_of_week",
+						"title" : "# Commits by day - real data",
+						"data_path" : "../static/data/day_of_week_copy.tsv",
+						"summary" : "Bar Chart",
+						"description" : "What week is this from? Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
+						"timestamp" : "System last updated at 11:34am"
+					},
+					"linegraph1" : {
+						"divID" : "lineChart1",
+						"title" : "Commits per Author - real data",
+						"data_path" : "../static/data/commits_by_author_copy.tsv",
+						"summary" : "Multi Series Line Chart",
+						"description" : "Theres a few authors on this project but 1 stands out",
+						"timestamp" : "System last updated at 11:34am"
+					},
+					"linegraph2" : {
+						"divID" : "lineChart2",
+						"title" : "Commits per Author - real data",
+						"data_path" : "../static/data/lines_of_code_by_author_copy.tsv",
+						"summary" : "Multi Series Line Chart",
+						"description" : "Theres a few authors on this project but 1 stands out",
+						"timestamp" : "System last updated at 11:34am"
+					}
+				}
+			]
 		}
-	}
-	return render_template("dashboard.html", data=data )
+	]
+}
+
+@app.route('/dashboard/<repo>')	
+def sub_repo(repo):
+	global data
+	sub_repo_data= None
+	for sub_repo in data['sub_repos']:
+		print (sub_repo['name'], repo)
+		if sub_repo['name'] == repo:
+			#this should happen in one case, else this isnt a valid sub repo...
+			sub_repo_data=sub_repo
+	return render_template("dashboard.html", sub=sub_repo_data, nav=data)
+
+@app.route("/dashboard")
+def dashboard():
+	global data
+	main_repo=data['main_repo'][0]
+	return render_template("dashboard.html", sub=main_repo, nav=data )
+
 
 
 

FlaskTest/static/js/script.js

   e.stopPropagation()
 });
 
+// cool load in the beginning
+$("#leftside-navigation .sub-menu > a").trigger("click");
+
 // generateHeatMap(["../static/data/data_dummy.tsv", "../static/data/data2_dummy.tsv"], "#chart");
 
 function generateHeatMap(datasets, divID){

FlaskTest/templates/base.html

      <link rel="stylesheet" href="../static/css/style.css">
      
      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">
+     <title> {{sub.name}} - Dashboard </title>
 
   </head>
   <body class="bg-faded">
 	  <div id="leftside-navigation" class="nano">
 	    <ul class="nano-content">
 	      <li class="sub-menu">
-	        <a href="#"><i class="fa fa-home"></i><span>Home</span><i class="arrow fa"></i></a>
+	        <a href="{{url_for('dashboard')}}"><i class="fa fa-home"></i><span>{{nav.main_repo[0].name}}</span><i class="arrow fa"></i></a>
 	      </li>
 
 	      <li class="sub-menu">
 	        <a href="javascript:void(0);"><i class="fa fa-cogs"></i><span>Sub-Repos</span><i class="arrow fa fa-angle-right pull-right"></i></a>
 	        <ul>
-	          <li><a href="#">Mini Repo 1</a>
-	          </li>
-	          <li><a href="#">Mini Repo 2</a>  
-	          </li>
-	          <li><a href="#">Mini Repo 3</a>
-	          </li>
+	        <!-- drop drown items are name of sub directories -->
+	        {% for sub_repo in nav.sub_repos %}
+		        <li> <a href ="{{url_for('dashboard')}}/{{sub_repo.name}}"> {{sub_repo.name}} </a></li>
+	        {% endfor %}
+
 	        </ul>
 	      </li>
 
-	      <li class="sub-menu">
+	    <!--   <li class="sub-menu">
 	        <a href="#"><i class="fa fa-terminal"></i><span>Lines</span><i class="arrow fa"></i></a>
 	      </li>
 
 	      <li class="sub-menu">
 	        <a href="#"><i class="fa fa-user"></i><span>Authors</span><i class="arrow fa "></i></a>
-	      </li>
+	      </li> -->
 
 	    </ul>
 
 
   	{% block content %}{% endblock %}
 
-    <!-- bootstrap -->
-    <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script>
-    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script>
-
-    <!-- for nav bar accordion -->
-    <script src='//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
-    <script src='//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js'></script>
-
-    <!-- for visualizations -->
-    <script src="http://d3js.org/d3.v4.js"></script>
-    <script src="../static/js/script.js" type="text/javascript"></script>
-
-    <script type="text/javascript">
-
- //    generateHeatMap(["../static/data/data_dummy.tsv", "../static/data/data2_dummy.tsv"], "#chart");
- //    generateBarChart("../static/data/day_of_week_copy.tsv", "#day_of_week");
-
- //    generateLineChart("../static/data/commits_by_author_copy.tsv", "#lineChart");
-	// generateLineChart("../static/data/lines_of_code_by_author_copy.tsv", "#lineChart2");
-
-		generateHeatMap(['{{data.heatmap.data_path1}}', '{{data.heatmap.data_path2}}'], "#{{data.heatmap.divID}}");
-
-	    generateBarChart('{{data.barchart.data_path}}', "#{{data.barchart.divID}}");
-
-	    generateLineChart('{{data.linegraph1.data_path}}', "#{{data.linegraph1.divID}}");
-		generateLineChart('{{data.linegraph2.data_path}}', "#{{data.linegraph2.divID}}");
-
-    </script>
-
-
-
 
     
 

FlaskTest/templates/dashboard.html

   <div class="container-fluid">
     <div class="card drop-shadow">
       <div class="card-block">
-        <h1> {{data.main_repo_name}} </h1>
+        <h1> {{sub.name}} </h1>
         <br>
-        <h6> {{data.main_repo_summary}} </h6>
+        <h6> {{sub.summary}} </h6>
         <br>
-        <p> {{data.main_repo_description}}</p>
+        <p> {{sub.description}}</p>
       </div>
     </div>
 
           <div class="card-block">
             <h4 class="card-title">Commits by Hour of Week-dummy data </h4>
             <div class="metric">
-              <div id="{{data.heatmap.divID}}"></div>
+              <div id="{{sub.visualizations[0].heatmap.divID}}"></div>
               <div id="dataset-picker"></div>
             </div>
             <div class="details_spacer">
             <h4 class="card-title"># Commits by day - real data </h4>
             <div class="metric">
 
-              <div id="{{data.barchart.divID}}"></div>
+              <div id="{{sub.visualizations[0].barchart.divID}}"></div>
 
             </div>
             <div class="details_spacer">
             <h4 class="card-title">Commits per Author - real data</h4>
             <div class="metric">
 
-              <div id ="{{data.linegraph1.divID}}"></div>
-              
+              <div id ="{{sub.visualizations[0].linegraph1.divID}}"></diva              
             </div>
             <div class="details_spacer">
               <div class="text_content">
             <h4 class="card-title">Cumulative Added Lines by Author - real data</h4>
             <div class="metric">
 
-              <div id ="{{data.linegraph2.divID}}"></div>
+              <div id ="{{sub.visualizations[0].linegraph2.divID}}"></div>
 
             </div>
             <div class="details_spacer">
   </div>
 </div>
 
+
+
+    <!-- bootstrap -->
+    <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script>
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script>
+
+    <!-- for nav bar accordion -->
+    <script src='//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
+    <script src='//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js'></script>
+
+    <!-- for visualizations -->
+    <script src="http://d3js.org/d3.v4.js"></script>
+    <script src="../static/js/script.js" type="text/javascript"></script>
+
+    <script type="text/javascript">
+
+ //    generateHeatMap(["../static/data/data_dummy.tsv", "../static/data/data2_dummy.tsv"], "#chart");
+ //    generateBarChart("../static/data/day_of_week_copy.tsv", "#day_of_week");
+
+ //    generateLineChart("../static/data/commits_by_author_copy.tsv", "#lineChart");
+  // generateLineChart("../static/data/lines_of_code_by_author_copy.tsv", "#lineChart2");
+
+    generateHeatMap(['{{sub.visualizations[0].heatmap.data_path1}}', '{{sub.visualizations[0].heatmap.data_path2}}'], "#{{sub.visualizations[0].heatmap.divID}}");
+
+      generateBarChart('{{sub.visualizations[0].barchart.data_path}}', "#{{sub.visualizations[0].barchart.divID}}");
+
+      generateLineChart('{{sub.visualizations[0].linegraph1.data_path}}', "#{{sub.visualizations[0].linegraph1.divID}}");
+    generateLineChart('{{sub.visualizations[0].linegraph2.data_path}}', "#{{sub.visualizations[0].linegraph2.divID}}");
+
+    </script>
+
 {% endblock %}
 

FlaskTest/templates/main_dash.html

+{% extends "base.html" %}
+
+{% block content %}
+
+
+<!-- Main Dashboard -->
+<!-- Summary -->
+<div class="main_dash">
+  <div class="container-fluid">
+    <div class="card drop-shadow">
+      <div class="card-block">
+        <h1> {{data.name}} </h1>
+        <br>
+        <h6> {{data.summary}} </h6>
+        <br>
+        <p> {{data.description}}</p>
+      </div>
+    </div>
+
+    <div class="row top_spacer">
+
+      <!-- Metric 1, half screen, heatmap-->
+      <div class="col-md-6">
+        <div class="card drop-shadow">
+          <div class="card-block">
+            <h4 class="card-title">Commits by Hour of Week-dummy data </h4>
+            <div class="metric">
+              <div id="{{data.visualizations[0].heatmap.divID}}"></div>
+              <div id="dataset-picker"></div>
+            </div>
+            <div class="details_spacer">
+              <div class="text_content">
+                <h5 class="card-text"> This data shows cool stuff </h5>
+                <p class="card-text"> As you can see, this data focuses on business hours </p>
+                <p class="card-text"> <small class="text-muted"> System last updated at 11:34am </small></p>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- Metric 2, half screen, bar chart-->
+      <div class="col-md-6">
+        <div class="card drop-shadow">
+          <div class="card-block">
+            <h4 class="card-title"># Commits by day - real data </h4>
+            <div class="metric">
+
+              <div id="{{data.visualizations[0].barchart.divID}}"></div>
+
+            </div>
+            <div class="details_spacer">
+              <div class="text_content">
+                <h5 class="card-text"> Bar Chart</h5>
+                <p class="card-text"> What week is this from?  <br>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+                tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+                quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+                consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
+                cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
+                proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+                <p class="card-text"> <small class="text-muted"> System last updated at 11:34am </small></p>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+    </div> 
+
+    <!-- Metric 3, full width, line chart -->
+    <div class="row top_spacer">
+
+      <div class="col-md-12">
+        <div class="card drop-shadow">
+          <div class="card-block">
+            <h4 class="card-title">Commits per Author - real data</h4>
+            <div class="metric">
+
+              <div id ="{{data.visualizations[0].linegraph1.divID}}"></div>
+              
+            </div>
+            <div class="details_spacer">
+              <div class="text_content">
+                <h5 class="card-text"> Multi Series Line Chart</h5>
+                <p class="card-text"> Theres a few authors on this project but 1 stands out </p>
+                <p class="card-text"> <small class="text-muted"> System last updated at 11:34am </small></p>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+    </div>
+
+    <!-- Another test metric, line chart -->
+    <div class="row top_spacer">
+
+      <div class="col-md-12">
+        <div class="card drop-shadow">
+          <div class="card-block">
+            <h4 class="card-title">Cumulative Added Lines by Author - real data</h4>
+            <div class="metric">
+
+              <div id ="{{data.visualizations[0].linegraph2.divID}}"></div>
+
+            </div>
+            <div class="details_spacer">
+              <div class="text_content">
+                <h5 class="card-text"> Multi Series Line Chart</h5>
+                <p class="card-text"> Theres a few authors on this project but 1 stands out </p>
+                <p class="card-text"> <small class="text-muted"> System last updated at 11:34am </small></p>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+    </div>
+
+    <!-- bottom for aesthetic spacing -->
+    <div class="top_spacer"></div>
+
+  </div>
+</div>
+
+{% endblock %}
+