locale.admin.es6.js 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  1. /**
  2. * @file
  3. * Locale admin behavior.
  4. */
  5. (function ($, Drupal) {
  6. /**
  7. * Marks changes of translations.
  8. *
  9. * @type {Drupal~behavior}
  10. *
  11. * @prop {Drupal~behaviorAttach} attach
  12. * Attaches behavior to show the user if translations has changed.
  13. * @prop {Drupal~behaviorDetach} detach
  14. * Detach behavior to show the user if translations has changed.
  15. */
  16. Drupal.behaviors.localeTranslateDirty = {
  17. attach() {
  18. const $form = $('#locale-translate-edit-form').once('localetranslatedirty');
  19. if ($form.length) {
  20. // Display a notice if any row changed.
  21. $form.one('formUpdated.localeTranslateDirty', 'table', function () {
  22. const $marker = $(Drupal.theme('localeTranslateChangedWarning')).hide();
  23. $(this).addClass('changed').before($marker);
  24. $marker.fadeIn('slow');
  25. });
  26. // Highlight changed row.
  27. $form.on('formUpdated.localeTranslateDirty', 'tr', function () {
  28. const $row = $(this);
  29. const $rowToMark = $row.once('localemark');
  30. const marker = Drupal.theme('localeTranslateChangedMarker');
  31. $row.addClass('changed');
  32. // Add an asterisk only once if row changed.
  33. if ($rowToMark.length) {
  34. $rowToMark.find('td:first-child .js-form-item').append(marker);
  35. }
  36. });
  37. }
  38. },
  39. detach(context, settings, trigger) {
  40. if (trigger === 'unload') {
  41. const $form = $('#locale-translate-edit-form').removeOnce('localetranslatedirty');
  42. if ($form.length) {
  43. $form.off('formUpdated.localeTranslateDirty');
  44. }
  45. }
  46. },
  47. };
  48. /**
  49. * Show/hide the description details on Available translation updates page.
  50. *
  51. * @type {Drupal~behavior}
  52. *
  53. * @prop {Drupal~behaviorAttach} attach
  54. * Attaches behavior for toggling details on the translation update page.
  55. */
  56. Drupal.behaviors.hideUpdateInformation = {
  57. attach(context, settings) {
  58. const $table = $('#locale-translation-status-form').once('expand-updates');
  59. if ($table.length) {
  60. const $tbodies = $table.find('tbody');
  61. // Open/close the description details by toggling a tr class.
  62. $tbodies.on('click keydown', '.description', function (e) {
  63. if (e.keyCode && (e.keyCode !== 13 && e.keyCode !== 32)) {
  64. return;
  65. }
  66. e.preventDefault();
  67. const $tr = $(this).closest('tr');
  68. $tr.toggleClass('expanded');
  69. // Change screen reader text.
  70. $tr.find('.locale-translation-update__prefix').text(() => {
  71. if ($tr.hasClass('expanded')) {
  72. return Drupal.t('Hide description');
  73. }
  74. return Drupal.t('Show description');
  75. });
  76. });
  77. $table.find('.requirements, .links').hide();
  78. }
  79. },
  80. };
  81. $.extend(Drupal.theme, /** @lends Drupal.theme */{
  82. /**
  83. * Creates markup for a changed translation marker.
  84. *
  85. * @return {string}
  86. * Markup for the marker.
  87. */
  88. localeTranslateChangedMarker() {
  89. return `<abbr class="warning ajax-changed" title="${Drupal.t('Changed')}">*</abbr>`;
  90. },
  91. /**
  92. * Creates markup for the translation changed warning.
  93. *
  94. * @return {string}
  95. * Markup for the warning.
  96. */
  97. localeTranslateChangedWarning() {
  98. return `<div class="clearfix messages messages--warning">${Drupal.theme('localeTranslateChangedMarker')} ${Drupal.t('Changes made in this table will not be saved until the form is submitted.')}</div>`;
  99. },
  100. });
  101. }(jQuery, Drupal));