Skip to content
Snippets Groups Projects
Commit 1f8395e7 authored by Harumi Jang's avatar Harumi Jang
Browse files

Add if condition to machine name to get rid of js error

parent 8bfaa4b8
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
core/misc/machine-name.js
+ 104
− 103
View file @ 1f8395e7
......@@ -117,132 +117,133 @@
}
}
Object.keys(settings.machineName).forEach((sourceId) => {
const options = settings.machineName[sourceId];
// @todo: See if we can remove this 'if'.
// This was added since the machine-name library was added
// in FieldStorageAddForm as a temporary workaround so
// the form flow can work in a modal.
if (settings.machineName) {
Object.keys(settings.machineName).forEach((sourceId) => {
const options = settings.machineName[sourceId];
const $source = $(
once(
'machine-name',
$context.find(sourceId).addClass('machine-name-source'),
),
);
const $target = $context
.find(options.target)
.addClass('machine-name-target');
const $suffix = $context.find(options.suffix);
const $wrapper = $target.closest('.js-form-item');
// All elements have to exist.
if (
!$source.length ||
!$target.length ||
!$suffix.length ||
!$wrapper.length
) {
return;
}
// Skip processing upon a form validation error on a non-empty
// machine name.
if (
$target.hasClass('error') &&
$target[0].value &&
$target[0].value.trim().length
) {
return;
}
// Figure out the maximum length for the machine name.
options.maxlength = $target.attr('maxlength');
// Hide the form item container of the machine name form element.
$wrapper.addClass('hidden');
if ($target.attr('required')) {
$target
.removeAttr('required')
.attr('data-machine-name-require-when-visible');
}
const $source = $(
once(
'machine-name',
$context.find(sourceId).addClass('machine-name-source'),
),
);
const $target = $context
.find(options.target)
.addClass('machine-name-target');
const $suffix = $context.find(options.suffix);
const $wrapper = $target.closest('.js-form-item');
// All elements have to exist.
if (
!$source.length ||
!$target.length ||
!$suffix.length ||
!$wrapper.length
) {
return;
}
// Skip processing upon a form validation error on a non-empty
// machine name.
if (
$target.hasClass('error') &&
$target[0].value &&
$target[0].value.trim().length
) {
return;
}
// Figure out the maximum length for the machine name.
options.maxlength = $target.attr('maxlength');
// Hide the form item container of the machine name form element.
$wrapper.addClass('hidden');
if ($target.attr('required')) {
$target.removeAttr('required').
attr('data-machine-name-require-when-visible');
}
// Initial machine name from the target field default value.
const machine = $target[0].value;
// Append the machine name preview to the source field.
const $preview = $(
`<span class="machine-name-value">${
options.field_prefix
}${Drupal.checkPlain(machine)}${options.field_suffix}</span>`,
);
$suffix.empty();
if (options.label) {
$suffix.append(
`<span class="machine-name-label">${options.label}: </span>`,
// Initial machine name from the target field default value.
const machine = $target[0].value;
// Append the machine name preview to the source field.
const $preview = $(
`<span class="machine-name-value">${
options.field_prefix
}${Drupal.checkPlain(machine)}${options.field_suffix}</span>`,
);
}
$suffix.append($preview);
$suffix.empty();
if (options.label) {
$suffix.append(
`<span class="machine-name-label">${options.label}: </span>`,
);
}
$suffix.append($preview);
// If the machine name cannot be edited, stop further processing.
if ($target[0].disabled) {
return;
}
// If the machine name cannot be edited, stop further processing.
if ($target[0].disabled) {
return;
}
const eventData = {
$source,
$target,
$suffix,
$wrapper,
$preview,
options,
};
const eventData = {
$source,
$target,
$suffix,
$wrapper,
$preview,
options,
};
// If no initial value, determine machine name based on the
// human-readable form element value.
if (machine === '' && $source[0].value !== '') {
if (/^[A-Za-z0-9_\s]*$/.test($source[0].value)) {
self.showMachineName(
prepareMachineName($source[0].value, options),
eventData,
);
} else {
self.showMachineName(machine, eventData);
// If no initial value, determine machine name based on the
// human-readable form element value.
if (machine === '' && $source[0].value !== '') {
if (/^[A-Za-z0-9_\s]*$/.test($source[0].value)) {
self.showMachineName(
prepareMachineName($source[0].value, options),
eventData,
);
} else {
self.showMachineName(machine, eventData);
}
}
}
// If it is editable, append an edit link.
const $link = $(
'<span class="admin-link"><button type="button" class="link" aria-label="'
.concat(Drupal.t('Edit machine name'), '">')
.concat(Drupal.t('Edit'), '</button></span>'),
)
.on('click', eventData, clickEditHandler)
.on('keyup', (e) => {
// If it is editable, append an edit link.
const $link = $(
'<span class="admin-link"><button type="button" class="link" aria-label="'.concat(
Drupal.t('Edit machine name'), '">').
concat(Drupal.t('Edit'), '</button></span>'),
).on('click', eventData, clickEditHandler).on('keyup', (e) => {
// Avoid propagating a keyup event from the machine name input.
if (e.key === 'Enter' || eventData.code === 'Space') {
e.preventDefault();
e.stopImmediatePropagation();
e.target.click();
}
})
.on('keydown', (e) => {
}).on('keydown', (e) => {
if (e.key === 'Enter' || eventData.code === 'Space') {
e.preventDefault();
}
});
$suffix.append($link);
$suffix.append($link);
// Preview the machine name in realtime when the human-readable name
// changes, but only if there is no machine name yet; i.e., only upon
// initial creation, not when editing.
if ($target[0].value === '') {
// Listen to the 'change' and 'input' events that are fired
// immediately as the user is typing for faster response time. This is
// safe because the event handler doesn't include any slow
// asynchronous operations (e.g., network requests) that could
// accumulate.
$source
.on(
// Preview the machine name in realtime when the human-readable name
// changes, but only if there is no machine name yet; i.e., only upon
// initial creation, not when editing.
if ($target[0].value === '') {
// Listen to the 'change' and 'input' events that are fired
// immediately as the user is typing for faster response time. This is
// safe because the event handler doesn't include any slow
// asynchronous operations (e.g., network requests) that could
// accumulate.
$source.on(
'change.machineName input.machineName',
eventData,
machineNameHandler,
)
// Initialize machine name preview.
.trigger('change.machineName');
}
});
// Initialize machine name preview.
.trigger('change.machineName');
}
});
}
},
showMachineName(machine, data) {
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment