Add new chart web interface.

Seve/ILC.Seve.Web/JSONWebSerializer.cs

@@ -1,6 +1,5 @@
 using System.Collections.Generic;
 using System.Linq;
-using ILC.Seve.Genetics;
 
 namespace ILC.Seve.Web
 {
@@ -17,21 +16,23 @@ namespace ILC.Seve.Web
     /// </example>
     public class JSONWebSerializer : WebSerializer
     {
-        private List<double> Averages = new List<double>();
+        private List<SimulationState> States = new List<SimulationState>();
 
         public string Rewind()
         {
-            var averages = string.Join(",", Averages);
+            var averages = string.Join(",", States.Select(s => s.Individuals.Average(x => x.Fitness)));
+            var times = string.Join(",", States.Select(s => s.ProcessingTime));
 
-            return string.Format("{{ \"average_fitnesses\": [{0}] }}", averages);
+            return string.Format("{{ \"average_fitnesses\": [{0}], processing_times: [{1}] }}", averages, times);
         }
 
-        public string Serialize(List<Individual> state)
+        public string Serialize(SimulationState state)
         {
-            var average = state.Select(a => a.Fitness).Average();
-            Averages.Add(average);
+            States.Add(state);
 
-            return string.Format("{{ \"average_fitness\": {0} }}", average);
+            var average = state.Individuals.Select(a => a.Fitness).Average();
+
+            return string.Format("{{ \"average_fitness\": {0}, \"processing_time\": {1} }}", average, state.ProcessingTime);
         }
     }
 }

Seve/ILC.Seve.Web/WebSerializer.cs

@@ -1,12 +1,8 @@
-using System;
-using System.Collections.Generic;
-using ILC.Seve.Genetics;
-
-namespace ILC.Seve.Web
+namespace ILC.Seve.Web
 {
     public interface WebSerializer
     {
         string Rewind();
-        string Serialize(List<Individual> state);
+        string Serialize(SimulationState state);
     }
 }

Seve/ILC.Seve/SerialSimulation.cs

@@ -1,5 +1,6 @@
 using System;
 using System.Collections.Generic;
+using System.Diagnostics;
 using System.Linq;
 using ILC.Seve.Genetics;
 using ILC.Seve.Graph;
@@ -13,9 +14,9 @@ namespace ILC.Seve
     public class SerialSimulation : ISimulation
     {
         private Algorithm Algorithm;
-        private Action<List<Individual>> StateCallback;
+        private Action<SimulationState> StateCallback;
 
-        public SerialSimulation(Algorithm algorithm, Action<List<Individual>> stateCallback)
+        public SerialSimulation(Algorithm algorithm, Action<SimulationState> stateCallback)
         {
             Algorithm = algorithm;
             StateCallback = stateCallback;
@@ -30,6 +31,9 @@ public void RunSimulation()
             {
                 var population = Algorithm.Population;
 
+                var stopwatch = new Stopwatch();
+                stopwatch.Start();
+
                 // Tests each individual in the population through a physics simulation
                 foreach(var individual in population)
                 {
@@ -41,7 +45,11 @@ public void RunSimulation()
                         individual.Fitness);
                 }
 
-                StateCallback(Algorithm.Population);
+                stopwatch.Stop();
+
+
+                var state = new SimulationState(population, stopwatch.ElapsedMilliseconds);
+                StateCallback(state);
 
                 Console.WriteLine("Average fitness of generation: {0}",
                     population.Select(a => a.Fitness).Average());

Seve/ILC.Seve/SimulationState.cs

@@ -0,0 +1,17 @@
+using System.Collections.Generic;
+using ILC.Seve.Genetics;
+
+namespace ILC.Seve
+{
+    public class SimulationState
+    {
+        public List<Individual> Individuals { get; private set; }
+        public long ProcessingTime { get; private set; }
+
+        public SimulationState(List<Individual> individuals, long processingTime)
+        {
+            Individuals = individuals;
+            ProcessingTime = processingTime;
+        }
+    }
+}

Seve/Seve.csproj

@@ -82,6 +82,7 @@
     <Compile Include="ILC.Seve.Web\JSONWebSerializer.cs" />
     <Compile Include="ILC.Seve.Web\WebSerializer.cs" />
     <Compile Include="ILC.Seve\SerialSimulation.cs" />
+    <Compile Include="ILC.Seve\SimulationState.cs" />
     <Compile Include="Properties\AssemblyInfo.cs" />
     <Compile Include="ILC.Seve.Genetics\Individual.cs" />
     <Compile Include="ILC.Seve.Genetics\Algorithm.cs" />

seve-chart/css/detail.css

@@ -0,0 +1,73 @@
+.rickshaw_graph .detail {
+	pointer-events: none;
+	position: absolute;
+	top: 0;
+	z-index: 2;
+	background: rgba(0, 0, 0, 0.1);
+	bottom: 0;
+	width: 1px;
+	transition: opacity 0.25s linear;
+	-moz-transition: opacity 0.25s linear;
+	-o-transition: opacity 0.25s linear;
+	-webkit-transition: opacity 0.25s linear;
+}
+.rickshaw_graph .detail.inactive {
+	opacity: 0;
+}
+.rickshaw_graph .detail .item.active {
+	opacity: 1;
+}
+.rickshaw_graph .detail .x_label {
+	font-family: Arial, sans-serif;
+	border-radius: 3px;
+	padding: 6px;
+	opacity: 0.5;
+	border: 1px solid #e0e0e0;
+	font-size: 12px;
+	position: absolute;
+	background: white;
+	white-space: nowrap;
+}
+.rickshaw_graph .detail .item {
+	position: absolute;
+	z-index: 2;
+	border-radius: 3px;
+	padding: 0.25em;
+	font-size: 12px;
+	font-family: Arial, sans-serif;
+	opacity: 0;
+	background: rgba(0, 0, 0, 0.4);
+	color: white;
+	border: 1px solid rgba(0, 0, 0, 0.4);
+	margin-left: 1em;
+	margin-top: -1em;
+	white-space: nowrap;
+}
+.rickshaw_graph .detail .item.active {
+	opacity: 1;
+	background: rgba(0, 0, 0, 0.8);
+}
+.rickshaw_graph .detail .item:before {
+	content: "\25c2";
+	position: absolute;
+	left: -0.5em;
+	color: rgba(0, 0, 0, 0.7);
+	width: 0;
+}
+.rickshaw_graph .detail .dot {
+	width: 4px;
+	height: 4px;
+	margin-left: -4px;
+	margin-top: -3px;
+	border-radius: 5px;
+	position: absolute;
+	box-shadow: 0 0 2px rgba(0, 0, 0, 0.6);
+	background: white;
+	border-width: 2px;
+	border-style: solid;
+	display: none;
+	background-clip: padding-box;
+}
+.rickshaw_graph .detail .dot.active {
+	display: block;
+}