* Table select functionality.
*/
-(function ($, Drupal) {
+(function($, Drupal) {
/**
* Initialize tableSelects.
*
/**
* Callback used in {@link Drupal.behaviors.tableSelect}.
*/
- Drupal.tableSelect = function () {
+ Drupal.tableSelect = function() {
// Do not add a "Select all" checkbox if there are no rows with checkboxes
// in the table.
if ($(this).find('td input[type="checkbox"]').length === 0) {
selectAll: Drupal.t('Select all rows in this table'),
selectNone: Drupal.t('Deselect all rows in this table'),
};
- const updateSelectAll = function (state) {
+ const updateSelectAll = function(state) {
// Update table's select-all checkbox (and sticky header's if available).
- $table.prev('table.sticky-header').addBack().find('th.select-all input[type="checkbox"]').each(function () {
- const $checkbox = $(this);
- const stateChanged = $checkbox.prop('checked') !== state;
-
- $checkbox.attr('title', state ? strings.selectNone : strings.selectAll);
-
- /**
- * @checkbox {HTMLElement}
- */
- if (stateChanged) {
- $checkbox.prop('checked', state).trigger('change');
- }
- });
- };
-
- // Find all <th> with class select-all, and insert the check all checkbox.
- $table.find('th.select-all').prepend($('<input type="checkbox" class="form-checkbox" />').attr('title', strings.selectAll)).on('click', (event) => {
- if ($(event.target).is('input[type="checkbox"]')) {
- // Loop through all checkboxes and set their state to the select all
- // checkbox' state.
- checkboxes.each(function () {
+ $table
+ .prev('table.sticky-header')
+ .addBack()
+ .find('th.select-all input[type="checkbox"]')
+ .each(function() {
const $checkbox = $(this);
- const stateChanged = $checkbox.prop('checked') !== event.target.checked;
+ const stateChanged = $checkbox.prop('checked') !== state;
+
+ $checkbox.attr(
+ 'title',
+ state ? strings.selectNone : strings.selectAll,
+ );
/**
* @checkbox {HTMLElement}
*/
if (stateChanged) {
- $checkbox.prop('checked', event.target.checked).trigger('change');
+ $checkbox.prop('checked', state).trigger('change');
}
- // Either add or remove the selected class based on the state of the
- // check all checkbox.
-
- /**
- * @checkbox {HTMLElement}
- */
- $checkbox.closest('tr').toggleClass('selected', this.checked);
});
- // Update the title and the state of the check all box.
- updateSelectAll(event.target.checked);
- }
- });
+ };
+
+ // Find all <th> with class select-all, and insert the check all checkbox.
+ $table
+ .find('th.select-all')
+ .prepend(
+ $('<input type="checkbox" class="form-checkbox" />').attr(
+ 'title',
+ strings.selectAll,
+ ),
+ )
+ .on('click', event => {
+ if ($(event.target).is('input[type="checkbox"]')) {
+ // Loop through all checkboxes and set their state to the select all
+ // checkbox' state.
+ checkboxes.each(function() {
+ const $checkbox = $(this);
+ const stateChanged =
+ $checkbox.prop('checked') !== event.target.checked;
+
+ /**
+ * @checkbox {HTMLElement}
+ */
+ if (stateChanged) {
+ $checkbox.prop('checked', event.target.checked).trigger('change');
+ }
+ // Either add or remove the selected class based on the state of the
+ // check all checkbox.
+
+ /**
+ * @checkbox {HTMLElement}
+ */
+ $checkbox.closest('tr').toggleClass('selected', this.checked);
+ });
+ // Update the title and the state of the check all box.
+ updateSelectAll(event.target.checked);
+ }
+ });
// For each of the checkboxes within the table that are not disabled.
- checkboxes = $table.find('td input[type="checkbox"]:enabled').on('click', function (e) {
- // Either add or remove the selected class based on the state of the
- // check all checkbox.
-
- /**
- * @this {HTMLElement}
- */
- $(this).closest('tr').toggleClass('selected', this.checked);
-
- // If this is a shift click, we need to highlight everything in the
- // range. Also make sure that we are actually checking checkboxes
- // over a range and that a checkbox has been checked or unchecked before.
- if (e.shiftKey && lastChecked && lastChecked !== e.target) {
- // We use the checkbox's parent <tr> to do our range searching.
- Drupal.tableSelectRange($(e.target).closest('tr')[0], $(lastChecked).closest('tr')[0], e.target.checked);
- }
+ checkboxes = $table
+ .find('td input[type="checkbox"]:enabled')
+ .on('click', function(e) {
+ // Either add or remove the selected class based on the state of the
+ // check all checkbox.
+
+ /**
+ * @this {HTMLElement}
+ */
+ $(this)
+ .closest('tr')
+ .toggleClass('selected', this.checked);
+
+ // If this is a shift click, we need to highlight everything in the
+ // range. Also make sure that we are actually checking checkboxes
+ // over a range and that a checkbox has been checked or unchecked before.
+ if (e.shiftKey && lastChecked && lastChecked !== e.target) {
+ // We use the checkbox's parent <tr> to do our range searching.
+ Drupal.tableSelectRange(
+ $(e.target).closest('tr')[0],
+ $(lastChecked).closest('tr')[0],
+ e.target.checked,
+ );
+ }
- // If all checkboxes are checked, make sure the select-all one is checked
- // too, otherwise keep unchecked.
- updateSelectAll((checkboxes.length === checkboxes.filter(':checked').length));
+ // If all checkboxes are checked, make sure the select-all one is checked
+ // too, otherwise keep unchecked.
+ updateSelectAll(
+ checkboxes.length === checkboxes.filter(':checked').length,
+ );
- // Keep track of the last checked checkbox.
- lastChecked = e.target;
- });
+ // Keep track of the last checked checkbox.
+ lastChecked = e.target;
+ });
// If all checkboxes are checked on page load, make sure the select-all one
// is checked too, otherwise keep unchecked.
- updateSelectAll((checkboxes.length === checkboxes.filter(':checked').length));
+ updateSelectAll(checkboxes.length === checkboxes.filter(':checked').length);
};
/**
* @param {bool} state
* The state to set on the range.
*/
- Drupal.tableSelectRange = function (from, to, state) {
+ Drupal.tableSelectRange = function(from, to, state) {
// We determine the looping mode based on the order of from and to.
- const mode = from.rowIndex > to.rowIndex ? 'previousSibling' : 'nextSibling';
+ const mode =
+ from.rowIndex > to.rowIndex ? 'previousSibling' : 'nextSibling';
// Traverse through the sibling nodes.
for (let i = from[mode]; i; i = i[mode]) {
}
}
};
-}(jQuery, Drupal));
+})(jQuery, Drupal);
projects / yaffs-website / blobdiff