Time tracking dashboard with JS

Community feedback

• 

  BT738844•680

  @BT453567Posted 6 months ago

  Hello

  Great looking solution, well done.

  A couple of small issues I noticed:

  When you reduce the window size, the first column becomes difficult to see. Perhaps add a min-width to the first column?

  The values for Weekly Exercise and Social last week are wrong, you have placed the values for current there.

  You have the wording "Last Week" for Daily and Monthly.

  With regards to reducing code:

  I have noticed in your HTML you have duplicated the top part of the card for daily, weekly and monthly.

  As a suggestion create a function called for example fetchData(period) { }

  Then add a listener to the buttons as follows:

  buttonDaily.addEventListener("click", function() { fetchData("daily"); });

  buttonWeekly.addEventListener("click", function() { fetchData("weekly"); });

  Within the fetchData(period) function you could then add the following:

  switch (period) { case 'daily': displayMessage = "Yesterday - ";

  and so forth.

  When you update the HTML, you could then use this variable for example:

  document.getElementById("work-previous").textContent = displayMessage + workData.timeframes.weekly.current;

  Regards

  Marked as helpful

  1