WordPress обнаруживает щелчок по предварительному просмотру шорткода галереи в TinyMCE

#javascript #wordpress #tinymce

#javascript #wordpress #tinymce

Вопрос:

Работаем над настройкой галереи WordPress с некоторыми различными настройками для разных типов галерей.

Короче говоря, я использую несколько редакторов wp_editors на странице, и у меня проблема с фокусировкой при переключении между редакторами.

Я использую wp.media.view.Settings.Gallery.extend для переключения между типами галерей и отображения разных шаблонов js.

Функциональность на самом деле хорошая, и шорткоды галереи идут туда, куда им нужно, и обновляются по мере необходимости.

Для определенных типов галерей я расширяю сведения о вложении расширением, которое выглядит примерно так: уменьшенная версия:

 var $gal_media = wp.media;
$gal_media.view.Attachment.Details = $gal_media.view.Attachment.Details.extend({
  initialize: function(){
    this.model.on('change', this.render, this);
  },
  render: function(){
    var check_active_editor =  window.wpActiveEditor;
    return this;
  }
});
 

Проблема заключается в том, что я пытаюсь определить текущий редактор во время рендеринга части функции с помощью window.wpActiveEditor;

Он работает правильно, если вы фокусируетесь на текущем редакторе, но если вы просто нажмете предварительный просмотр галереи или отредактируете галерею, карандаш window.wpActiveEditor; вернет последний сфокусированный редактор.

Пробовал несколько разных попыток изменить фокус на редакторе в вызове wp_editor, используя события нажатия во время инициализации, например:

 'tinymce' => array(
  'init_instance_callback' => 'function(gallery_editor) {
    gallery_editor.on("click", function(){
      tinyMCE.get(gallery_editor.id).focus();
    });
  }'
)
 

но они не вызываются при нажатии на предварительный просмотр галереи или редактирование.

Любое предложение по любому:

1) Получение правильного идентификатора? Очевидно, что Галерея знает это, поскольку возвращает шорткод в соответствующий редактор.

или

2) Переключение фокуса / размытия в нескольких редакторах при нажатии кнопки предварительного просмотра галереи или редактирования.

Очень признателен!

Ответ №1:

Если кто-нибудь окажется в подобной ситуации, я смог решить эту проблему с помощью обратного вызова по щелчку в моих редакторах, который перебирает все редакторы и удаляет data-mce-selected атрибут из любых других выбранных узлов галереи. Затем он фокусируется на редакторе, который только что щелкнул. Не самый красивый, но он ведет себя так, как ожидалось.

Ключом для меня было использование tinyMCE.dom.DomQuery

 'tinymce' => array(
  'init_instance_callback' => 'function(ed) {
    ed.on("click", function(){
      for (edId in tinyMCE.editors){
        if(edId !== ed.id){
          var this_editor = tinyMCE.get(edId);
          var $ = tinyMCE.dom.DomQuery;
          $("div[data-wpview-type]", this_editor.dom.doc).removeAttr("data-mce-selected");
        }
      }
      tinyMCE.get(ed.id).focus();
    });
  }'
)