Prototype empty capacity

app/assets/javascript/calendar-table-actions.js

@@ -1,6 +1,3 @@
-  var lastSelectedCell = null;
-  var selectableCells = Array.from(document.querySelectorAll('.calendar-table td:not(.calendar-table-no-data)'));
-
   function clearSelectedDays() {
     document.querySelectorAll('.calendar-table td.--date-selected').forEach(function (cell) {
       cell.classList.remove('--date-selected');
@@ -59,7 +56,6 @@
           clickedScheduleName.textContent = isAlreadySelected ? 'Select schedule' : 'Deselect schedule';
         }
 
-        lastSelectedCell = clickedStartCell;
         return;
       }
 
@@ -71,25 +67,27 @@
         return;
       }
 
-      if (event.shiftKey && lastSelectedCell) {
-        var startIndex = selectableCells.indexOf(lastSelectedCell);
-        var endIndex = selectableCells.indexOf(cell);
-
-        if (startIndex !== -1 && endIndex !== -1) {
-          var rangeStart = Math.min(startIndex, endIndex);
-          var rangeEnd = Math.max(startIndex, endIndex);
-
-          for (var index = rangeStart; index <= rangeEnd; index++) {
-            selectableCells[index].classList.add('--date-selected');
-          }
-        }
-      } else {
-        cell.classList.toggle('--date-selected');
-      }
-
-      lastSelectedCell = cell;
+      cell.classList.toggle('--date-selected');
     });
 
     table.classList.add('--js-enabled');
   });
+
+  var selectDaysForm = document.getElementById('select-days-form');
+
+  if (selectDaysForm) {
+    selectDaysForm.addEventListener('submit', function () {
+      selectDaysForm.querySelectorAll('input[name="selectedDays"]').forEach(function (input) {
+        input.remove();
+      });
+
+      document.querySelectorAll('.calendar-table td.--date-selected[data-date]').forEach(function (cell) {
+        var input = document.createElement('input');
+        input.type = 'hidden';
+        input.name = 'selectedDays';
+        input.value = cell.getAttribute('data-date');
+        selectDaysForm.appendChild(input);
+      });
+    });
+  }
 

app/assets/sass/components/_calendar-table.scss

@@ -82,6 +82,7 @@
       text-wrap: nowrap;
     }
   }
+
   .--schedule-end {
     position: relative;
     border-right-color: nhsuk-colour("grey-2");
@@ -109,6 +110,12 @@
   margin-bottom: nhsuk-spacing(2);
 }
 
+.--template-name {
+  display: block;
+  padding: nhsuk-spacing(1);
+  margin-top: nhsuk-spacing(2);
+}
+
 ///
 /// 
 /// 

app/assets/sass/components/_clinic-capacity-summary.scss

@@ -0,0 +1,18 @@
+@use "nhsuk-frontend/dist/nhsuk/core" as *;
+
+.app-clinic-capacity-summary {
+  @include nhsuk-responsive-margin(4, "bottom");
+
+  .nhsuk-table__body {
+    display: flex;
+  }
+    .nhsuk-table__header:not(:last-child) {
+      @include nhsuk-responsive-padding(1, "right");
+      border: 0;
+    }
+    .nhsuk-table__cell {
+      @include nhsuk-responsive-padding(5, "right");
+      border: 0;
+    }
+
+}

app/assets/sass/components/_progress-bar.scss

@@ -55,34 +55,44 @@
     min-width: 0;
   }
 }
-.app-progress-bar::-webkit-progress-bar {
+::-webkit-progress-bar {
   background: #fff;
 }
 .app-progress-bar::-moz-progress-bar {
   background: #fff;
 }
 
-.app-progress-bar.--generic::-webkit-progress-value,
+.app-progress-bar.--generic::-webkit-progress-value {
+  background: var(--generic-chart-hatch);
+}
 .app-progress-bar.--generic::-moz-progress-bar {
   background: var(--generic-chart-hatch);
 }
 
-.app-progress-bar.--standard::-webkit-progress-value,
+.app-progress-bar.--standard::-webkit-progress-value {
+  background: var(--standard-chart-hatch);
+}
 .app-progress-bar.--standard::-moz-progress-bar {
   background: var(--standard-chart-hatch);
 }
 
-.app-progress-bar.--special::-webkit-progress-value,
+.app-progress-bar.--special::-webkit-progress-value {
+  background: var(--special-chart-hatch);
+}
 .app-progress-bar.--special::-moz-progress-bar {
   background: var(--special-chart-hatch);
 }
 
-.app-progress-bar.--ceased::-webkit-progress-value,
+.app-progress-bar.--ceased::-webkit-progress-value {
+  background: var(--ceased-chart-hatch);
+}
 .app-progress-bar.--ceased::-moz-progress-bar {
   background: var(--ceased-chart-hatch);
 }
 
-.app-progress-bar.--vhr::-webkit-progress-value,
+.app-progress-bar.--vhr::-webkit-progress-value {
+  background: var(--vhr-chart-hatch);
+}
 .app-progress-bar.--vhr::-moz-progress-bar {
   background: var(--vhr-chart-hatch);
-}
+}

app/assets/sass/main.scss

@@ -85,6 +85,7 @@
 // https://github.com/NHSDigital/manage-breast-screening-prototype
 
 @forward "components/calendar-table";
+@forward "components/clinic-capacity-summary";
 @forward "components/clinic-level-breadcrumbs";
 @forward "components/grid-extensions";
 @forward "components/inline-detailed-search";
@@ -106,6 +107,24 @@ a {
   @extend .nhsuk-link--no-visited-state;
 }
 
+// Makes a <button> look and behave like the .panel-item links it sits alongside
+.app-link-button {
+  display: block;
+  width: 100%;
+  padding: 0;
+  border: 0;
+  background: none;
+  text-align: left;
+  font: inherit;
+  color: $nhsuk-link-colour;
+  cursor: pointer;
+
+  &:hover {
+    color: nhsuk-shade($nhsuk-link-colour, 20%);
+    text-decoration: underline;
+  }
+}
+
 .app-card-editable {
   display: flex;
   justify-content: space-between;
@@ -178,3 +197,6 @@ a {
 .nhsuk-grid-column-one-fifth {
   @include nhsuk-grid-column(one-fifth);
 }
+.app-tag--attached {
+  margin-right: -1px;
+}

app/config.js

@@ -3,7 +3,6 @@
 module.exports = {
   // Service name
   serviceName: 'Run breast screening in England',
-
   // Port to run the prototype on locally
   port: 3000
 }

app/data/session-data-defaults.js

@@ -1,6 +1,5 @@
 const participants = require('./participants')
 
-// currently just for the September Test "clickthru"
 module.exports = {
   participants,
   stagedCount: 0,
@@ -14,5 +13,10 @@ module.exports = {
   clinicLength: "1 day",
   clinicCapacityPercentBooked: "0",
   clinicCapacityAvailable: "10",
-  clinicCapacityTotal: "10"
+  clinicCapacityTotal: "10",
+  createCapacityFromZero: {
+    schedules: [],
+    selectedDays: [],
+    dayTemplates: {}
+  }
 }

app/locals.js

@@ -7,6 +7,39 @@ module.exports = function(req, res, next) {
   //
   // req.locals.organisationName = 'NHS'
 
+  res.locals.bsoName = "Mereford and Wensley Breast Screening Service"
+  res.locals.bsoCode = "MW01"
+  res.locals.staticBaseUnit = "Mereford and Wensley Screening Centre"
+  res.locals.staticLocationShort = "Mereford and Wensley District Hospital"
+  res.locals.mobileUnits = [
+    "Davison",
+    "Drummond",
+    "Dunlop",
+    "Garrud",
+    "Howey",
+    "Kenney",
+    "Lenton",
+    "Pankhurst"
+  ]
+  res.locals.locationsShort = [
+    "Brookfield Sports Pavilion",
+    "East Mereford Community Hub",
+    "Kingsmead Swimming Centre",
+    "Mereford Central",
+    "Mereford Civic Centre",
+    "Mereford Library",
+    "Mereford Showground",
+    "Northgate Food Hall",
+    "Riverside Sports Centre",
+    "South Mereford",
+    "Wensley Community Hospital",
+    "Wensley Cross",
+    "Wensley Leisure Centre",
+    "Wensley Park",
+    "Wensley Town Hall",
+    "West Wensley Foodstore"
+  ]
+
   next()
 }