* CKEditor implementation of {@link Drupal.editors} API.
*/
-(function (Drupal, debounce, CKEDITOR, $, displace, AjaxCommands) {
+(function(Drupal, debounce, CKEDITOR, $, displace, AjaxCommands) {
/**
* @namespace
*/
Drupal.editors.ckeditor = {
-
/**
* Editor attach callback.
*
// label so that screen readers say something that is understandable
// for end users.
const label = $(`label[for=${element.getAttribute('id')}]`).html();
- format.editorSettings.title = Drupal.t('Rich Text Editor, !label field', { '!label': label });
+ format.editorSettings.title = Drupal.t('Rich Text Editor, !label field', {
+ '!label': label,
+ });
return !!CKEDITOR.replace(element, format.editorSettings);
},
if (editor) {
if (trigger === 'serialize') {
editor.updateElement();
- }
- else {
+ } else {
editor.destroy();
element.removeAttribute('contentEditable');
}
* Reacts on a change in the editor element.
*
* @param {HTMLElement} element
- * The element where the change occured.
+ * The element where the change occurred.
* @param {function} callback
* Callback called with the value of the editor.
*
onChange(element, callback) {
const editor = CKEDITOR.dom.element.get(element).getEditor();
if (editor) {
- editor.on('change', debounce(() => {
- callback(editor.getData());
- }, 400));
+ editor.on(
+ 'change',
+ debounce(() => {
+ callback(editor.getData());
+ }, 400),
+ );
// A temporary workaround to control scrollbar appearance when using
// autoGrow event to control editor's height.
editor.on('mode', () => {
const editable = editor.editable();
if (!editable.isInline()) {
- editor.on('autoGrow', (evt) => {
- const doc = evt.editor.document;
- const scrollable = CKEDITOR.env.quirks ? doc.getBody() : doc.getDocumentElement();
-
- if (scrollable.$.scrollHeight < scrollable.$.clientHeight) {
- scrollable.setStyle('overflow-y', 'hidden');
- }
- else {
- scrollable.removeStyle('overflow-y');
- }
- }, null, null, 10000);
+ editor.on(
+ 'autoGrow',
+ evt => {
+ const doc = evt.editor.document;
+ const scrollable = CKEDITOR.env.quirks
+ ? doc.getBody()
+ : doc.getDocumentElement();
+
+ if (scrollable.$.scrollHeight < scrollable.$.clientHeight) {
+ scrollable.setStyle('overflow-y', 'hidden');
+ } else {
+ scrollable.removeStyle('overflow-y');
+ }
+ },
+ null,
+ null,
+ 10000,
+ );
}
});
}
// Find the "Source" button, if any, and replace it with "Sourcedialog".
// (The 'sourcearea' plugin only works in CKEditor's iframe mode.)
let sourceButtonFound = false;
- for (let i = 0; !sourceButtonFound && i < settings.toolbar.length; i++) {
+ for (
+ let i = 0;
+ !sourceButtonFound && i < settings.toolbar.length;
+ i++
+ ) {
if (settings.toolbar[i] !== '/') {
- for (let j = 0; !sourceButtonFound && j < settings.toolbar[i].items.length; j++) {
+ for (
+ let j = 0;
+ !sourceButtonFound && j < settings.toolbar[i].items.length;
+ j++
+ ) {
if (settings.toolbar[i].items[j] === 'Source') {
sourceButtonFound = true;
// Swap sourcearea's "Source" button for sourcedialog's.
const externalPlugins = format.editorSettings.drupalExternalPlugins;
// Register and load additional CKEditor plugins as necessary.
if (externalPlugins) {
- Object.keys(externalPlugins || {}).forEach((pluginName) => {
- CKEDITOR.plugins.addExternal(pluginName, externalPlugins[pluginName], '');
+ Object.keys(externalPlugins || {}).forEach(pluginName => {
+ CKEDITOR.plugins.addExternal(
+ pluginName,
+ externalPlugins[pluginName],
+ '',
+ );
});
delete format.editorSettings.drupalExternalPlugins;
}
},
-
};
Drupal.ckeditor = {
-
/**
* Variable storing the current dialog's save callback.
*
}
// Remove any previous loading indicator.
- $target.css('position', 'relative').find('.ckeditor-dialog-loading').remove();
+ $target
+ .css('position', 'relative')
+ .find('.ckeditor-dialog-loading')
+ .remove();
// Add a consistent dialog class.
- const classes = dialogSettings.dialogClass ? dialogSettings.dialogClass.split(' ') : [];
+ const classes = dialogSettings.dialogClass
+ ? dialogSettings.dialogClass.split(' ')
+ : [];
classes.push('ui-dialog--narrow');
dialogSettings.dialogClass = classes.join(' ');
- dialogSettings.autoResize = window.matchMedia('(min-width: 600px)').matches;
+ dialogSettings.autoResize = window.matchMedia(
+ '(min-width: 600px)',
+ ).matches;
dialogSettings.width = 'auto';
// Add a "Loading…" message, hide it underneath the CKEditor toolbar,
// create a Drupal.Ajax instance to load the dialog and trigger it.
- const $content = $(`<div class="ckeditor-dialog-loading"><span style="top: -40px;" class="ckeditor-dialog-loading-link">${Drupal.t('Loading...')}</span></div>`);
+ const $content = $(
+ `<div class="ckeditor-dialog-loading"><span style="top: -40px;" class="ckeditor-dialog-loading-link">${Drupal.t(
+ 'Loading...',
+ )}</span></div>`,
+ );
$content.appendTo($target);
const ckeditorAjaxDialog = Drupal.ajax({
// Respond to new dialogs that are opened by CKEditor, closing the AJAX loader.
$(window).on('dialog:beforecreate', (e, dialog, $element, settings) => {
- $('.ckeditor-dialog-loading').animate({ top: '-40px' }, function () {
+ $('.ckeditor-dialog-loading').animate({ top: '-40px' }, function() {
$(this).remove();
});
});
// Formulate a default formula for the maximum autoGrow height.
$(document).on('drupalViewportOffsetChange', () => {
- CKEDITOR.config.autoGrow_maxHeight = 0.7 * (window.innerHeight - displace.offsets.top - displace.offsets.bottom);
+ CKEDITOR.config.autoGrow_maxHeight =
+ 0.7 *
+ (window.innerHeight - displace.offsets.top - displace.offsets.bottom);
});
// Redirect on hash change when the original hash has an associated CKEditor.
function redirectTextareaFragmentToCKEditorInstance() {
- const hash = location.hash.substr(1);
+ const hash = window.location.hash.substr(1);
const element = document.getElementById(hash);
if (element) {
const editor = CKEDITOR.dom.element.get(element).getEditor();
if (editor) {
const id = editor.container.getAttribute('id');
- location.replace(`#${id}`);
+ window.location.replace(`#${id}`);
}
}
}
- $(window).on('hashchange.ckeditor', redirectTextareaFragmentToCKEditorInstance);
+ $(window).on(
+ 'hashchange.ckeditor',
+ redirectTextareaFragmentToCKEditorInstance,
+ );
// Set autoGrow to make the editor grow the moment it is created.
CKEDITOR.config.autoGrow_onStartup = true;
*
* @see http://docs.ckeditor.com/#!/api/CKEDITOR.dom.document
*/
- AjaxCommands.prototype.ckeditor_add_stylesheet = function (ajax, response, status) {
+ AjaxCommands.prototype.ckeditor_add_stylesheet = function(
+ ajax,
+ response,
+ status,
+ ) {
const editor = CKEDITOR.instances[response.editor_id];
if (editor) {
- response.stylesheets.forEach((url) => {
+ response.stylesheets.forEach(url => {
editor.document.appendStyleSheet(url);
});
}
};
}
-}(Drupal, Drupal.debounce, CKEDITOR, jQuery, Drupal.displace, Drupal.AjaxCommands));
+})(
+ Drupal,
+ Drupal.debounce,
+ CKEDITOR,
+ jQuery,
+ Drupal.displace,
+ Drupal.AjaxCommands,
+);