finished

hw4/js/infoPanel.js

@@ -16,11 +16,27 @@ class InfoPanel {
 
     // Update the text elements in the infoBox to reflect:
     // World Cup Title, host, winner, runner_up, and all participating teams that year
+      let host = d3.select('#details').select('#host');
+      let title = d3.select('#details').select('#edition');
+      let winner = d3.select('#details').select('#winner');
+      let runner_up = d3.select('#details').select('#silver');
+      let teams = d3.select('#details').select('#teams');
 
-    // Hint: For the list of teams, you can create an list element for each team.
-    // Hint: Select the appropriate ids to update the text content.
+      host.text(oneWorldCup['host']);
+      title.text(oneWorldCup['EDITION']);
+      winner.text(oneWorldCup['winner']);
+      runner_up.text(oneWorldCup['runner_up']);
+      let list = d3.select("#teams").selectAll('li').data(oneWorldCup.teams_names);
+
+      let newList = list.enter()
+          .append('li')
+          .text((d,i) => d);
+      list.exit().remove();
+      list = newList.merge(list);
+      list.transition()
+          .duration(2000)
+          .text((d,i) => d);
 
-    //Set Labels
 
   }