Chris@0: /**
Chris@0:  * @file
Chris@0:  * Menu UI behaviors.
Chris@0:  */
Chris@0: 
Chris@17: (function($, Drupal) {
Chris@0:   /**
Chris@0:    * Set a summary on the menu link form.
Chris@0:    *
Chris@0:    * @type {Drupal~behavior}
Chris@0:    *
Chris@0:    * @prop {Drupal~behaviorAttach} attach
Chris@0:    *   Find the form and call `drupalSetSummary` on it.
Chris@0:    */
Chris@0:   Drupal.behaviors.menuUiDetailsSummaries = {
Chris@0:     attach(context) {
Chris@17:       $(context)
Chris@17:         .find('.menu-link-form')
Chris@17:         .drupalSetSummary(context => {
Chris@17:           const $context = $(context);
Chris@17:           if (
Chris@17:             $context.find('.js-form-item-menu-enabled input').is(':checked')
Chris@17:           ) {
Chris@17:             return Drupal.checkPlain(
Chris@17:               $context.find('.js-form-item-menu-title input').val(),
Chris@17:             );
Chris@17:           }
Chris@0: 
Chris@17:           return Drupal.t('Not in menu');
Chris@17:         });
Chris@0:     },
Chris@0:   };
Chris@0: 
Chris@0:   /**
Chris@0:    * Automatically fill in a menu link title, if possible.
Chris@0:    *
Chris@0:    * @type {Drupal~behavior}
Chris@0:    *
Chris@0:    * @prop {Drupal~behaviorAttach} attach
Chris@0:    *   Attaches change and keyup behavior for automatically filling out menu
Chris@0:    *   link titles.
Chris@0:    */
Chris@0:   Drupal.behaviors.menuUiLinkAutomaticTitle = {
Chris@0:     attach(context) {
Chris@0:       const $context = $(context);
Chris@17:       $context.find('.menu-link-form').each(function() {
Chris@0:         const $this = $(this);
Chris@0:         // Try to find menu settings widget elements as well as a 'title' field
Chris@0:         // in the form, but play nicely with user permissions and form
Chris@0:         // alterations.
Chris@0:         const $checkbox = $this.find('.js-form-item-menu-enabled input');
Chris@14:         const $linkTitle = $context.find('.js-form-item-menu-title input');
Chris@17:         const $title = $this
Chris@17:           .closest('form')
Chris@17:           .find('.js-form-item-title-0-value input');
Chris@0:         // Bail out if we do not have all required fields.
Chris@14:         if (!($checkbox.length && $linkTitle.length && $title.length)) {
Chris@0:           return;
Chris@0:         }
Chris@0:         // If there is a link title already, mark it as overridden. The user
Chris@0:         // expects that toggling the checkbox twice will take over the node's
Chris@0:         // title.
Chris@14:         if ($checkbox.is(':checked') && $linkTitle.val().length) {
Chris@14:           $linkTitle.data('menuLinkAutomaticTitleOverridden', true);
Chris@0:         }
Chris@0:         // Whenever the value is changed manually, disable this behavior.
Chris@14:         $linkTitle.on('keyup', () => {
Chris@14:           $linkTitle.data('menuLinkAutomaticTitleOverridden', true);
Chris@0:         });
Chris@0:         // Global trigger on checkbox (do not fill-in a value when disabled).
Chris@0:         $checkbox.on('change', () => {
Chris@0:           if ($checkbox.is(':checked')) {
Chris@14:             if (!$linkTitle.data('menuLinkAutomaticTitleOverridden')) {
Chris@14:               $linkTitle.val($title.val());
Chris@0:             }
Chris@17:           } else {
Chris@14:             $linkTitle.val('');
Chris@14:             $linkTitle.removeData('menuLinkAutomaticTitleOverridden');
Chris@0:           }
Chris@0:           $checkbox.closest('.vertical-tabs-pane').trigger('summaryUpdated');
Chris@0:           $checkbox.trigger('formUpdated');
Chris@0:         });
Chris@0:         // Take over any title change.
Chris@0:         $title.on('keyup', () => {
Chris@17:           if (
Chris@17:             !$linkTitle.data('menuLinkAutomaticTitleOverridden') &&
Chris@17:             $checkbox.is(':checked')
Chris@17:           ) {
Chris@14:             $linkTitle.val($title.val());
Chris@14:             $linkTitle.val($title.val()).trigger('formUpdated');
Chris@0:           }
Chris@0:         });
Chris@0:       });
Chris@0:     },
Chris@0:   };
Chris@17: })(jQuery, Drupal);