Уровень опыта |
Продвинутый |
Временная оценка |
15 мин |
Приложение Atlassian |
JIRA 7.3+ |
Обзор функций
Если вы прочитали эти два учебника: Учебник - Написание плагина для Rich Text Editor в JIRA и учебном пособии - Настройка Rich Text Editor в JIRA, вы узнаете, как добавить новые функции в Rich Text Editor. После прочтения этого руководства вы узнаете, как настроить параметры в основном редакторе TinyMCE. Предположим, вы хотите разрешить печатать заголовки, похожие на уценку. Конечный результат:
РИСУНКИ с видео роликами
Давайте погрузимся в детали.
Создание файла с логикой настройки
Листинг markdown-headings.js
require(["jira/editor/customizer"], function (EditorCustomizer) {
EditorCustomizer.customizeSettings(function (tinymceSettings, tinymce, SchemaBuilder) {
if (tinymceSettings.plugins.indexOf('textpattern') === -1) {
tinymceSettings.plugins.push('textpattern');
}
tinymceSettings.textpattern_patterns = tinymceSettings.textpattern_patterns || [];
Array.prototype.push.apply(tinymceSettings.textpattern_patterns, [
{start: '#', format: 'h1'},
{start: '##', format: 'h2'},
{start: '###', format: 'h3'}
]);
});
});
Что происходит в коде?
- Во-первых,require jira / editor / customizer, который позволяет нам изменять настройки TinyMCE с помощью метода customizeSettings.
- Данная функция обратного вызова function (tinymceSettings, tinymce, SchemaBuilder) {...} будет вызываться до инициализации экземпляра редактора TinyMCE.Мы можем использовать три параметра:
- объект tinymceSettings, который используется для инициализации экземпляра редактора TinyMCE: tinymce.init (tinymceSettings);
(подробнее см. документацию TinyMCE)
- tinymce Основной объект TinyMCE, который мы можем использовать, например, для добавления нового плагина TinyMCE
(некоторые примеры приведены в этой части документации TinyMCE)
- Редактор Rich Text Editor SchemaBuilder контролирует параметры схемы, связанные с TinyMCE, такие как schema, valid_elements, valid_children или custom_elements, потому что только подмножество HTML поддерживается форматом Wiki Markup, который используется в качестве формата хранения в JIRA. Этот параметр подробно рассмотрен на следующей странице: Учебное пособие - Настройка редактора Rich Text в JIRA.
- Внутри тела обратного вызова мы добавляем * textpattern * TinyMCE-плагин, если он еще не существует, и мы настраиваем этот плагин в соответствии с его спецификацией.
Загрузка файла в контекст редактора
Листинг atlassian-plugin.xml
<web-resource key="customizations" name="JIRA Editor Reference Plugin Customizations">
<context>jira.rich.editor</context>
<resource type="download" name="js/markdown-headings.js" location="js/markdown-headings.js"/>
</web-resource>
Вот и все! (улыбка)
Ссылки
Исходный код исходного плагина: bitbucket.org/atlassian/jira-editor-ref-plugin/overview
Документация TinyMCE: www.tinymce.com/docs/
По материалам Atlassian JIRA Server Developer Customizing the TinyMCE within Rich Text Editor in JIRA