content_translation.admin.es6.js 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
  1. /**
  2. * @file
  3. * Content Translation admin behaviors.
  4. */
  5. (function($, Drupal, drupalSettings) {
  6. /**
  7. * Forces applicable options to be checked as translatable.
  8. *
  9. * @type {Drupal~behavior}
  10. *
  11. * @prop {Drupal~behaviorAttach} attach
  12. * Attaches content translation dependent options to the UI.
  13. */
  14. Drupal.behaviors.contentTranslationDependentOptions = {
  15. attach(context) {
  16. const $context = $(context);
  17. const options = drupalSettings.contentTranslationDependentOptions;
  18. let $fields;
  19. function fieldsChangeHandler($fields, dependentColumns) {
  20. return function(e) {
  21. Drupal.behaviors.contentTranslationDependentOptions.check(
  22. $fields,
  23. dependentColumns,
  24. $(e.target),
  25. );
  26. };
  27. }
  28. // We're given a generic name to look for so we find all inputs containing
  29. // that name and copy over the input values that require all columns to be
  30. // translatable.
  31. if (options && options.dependent_selectors) {
  32. Object.keys(options.dependent_selectors).forEach(field => {
  33. $fields = $context.find(`input[name^="${field}"]`);
  34. const dependentColumns = options.dependent_selectors[field];
  35. $fields.on('change', fieldsChangeHandler($fields, dependentColumns));
  36. Drupal.behaviors.contentTranslationDependentOptions.check(
  37. $fields,
  38. dependentColumns,
  39. );
  40. });
  41. }
  42. },
  43. check($fields, dependentColumns, $changed) {
  44. let $element = $changed;
  45. let column;
  46. function filterFieldsList(index, field) {
  47. return $(field).val() === column;
  48. }
  49. // A field that has many different translatable parts can also define one
  50. // or more columns that require all columns to be translatable.
  51. Object.keys(dependentColumns || {}).forEach(index => {
  52. column = dependentColumns[index];
  53. if (!$changed) {
  54. $element = $fields.filter(filterFieldsList);
  55. }
  56. if ($element.is(`input[value="${column}"]:checked`)) {
  57. $fields
  58. .prop('checked', true)
  59. .not($element)
  60. .prop('disabled', true);
  61. } else {
  62. $fields.prop('disabled', false);
  63. }
  64. });
  65. },
  66. };
  67. /**
  68. * Makes field translatability inherit bundle translatability.
  69. *
  70. * @type {Drupal~behavior}
  71. *
  72. * @prop {Drupal~behaviorAttach} attach
  73. * Attaches content translation behavior.
  74. */
  75. Drupal.behaviors.contentTranslation = {
  76. attach(context) {
  77. // Initially hide all field rows for non translatable bundles and all
  78. // column rows for non translatable fields.
  79. $(context)
  80. .find('table .bundle-settings .translatable :input')
  81. .once('translation-entity-admin-hide')
  82. .each(function() {
  83. const $input = $(this);
  84. const $bundleSettings = $input.closest('.bundle-settings');
  85. if (!$input.is(':checked')) {
  86. $bundleSettings.nextUntil('.bundle-settings').hide();
  87. } else {
  88. $bundleSettings
  89. .nextUntil('.bundle-settings', '.field-settings')
  90. .find('.translatable :input:not(:checked)')
  91. .closest('.field-settings')
  92. .nextUntil(':not(.column-settings)')
  93. .hide();
  94. }
  95. });
  96. // When a bundle is made translatable all of its fields should inherit
  97. // this setting. Instead when it is made non translatable its fields are
  98. // hidden, since their translatability no longer matters.
  99. $('body')
  100. .once('translation-entity-admin-bind')
  101. .on('click', 'table .bundle-settings .translatable :input', e => {
  102. const $target = $(e.target);
  103. const $bundleSettings = $target.closest('.bundle-settings');
  104. const $settings = $bundleSettings.nextUntil('.bundle-settings');
  105. const $fieldSettings = $settings.filter('.field-settings');
  106. if ($target.is(':checked')) {
  107. $bundleSettings
  108. .find('.operations :input[name$="[language_alterable]"]')
  109. .prop('checked', true);
  110. $fieldSettings.find('.translatable :input').prop('checked', true);
  111. $settings.show();
  112. } else {
  113. $settings.hide();
  114. }
  115. })
  116. .on('click', 'table .field-settings .translatable :input', e => {
  117. const $target = $(e.target);
  118. const $fieldSettings = $target.closest('.field-settings');
  119. const $columnSettings = $fieldSettings.nextUntil(
  120. '.field-settings, .bundle-settings',
  121. );
  122. if ($target.is(':checked')) {
  123. $columnSettings.show();
  124. } else {
  125. $columnSettings.hide();
  126. }
  127. });
  128. },
  129. };
  130. })(jQuery, Drupal, drupalSettings);