Separated chart generation into different functions for readability

docs/main.js

@@ -125,27 +125,23 @@ async function PapaParse(department, num, name, sem) {
         // console.log(selectedClass[i]["Count of letter grade"]);
     }
     console.log(gradeDist);
-    if (gradeChart) {
+    (gradeChart ? updateChart(lableName, gradeDist) : createChart(gradeDist, lableName));
+}
+
+function updateChart(labelName, gradeDist) {
     gradeChart.config.data = {
         labels: gradeLabels,
         datasets: [{
-                label: '\"' + lableName + "\"",
+            label: '\"' + labelName + "\"",
             data: Object.values(gradeDist),
             borderWidth: 2,
             backgroundColor: backgroundColor,
         }]
     };
     gradeChart.update();
-    } else {
-        loadChart(gradeDist, lableName);
-        aboutDiv.style.visibility = 'hidden';
-        aboutDiv.style.display = 'none';
-        chartDiv.style.display = '';
-        formDiv.setAttribute("style", "grid-row: 1");
-    }
 }
 
-function loadChart(gradeDist, courseName) {
+function createChart(gradeDist, courseName) {
     gradeChart = new Chart(ctx, {
         type: 'bar',
         data: {
@@ -181,4 +177,8 @@ function loadChart(gradeDist, courseName) {
             }
         }
     });
+    aboutDiv.style.visibility = 'hidden';
+    aboutDiv.style.display = 'none';
+    chartDiv.style.display = '';
+    formDiv.setAttribute("style", "grid-row: 1");
 }