Chris@0: /**
Chris@0:  * @file
Chris@0:  * Content Translation admin behaviors.
Chris@0:  */
Chris@0: 
Chris@4: (function($, Drupal, drupalSettings) {
Chris@0:   /**
Chris@0:    * Forces applicable options to be checked as translatable.
Chris@0:    *
Chris@0:    * @type {Drupal~behavior}
Chris@0:    *
Chris@0:    * @prop {Drupal~behaviorAttach} attach
Chris@0:    *   Attaches content translation dependent options to the UI.
Chris@0:    */
Chris@0:   Drupal.behaviors.contentTranslationDependentOptions = {
Chris@0:     attach(context) {
Chris@0:       const $context = $(context);
Chris@0:       const options = drupalSettings.contentTranslationDependentOptions;
Chris@0:       let $fields;
Chris@0: 
Chris@0:       function fieldsChangeHandler($fields, dependentColumns) {
Chris@4:         return function(e) {
Chris@4:           Drupal.behaviors.contentTranslationDependentOptions.check(
Chris@4:             $fields,
Chris@4:             dependentColumns,
Chris@4:             $(e.target),
Chris@4:           );
Chris@0:         };
Chris@0:       }
Chris@0: 
Chris@0:       // We're given a generic name to look for so we find all inputs containing
Chris@0:       // that name and copy over the input values that require all columns to be
Chris@0:       // translatable.
Chris@0:       if (options && options.dependent_selectors) {
Chris@4:         Object.keys(options.dependent_selectors).forEach(field => {
Chris@0:           $fields = $context.find(`input[name^="${field}"]`);
Chris@0:           const dependentColumns = options.dependent_selectors[field];
Chris@0: 
Chris@0:           $fields.on('change', fieldsChangeHandler($fields, dependentColumns));
Chris@4:           Drupal.behaviors.contentTranslationDependentOptions.check(
Chris@4:             $fields,
Chris@4:             dependentColumns,
Chris@4:           );
Chris@0:         });
Chris@0:       }
Chris@0:     },
Chris@0:     check($fields, dependentColumns, $changed) {
Chris@0:       let $element = $changed;
Chris@0:       let column;
Chris@0: 
Chris@0:       function filterFieldsList(index, field) {
Chris@0:         return $(field).val() === column;
Chris@0:       }
Chris@0: 
Chris@0:       // A field that has many different translatable parts can also define one
Chris@0:       // or more columns that require all columns to be translatable.
Chris@4:       Object.keys(dependentColumns || {}).forEach(index => {
Chris@0:         column = dependentColumns[index];
Chris@0: 
Chris@0:         if (!$changed) {
Chris@0:           $element = $fields.filter(filterFieldsList);
Chris@0:         }
Chris@0: 
Chris@0:         if ($element.is(`input[value="${column}"]:checked`)) {
Chris@4:           $fields
Chris@4:             .prop('checked', true)
Chris@4:             .not($element)
Chris@4:             .prop('disabled', true);
Chris@4:         } else {
Chris@0:           $fields.prop('disabled', false);
Chris@0:         }
Chris@0:       });
Chris@0:     },
Chris@0:   };
Chris@0: 
Chris@0:   /**
Chris@0:    * Makes field translatability inherit bundle translatability.
Chris@0:    *
Chris@0:    * @type {Drupal~behavior}
Chris@0:    *
Chris@0:    * @prop {Drupal~behaviorAttach} attach
Chris@0:    *   Attaches content translation behavior.
Chris@0:    */
Chris@0:   Drupal.behaviors.contentTranslation = {
Chris@0:     attach(context) {
Chris@0:       // Initially hide all field rows for non translatable bundles and all
Chris@0:       // column rows for non translatable fields.
Chris@4:       $(context)
Chris@4:         .find('table .bundle-settings .translatable :input')
Chris@4:         .once('translation-entity-admin-hide')
Chris@4:         .each(function() {
Chris@4:           const $input = $(this);
Chris@4:           const $bundleSettings = $input.closest('.bundle-settings');
Chris@4:           if (!$input.is(':checked')) {
Chris@4:             $bundleSettings.nextUntil('.bundle-settings').hide();
Chris@4:           } else {
Chris@4:             $bundleSettings
Chris@4:               .nextUntil('.bundle-settings', '.field-settings')
Chris@4:               .find('.translatable :input:not(:checked)')
Chris@4:               .closest('.field-settings')
Chris@4:               .nextUntil(':not(.column-settings)')
Chris@4:               .hide();
Chris@4:           }
Chris@4:         });
Chris@0: 
Chris@0:       // When a bundle is made translatable all of its fields should inherit
Chris@0:       // this setting. Instead when it is made non translatable its fields are
Chris@0:       // hidden, since their translatability no longer matters.
Chris@4:       $('body')
Chris@4:         .once('translation-entity-admin-bind')
Chris@4:         .on('click', 'table .bundle-settings .translatable :input', e => {
Chris@4:           const $target = $(e.target);
Chris@4:           const $bundleSettings = $target.closest('.bundle-settings');
Chris@4:           const $settings = $bundleSettings.nextUntil('.bundle-settings');
Chris@4:           const $fieldSettings = $settings.filter('.field-settings');
Chris@4:           if ($target.is(':checked')) {
Chris@4:             $bundleSettings
Chris@4:               .find('.operations :input[name$="[language_alterable]"]')
Chris@4:               .prop('checked', true);
Chris@4:             $fieldSettings.find('.translatable :input').prop('checked', true);
Chris@4:             $settings.show();
Chris@4:           } else {
Chris@4:             $settings.hide();
Chris@4:           }
Chris@4:         })
Chris@4:         .on('click', 'table .field-settings .translatable :input', e => {
Chris@0:           const $target = $(e.target);
Chris@0:           const $fieldSettings = $target.closest('.field-settings');
Chris@4:           const $columnSettings = $fieldSettings.nextUntil(
Chris@4:             '.field-settings, .bundle-settings',
Chris@4:           );
Chris@0:           if ($target.is(':checked')) {
Chris@0:             $columnSettings.show();
Chris@4:           } else {
Chris@0:             $columnSettings.hide();
Chris@0:           }
Chris@0:         });
Chris@0:     },
Chris@0:   };
Chris@4: })(jQuery, Drupal, drupalSettings);