Added front end selection box methods.

schedules/config.js

@@ -17,9 +17,18 @@ config.schoolSlugs = {
   'GMU': {
     'longName': 'George Mason University',
     'semesters': [
-      {'GMU2016F': 'Fall 2016'},
-      {'GMU2016S': 'Summer 2016'},
-      {'GMU2016SP': 'Spring 2016'}
+      {
+        slug: 'GMU2016F',
+        longName: 'Fall 2016'
+      },
+      {
+        slug: 'GMU2016S',
+        longName: 'Summer 2016'
+      },
+      {
+        slug: 'GMU2016SP',
+        longName: 'Spring 2016'
+      }
     ]
   },
   'VT' : {

schedules/public/javascripts/mainApp.js

-var slugs;
+// Expose the school data globally.
+var schoolData = {};
+// Expose the semester data globally
+var semesterData = {};
+
 $(document).ready(function() {
+    // Convert table to DataTable
     $('#classSearch').DataTable();
 
-    var schoolSelect = document.getElementById('selectSchool');
+    // Get schoolData and populate the selection menus
     $.getJSON('/api/v1/json/schools', function(schoolSlugs) {
-      var slugs = schoolSlugs;
-      for (i = 0; i < schoolSlugs.schools.length; i++) {
-        schoolName = schoolSlugs[schoolSlugs.schools[i]];
-        schoolSelect.add(new Option(schoolName.longName, i + 1));
-      }
+      semesterData = schoolSlugs;
+      populateBoxes();
+    });
+
+    $('#selectSchool').change(function() {
+      populateSemesterSelect();
     });
 } );
+
+function populateBoxes() {
+  var schoolSelect = document.getElementById('selectSchool');
+
+  for (i = 0; i < semesterData.schools.length; i++) {
+    var schoolName = semesterData[semesterData.schools[i]];
+    schoolSelect.add(new Option(schoolName.longName, i));
+  }
+
+  populateSemesterSelect();
+}
+
+function populateSemesterSelect() {
+  var schoolSelect = $('#selectSchool');
+  var selectSemester = document.getElementById('selectSemester');
+
+  // Clear Select Semester
+  selectSemester.innerHTML = "";
+
+  var schoolID = $('#selectSchool option:selected').val();
+  var schoolSlug = semesterData.schools[schoolID];
+  var school = semesterData[schoolSlug];
+
+  for (i = 0; i < school.semesters.length; i++) {
+    var semesterName = school.semesters[i];
+    selectSemester.add(new Option(semesterName.longName, i));
+  }
+}

schedules/views/index.jade

@@ -37,8 +37,6 @@ block content
                       label.col-md-4.control-label(for="selectSemester") Select a Semester
                       div.col-md-6
                         select#selectSemester.form-control(name="selectSemester")
-                          option(value="1") Option one
-                          option(value="2") Option two
 
                     // Text input
                     div.form-group