annotate core/modules/user/user.permissions.es6.js @ 0:c75dbcec494b

Initial commit from drush-created site
author Chris Cannam
date Thu, 05 Jul 2018 14:24:15 +0000
parents
children a9cd425dd02b
rev   line source
Chris@0 1 /**
Chris@0 2 * @file
Chris@0 3 * User permission page behaviors.
Chris@0 4 */
Chris@0 5
Chris@0 6 (function ($, Drupal) {
Chris@0 7 /**
Chris@0 8 * Shows checked and disabled checkboxes for inherited permissions.
Chris@0 9 *
Chris@0 10 * @type {Drupal~behavior}
Chris@0 11 *
Chris@0 12 * @prop {Drupal~behaviorAttach} attach
Chris@0 13 * Attaches functionality to the permissions table.
Chris@0 14 */
Chris@0 15 Drupal.behaviors.permissions = {
Chris@0 16 attach(context) {
Chris@0 17 const self = this;
Chris@0 18 $('table#permissions').once('permissions').each(function () {
Chris@0 19 // On a site with many roles and permissions, this behavior initially
Chris@0 20 // has to perform thousands of DOM manipulations to inject checkboxes
Chris@0 21 // and hide them. By detaching the table from the DOM, all operations
Chris@0 22 // can be performed without triggering internal layout and re-rendering
Chris@0 23 // processes in the browser.
Chris@0 24 const $table = $(this);
Chris@0 25 let $ancestor;
Chris@0 26 let method;
Chris@0 27 if ($table.prev().length) {
Chris@0 28 $ancestor = $table.prev();
Chris@0 29 method = 'after';
Chris@0 30 }
Chris@0 31 else {
Chris@0 32 $ancestor = $table.parent();
Chris@0 33 method = 'append';
Chris@0 34 }
Chris@0 35 $table.detach();
Chris@0 36
Chris@0 37 // Create dummy checkboxes. We use dummy checkboxes instead of reusing
Chris@0 38 // the existing checkboxes here because new checkboxes don't alter the
Chris@0 39 // submitted form. If we'd automatically check existing checkboxes, the
Chris@0 40 // permission table would be polluted with redundant entries. This
Chris@0 41 // is deliberate, but desirable when we automatically check them.
Chris@0 42 const $dummy = $('<input type="checkbox" class="dummy-checkbox js-dummy-checkbox" disabled="disabled" checked="checked" />')
Chris@0 43 .attr('title', Drupal.t('This permission is inherited from the authenticated user role.'))
Chris@0 44 .hide();
Chris@0 45
Chris@0 46 $table
Chris@0 47 .find('input[type="checkbox"]')
Chris@0 48 .not('.js-rid-anonymous, .js-rid-authenticated')
Chris@0 49 .addClass('real-checkbox js-real-checkbox')
Chris@0 50 .after($dummy);
Chris@0 51
Chris@0 52 // Initialize the authenticated user checkbox.
Chris@0 53 $table.find('input[type=checkbox].js-rid-authenticated')
Chris@0 54 .on('click.permissions', self.toggle)
Chris@0 55 // .triggerHandler() cannot be used here, as it only affects the first
Chris@0 56 // element.
Chris@0 57 .each(self.toggle);
Chris@0 58
Chris@0 59 // Re-insert the table into the DOM.
Chris@0 60 $ancestor[method]($table);
Chris@0 61 });
Chris@0 62 },
Chris@0 63
Chris@0 64 /**
Chris@0 65 * Toggles all dummy checkboxes based on the checkboxes' state.
Chris@0 66 *
Chris@0 67 * If the "authenticated user" checkbox is checked, the checked and disabled
Chris@0 68 * checkboxes are shown, the real checkboxes otherwise.
Chris@0 69 */
Chris@0 70 toggle() {
Chris@0 71 const authCheckbox = this;
Chris@0 72 const $row = $(this).closest('tr');
Chris@0 73 // jQuery performs too many layout calculations for .hide() and .show(),
Chris@0 74 // leading to a major page rendering lag on sites with many roles and
Chris@0 75 // permissions. Therefore, we toggle visibility directly.
Chris@0 76 $row.find('.js-real-checkbox').each(function () {
Chris@0 77 this.style.display = (authCheckbox.checked ? 'none' : '');
Chris@0 78 });
Chris@0 79 $row.find('.js-dummy-checkbox').each(function () {
Chris@0 80 this.style.display = (authCheckbox.checked ? '' : 'none');
Chris@0 81 });
Chris@0 82 },
Chris@0 83 };
Chris@0 84 }(jQuery, Drupal));