Merge pull request #470 from commercekitchen/develop

Nashville custom school program registration
commercekitchen · Jul 27, 2020 · d4753eb · d4753eb
2 parents 8c0b695 + be2c79a
commit d4753eb
Show file tree

Hide file tree

Showing 46 changed files with 728 additions and 220 deletions.
diff --git a/app/assets/javascripts/registrations.js b/app/assets/javascripts/registrations.js
@@ -1,42 +1,33 @@
-(function(registrations) {
+(function (registrations) {
   registrations(window.jQuery, window, document);
-})(function($, window, document) {
-  $(function() {
-    $(document).ready(function() {
+})(function ($, window, document) {
+  $(function () {
+    $(document).ready(function () {
       var programType = $(
         "input[type=radio][name=program_type][checked='checked']"
       ).val();
+
       if (programType) {
-        updateVisibleInputs(programType);
+        programTypeSelected(programType);
       }
     });
 
-    $("input[type=radio][name=program_type]").change(function() {
-      updateVisibleInputs(this.value);
+    $("input[type=radio][name=program_type]").change(function () {
+      programTypeSelected(this.value);
     });
 
-    $("#user_program_id").change(function(e) {
+    $("#user_program_id").change(function (e) {
       var programId = $(this).val();
       $("#previously_selected_program").val(programId);
       programSelected(programId);
     });
 
-    $("#user_program_location_id").change(function() {
+    $("#user_program_location_id").change(function () {
       var locationId = $(this).val();
       $("#user_previous_location_id").val(locationId);
     });
 
-    $("#user_acting_as").change(function(e) {
-      var newRole = $(this).val();
-
-      if (newRole == "Student") {
-        showStudentFields();
-      } else {
-        hideStudentFields();
-      }
-    });
-
-    $("#chzn").change(function(e) {
+    $("#chzn").change(function (e) {
       var selection = $(this).val();
 
       if (selection) {
@@ -48,109 +39,79 @@
     });
   });
 
-  function updateVisibleInputs(programType) {
-    if (programType !== "none") {
-      $("#user_program_id.hideUntilActive").show();
-      getProgramsOfType(programType).done(updateProgramSelection);
-    } else {
+  function programTypeSelected(programType) {
+    if (programType == "none") {
       $("#user_program_id").val(null);
       $("#user_program_location_id").val(null);
       $(".hideUntilActive").hide();
+    } else {
+      $("#user_program_id.hideUntilActive").show();
+      updateProgramOptions(programType);
     }
-    $("#program_location_fields.hideUntilActive").hide();
-    updateSchoolsSection(programType);
-  }
 
-  function tryPreviousProgramSelection() {
-    var programId = $("#previously_selected_program").val();
-    if (!programId) {
-      return;
-    }
-    if (
-      $("#user_program_id").find("option[value=" + programId + "]").length > 0
-    ) {
-      $("#user_program_id").val(programId);
-      programSelected(programId);
-    }
-  }
+    $("#program_location_fields.hideUntilActive").hide();
 
-  function tryPreviousLocationSelection() {
-    var previousId = $("#user_previous_location_id").val();
-    if (!previousId) {
-      return;
-    }
-    if (
-      $("#user_program_location_id").find("option[value=" + previousId + "]")
-        .length > 0
-    ) {
-      $("#user_program_location_id").val(previousId);
+    if (programType == "students_and_parents") {
+      schoolsForm.showForm();
+    } else {
+      schoolsForm.hideForm();
     }
   }
 
   function programSelected(id) {
     if (id === "") {
       $("#program_location_fields.hideUntilActive").hide();
-      $("#school_fields.hideUntilActive").hide();
+      schoolsForm.hideForm();
     } else {
-      getNewProgramData(id).done(updateRegistrationFields);
+      $.ajax({
+        method: "post",
+        url: "/ajax/programs/select_program",
+        data: { program_id: id },
+      }).done(function (response) {
+        updateProgramLocationSection(response.program_locations);
+      });
     }
   }
 
-  function getProgramsOfType(type) {
-    return $.ajax({
+  function updateProgramOptions(type) {
+    $.ajax({
       method: "post",
       url: "/ajax/programs/sub_programs",
-      data: { parent_type: type }
-    });
-  }
+      data: { parent_type: type },
+    }).done(function (data) {
+      var newOptionsArray = data.map(function (obj) {
+        return [obj.id, obj.program_name];
+      });
+
+      $("#user_program_id").updateDropdown("Program", newOptionsArray);
+
+      if (newOptionsArray.length === 1) {
+        $("#user_program_id option")
+          .filter(function () {
+            return (
+              !this.value ||
+              $.trim(this.value).length == 0 ||
+              $.trim(this.text).length == 0
+            );
+          })
+          .remove();
+      }
 
-  function updateProgramSelection(data) {
-    var newOptionsArray = data.map(function(obj) {
-      return [obj.id, obj.program_name];
+      tryPreviousProgramSelection();
     });
-
-    $("#user_program_id").updateDropdown("Program", newOptionsArray);
-
-    tryPreviousProgramSelection();
   }
 
-  function getNewProgramData(programId) {
-    return $.ajax({
-      method: "post",
-      url: "/ajax/programs/select_program",
-      data: { program_id: programId }
+  function updateProgramLocationSection(programLocations) {
+    var enabledLocations = programLocations.filter(function (obj) {
+      return JSON.parse(obj.enabled);
     });
-  }
-
-  function updateRegistrationFields(data) {
-    var programType = data.parent_type;
-    var programLocations = data.program_locations;
-
-    updateProgramLocationSection(programLocations);
-    updateSchoolsSection(programType);
-  }
-
-  function showStudentFields() {
-    $("#student-only.hideUntilActive").show();
-    $("#user_student_id").attr("placeholder", "Student ID #");
-  }
-
-  function hideStudentFields() {
-    $("#student-only").hide();
-    $("#user_student_id").attr("placeholder", "Students' ID #s");
-  }
 
-  function updateProgramLocationSection(programLocations) {
-    if (programLocations.length > 0) {
+    if (enabledLocations.length > 0) {
       $("#program_location_fields.hideUntilActive").show();
 
-      var newOptionsArray = programLocations
-        .filter(function(obj) {
-          return JSON.parse(obj.enabled);
-        })
-        .map(function(obj) {
-          return [obj.id, obj.location_name];
-        });
+      var newOptionsArray = enabledLocations.map(function (obj) {
+        return [obj.id, obj.location_name];
+      });
 
       $("#user_program_location_id").updateDropdown(
         "Location",
@@ -162,11 +123,29 @@
     }
   }
 
-  function updateSchoolsSection(programType) {
-    if (programType == "students_and_parents") {
-      $("#school_fields.hideUntilActive").show();
-    } else {
-      $("#school_fields.hideUntilActive").hide();
+  function tryPreviousProgramSelection() {
+    var programId = $("#previously_selected_program").val();
+    if (!programId) {
+      return;
+    }
+    if (
+      $("#user_program_id").find("option[value=" + programId + "]").length > 0
+    ) {
+      $("#user_program_id").val(programId);
+      programSelected(programId);
+    }
+  }
+
+  function tryPreviousLocationSelection() {
+    var previousId = $("#user_previous_location_id").val();
+    if (!previousId) {
+      return;
+    }
+    if (
+      $("#user_program_location_id").find("option[value=" + previousId + "]")
+        .length > 0
+    ) {
+      $("#user_program_location_id").val(previousId);
     }
   }
 });
diff --git a/app/assets/javascripts/registrations/schools_form.js b/app/assets/javascripts/registrations/schools_form.js
@@ -0,0 +1,71 @@
+var schoolsForm = (function () {
+  function showForm() {
+    $("#school_fields").show();
+    $("#user_acting_as").trigger("change");
+  }
+
+  function hideForm() {
+    $("#school_fields").hide();
+    $("#user_student_id").prop("required", false);
+  }
+
+  function loadSchoolsByType(schoolType) {
+    $.get("/ajax/schools", { school_type: schoolType }).done(function (data) {
+      newOptions = data.map(function (obj) {
+        return [obj.id, obj.school_name];
+      });
+
+      $("#user_school_id").updateDropdown("School", newOptions);
+      $("#school_fields .hideUntilActive").show();
+    });
+  }
+
+  function showStudentFields() {
+    $("#student-only").show();
+  }
+
+  function hideStudentFields() {
+    $("#student-only").hide();
+  }
+
+  function makeStudentIdRequired() {
+    $("#user_student_id").prop("required", true);
+  }
+
+  function makeStudentIdOptional() {
+    $("#user_student_id").prop("required", false);
+  }
+
+  return {
+    showForm: showForm,
+    hideForm: hideForm,
+    loadSchoolsByType: loadSchoolsByType,
+    showStudentFields: showStudentFields,
+    hideStudentFields: hideStudentFields,
+    makeStudentIdRequired: makeStudentIdRequired,
+    makeStudentIdOptional: makeStudentIdOptional,
+  };
+})();
+
+$(document).ready(function () {
+  $("#user_acting_as").change(function (e) {
+    var newRole = $(this).val();
+
+    if (newRole == "Student") {
+      schoolsForm.showStudentFields();
+      schoolsForm.makeStudentIdRequired();
+    } else {
+      schoolsForm.hideStudentFields();
+      schoolsForm.makeStudentIdOptional();
+    }
+  });
+
+  $("#school_type").change(function () {
+    var schoolType = $(this).val();
+
+    if (schoolType !== "") {
+      $("#school_type option[value='']").remove();
+      schoolsForm.loadSchoolsByType(schoolType);
+    }
+  });
+});
diff --git a/app/assets/stylesheets/components/_admin_resource_list.scss b/app/assets/stylesheets/components/_admin_resource_list.scss
@@ -5,6 +5,8 @@
 .resource-row {
   padding: 1em 0;
   display: flex;
+  align-items: center;
+  align-content: stretch;
   border-top: 1px solid;
   border-bottom: 1px solid;
 
@@ -22,11 +24,11 @@
     border-top: none;
   }
 
-  .resource-title {
-    flex-basis: 50%;
-  }
+  .resource-cell {
+    flex: 1 1 0px;
 
-  .resource-link {
-    flex-basis: 50%;
+    &:not(:first-child) {
+      padding: 0 1rem;
+    }
   }
 }
diff --git a/app/assets/stylesheets/components/_new_school_form.scss b/app/assets/stylesheets/components/_new_school_form.scss
@@ -0,0 +1,5 @@
+.new-school-form {
+  select {
+    max-width: 200px;
+  }
+}
diff --git a/app/assets/stylesheets/mixins/_buttons.scss b/app/assets/stylesheets/mixins/_buttons.scss
@@ -18,6 +18,11 @@
     letter-spacing: 1px;
     outline: none;
 
+    &.skinny {
+      min-width: 200px;
+      padding: 11px 20px;
+    }
+
     @media (max-width: $breakpoint-tablet) {
       min-width: 0;
     }

diff --git a/app/assets/stylesheets/partials/_forms.scss b/app/assets/stylesheets/partials/_forms.scss
@@ -97,8 +97,11 @@ textarea {
     padding-right: 2em;
   }
 
-  input {
-    &:nth-child(1) {
+  input,
+  select {
+    flex: 0 1 auto;
+
+    &:not(:last-child) {
       margin-right: 1em;
     }
   }

diff --git a/app/controllers/admin/programs_controller.rb b/app/controllers/admin/programs_controller.rb
@@ -21,7 +21,7 @@ def create
     end
 
     def index
-      @programs = policy_scope(Program)
+      @programs = policy_scope(Program).active
     end
 
     def edit