3 * Locale admin behavior.
6 (function ($, Drupal) {
8 * Marks changes of translations.
10 * @type {Drupal~behavior}
12 * @prop {Drupal~behaviorAttach} attach
13 * Attaches behavior to show the user if translations has changed.
14 * @prop {Drupal~behaviorDetach} detach
15 * Detach behavior to show the user if translations has changed.
17 Drupal.behaviors.localeTranslateDirty = {
19 const $form = $('#locale-translate-edit-form').once('localetranslatedirty');
21 // Display a notice if any row changed.
22 $form.one('formUpdated.localeTranslateDirty', 'table', function () {
23 const $marker = $(Drupal.theme('localeTranslateChangedWarning')).hide();
24 $(this).addClass('changed').before($marker);
25 $marker.fadeIn('slow');
27 // Highlight changed row.
28 $form.on('formUpdated.localeTranslateDirty', 'tr', function () {
30 const $rowToMark = $row.once('localemark');
31 const marker = Drupal.theme('localeTranslateChangedMarker');
33 $row.addClass('changed');
34 // Add an asterisk only once if row changed.
35 if ($rowToMark.length) {
36 $rowToMark.find('td:first-child .js-form-item').append(marker);
41 detach(context, settings, trigger) {
42 if (trigger === 'unload') {
43 const $form = $('#locale-translate-edit-form').removeOnce('localetranslatedirty');
45 $form.off('formUpdated.localeTranslateDirty');
52 * Show/hide the description details on Available translation updates page.
54 * @type {Drupal~behavior}
56 * @prop {Drupal~behaviorAttach} attach
57 * Attaches behavior for toggling details on the translation update page.
59 Drupal.behaviors.hideUpdateInformation = {
60 attach(context, settings) {
61 const $table = $('#locale-translation-status-form').once('expand-updates');
63 const $tbodies = $table.find('tbody');
65 // Open/close the description details by toggling a tr class.
66 $tbodies.on('click keydown', '.description', function (e) {
67 if (e.keyCode && (e.keyCode !== 13 && e.keyCode !== 32)) {
71 const $tr = $(this).closest('tr');
73 $tr.toggleClass('expanded');
75 // Change screen reader text.
76 $tr.find('.locale-translation-update__prefix').text(() => {
77 if ($tr.hasClass('expanded')) {
78 return Drupal.t('Hide description');
81 return Drupal.t('Show description');
84 $table.find('.requirements, .links').hide();
89 $.extend(Drupal.theme, /** @lends Drupal.theme */{
92 * Creates markup for a changed translation marker.
95 * Markup for the marker.
97 localeTranslateChangedMarker() {
98 return `<abbr class="warning ajax-changed" title="${Drupal.t('Changed')}">*</abbr>`;
102 * Creates markup for the translation changed warning.
105 * Markup for the warning.
107 localeTranslateChangedWarning() {
108 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>`;