Commit 73ad4fea authored by Ben Mullins's avatar Ben Mullins
Browse files

Issue #3264775 by lauriii, Wim Leers: [drupalMedia] Toolbar should be visible... 

Issue #3264775 by lauriii, Wim Leers: [drupalMedia] Toolbar should be visible when element inside <drupalMedia> is focused
parent 9c7aa8ad

core/modules/ckeditor5/js/build/drupalMedia.js

+1 −1

File changed.

Preview size limit exceeded, changes collapsed.

core/modules/ckeditor5/js/ckeditor5_plugins/drupalMedia/src/drupalelementstyle/drupalelementstylecommand.js

+21 −10
Original line number Diff line number Diff line
@@ -20,14 +20,27 @@ import { Command } from 'ckeditor5/src/core'; 
function getClosestElementWithElementStyleAttribute(selection, schema) {

  const selectedElement = selection.getSelectedElement();



  return selectedElement &&

  if (

    selectedElement &&

    schema.checkAttribute(selectedElement, 'drupalElementStyle')

    ? selectedElement

    : selection

        .getFirstPosition()

        .findAncestor((element) =>

          schema.checkAttribute(element, 'drupalElementStyle'),

        );

  ) {

    return selectedElement;

  }



  let parent = selection.getFirstPosition().parent;



  while (parent) {

    if (

      parent.is('element') &&

      schema.checkAttribute(parent, 'drupalElementStyle')

    ) {

      return parent;

    }



    parent = parent.parent;

  }



  return null;

}



/**
@@ -69,9 +82,7 @@ export default class DrupalElementStyleCommand extends Command { 


    this.isEnabled = !!element;



    if (!this.isEnabled) {

      this.value = false;

    } else if (element.hasAttribute('drupalElementStyle')) {

    if (this.isEnabled) {

      this.value = element.getAttribute('drupalElementStyle');

    } else {

      this.value = false;

core/modules/ckeditor5/js/ckeditor5_plugins/drupalMedia/src/drupalmediacaption/drupalmediacaptioncommand.js

+37 −16
Original line number Diff line number Diff line 
/* eslint-disable import/no-extraneous-dependencies */

/* cspell:words imagecaption */

import { Command } from 'ckeditor5/src/core';

import { isDrupalMedia } from '../utils';

import { getClosestSelectedDrupalMediaElement, isDrupalMedia } from '../utils';

import { getMediaCaptionFromModelSelection } from './utils';



/**

 * Gets the caption model element from the media model selection.
@@ -12,7 +13,7 @@ import { isDrupalMedia } from '../utils'; 
 *   The caption element or `null` if the selection has no child caption

 *   element.

 */

export function getCaptionFromDrupalMediaModelElement(drupalMediaModelElement) {

function getCaptionFromDrupalMediaModelElement(drupalMediaModelElement) {

  // eslint-disable-next-line no-restricted-syntax

  for (const node of drupalMediaModelElement.getChildren()) {

    if (!!node && node.is('element', 'caption')) {
@@ -42,14 +43,31 @@ export default class ToggleDrupalMediaCaptionCommand extends Command { 
   * @inheritDoc

   */

  refresh() {

    const element = this.editor.model.document.selection.getSelectedElement();

    const selection = this.editor.model.document.selection;

    const selectedElement = selection.getSelectedElement();



    this.isEnabled = isDrupalMedia(element);

    // When selectedElement is falsy, it is potentially due to multiple elements

    // being selected, such as elements that descend from `<drupalMedia>`.

    if (!selectedElement) {

      // Command should be enabled if `<drupalMedia>` element is part of the

      // selection.

      this.isEnabled = !!getClosestSelectedDrupalMediaElement(selection);

      // Check if the selection descends from a `<drupalMedia>` element that

      // also includes a `<caption>`.

      this.value = !!getMediaCaptionFromModelSelection(selection);



      return;

    }



    // If single element is selected, check if it's a `<drupalMedia>` element.

    this.isEnabled = isDrupalMedia(selectedElement);



    if (!this.isEnabled) {

      this.value = false;

    } else {

      this.value = !!getCaptionFromDrupalMediaModelElement(element);

      // Command value is set based on whether the selected `<drupalMedia>`

      // element has a `<caption>` as a child element.

      this.value = !!getCaptionFromDrupalMediaModelElement(selectedElement);

    }

  }
@@ -97,7 +115,7 @@ export default class ToggleDrupalMediaCaptionCommand extends Command { 
    const mediaCaptionEditing = this.editor.plugins.get(

      'DrupalMediaCaptionEditing',

    );

    const selectedMedia = selection.getSelectedElement();

    const selectedMedia = getClosestSelectedDrupalMediaElement(selection);

    const savedCaption = mediaCaptionEditing._getSavedCaption(selectedMedia);



    // Try restoring the caption from the DrupalMediaCaptionEditing plugin storage.
@@ -123,17 +141,20 @@ export default class ToggleDrupalMediaCaptionCommand extends Command { 
    const editor = this.editor;

    const selection = editor.model.document.selection;

    const mediaCaptionEditing = editor.plugins.get('DrupalMediaCaptionEditing');

    const selectedMedia = selection.getSelectedElement();

    let selectedElement = selection.getSelectedElement();

    let captionElement;



    if (selectedMedia) {

      const captionElement =

        getCaptionFromDrupalMediaModelElement(selectedMedia);

    if (selectedElement) {

      captionElement = getCaptionFromDrupalMediaModelElement(selectedElement);

    } else {

      captionElement = getMediaCaptionFromModelSelection(selection);

      selectedElement = getClosestSelectedDrupalMediaElement(selection);

    }



    // Store the caption content so it can be restored quickly if the user

    // changes their mind.

      mediaCaptionEditing._saveCaption(selectedMedia, captionElement);

      writer.setSelection(selectedMedia, 'on');

    mediaCaptionEditing._saveCaption(selectedElement, captionElement);

    writer.setSelection(selectedElement, 'on');

    writer.remove(captionElement);

  }

}
 
}

core/modules/ckeditor5/js/ckeditor5_plugins/drupalMedia/src/drupalmediacaption/drupalmediacaptionui.js

+4 −3
Original line number Diff line number Diff line 
/* eslint-disable import/no-extraneous-dependencies */

import { Plugin, icons } from 'ckeditor5/src/core';

import { ButtonView } from 'ckeditor5/src/ui';

import { getMediaCaptionFromModelSelection } from './utils';



/**

 * The caption media UI plugin.
@@ -53,9 +54,9 @@ export default class DrupalMediaCaptionUI extends Plugin { 
        editor.execute('toggleMediaCaption', { focusCaptionOnShow: true });



        // If a caption is present, highlight it and scroll to the selection.

        const modelCaptionElement = editor.model.document.selection

          .getFirstPosition()

          .findAncestor('caption');

        const modelCaptionElement = getMediaCaptionFromModelSelection(

          editor.model.document.selection,

        );

        if (modelCaptionElement) {

          const figcaptionElement =

            editor.editing.mapper.toViewElement(modelCaptionElement);

core/modules/ckeditor5/js/ckeditor5_plugins/drupalMedia/src/drupalmediacaption/utils.js

0 → 100644
+25 −0
Original line number Diff line number Diff line 
/* eslint-disable import/prefer-default-export */

import { isDrupalMedia } from '../utils';



/**

 * Returns the Media caption model element for a model selection.

 *

 * @param {module:engine/model/selection~Selection} selection

 *   The current selection.

 * @returns {module:engine/model/element~Element|null}

 *   The Drupal Media caption element for a model selection. Returns null if the

 *   selection has no Drupal Media caption element ancestor.

 */

export function getMediaCaptionFromModelSelection(selection) {

  const captionElement = selection.getFirstPosition().findAncestor('caption');



  if (!captionElement) {

    return null;

  }



  if (isDrupalMedia(captionElement.parent)) {

    return captionElement;

  }



  return null;

}