65d53488 by David LaPalomento

Update timeline chart

When the simulation is run, update the network timeline with the new bandwidth plot.
1 parent 42bad623
...@@ -19,9 +19,9 @@ ...@@ -19,9 +19,9 @@
19 addTimePeriod.addEventListener('click', function() { 19 addTimePeriod.addEventListener('click', function() {
20 var clone = timePeriod.cloneNode(true), 20 var clone = timePeriod.cloneNode(true),
21 fragment = document.createDocumentFragment(), 21 fragment = document.createDocumentFragment(),
22 count = networkTimeline.querySelectorAll('.bandwidth').length, 22 count = networkTimeline.querySelectorAll('input.bandwidth').length,
23 time = clone.querySelector('.time'), 23 time = clone.querySelector('.time'),
24 bandwidth = clone.querySelector('.bandwidth'); 24 bandwidth = clone.querySelector('input.bandwidth');
25 25
26 time.name = 'time' + count; 26 time.name = 'time' + count;
27 bandwidth.name = 'bandwidth' + count; 27 bandwidth.name = 'bandwidth' + count;
...@@ -34,7 +34,7 @@ ...@@ -34,7 +34,7 @@
34 // collect the simulation parameters 34 // collect the simulation parameters
35 parameters = function() { 35 parameters = function() {
36 var times = Array.prototype.slice.call(document.querySelectorAll('.time')), 36 var times = Array.prototype.slice.call(document.querySelectorAll('.time')),
37 bandwidths = document.querySelectorAll('.bandwidth'); 37 bandwidths = document.querySelectorAll('input.bandwidth');
38 38
39 return times.reduce(function(conditions, time, i) { 39 return times.reduce(function(conditions, time, i) {
40 return conditions.concat({ 40 return conditions.concat({
...@@ -113,6 +113,7 @@ ...@@ -113,6 +113,7 @@
113 })]); 113 })]);
114 114
115 // draw the new timeline 115 // draw the new timeline
116 svg.selectAll('.axis').remove();
116 svg.append('g') 117 svg.append('g')
117 .attr('class', 'x axis') 118 .attr('class', 'x axis')
118 .attr('transform', 'translate(0,' + height + ')') 119 .attr('transform', 'translate(0,' + height + ')')
...@@ -128,6 +129,7 @@ ...@@ -128,6 +129,7 @@
128 .style('text-anchor', 'end') 129 .style('text-anchor', 'end')
129 .text('Bandwidth (b/s)'); 130 .text('Bandwidth (b/s)');
130 131
132 svg.selectAll('.bandwidth').remove();
131 svg.append('path') 133 svg.append('path')
132 .datum(bandwidth) 134 .datum(bandwidth)
133 .attr('class', 'line bandwidth') 135 .attr('class', 'line bandwidth')
......