123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333 |
- /**
- * DO NOT EDIT THIS FILE.
- * See the following change record for more information,
- * https://www.drupal.org/node/2815083
- * @preserve
- **/
- (function (jQuery, Drupal, CKEDITOR) {
- function getFocusedWidget(editor) {
- var widget = editor.widgets.focused;
- if (widget && widget.name === 'drupalmedia') {
- return widget;
- }
- return null;
- }
- function linkCommandIntegrator(editor) {
- if (!editor.plugins.drupallink) {
- return;
- }
- CKEDITOR.plugins.drupallink.registerLinkableWidget('drupalmedia');
- editor.getCommand('drupalunlink').on('exec', function (evt) {
- var widget = getFocusedWidget(editor);
- if (!widget) {
- return;
- }
- widget.setData('link', null);
- this.refresh(editor, editor.elementPath());
- evt.cancel();
- });
- editor.getCommand('drupalunlink').on('refresh', function (evt) {
- var widget = getFocusedWidget(editor);
- if (!widget) {
- return;
- }
- this.setState(widget.data.link ? CKEDITOR.TRISTATE_OFF : CKEDITOR.TRISTATE_DISABLED);
- evt.cancel();
- });
- if (editor.contextMenu) {
- editor.contextMenu.addListener(function () {
- var widget = getFocusedWidget(editor);
- if (!widget) {
- return;
- }
- if (widget.data.link) {
- return {
- link: CKEDITOR.TRISTATE_OFF,
- unlink: CKEDITOR.TRISTATE_OFF
- };
- }
- return {};
- });
- }
- }
- CKEDITOR.plugins.add('drupalmedia', {
- requires: 'widget',
- beforeInit: function beforeInit(editor) {
- var dtd = CKEDITOR.dtd;
- dtd['drupal-media'] = { '#': 1 };
- Object.keys(dtd).forEach(function (tagName) {
- if (dtd[tagName].div) {
- dtd[tagName]['drupal-media'] = 1;
- }
- });
- dtd.a['drupal-media'] = 1;
- editor.widgets.add('drupalmedia', {
- allowedContent: {
- 'drupal-media': {
- attributes: {
- '!data-entity-type': true,
- '!data-entity-uuid': true,
- 'data-align': true,
- 'data-caption': true,
- alt: true,
- title: true
- },
- classes: {}
- }
- },
- requiredContent: new CKEDITOR.style({
- element: 'drupal-media',
- attributes: {
- 'data-entity-type': '',
- 'data-entity-uuid': ''
- }
- }),
- pathName: Drupal.t('Embedded media'),
- editables: {
- caption: {
- selector: 'figcaption',
- allowedContent: 'a[!href]; em strong cite code br',
- pathName: Drupal.t('Caption')
- }
- },
- getLabel: function getLabel() {
- if (this.data.label) {
- return this.data.label;
- }
- return Drupal.t('Embedded media');
- },
- upcast: function upcast(element, data) {
- var attributes = element.attributes;
- if (element.name !== 'drupal-media' || attributes['data-entity-type'] !== 'media' || attributes['data-entity-uuid'] === undefined) {
- return;
- }
- data.attributes = CKEDITOR.tools.copy(attributes);
- data.hasCaption = data.attributes.hasOwnProperty('data-caption');
- if (data.hasCaption && data.attributes['data-caption'] === '') {
- data.attributes['data-caption'] = ' ';
- }
- data.label = null;
- data.link = null;
- if (element.parent.name === 'a') {
- data.link = CKEDITOR.tools.copy(element.parent.attributes);
- Object.keys(element.parent.attributes).forEach(function (attrName) {
- if (attrName.indexOf('data-cke-') !== -1) {
- delete data.link[attrName];
- }
- });
- }
- var hostEntityLangcode = document.getElementById(editor.name).getAttribute('data-media-embed-host-entity-langcode');
- if (hostEntityLangcode) {
- data.hostEntityLangcode = hostEntityLangcode;
- }
- return element;
- },
- destroy: function destroy() {
- this._tearDownDynamicEditables();
- },
- data: function data(event) {
- var _this = this;
- if (this.oldData) {
- if (!this.data.hasCaption && this.oldData.hasCaption) {
- delete this.data.attributes['data-caption'];
- } else if (this.data.hasCaption && !this.data.attributes['data-caption']) {
- this.data.attributes['data-caption'] = ' ';
- }
- }
- if (this._previewNeedsServerSideUpdate()) {
- editor.fire('lockSnapshot');
- this._tearDownDynamicEditables();
- this._loadPreview(function (widget) {
- widget._setUpDynamicEditables();
- widget._setUpEditButton();
- editor.fire('unlockSnapshot');
- });
- }
- if (this.oldData) {
- Object.keys(this.oldData.attributes).forEach(function (attrName) {
- _this.element.removeAttribute(attrName);
- });
- }
- this.element.setAttributes(this.data.attributes);
- this.oldData = CKEDITOR.tools.clone(this.data);
- },
- downcast: function downcast() {
- var downcastElement = new CKEDITOR.htmlParser.element('drupal-media', this.data.attributes);
- if (this.data.link) {
- var link = new CKEDITOR.htmlParser.element('a', this.data.link);
- link.add(downcastElement);
- return link;
- }
- return downcastElement;
- },
- _setUpDynamicEditables: function _setUpDynamicEditables() {
- var _this2 = this;
- if (this.initEditable('caption', this.definition.editables.caption)) {
- var captionEditable = this.editables.caption;
- captionEditable.setAttribute('data-placeholder', Drupal.t('Enter caption here'));
- this.captionObserver = new MutationObserver(function () {
- var mediaAttributes = CKEDITOR.tools.clone(_this2.data.attributes);
- mediaAttributes['data-caption'] = captionEditable.getData();
- _this2.setData('attributes', mediaAttributes);
- });
- this.captionObserver.observe(captionEditable.$, {
- characterData: true,
- attributes: true,
- childList: true,
- subtree: true
- });
- if (captionEditable.$.childNodes.length === 1 && captionEditable.$.childNodes.item(0).nodeName === 'BR') {
- captionEditable.$.removeChild(captionEditable.$.childNodes.item(0));
- }
- }
- },
- _setUpEditButton: function _setUpEditButton() {
- if (this.element.findOne('.media-embed-error')) {
- return;
- }
- var isElementNode = function isElementNode(n) {
- return n.type === CKEDITOR.NODE_ELEMENT;
- };
- var embeddedMediaContainer = this.data.hasCaption ? this.element.findOne('figure') : this.element;
- var embeddedMedia = embeddedMediaContainer.getFirst(isElementNode);
- if (this.data.link) {
- embeddedMedia = embeddedMedia.getFirst(isElementNode);
- }
- embeddedMedia.setStyle('position', 'relative');
- var editButton = CKEDITOR.dom.element.createFromHtml(Drupal.theme('mediaEmbedEditButton'));
- embeddedMedia.getFirst().insertBeforeMe(editButton);
- var widget = this;
- this.element.findOne('.media-library-item__edit').on('click', function (event) {
- var saveCallback = function saveCallback(values) {
- event.cancel();
- editor.fire('saveSnapshot');
- if (values.hasOwnProperty('attributes')) {
- CKEDITOR.tools.extend(values.attributes, widget.data.attributes);
- Object.keys(values.attributes).forEach(function (prop) {
- if (values.attributes[prop] === false || prop === 'data-align' && values.attributes[prop] === 'none') {
- delete values.attributes[prop];
- }
- });
- }
- widget.setData({
- attributes: values.attributes,
- hasCaption: !!values.hasCaption
- });
- editor.fire('saveSnapshot');
- };
- Drupal.ckeditor.openDialog(editor, Drupal.url('editor/dialog/media/' + editor.config.drupal.format), widget.data, saveCallback, {});
- });
- this.element.findOne('.media-library-item__edit').on('keydown', function (event) {
- var returnKey = 13;
- var spaceBar = 32;
- if (typeof event.data !== 'undefined') {
- var keypress = event.data.getKey();
- if (keypress === returnKey || keypress === spaceBar) {
- event.sender.$.click();
- }
- event.data.$.stopPropagation();
- event.data.$.stopImmediatePropagation();
- }
- });
- },
- _tearDownDynamicEditables: function _tearDownDynamicEditables() {
- if (this.captionObserver) {
- this.captionObserver.disconnect();
- }
- },
- _previewNeedsServerSideUpdate: function _previewNeedsServerSideUpdate() {
- if (!this.ready) {
- return true;
- }
- return this._hashData(this.oldData) !== this._hashData(this.data);
- },
- _hashData: function _hashData(data) {
- var dataToHash = CKEDITOR.tools.clone(data);
- delete dataToHash.attributes['data-caption'];
- delete dataToHash.label;
- if (dataToHash.link) {
- delete dataToHash.link.href;
- }
- return JSON.stringify(dataToHash);
- },
- _loadPreview: function _loadPreview(callback) {
- var _this3 = this;
- jQuery.get({
- url: Drupal.url('media/' + editor.config.drupal.format + '/preview'),
- data: {
- text: this.downcast().getOuterHtml(),
- uuid: this.data.attributes['data-entity-uuid']
- },
- dataType: 'html',
- success: function success(previewHtml, textStatus, jqXhr) {
- _this3.element.setHtml(previewHtml);
- _this3.setData('label', jqXhr.getResponseHeader('Drupal-Media-Label'));
- callback(_this3);
- },
- error: function error() {
- _this3.element.setHtml(Drupal.theme('mediaEmbedPreviewError'));
- }
- });
- }
- });
- },
- afterInit: function afterInit(editor) {
- linkCommandIntegrator(editor);
- }
- });
- })(jQuery, Drupal, CKEDITOR);
|