Issue #3271094 by Wim Leers, lauriii, xjm, catch: Move Media CKEditor 4 integration into CKEditor
catch
parent
ccce80147c
commit
0becafafbc
|
|
@ -477,7 +477,7 @@
|
|||
"ignoreFiles": [
|
||||
"assets/vendor/**/*.css",
|
||||
"tests/Drupal/Tests/Core/Asset/css_test_files/**/*.css",
|
||||
"modules/media/css/plugins/drupalmedia/ckeditor.drupalmedia.css",
|
||||
"modules/ckeditor/css/plugins/drupalmedia/ckeditor.drupalmedia.css",
|
||||
"themes/stable/css/core/assets/vendor/**/*.css",
|
||||
"themes/stable9/css/core/assets/vendor/**/*.css",
|
||||
"themes/stable9/css/media/plugins/drupalmedia/ckeditor.drupalmedia.css"
|
||||
|
|
|
|||
|
|
@ -90,3 +90,10 @@ drupal.ckeditor.language.admin:
|
|||
- core/jquery
|
||||
- core/drupal
|
||||
- core/drupal.vertical-tabs
|
||||
|
||||
drupal.ckeditor.plugins.drupalmedia:
|
||||
version: VERSION
|
||||
js:
|
||||
js/ckeditor.drupalmedia.theme.js: {}
|
||||
dependencies:
|
||||
- core/drupal
|
||||
|
|
|
|||
|
|
@ -0,0 +1,17 @@
|
|||
/**
|
||||
* @file
|
||||
* Theme elements for the Media Embed CKEditor plugin.
|
||||
*/
|
||||
|
||||
((Drupal) => {
|
||||
/**
|
||||
* Themes the edit button for a media embed.
|
||||
*
|
||||
* @return {string}
|
||||
* An HTML string to insert in the CKEditor.
|
||||
*/
|
||||
Drupal.theme.mediaEmbedEditButton = () =>
|
||||
`<button class="media-library-item__edit">${Drupal.t(
|
||||
'Edit media',
|
||||
)}</button>`;
|
||||
})(Drupal);
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
/**
|
||||
* DO NOT EDIT THIS FILE.
|
||||
* See the following change record for more information,
|
||||
* https://www.drupal.org/node/2815083
|
||||
* @preserve
|
||||
**/
|
||||
|
||||
(Drupal => {
|
||||
Drupal.theme.mediaEmbedEditButton = () => `<button class="media-library-item__edit">${Drupal.t('Edit media')}</button>`;
|
||||
})(Drupal);
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
<?php
|
||||
|
||||
namespace Drupal\media\Plugin\CKEditorPlugin;
|
||||
namespace Drupal\ckeditor\Plugin\CKEditorPlugin;
|
||||
|
||||
use Drupal\ckeditor\CKEditorPluginContextualInterface;
|
||||
use Drupal\ckeditor\CKEditorPluginCssInterface;
|
||||
|
|
@ -16,6 +16,7 @@ use Drupal\editor\Entity\Editor;
|
|||
* @CKEditorPlugin(
|
||||
* id = "drupalmedia",
|
||||
* label = @Translation("Media Embed"),
|
||||
* provider = "media",
|
||||
* )
|
||||
*
|
||||
* @internal
|
||||
|
|
@ -83,7 +84,10 @@ class DrupalMedia extends PluginBase implements ContainerFactoryPluginInterface,
|
|||
'core/jquery',
|
||||
'core/drupal',
|
||||
'core/drupal.ajax',
|
||||
// @see Drupal.theme.mediaEmbedPreviewError()
|
||||
'media/media_embed_ckeditor_theme',
|
||||
// @see Drupal.theme.mediaEmbedEditButton()
|
||||
'ckeditor/drupal.ckeditor.plugins.drupalmedia',
|
||||
];
|
||||
}
|
||||
|
||||
|
|
@ -91,7 +95,7 @@ class DrupalMedia extends PluginBase implements ContainerFactoryPluginInterface,
|
|||
* {@inheritdoc}
|
||||
*/
|
||||
public function getFile() {
|
||||
return $this->moduleExtensionList->getPath('media') . '/js/plugins/drupalmedia/plugin.js';
|
||||
return $this->moduleExtensionList->getPath('ckeditor') . '/js/plugins/drupalmedia/plugin.js';
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -124,7 +128,7 @@ class DrupalMedia extends PluginBase implements ContainerFactoryPluginInterface,
|
|||
*/
|
||||
public function getCssFiles(Editor $editor) {
|
||||
return [
|
||||
$this->moduleExtensionList->getPath('media') . '/css/plugins/drupalmedia/ckeditor.drupalmedia.css',
|
||||
$this->moduleExtensionList->getPath('ckeditor') . '/css/plugins/drupalmedia/ckeditor.drupalmedia.css',
|
||||
$this->moduleExtensionList->getPath('system') . '/css/components/hidden.module.css',
|
||||
];
|
||||
}
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
<?php
|
||||
|
||||
namespace Drupal\Tests\media\FunctionalJavascript;
|
||||
namespace Drupal\Tests\ckeditor\FunctionalJavascript;
|
||||
|
||||
use Drupal\Component\Utility\Html;
|
||||
use Drupal\Core\Database\Database;
|
||||
|
|
@ -21,10 +21,10 @@ use Drupal\user\RoleInterface;
|
|||
use Drupal\Core\Entity\Entity\EntityViewMode;
|
||||
|
||||
/**
|
||||
* @coversDefaultClass \Drupal\media\Plugin\CKEditorPlugin\DrupalMedia
|
||||
* @group media
|
||||
* @coversDefaultClass \Drupal\ckeditor\Plugin\CKEditorPlugin\DrupalMedia
|
||||
* @group ckeditor
|
||||
*/
|
||||
class CKEditorIntegrationTest extends WebDriverTestBase {
|
||||
class MediaTest extends WebDriverTestBase {
|
||||
|
||||
use CKEditorTestTrait;
|
||||
use MediaTypeCreationTrait;
|
||||
|
|
@ -63,7 +63,6 @@ drupal.ckeditor5.emphasis:
|
|||
|
||||
drupal.ckeditor5.media:
|
||||
js:
|
||||
js/media_embed_ckeditor5.theme.js: {}
|
||||
js/build/drupalMedia.js: { minified: true }
|
||||
css:
|
||||
theme:
|
||||
|
|
@ -71,6 +70,7 @@ drupal.ckeditor5.media:
|
|||
dependencies:
|
||||
- core/ckeditor5
|
||||
- core/drupal
|
||||
- media/media_embed_ckeditor_theme
|
||||
|
||||
drupal.ckeditor5.mediaAlign:
|
||||
css:
|
||||
|
|
|
|||
|
|
@ -0,0 +1,188 @@
|
|||
# cspell:ignore imageupload
|
||||
|
||||
ckeditor5.language:
|
||||
css:
|
||||
component:
|
||||
css/language.css: {}
|
||||
dependencies:
|
||||
- core/ckeditor5.language
|
||||
|
||||
drupal.ckeditor5.internal:
|
||||
js:
|
||||
js/build/drupalHtmlEngine.js: { minified: true }
|
||||
dependencies:
|
||||
- core/ckeditor5
|
||||
- core/ckeditor5.internal
|
||||
|
||||
drupal.ckeditor5:
|
||||
js:
|
||||
js/ckeditor5.js: {}
|
||||
dependencies:
|
||||
- core/jquery
|
||||
- core/once
|
||||
- core/drupal
|
||||
- core/drupal.debounce
|
||||
- core/ckeditor5.editorClassic
|
||||
- core/ckeditor5.editorDecoupled
|
||||
- core/ckeditor5
|
||||
- editor/drupal.editor
|
||||
- ckeditor5/drupal.ckeditor5.stylesheets
|
||||
- core/drupalSettings
|
||||
- core/drupal.message
|
||||
|
||||
# Library used for dynamically loading CKEditor 5 stylesheets from the default
|
||||
# front end theme.
|
||||
# @see ckeditor5_library_info_alter()
|
||||
drupal.ckeditor5.stylesheets:
|
||||
version: VERSION
|
||||
css: []
|
||||
|
||||
drupal.ckeditor5.codeBlock:
|
||||
dependencies:
|
||||
- core/ckeditor5.codeBlock
|
||||
- core/ckeditor5.htmlSupport
|
||||
|
||||
drupal.ckeditor5.image:
|
||||
js:
|
||||
js/build/drupalImage.js: { minified: true }
|
||||
css:
|
||||
theme:
|
||||
css/image.css: { }
|
||||
dependencies:
|
||||
- core/drupal
|
||||
- core/ckeditor5
|
||||
- core/ckeditor5.image
|
||||
|
||||
drupal.ckeditor5.emphasis:
|
||||
version: VERSION
|
||||
js:
|
||||
js/build/drupalEmphasis.js: { minified: true }
|
||||
dependencies:
|
||||
- core/ckeditor5
|
||||
- core/ckeditor5.basic
|
||||
|
||||
drupal.ckeditor5.media:
|
||||
js:
|
||||
js/media_embed_ckeditor5.theme.js: {}
|
||||
js/build/drupalMedia.js: { minified: true }
|
||||
css:
|
||||
theme:
|
||||
css/drupalmedia.css: { }
|
||||
dependencies:
|
||||
- core/ckeditor5
|
||||
- core/drupal
|
||||
|
||||
drupal.ckeditor5.mediaAlign:
|
||||
css:
|
||||
theme:
|
||||
css/media-alignment.css: { }
|
||||
dependencies:
|
||||
- ckeditor5/drupal.ckeditor5.media
|
||||
|
||||
drupal.ckeditor5.filter.admin:
|
||||
js:
|
||||
js/ckeditor5.filter.admin.js: {}
|
||||
dependencies:
|
||||
- core/drupal
|
||||
- core/once
|
||||
- core/drupal.ajax
|
||||
- core/drupalSettings
|
||||
|
||||
admin:
|
||||
js:
|
||||
js/ckeditor5.admin.js: { }
|
||||
css:
|
||||
theme:
|
||||
css/toolbar.admin.css: { }
|
||||
dependencies:
|
||||
- core/sortable
|
||||
- filter/drupal.filter.admin
|
||||
- core/jquery
|
||||
- core/once
|
||||
|
||||
admin.specialCharacters:
|
||||
css:
|
||||
theme:
|
||||
css/special-characters.css: { }
|
||||
|
||||
admin.removeFormat:
|
||||
css:
|
||||
theme:
|
||||
css/remove-format.css: { }
|
||||
|
||||
admin.internal:
|
||||
css:
|
||||
theme:
|
||||
css/internal.admin.css: { }
|
||||
|
||||
admin.basic:
|
||||
css:
|
||||
theme:
|
||||
css/basic.admin.css: { }
|
||||
|
||||
admin.blockquote:
|
||||
css:
|
||||
theme:
|
||||
css/blockquote.admin.css: { }
|
||||
|
||||
admin.link:
|
||||
css:
|
||||
theme:
|
||||
css/link.admin.css: { }
|
||||
|
||||
admin.list:
|
||||
css:
|
||||
theme:
|
||||
css/list.admin.css: { }
|
||||
|
||||
admin.heading:
|
||||
css:
|
||||
theme:
|
||||
css/heading.admin.css: { }
|
||||
dependencies:
|
||||
- core/ckeditor5.internal
|
||||
|
||||
admin.horizontalLine:
|
||||
css:
|
||||
theme:
|
||||
css/horizontal-line.admin.css: { }
|
||||
|
||||
admin.alignment:
|
||||
css:
|
||||
theme:
|
||||
css/alignment.admin.css: { }
|
||||
|
||||
admin.imageupload:
|
||||
css:
|
||||
theme:
|
||||
css/imageupload.admin.css: { }
|
||||
|
||||
admin.indent:
|
||||
css:
|
||||
theme:
|
||||
css/indent.admin.css: { }
|
||||
|
||||
admin.language:
|
||||
css:
|
||||
theme:
|
||||
css/language.admin.css: { }
|
||||
|
||||
admin.drupalmedia:
|
||||
css:
|
||||
theme:
|
||||
css/drupalmedia.admin.css: { }
|
||||
|
||||
admin.sourceEditing:
|
||||
css:
|
||||
theme:
|
||||
css/source-editing.admin.css: { }
|
||||
|
||||
admin.table:
|
||||
css:
|
||||
theme:
|
||||
css/table.admin.css: { }
|
||||
|
||||
admin.codeBlock:
|
||||
css:
|
||||
theme:
|
||||
css/code-block.admin.css: { }
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
/**
|
||||
* @file
|
||||
* Theme elements for the Media Embed CKEditor5 plugin.
|
||||
*/
|
||||
|
||||
((Drupal) => {
|
||||
/**
|
||||
* Themes the error displayed when the media embed preview fails.
|
||||
*
|
||||
* @return {string}
|
||||
* A string representing a DOM fragment.
|
||||
*
|
||||
* @see media-embed-error.html.twig
|
||||
*/
|
||||
Drupal.theme.mediaEmbedPreviewError = () =>
|
||||
`<div>${Drupal.t(
|
||||
'An error occurred while trying to preview the media. Please save your work and reload this page.',
|
||||
)}</div>`;
|
||||
})(Drupal);
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
/**
|
||||
* DO NOT EDIT THIS FILE.
|
||||
* See the following change record for more information,
|
||||
* https://www.drupal.org/node/2815083
|
||||
* @preserve
|
||||
**/
|
||||
|
||||
(Drupal => {
|
||||
Drupal.theme.mediaEmbedPreviewError = () => `<div>${Drupal.t('An error occurred while trying to preview the media. Please save your work and reload this page.')}</div>`;
|
||||
})(Drupal);
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
/**
|
||||
* @file
|
||||
* Theme elements for the Media Embed CKEditor plugin.
|
||||
* Theme elements for the Media Embed text editor plugins.
|
||||
*/
|
||||
|
||||
((Drupal) => {
|
||||
|
|
@ -16,15 +16,4 @@
|
|||
`<div>${Drupal.t(
|
||||
'An error occurred while trying to preview the media. Please save your work and reload this page.',
|
||||
)}</div>`;
|
||||
|
||||
/**
|
||||
* Themes the edit button for a media embed.
|
||||
*
|
||||
* @return {string}
|
||||
* An HTML string to insert in the CKEditor.
|
||||
*/
|
||||
Drupal.theme.mediaEmbedEditButton = () =>
|
||||
`<button class="media-library-item__edit">${Drupal.t(
|
||||
'Edit media',
|
||||
)}</button>`;
|
||||
})(Drupal);
|
||||
|
|
|
|||
|
|
@ -7,6 +7,4 @@
|
|||
|
||||
(Drupal => {
|
||||
Drupal.theme.mediaEmbedPreviewError = () => `<div>${Drupal.t('An error occurred while trying to preview the media. Please save your work and reload this page.')}</div>`;
|
||||
|
||||
Drupal.theme.mediaEmbedEditButton = () => `<button class="media-library-item__edit">${Drupal.t('Edit media')}</button>`;
|
||||
})(Drupal);
|
||||
|
|
@ -32,6 +32,8 @@ filter.caption:
|
|||
dependencies:
|
||||
- filter/caption
|
||||
|
||||
# Despite the name, this is actually not specific to CKEditor 4, and can be
|
||||
# used by all text editor plugins.
|
||||
media_embed_ckeditor_theme:
|
||||
version: VERSION
|
||||
js:
|
||||
|
|
|
|||
|
|
@ -510,9 +510,9 @@ function media_filter_format_edit_form_validate($form, FormStateInterface $form_
|
|||
* Implements hook_field_widget_single_element_form_alter().
|
||||
*/
|
||||
function media_field_widget_single_element_form_alter(&$element, FormStateInterface $form_state, $context) {
|
||||
// Add an attribute so that "drupalmedia" CKEditor plugin can pass the host
|
||||
// entity's language to EditorMediaDialog, allowing it to present entities
|
||||
// in the same language.
|
||||
// Add an attribute so that text editors plugins can pass the host entity's
|
||||
// language to EditorMediaDialog, allowing it to present entities in the same
|
||||
// language.
|
||||
if (!empty($element['#type']) && $element['#type'] == 'text_format') {
|
||||
$element['#attributes']['data-media-embed-host-entity-langcode'] = $context['items']->getLangcode();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -96,7 +96,6 @@ class EditorMediaDialog extends FormBase {
|
|||
$editor_object = $form_state->getUserInput()['editor_object'];
|
||||
// The data that the text editor sends to any dialog is in
|
||||
// the 'editor_object' key.
|
||||
// @see core/modules/ckeditor/js/ckeditor.es6.js
|
||||
$media_embed_element = $editor_object['attributes'];
|
||||
$form_state->set('media_embed_element', $media_embed_element);
|
||||
$has_caption = $editor_object['hasCaption'];
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
name: Media Embed plugin test
|
||||
description: 'Provides functionality to test embedding media items in CKEditor.'
|
||||
name: Media Embed text editor plugin test
|
||||
description: 'Provides functionality to test embedding media items in text editors.'
|
||||
type: module
|
||||
package: Testing
|
||||
version: VERSION
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
/**
|
||||
* @file
|
||||
* Helper module for the Media Embed CKEditor plugin tests.
|
||||
* Helper module for the Media Embed text editor plugin tests.
|
||||
*/
|
||||
|
||||
use Drupal\Core\Access\AccessResult;
|
||||
|
|
@ -14,7 +14,6 @@ use Drupal\Core\Session\AccountInterface;
|
|||
* Implements hook_entity_view_alter().
|
||||
*/
|
||||
function media_test_embed_entity_view_alter(&$build, EntityInterface $entity, EntityViewDisplayInterface $display) {
|
||||
// @see \Drupal\Tests\media\FunctionalJavascript\CKEditorIntegrationTest::testPreviewUsesDefaultThemeAndIsClientCacheable()
|
||||
$build['#attributes']['data-media-embed-test-active-theme'] = \Drupal::theme()->getActiveTheme()->getName();
|
||||
$build['#attributes']['data-media-embed-test-view-mode'] = $display->getMode();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ use Symfony\Component\HttpFoundation\Request;
|
|||
use Symfony\Component\HttpKernel\Exception\NotFoundHttpException;
|
||||
|
||||
/**
|
||||
* Controller to allow testing of error handling in drupalmedia plugin.js.
|
||||
* Controller to allow testing of error handling of Media Embed in text editors.
|
||||
*/
|
||||
class TestMediaFilterController extends MediaFilterController {
|
||||
|
||||
|
|
|
|||
|
|
@ -356,8 +356,6 @@ class MediaEmbedFilterTest extends MediaEmbedFilterTestBase {
|
|||
|
||||
/**
|
||||
* Tests that only <drupal-media> tags are processed.
|
||||
*
|
||||
* @see \Drupal\Tests\media\FunctionalJavascript\CKEditorIntegrationTest::testOnlyDrupalMediaTagProcessed()
|
||||
*/
|
||||
public function testOnlyDrupalMediaTagProcessed() {
|
||||
$content = $this->createEmbedCode([
|
||||
|
|
|
|||
Loading…
Reference in New Issue