Skip to content
This repository has been archived by the owner on Jan 5, 2018. It is now read-only.

Decouple engine from UI #189

Open
wants to merge 3 commits into
base: 8.x-1.x
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
91 changes: 91 additions & 0 deletions js/plugins/drupalentity/engine.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,91 @@
/**
* @file
* Drupal Entity embed plugin.
*/

(function ($, Drupal, CKEDITOR) {

"use strict";

CKEDITOR.plugins.add('drupalentity', {
// This plugin requires the Widgets System defined in the 'widget' plugin.
requires: 'widget',

// The plugin initialization logic goes inside this method.
beforeInit: function (editor) {
// Configure CKEditor DTD for custom drupal-entity element.
// @see https://www.drupal.org/node/2448449#comment-9717735
var dtd = CKEDITOR.dtd, tagName;
dtd['drupal-entity'] = {'#': 1};
// Register drupal-entity element as allowed child, in each tag that can
// contain a div element.
for (tagName in dtd) {
if (dtd[tagName].div) {
dtd[tagName]['drupal-entity'] = 1;
}
}

// Register the entity embed widget.
editor.widgets.add('drupalentity', {
// Minimum HTML which is required by this widget to work.
allowedContent: 'drupal-entity[*]',
requiredContent: 'drupal-entity[*]',

// Simply recognize the element as our own. The inner markup if fetched
// and inserted the init() callback, since it requires the actual DOM
// element.
upcast: function (element) {
var attributes = element.attributes;
if (attributes['data-entity-type'] === undefined || (attributes['data-entity-id'] === undefined && attributes['data-entity-uuid'] === undefined) || (attributes['data-view-mode'] === undefined && attributes['data-entity-embed-display'] === undefined)) {
return;
}
// Generate an ID for the element, so that we can use the Ajax
// framework.
element.attributes.id = generateEmbedId();
return element;
},

// Fetch the rendered entity.
init: function () {
var element = this.element;
var $element = $(element.$);
// Use the Ajax framework to fetch the HTML, so that we can retrieve
// out-of-band assets (JS, CSS...).
var entityEmbedPreview = new Drupal.ajax({
base: $element.attr('id'),
element: $element,
url: Drupal.url('embed/preview/' + editor.config.drupal.format + '?' + $.param({
value: element.getOuterHtml()
})),
progress: {type: 'none'},
// Use a custom event to trigger the call.
event: 'entity_embed_dummy_event'
});
entityEmbedPreview.execute();
},

// Downcast the element.
downcast: function (element) {
// Only keep the wrapping element.
element.setHtml('');
// Remove the auto-generated ID.
delete element.attributes.id;
return element;
}
});
}
});

/**
* Generates unique HTML IDs for the widgets.
*
* @returns {string}
*/
function generateEmbedId() {
if (typeof generateEmbedId.counter == 'undefined') {
generateEmbedId.counter = 0;
}
return 'entity-embed-' + generateEmbedId.counter++;
}

})(jQuery, Drupal, CKEDITOR);
79 changes: 3 additions & 76 deletions js/plugins/drupalentity/plugin.js
Original file line number Diff line number Diff line change
@@ -1,30 +1,18 @@
/**
* @file
* Drupal Entity embed plugin.
* Drupal Entity embed button plugin.
*/

(function ($, Drupal, CKEDITOR) {

"use strict";

CKEDITOR.plugins.add('drupalentity', {
CKEDITOR.plugins.add('drupalentity_button', {
// This plugin requires the Widgets System defined in the 'widget' plugin.
requires: 'widget',
requires: 'drupalentity',

// The plugin initialization logic goes inside this method.
beforeInit: function (editor) {
// Configure CKEditor DTD for custom drupal-entity element.
// @see https://www.drupal.org/node/2448449#comment-9717735
var dtd = CKEDITOR.dtd, tagName;
dtd['drupal-entity'] = {'#': 1};
// Register drupal-entity element as allowed child, in each tag that can
// contain a div element.
for (tagName in dtd) {
if (dtd[tagName].div) {
dtd[tagName]['drupal-entity'] = 1;
}
}

// Generic command for adding/editing entities of all types.
editor.addCommand('editdrupalentity', {
allowedContent: 'drupal-entity[*]',
Expand Down Expand Up @@ -81,55 +69,6 @@
}
});

// Register the entity embed widget.
editor.widgets.add('drupalentity', {
// Minimum HTML which is required by this widget to work.
allowedContent: 'drupal-entity[*]',
requiredContent: 'drupal-entity[*]',

// Simply recognize the element as our own. The inner markup if fetched
// and inserted the init() callback, since it requires the actual DOM
// element.
upcast: function (element) {
var attributes = element.attributes;
if (attributes['data-entity-type'] === undefined || (attributes['data-entity-id'] === undefined && attributes['data-entity-uuid'] === undefined) || (attributes['data-view-mode'] === undefined && attributes['data-entity-embed-display'] === undefined)) {
return;
}
// Generate an ID for the element, so that we can use the Ajax
// framework.
element.attributes.id = generateEmbedId();
return element;
},

// Fetch the rendered entity.
init: function () {
var element = this.element;
var $element = $(element.$);
// Use the Ajax framework to fetch the HTML, so that we can retrieve
// out-of-band assets (JS, CSS...).
var entityEmbedPreview = new Drupal.ajax({
base: $element.attr('id'),
element: $element,
url: Drupal.url('embed/preview/' + editor.config.drupal.format + '?' + $.param({
value: element.getOuterHtml()
})),
progress: {type: 'none'},
// Use a custom event to trigger the call.
event: 'entity_embed_dummy_event'
});
entityEmbedPreview.execute();
},

// Downcast the element.
downcast: function (element) {
// Only keep the wrapping element.
element.setHtml('');
// Remove the auto-generated ID.
delete element.attributes.id;
return element;
}
});

// Register the toolbar buttons.
if (editor.ui.addButton) {
for (var key in editor.config.DrupalEntity_buttons) {
Expand Down Expand Up @@ -199,16 +138,4 @@
return widget && widget.name === 'drupalentity';
}

/**
* Generates unique HTML IDs for the widgets.
*
* @returns {string}
*/
function generateEmbedId() {
if (typeof generateEmbedId.counter == 'undefined') {
generateEmbedId.counter = 0;
}
return 'entity-embed-' + generateEmbedId.counter++;
}

})(jQuery, Drupal, CKEDITOR);
18 changes: 2 additions & 16 deletions src/Plugin/CKEditorPlugin/DrupalEntity.php
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@
namespace Drupal\entity_embed\Plugin\CKEditorPlugin;

use Drupal\editor\Entity\Editor;
use Drupal\embed\EmbedButtonInterface;
use Drupal\embed\EmbedCKEditorPluginBase;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Seems odd that this would still extend EmbedCKEditorPluginBase?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is strange indeeed.


/**
Expand All @@ -22,31 +21,18 @@
*/
class DrupalEntity extends EmbedCKEditorPluginBase {

/**
* {@inheritdoc}
*/
protected function getButton(EmbedButtonInterface $embed_button) {
$button = parent::getButton($embed_button);
$button['entity_type'] = $embed_button->getTypeSetting('entity_type');
return $button;
}

/**
* {@inheritdoc}
*/
public function getFile() {
return drupal_get_path('module', 'entity_embed') . '/js/plugins/drupalentity/plugin.js';
return drupal_get_path('module', 'entity_embed') . '/js/plugins/drupalentity/engine.js';
}

/**
* {@inheritdoc}
*/
public function getConfig(Editor $editor) {
return array(
'DrupalEntity_dialogTitleAdd' => t('Insert entity'),
'DrupalEntity_dialogTitleEdit' => t('Edit entity'),
'DrupalEntity_buttons' => $this->getButtons(),
);
return array();
}

}
59 changes: 59 additions & 0 deletions src/Plugin/CKEditorPlugin/DrupalEntityButton.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
<?php

/**
* @file
* Contains \Drupal\entity_embed\Plugin\CKEditorPlugin\DrupalEntityButton.
*/

namespace Drupal\entity_embed\Plugin\CKEditorPlugin;

use Drupal\editor\Entity\Editor;
use Drupal\embed\EmbedButtonInterface;
use Drupal\embed\EmbedCKEditorPluginBase;

/**
* Defines the "drupalentity_button" plugin.
*
* @CKEditorPlugin(
* id = "drupalentity_button",
* label = @Translation("Entity"),
* embed_type_id = "entity"
* )
*/
class DrupalEntityButton extends EmbedCKEditorPluginBase {

/**
* {@inheritdoc}
*/
protected function getButton(EmbedButtonInterface $embed_button) {
$button = parent::getButton($embed_button);
$button['entity_type'] = $embed_button->getTypeSetting('entity_type');
return $button;
}

/**
* {@inheritdoc}
*/
public function getDependencies(Editor $editor) {
return ['drupalentity'];
}

/**
* {@inheritdoc}
*/
public function getFile() {
return drupal_get_path('module', 'entity_embed') . '/js/plugins/drupalentity/plugin.js';
}

/**
* {@inheritdoc}
*/
public function getConfig(Editor $editor) {
return array(
'DrupalEntity_dialogTitleAdd' => t('Insert entity'),
'DrupalEntity_dialogTitleEdit' => t('Edit entity'),
'DrupalEntity_buttons' => $this->getButtons(),
);
}

}