menu_ui.es6.js 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. /**
  2. * @file
  3. * Menu UI behaviors.
  4. */
  5. (function($, Drupal) {
  6. /**
  7. * Set a summary on the menu link form.
  8. *
  9. * @type {Drupal~behavior}
  10. *
  11. * @prop {Drupal~behaviorAttach} attach
  12. * Find the form and call `drupalSetSummary` on it.
  13. */
  14. Drupal.behaviors.menuUiDetailsSummaries = {
  15. attach(context) {
  16. $(context)
  17. .find('.menu-link-form')
  18. .drupalSetSummary(context => {
  19. const $context = $(context);
  20. if (
  21. $context.find('.js-form-item-menu-enabled input').is(':checked')
  22. ) {
  23. return Drupal.checkPlain(
  24. $context.find('.js-form-item-menu-title input').val(),
  25. );
  26. }
  27. return Drupal.t('Not in menu');
  28. });
  29. },
  30. };
  31. /**
  32. * Automatically fill in a menu link title, if possible.
  33. *
  34. * @type {Drupal~behavior}
  35. *
  36. * @prop {Drupal~behaviorAttach} attach
  37. * Attaches change and keyup behavior for automatically filling out menu
  38. * link titles.
  39. */
  40. Drupal.behaviors.menuUiLinkAutomaticTitle = {
  41. attach(context) {
  42. const $context = $(context);
  43. $context.find('.menu-link-form').each(function() {
  44. const $this = $(this);
  45. // Try to find menu settings widget elements as well as a 'title' field
  46. // in the form, but play nicely with user permissions and form
  47. // alterations.
  48. const $checkbox = $this.find('.js-form-item-menu-enabled input');
  49. const $linkTitle = $context.find('.js-form-item-menu-title input');
  50. const $title = $this
  51. .closest('form')
  52. .find('.js-form-item-title-0-value input');
  53. // Bail out if we do not have all required fields.
  54. if (!($checkbox.length && $linkTitle.length && $title.length)) {
  55. return;
  56. }
  57. // If there is a link title already, mark it as overridden. The user
  58. // expects that toggling the checkbox twice will take over the node's
  59. // title.
  60. if ($checkbox.is(':checked') && $linkTitle.val().length) {
  61. $linkTitle.data('menuLinkAutomaticTitleOverridden', true);
  62. }
  63. // Whenever the value is changed manually, disable this behavior.
  64. $linkTitle.on('keyup', () => {
  65. $linkTitle.data('menuLinkAutomaticTitleOverridden', true);
  66. });
  67. // Global trigger on checkbox (do not fill-in a value when disabled).
  68. $checkbox.on('change', () => {
  69. if ($checkbox.is(':checked')) {
  70. if (!$linkTitle.data('menuLinkAutomaticTitleOverridden')) {
  71. $linkTitle.val($title.val());
  72. }
  73. } else {
  74. $linkTitle.val('');
  75. $linkTitle.removeData('menuLinkAutomaticTitleOverridden');
  76. }
  77. $checkbox.closest('.vertical-tabs-pane').trigger('summaryUpdated');
  78. $checkbox.trigger('formUpdated');
  79. });
  80. // Take over any title change.
  81. $title.on('keyup', () => {
  82. if (
  83. !$linkTitle.data('menuLinkAutomaticTitleOverridden') &&
  84. $checkbox.is(':checked')
  85. ) {
  86. $linkTitle.val($title.val());
  87. $linkTitle.val($title.val()).trigger('formUpdated');
  88. }
  89. });
  90. });
  91. },
  92. };
  93. })(jQuery, Drupal);