digitalmarketplace-frontend
Version:
Digital Marketplace Frontend contains assets and components used in Digital Marketplace projects
123 lines (119 loc) • 5.41 kB
JavaScript
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
typeof define === 'function' && define.amd ? define(['exports'], factory) :
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.DigitalMarketplaceFrontend = {}));
})(this, (function (exports) { 'use strict';
class QuestionCheckboxTreeSummary {
$totalSelected;
$totalSelectedText;
itemNameSingular;
itemNamePlural;
constructor($summary, itemNameSingular, itemNamePlural) {
this.$totalSelected = $summary.find('.dm-checkbox-tree__summary-total-selected');
this.$totalSelectedText = $summary.find('.dm-checkbox-tree__summary-total-selected-text');
this.itemNameSingular = itemNameSingular;
this.itemNamePlural = itemNamePlural;
}
updateSelectedCount(numberSelected) {
this.$totalSelected.text(numberSelected);
if (numberSelected === 1) {
this.$totalSelectedText.text(`${this.itemNameSingular} selected.`);
}
else {
this.$totalSelectedText.text(`${this.itemNamePlural} selected.`);
}
}
}
class QuestionCheckboxTreeSection {
checkboxTree;
$section;
$accordionButton;
checkboxes;
$summary;
constructor(checkboxTree, $section) {
this.checkboxTree = checkboxTree;
this.$section = $section;
this.$accordionButton = this.$section.find('button.govuk-accordion__section-button');
this.checkboxes = this.$section.find('.govuk-checkboxes__input').get().map((element) => $(element));
this.$summary = this.$section.find('.dm-checkbox-tree__options-number-selected');
}
init() {
this.openSectionIfSelected();
this.checkboxes.forEach(($checkbox) => {
$checkbox.on('click', () => {
this.checkboxTree.updateTotals($checkbox.val(), $checkbox.is(':checked'));
});
});
}
selectedItems() {
return this.checkboxes.filter(($checkbox) => $checkbox.is(':checked'));
}
countSelected() {
return this.selectedItems().length;
}
openSectionIfSelected() {
if (this.$accordionButton.length && this.countSelected() > 0 && this.$accordionButton.attr('aria-expanded') === 'false') {
this.$accordionButton.trigger('click');
}
}
slectedItemValues() {
return this.selectedItems().map(($checkbox) => $checkbox.val());
}
updateSelectedCount() {
if (this.$summary.length) {
const numberSelected = this.countSelected();
if (numberSelected > 0) {
this.$summary.text(`, ${numberSelected} selected`);
}
else {
this.$summary.text('');
}
}
}
toggleCheckbox(value, isChecked) {
this.checkboxes.forEach(($checkbox) => {
if ($checkbox.val() === value) {
$checkbox.prop('checked', isChecked);
}
});
}
}
class QuestionCheckboxTree {
static moduleName = 'dm-question-checkbox-tree';
$checkboxTree;
checkboxTreeSummary;
checkboxTreeSections;
constructor($checkboxTree) {
this.$checkboxTree = $checkboxTree;
this.checkboxTreeSummary = new QuestionCheckboxTreeSummary(this.$checkboxTree.find('.dm-checkbox-tree__summary'), this.$checkboxTree.data('itemNameSingular'), this.$checkboxTree.data('itemNamePlural'));
const checkboxTreeSections = this.$checkboxTree.find('.govuk-accordion__section').get().map((element) => new QuestionCheckboxTreeSection(this, $(element)));
if (checkboxTreeSections.length) {
this.checkboxTreeSections = checkboxTreeSections;
}
else {
this.checkboxTreeSections = [new QuestionCheckboxTreeSection(this, $('.dm-checkbox-tree__options'))];
}
}
init() {
this.checkboxTreeSections.forEach((checkboxTreeSection) => checkboxTreeSection.init());
this.updateCheckboxTreeSummaryCount();
this.updateCheckboxTreeSectionSelectedCounts();
}
countSelected() {
return new Set(this.checkboxTreeSections.map((checkboxTreeSection) => checkboxTreeSection.slectedItemValues()).flat()).size;
}
updateCheckboxTreeSummaryCount() {
this.checkboxTreeSummary.updateSelectedCount(this.countSelected());
}
updateCheckboxTreeSectionSelectedCounts() {
this.checkboxTreeSections.forEach((checkboxTreeSection) => checkboxTreeSection.updateSelectedCount());
}
updateTotals(value, isChecked) {
this.checkboxTreeSections.forEach((checkboxTreeSection) => checkboxTreeSection.toggleCheckbox(value, isChecked));
this.updateCheckboxTreeSummaryCount();
this.updateCheckboxTreeSectionSelectedCounts();
}
}
exports.QuestionCheckboxTree = QuestionCheckboxTree;
}));
//# sourceMappingURL=question-checkbox-tree.bundle.js.map