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));
|