diff --git a/EMS/admin-ui-bundle/assets/src/core/core.js b/EMS/admin-ui-bundle/assets/src/core/core.js
index 5f8e2d9ab..45163f1de 100644
--- a/EMS/admin-ui-bundle/assets/src/core/core.js
+++ b/EMS/admin-ui-bundle/assets/src/core/core.js
@@ -1,146 +1,137 @@
-import Button from "./plugins/button";
-import Choice from "./plugins/choice";
-import CodeEditor from "./plugins/codeEditor";
-import Collection from "./plugins/collection";
-import Datatable from "./plugins/datatable";
-import Datetime from "./plugins/datetime";
-import File from "./plugins/file";
-import Form from "./plugins/form";
-import Iframe from "./plugins/iframe";
-import Image from "./plugins/image";
-import Job from "./plugins/job";
-import JsonMenu from "./plugins/jsonMenu";
-import JsonMenuNested from "./plugins/jsonMenuNested";
-import MediaLibrary from "./plugins/mediaLibrary";
-import NestedSortable from "./plugins/nestedSortable";
-import ObjectPicker from "./plugins/objectPicker";
-import SearchForm from "./plugins/searchForm";
-import Select from "./plugins/select";
-import SortableList from "./plugins/sortableList";
-import SymfonyCollection from "./plugins/symfonyCollection";
-import Text from "./plugins/text";
-import Tooltip from "./plugins/tooltip";
-import WYSIWYG from "./plugins/wysiwyg.ts";
+import Button from './plugins/button'
+import Choice from './plugins/choice'
+import CodeEditor from './plugins/codeEditor'
+import Collection from './plugins/collection'
+import Datatable from './plugins/datatable'
+import Datetime from './plugins/datetime'
+import File from './plugins/file'
+import Form from './plugins/form'
+import Iframe from './plugins/iframe'
+import Image from './plugins/image'
+import Job from './plugins/job'
+import JsonMenu from './plugins/jsonMenu'
+import JsonMenuNested from './plugins/jsonMenuNested'
+import MediaLibrary from './plugins/mediaLibrary'
+import NestedSortable from './plugins/nestedSortable'
+import ObjectPicker from './plugins/objectPicker'
+import SearchForm from './plugins/searchForm'
+import Select from './plugins/select'
+import SortableList from './plugins/sortableList'
+import SymfonyCollection from './plugins/symfonyCollection'
+import Text from './plugins/text'
+import Tooltip from './plugins/tooltip'
+import WYSIWYG from './plugins/wysiwyg'
-import RevisionTask from "./components/revisionTask";
-import Modal from "./components/modal";
-import Sidebar from "./components/sidebar";
+import RevisionTask from './components/revisionTask'
+import Modal from './components/modal'
+import Sidebar from './components/sidebar'
-import { EMS_ADDED_DOM_EVENT } from "./events/addedDomEvent";
-import CtrlSaveEvent from "./events/ctrlSaveEvent";
-import $ from "jquery";
+import { EMS_ADDED_DOM_EVENT } from './events/addedDomEvent'
+import CtrlSaveEvent from './events/ctrlSaveEvent'
+import $ from 'jquery'
class Core {
- constructor() {
- this._statusUpdateUrl = document.body.getAttribute("data-status-url");
- this._domListeners = [
- new Button(),
- new Choice(),
- new CodeEditor(),
- new Collection(),
- new Datatable(),
- new Datetime(),
- new File(),
- new Form(),
- new Iframe(),
- new Image(),
- new Job(),
- new JsonMenu(),
- new JsonMenuNested(),
- new MediaLibrary(),
- new NestedSortable(),
- new ObjectPicker(),
- new SearchForm(),
- new Select(),
- new SortableList(),
- new SymfonyCollection(),
- new Text(),
- new Tooltip(),
- new WYSIWYG(),
- ];
- document.addEventListener(EMS_ADDED_DOM_EVENT, (event) =>
- this.load(event.detail.target),
- );
- this.coreReady();
- }
-
- load(target) {
- if (target === undefined) {
- console.log(
- "Impossible to add ems listeners as no target is defined",
- );
- return;
- }
- this._domListeners.forEach((element) => element.load(target));
- }
+ constructor() {
+ this._statusUpdateUrl = document.body.getAttribute('data-status-url')
+ this._domListeners = [
+ new Button(),
+ new Choice(),
+ new CodeEditor(),
+ new Collection(),
+ new Datatable(),
+ new Datetime(),
+ new File(),
+ new Form(),
+ new Iframe(),
+ new Image(),
+ new Job(),
+ new JsonMenu(),
+ new JsonMenuNested(),
+ new MediaLibrary(),
+ new NestedSortable(),
+ new ObjectPicker(),
+ new SearchForm(),
+ new Select(),
+ new SortableList(),
+ new SymfonyCollection(),
+ new Text(),
+ new Tooltip(),
+ new WYSIWYG()
+ ]
+ document.addEventListener(EMS_ADDED_DOM_EVENT, (event) => this.load(event.detail.target))
+ this.coreReady()
+ }
- coreReady() {
- if (
- document.readyState === "complete" ||
- document.readyState === "interactive"
- ) {
- setTimeout(() => this.load(document), 1);
- } else {
- document.addEventListener("DOMContentLoaded", () =>
- this.load(document),
- );
- }
- this.initStatusRefresh();
- this.initCtrlSaveEvent();
- this.components = [new RevisionTask(), new Modal(), new Sidebar()];
+ load(target) {
+ if (target === undefined) {
+ console.log('Impossible to add ems listeners as no target is defined')
+ return
}
+ this._domListeners.forEach((element) => element.load(target))
+ }
- initStatusRefresh() {
- const self = this;
- window.setInterval(function () {
- self.updateStatus();
- }, 180000);
+ coreReady() {
+ if (document.readyState === 'complete' || document.readyState === 'interactive') {
+ setTimeout(() => this.load(document), 1)
+ } else {
+ document.addEventListener('DOMContentLoaded', () => this.load(document))
}
+ this.initStatusRefresh()
+ this.initCtrlSaveEvent()
+ this.components = [new RevisionTask(), new Modal(), new Sidebar()]
+ }
- updateStatus() {
- const xhr = new XMLHttpRequest();
- xhr.open("GET", this._statusUpdateUrl, true);
+ initStatusRefresh() {
+ const self = this
+ window.setInterval(function () {
+ self.updateStatus()
+ }, 180000)
+ }
- xhr.onreadystatechange = function () {
- if (this.readyState !== 4) {
- return;
- }
+ updateStatus() {
+ const xhr = new XMLHttpRequest()
+ xhr.open('GET', this._statusUpdateUrl, true)
- const statusLink = document.getElementById("status-overview");
- if (this.status === 200) {
- const json = JSON.parse(xhr.responseText);
- statusLink.innerHTML = json.body;
- statusLink.setAttribute("title", json.title);
- } else {
- statusLink.setAttribute("title", `Error ${xhr.status}`);
- statusLink.innerHTML = `Error ${xhr.status}`;
- }
- };
+ xhr.onreadystatechange = function () {
+ if (this.readyState !== 4) {
+ return
+ }
- xhr.send();
+ const statusLink = document.getElementById('status-overview')
+ if (this.status === 200) {
+ const json = JSON.parse(xhr.responseText)
+ statusLink.innerHTML = json.body
+ statusLink.setAttribute('title', json.title)
+ } else {
+ statusLink.setAttribute('title', `Error ${xhr.status}`)
+ statusLink.innerHTML = `Error ${xhr.status}`
+ }
}
- initCtrlSaveEvent() {
- $(document).keydown(function (e) {
- let key;
- const possible = [e.key, e.keyIdentifier, e.keyCode, e.which];
+ xhr.send()
+ }
- while (key === undefined && possible.length > 0) {
- key = possible.pop();
- }
- if (
- typeof key === "number" &&
- (key === 115 || key === 83) &&
- (e.ctrlKey || e.metaKey) &&
- !e.altKey
- ) {
- const event = new CtrlSaveEvent(e);
- event.dispatch();
- }
- });
- }
+ initCtrlSaveEvent() {
+ $(document).keydown(function (e) {
+ let key
+ const possible = [e.key, e.keyIdentifier, e.keyCode, e.which]
+
+ while (key === undefined && possible.length > 0) {
+ key = possible.pop()
+ }
+ if (
+ typeof key === 'number' &&
+ (key === 115 || key === 83) &&
+ (e.ctrlKey || e.metaKey) &&
+ !e.altKey
+ ) {
+ const event = new CtrlSaveEvent(e)
+ event.dispatch()
+ }
+ })
+ }
}
-const core = new Core();
+const core = new Core()
-export default core;
+export default core
diff --git a/EMS/admin-ui-bundle/assets/src/core/helpers/editor.js b/EMS/admin-ui-bundle/assets/src/core/helpers/editor.js
index 0940f6aa7..f1bcbe1e0 100644
--- a/EMS/admin-ui-bundle/assets/src/core/helpers/editor.js
+++ b/EMS/admin-ui-bundle/assets/src/core/helpers/editor.js
@@ -10,15 +10,15 @@ import { FontColor, FontFamily, FontSize } from '@ckeditor/ckeditor5-font'
import { Heading } from '@ckeditor/ckeditor5-heading'
import { GeneralHtmlSupport } from '@ckeditor/ckeditor5-html-support'
import {
- Image,
- ImageCaption,
- ImageInsertViaUrl,
- ImageStyle,
- ImageToolbar,
- ImageResizeEditing,
- ImageResizeHandles,
- ImageUpload,
- PictureEditing
+ Image,
+ ImageCaption,
+ ImageInsertViaUrl,
+ ImageStyle,
+ ImageToolbar,
+ ImageResizeEditing,
+ ImageResizeHandles,
+ ImageUpload,
+ PictureEditing
} from '@ckeditor/ckeditor5-image'
import { Indent } from '@ckeditor/ckeditor5-indent'
import { List } from '@ckeditor/ckeditor5-list'
@@ -27,17 +27,17 @@ import { Paragraph } from '@ckeditor/ckeditor5-paragraph'
import { RemoveFormat } from '@ckeditor/ckeditor5-remove-format'
import { SourceEditing } from '@ckeditor/ckeditor5-source-editing'
import {
- SpecialCharacters,
- SpecialCharactersEssentials
+ SpecialCharacters,
+ SpecialCharactersEssentials
} from '@ckeditor/ckeditor5-special-characters'
import { Style } from '@ckeditor/ckeditor5-style'
import {
- Table,
- TableCaption,
- TableCellProperties,
- TableProperties,
- TableColumnResize,
- TableToolbar
+ Table,
+ TableCaption,
+ TableCellProperties,
+ TableProperties,
+ TableColumnResize,
+ TableToolbar
} from '@ckeditor/ckeditor5-table'
import { TextTransformation } from '@ckeditor/ckeditor5-typing'
import { Undo } from '@ckeditor/ckeditor5-undo'
@@ -51,271 +51,271 @@ import { LinkTarget } from './ck5/linkTarget'
import ChangeEvent from '../events/changeEvent'
function initUploadAdaptor(editor) {
- editor.plugins.get('FileRepository').createUploadAdapter = (loader) => {
- return new UploadAdapter(loader)
- }
+ editor.plugins.get('FileRepository').createUploadAdapter = (loader) => {
+ return new UploadAdapter(loader)
+ }
}
export default class Editor {
- constructor(element, options) {
- const self = this
- this.element = element
- this.options = options
- ClassicEditor.create(element, this.buildCke5Options())
- .then((editor) => {
- self._init(editor)
- })
- .catch((error) => {
- console.error(error)
- })
- }
+ constructor(element, options) {
+ const self = this
+ this.element = element
+ this.options = options
+ ClassicEditor.create(element, this.buildCke5Options())
+ .then((editor) => {
+ self._init(editor)
+ })
+ .catch((error) => {
+ console.error(error)
+ })
+ }
- buildCke5Options() {
- let options = this.getDefaultOptions()
- options = this._applyProfile(options)
- options = this._applyStyleSet(options)
- options = this._applyHeadings(options)
- options = this._applyLang(options)
+ buildCke5Options() {
+ let options = this.getDefaultOptions()
+ options = this._applyProfile(options)
+ options = this._applyStyleSet(options)
+ options = this._applyHeadings(options)
+ options = this._applyLang(options)
- return options
- }
+ return options
+ }
- getDefaultOptions() {
- return {
- heading: {
- options: [
- { model: 'paragraph', title: 'Paragraph', class: '' },
- {
- model: 'heading2',
- view: 'h2',
- title: 'Heading 2',
- class: ''
- },
- {
- model: 'heading3',
- view: 'h3',
- title: 'Heading 3',
- class: ''
- }
- ]
- },
- htmlSupport: {
- allow: [
- {
- name: /.*/,
- attributes: true,
- classes: true,
- styles: true
- }
- ]
- },
- extraPlugins: [initUploadAdaptor],
- plugins: [
- Alignment,
- Autoformat,
- AssetManager,
- BlockQuote,
- Bold,
- Essentials,
- FindAndReplace,
- FontColor,
- FontFamily,
- FontSize,
- GeneralHtmlSupport,
- Heading,
- Image,
- ImageCaption,
- ImageInsertViaUrl,
- ImageStyle,
- ImageToolbar,
- ImageResizeEditing,
- ImageResizeHandles,
- ImageUpload,
- Indent,
- Italic,
- Link,
- LinkTarget,
- List,
- MediaEmbed,
- Paragraph,
- PasteAjax,
- PictureEditing,
- RemoveFormat,
- SourceEditing,
- SpecialCharacters,
- SpecialCharactersEssentials,
- Style,
- Table,
- TableCaption,
- TableCellProperties,
- TableColumnResize,
- TableProperties,
- TableToolbar,
- TextTransformation,
- Undo
- ],
- toolbar: {
- items: [
- 'heading',
- '|',
- 'bold',
- 'italic',
- 'bulletedList',
- 'numberedList',
- 'removeFormat',
- '|',
- 'outdent',
- 'indent',
- 'undo',
- 'redo',
- '|',
- 'link',
- 'insertImage',
- 'insertTable',
- 'mediaEmbed',
- 'specialCharacters',
- '|',
- 'findAndReplace',
- 'sourceEditing'
- ],
- shouldNotGroupWhenFull: true
- },
- language: {
- ui: 'en',
- content: 'en'
- },
- image: {
- toolbar: [
- 'imageTextAlternative',
- 'toggleImageCaption',
- '|',
- 'imageStyle:inline',
- 'imageStyle:block',
- 'imageStyle:side',
- '|',
- 'editImage'
- ],
- insert: {
- integrations: ['upload', 'assetManager']
- }
- },
- table: {
- defaultHeadings: { rows: 1 },
- contentToolbar: [
- 'tableColumn',
- 'tableRow',
- 'mergeTableCells',
- 'tableProperties',
- 'tableCellProperties'
- ]
- }
+ getDefaultOptions() {
+ return {
+ heading: {
+ options: [
+ { model: 'paragraph', title: 'Paragraph', class: '' },
+ {
+ model: 'heading2',
+ view: 'h2',
+ title: 'Heading 2',
+ class: ''
+ },
+ {
+ model: 'heading3',
+ view: 'h3',
+ title: 'Heading 3',
+ class: ''
+ }
+ ]
+ },
+ htmlSupport: {
+ allow: [
+ {
+ name: /.*/,
+ attributes: true,
+ classes: true,
+ styles: true
+ }
+ ]
+ },
+ extraPlugins: [initUploadAdaptor],
+ plugins: [
+ Alignment,
+ Autoformat,
+ AssetManager,
+ BlockQuote,
+ Bold,
+ Essentials,
+ FindAndReplace,
+ FontColor,
+ FontFamily,
+ FontSize,
+ GeneralHtmlSupport,
+ Heading,
+ Image,
+ ImageCaption,
+ ImageInsertViaUrl,
+ ImageStyle,
+ ImageToolbar,
+ ImageResizeEditing,
+ ImageResizeHandles,
+ ImageUpload,
+ Indent,
+ Italic,
+ Link,
+ LinkTarget,
+ List,
+ MediaEmbed,
+ Paragraph,
+ PasteAjax,
+ PictureEditing,
+ RemoveFormat,
+ SourceEditing,
+ SpecialCharacters,
+ SpecialCharactersEssentials,
+ Style,
+ Table,
+ TableCaption,
+ TableCellProperties,
+ TableColumnResize,
+ TableProperties,
+ TableToolbar,
+ TextTransformation,
+ Undo
+ ],
+ toolbar: {
+ items: [
+ 'heading',
+ '|',
+ 'bold',
+ 'italic',
+ 'bulletedList',
+ 'numberedList',
+ 'removeFormat',
+ '|',
+ 'outdent',
+ 'indent',
+ 'undo',
+ 'redo',
+ '|',
+ 'link',
+ 'insertImage',
+ 'insertTable',
+ 'mediaEmbed',
+ 'specialCharacters',
+ '|',
+ 'findAndReplace',
+ 'sourceEditing'
+ ],
+ shouldNotGroupWhenFull: true
+ },
+ language: {
+ ui: 'en',
+ content: 'en'
+ },
+ image: {
+ toolbar: [
+ 'imageTextAlternative',
+ 'toggleImageCaption',
+ '|',
+ 'imageStyle:inline',
+ 'imageStyle:block',
+ 'imageStyle:side',
+ '|',
+ 'editImage'
+ ],
+ insert: {
+ integrations: ['upload', 'assetManager']
}
+ },
+ table: {
+ defaultHeadings: { rows: 1 },
+ contentToolbar: [
+ 'tableColumn',
+ 'tableRow',
+ 'mergeTableCells',
+ 'tableProperties',
+ 'tableCellProperties'
+ ]
+ }
}
+ }
- _init(editor) {
- this.editor = editor
- const self = this
- if (undefined !== this.options.styleSet && this.options.styleSet.length > 0) {
- editor.ui.element.classList.add(`ems-styleset-${this.options.styleSet}`)
- }
- if (undefined !== this.options.onChangeEvent && this.options.onChangeEvent.length > 0) {
- editor.editing.view.document.on(this.options.onChangeEvent, () => {
- self._change()
- })
- }
- if (undefined !== this.options.height && this.options.height > 0) {
- editor.editing.view.change((writer) => {
- writer.setStyle(
- 'height',
- `${this.options.height}px`,
- editor.editing.view.document.getRoot()
- )
- })
- }
+ _init(editor) {
+ this.editor = editor
+ const self = this
+ if (undefined !== this.options.styleSet && this.options.styleSet.length > 0) {
+ editor.ui.element.classList.add(`ems-styleset-${this.options.styleSet}`)
}
-
- _change() {
- this.editor.updateSourceElement()
- const event = new ChangeEvent(this.element)
- event.dispatch()
+ if (undefined !== this.options.onChangeEvent && this.options.onChangeEvent.length > 0) {
+ editor.editing.view.document.on(this.options.onChangeEvent, () => {
+ self._change()
+ })
}
-
- _applyStyleSet(options) {
- if (undefined === this.options.styleSet || this.options.styleSet === 0) {
- options.toolbar.items = options.toolbar.items.filter((e) => e !== 'style')
- return options
- }
- const styleSet = this.options.styleSet
- if (
- undefined === document.body.dataset.wysiwygInfo ||
- document.body.dataset.wysiwygInfo.length === 0
- ) {
- options.toolbar.items = options.toolbar.items.filter((e) => e !== 'style')
- return options
- }
- const config = JSON.parse(document.body.dataset.wysiwygInfo)
- if (undefined === config.styles || config.styles.length === 0) {
- options.toolbar.items = options.toolbar.items.filter((e) => e !== 'style')
- return options
- }
- for (let i = 0; i < config.styles.length; ++i) {
- if (config.styles[i].name !== styleSet || undefined === config.styles[i].config) {
- continue
- }
- if (!options.toolbar.items.includes('style')) {
- options.toolbar.items.unshift('style')
- }
- options.style = {
- definitions: config.styles[i].config
- }
- break
- }
- return options
+ if (undefined !== this.options.height && this.options.height > 0) {
+ editor.editing.view.change((writer) => {
+ writer.setStyle(
+ 'height',
+ `${this.options.height}px`,
+ editor.editing.view.document.getRoot()
+ )
+ })
}
+ }
- _applyHeadings(options) {
- if (undefined === this.options.formatTags || this.options.formatTags.length === 0) {
- return options
- }
+ _change() {
+ this.editor.updateSourceElement()
+ const event = new ChangeEvent(this.element)
+ event.dispatch()
+ }
- try {
- const formatTags = JSON.parse(this.options.formatTags)
- options.heading.options = formatTags
- } catch (e) {
- console.error(
- `The format tags option expect an JSON, did you migrated it? Got: ${this.options.formatTags}`
- )
- }
+ _applyStyleSet(options) {
+ if (undefined === this.options.styleSet || this.options.styleSet === 0) {
+ options.toolbar.items = options.toolbar.items.filter((e) => e !== 'style')
+ return options
+ }
+ const styleSet = this.options.styleSet
+ if (
+ undefined === document.body.dataset.wysiwygInfo ||
+ document.body.dataset.wysiwygInfo.length === 0
+ ) {
+ options.toolbar.items = options.toolbar.items.filter((e) => e !== 'style')
+ return options
+ }
+ const config = JSON.parse(document.body.dataset.wysiwygInfo)
+ if (undefined === config.styles || config.styles.length === 0) {
+ options.toolbar.items = options.toolbar.items.filter((e) => e !== 'style')
+ return options
+ }
+ for (let i = 0; i < config.styles.length; ++i) {
+ if (config.styles[i].name !== styleSet || undefined === config.styles[i].config) {
+ continue
+ }
+ if (!options.toolbar.items.includes('style')) {
+ options.toolbar.items.unshift('style')
+ }
+ options.style = {
+ definitions: config.styles[i].config
+ }
+ break
+ }
+ return options
+ }
- return options
+ _applyHeadings(options) {
+ if (undefined === this.options.formatTags || this.options.formatTags.length === 0) {
+ return options
}
- _applyLang(options) {
- if (undefined !== this.options.lang && this.options.lang.length > 0) {
- options.language.content = this.options.lang
- }
- return options
+ try {
+ const formatTags = JSON.parse(this.options.formatTags)
+ options.heading.options = formatTags
+ } catch (e) {
+ console.error(
+ `The format tags option expect an JSON, did you migrated it? Got: ${this.options.formatTags}`
+ )
}
- _applyProfile(options) {
- if (
- undefined === document.body.dataset.wysiwygInfo ||
- (document.body.dataset.wysiwygInfo === 0) | length
- ) {
- return options
- }
+ return options
+ }
- try {
- const profile = JSON.parse(document.body.dataset.wysiwygInfo)
- if (typeof profile.config !== 'object') {
- return options
- }
+ _applyLang(options) {
+ if (undefined !== this.options.lang && this.options.lang.length > 0) {
+ options.language.content = this.options.lang
+ }
+ return options
+ }
- return { ...options, ...profile.config }
- } catch (e) {
- console.error(`Impossible to apply the WYSIWYG profile: ${e}`)
- }
+ _applyProfile(options) {
+ if (
+ undefined === document.body.dataset.wysiwygInfo ||
+ (document.body.dataset.wysiwygInfo === 0) | length
+ ) {
+ return options
+ }
+ try {
+ const profile = JSON.parse(document.body.dataset.wysiwygInfo)
+ if (typeof profile.config !== 'object') {
return options
+ }
+
+ return { ...options, ...profile.config }
+ } catch (e) {
+ console.error(`Impossible to apply the WYSIWYG profile: ${e}`)
}
+
+ return options
+ }
}
diff --git a/EMS/admin-ui-bundle/assets/src/core/helpers/editor.ts b/EMS/admin-ui-bundle/assets/src/core/helpers/editor.ts
deleted file mode 100644
index f7df0c35b..000000000
--- a/EMS/admin-ui-bundle/assets/src/core/helpers/editor.ts
+++ /dev/null
@@ -1,339 +0,0 @@
-import { ClassicEditor } from "@ckeditor/ckeditor5-editor-classic";
-
-import { Alignment } from "@ckeditor/ckeditor5-alignment";
-import { Autoformat } from "@ckeditor/ckeditor5-autoformat";
-import { Bold, Italic } from "@ckeditor/ckeditor5-basic-styles";
-import { BlockQuote } from "@ckeditor/ckeditor5-block-quote";
-import { Essentials } from "@ckeditor/ckeditor5-essentials";
-import { FindAndReplace } from "@ckeditor/ckeditor5-find-and-replace";
-import { FontColor, FontFamily, FontSize } from "@ckeditor/ckeditor5-font";
-import { Heading } from "@ckeditor/ckeditor5-heading";
-import { GeneralHtmlSupport } from "@ckeditor/ckeditor5-html-support";
-import {
- Image,
- ImageCaption,
- ImageInsertViaUrl,
- ImageStyle,
- ImageToolbar,
- ImageResizeEditing,
- ImageResizeHandles,
- ImageUpload,
- PictureEditing,
-} from "@ckeditor/ckeditor5-image";
-import { Indent } from "@ckeditor/ckeditor5-indent";
-import { List } from "@ckeditor/ckeditor5-list";
-import { MediaEmbed } from "@ckeditor/ckeditor5-media-embed";
-import { Paragraph } from "@ckeditor/ckeditor5-paragraph";
-import { RemoveFormat } from "@ckeditor/ckeditor5-remove-format";
-import { SourceEditing } from "@ckeditor/ckeditor5-source-editing";
-import {
- SpecialCharacters,
- SpecialCharactersEssentials,
-} from "@ckeditor/ckeditor5-special-characters";
-import { Style } from "@ckeditor/ckeditor5-style";
-import {
- Table,
- TableCaption,
- TableCellProperties,
- TableProperties,
- TableColumnResize,
- TableToolbar,
-} from "@ckeditor/ckeditor5-table";
-import { TextTransformation } from "@ckeditor/ckeditor5-typing";
-import { Undo } from "@ckeditor/ckeditor5-undo";
-
-import { Link } from "./ckeditor5-link/src/index";
-import { AssetManager } from "./ckeditor5-assetmanager/src/index";
-import { UploadAdapter } from "./ck5/uploadAdapter";
-import { PasteAjax } from "./ck5/pasteAjax";
-import { LinkTarget } from "./ck5/linkTarget";
-
-import ChangeEvent from "../events/changeEvent";
-
-function initUploadAdaptor(editor) {
- editor.plugins.get("FileRepository").createUploadAdapter = (loader) => {
- return new UploadAdapter(loader);
- };
-}
-
-export default class Editor {
- constructor(element, options) {
- const self = this;
- this.element = element;
- this.options = options;
- ClassicEditor.create(element, this.buildCke5Options())
- .then((editor) => {
- self._init(editor);
- })
- .catch((error) => {
- console.error(error);
- });
- }
-
- buildCke5Options() {
- let options = this.getDefaultOptions();
- options = this._applyProfile(options);
- options = this._applyStyleSet(options);
- options = this._applyHeadings(options);
- options = this._applyLang(options);
-
- return options;
- }
-
- getDefaultOptions() {
- return {
- heading: {
- options: [
- { model: "paragraph", title: "Paragraph", class: "" },
- {
- model: "heading2",
- view: "h2",
- title: "Heading 2",
- class: "",
- },
- {
- model: "heading3",
- view: "h3",
- title: "Heading 3",
- class: "",
- },
- ],
- },
- htmlSupport: {
- allow: [
- {
- name: /.*/,
- attributes: true,
- classes: true,
- styles: true,
- },
- ],
- },
- extraPlugins: [initUploadAdaptor],
- plugins: [
- Alignment,
- Autoformat,
- AssetManager,
- BlockQuote,
- Bold,
- Essentials,
- FindAndReplace,
- FontColor,
- FontFamily,
- FontSize,
- GeneralHtmlSupport,
- Heading,
- Image,
- ImageCaption,
- ImageInsertViaUrl,
- ImageStyle,
- ImageToolbar,
- ImageResizeEditing,
- ImageResizeHandles,
- ImageUpload,
- Indent,
- Italic,
- Link,
- LinkTarget,
- List,
- MediaEmbed,
- Paragraph,
- PasteAjax,
- PictureEditing,
- RemoveFormat,
- SourceEditing,
- SpecialCharacters,
- SpecialCharactersEssentials,
- Style,
- Table,
- TableCaption,
- TableCellProperties,
- TableColumnResize,
- TableProperties,
- TableToolbar,
- TextTransformation,
- Undo,
- ],
- toolbar: {
- items: [
- "heading",
- "|",
- "bold",
- "italic",
- "bulletedList",
- "numberedList",
- "removeFormat",
- "|",
- "outdent",
- "indent",
- "undo",
- "redo",
- "|",
- "link",
- "insertImage",
- "insertTable",
- "mediaEmbed",
- "specialCharacters",
- "|",
- "findAndReplace",
- "sourceEditing",
- ],
- shouldNotGroupWhenFull: true,
- },
- language: {
- ui: "en",
- content: "en",
- },
- image: {
- toolbar: [
- "imageTextAlternative",
- "toggleImageCaption",
- "|",
- "imageStyle:inline",
- "imageStyle:block",
- "imageStyle:side",
- "|",
- "editImage",
- ],
- insert: {
- integrations: ["upload", "assetManager"],
- },
- },
- table: {
- defaultHeadings: { rows: 1 },
- contentToolbar: [
- "tableColumn",
- "tableRow",
- "mergeTableCells",
- "tableProperties",
- "tableCellProperties",
- ],
- },
- };
- }
-
- _init(editor) {
- this.editor = editor;
- const self = this;
- if (
- undefined !== this.options.styleSet &&
- this.options.styleSet.length > 0
- ) {
- editor.ui.element.classList.add(`ems-styleset-${this.options.styleSet}`);
- }
- if (
- undefined !== this.options.onChangeEvent &&
- this.options.onChangeEvent.length > 0
- ) {
- editor.editing.view.document.on(this.options.onChangeEvent, () => {
- self._change();
- });
- }
- if (undefined !== this.options.height && this.options.height > 0) {
- editor.editing.view.change((writer) => {
- writer.setStyle(
- "height",
- `${this.options.height}px`,
- editor.editing.view.document.getRoot(),
- );
- });
- }
- }
-
- _change() {
- this.editor.updateSourceElement();
- const event = new ChangeEvent(this.element);
- event.dispatch();
- }
-
- _applyStyleSet(options) {
- if (undefined === this.options.styleSet || this.options.styleSet === 0) {
- options.toolbar.items = options.toolbar.items.filter(
- (e) => e !== "style",
- );
- return options;
- }
- const styleSet = this.options.styleSet;
- if (
- undefined === document.body.dataset.wysiwygInfo ||
- document.body.dataset.wysiwygInfo.length === 0
- ) {
- options.toolbar.items = options.toolbar.items.filter(
- (e) => e !== "style",
- );
- return options;
- }
- const config = JSON.parse(document.body.dataset.wysiwygInfo);
- if (undefined === config.styles || config.styles.length === 0) {
- options.toolbar.items = options.toolbar.items.filter(
- (e) => e !== "style",
- );
- return options;
- }
- for (let i = 0; i < config.styles.length; ++i) {
- if (
- config.styles[i].name !== styleSet ||
- undefined === config.styles[i].config
- ) {
- continue;
- }
- if (!options.toolbar.items.includes("style")) {
- options.toolbar.items.unshift("style");
- }
- options.style = {
- definitions: config.styles[i].config,
- };
- break;
- }
- return options;
- }
-
- _applyHeadings(options) {
- if (
- undefined === this.options.formatTags ||
- this.options.formatTags.length === 0
- ) {
- return options;
- }
-
- try {
- const formatTags = JSON.parse(this.options.formatTags);
- options.heading.options = formatTags;
- } catch (e) {
- console.error(
- `The format tags option expect an JSON, did you migrated it? Got: ${this.options.formatTags}`,
- );
- }
-
- return options;
- }
-
- _applyLang(options) {
- if (undefined !== this.options.lang && this.options.lang.length > 0) {
- options.language.content = this.options.lang;
- }
- return options;
- }
-
- _applyProfile(options) {
- if (
- undefined === document.body.dataset.wysiwygInfo ||
- (document.body.dataset.wysiwygInfo === 0) | length
- ) {
- return options;
- }
-
- try {
- const profile = JSON.parse(document.body.dataset.wysiwygInfo);
- if (typeof profile.config !== "object") {
- return options;
- }
-
- return { ...options, ...profile.config };
- } catch (e) {
- console.error(`Impossible to apply the WYSIWYG profile: ${e}`);
- }
-
- return options;
- }
-}
diff --git a/EMS/admin-ui-bundle/assets/src/core/plugins/wysiwyg.js b/EMS/admin-ui-bundle/assets/src/core/plugins/wysiwyg.js
index aad2ca1e1..3e9a19ea1 100644
--- a/EMS/admin-ui-bundle/assets/src/core/plugins/wysiwyg.js
+++ b/EMS/admin-ui-bundle/assets/src/core/plugins/wysiwyg.js
@@ -1,39 +1,39 @@
import Editor from '../helpers/editor'
class WYSIWYG {
- editors = []
+ editors = []
- load(target) {
- this.loadInAdminUI(target)
- this.loadInRevision(target)
- }
+ load(target) {
+ this.loadInAdminUI(target)
+ this.loadInRevision(target)
+ }
- loadInRevision(target) {
- const wysiwygs = target.querySelectorAll('.ckeditor_ems')
- for (let i = 0; i < wysiwygs.length; ++i) {
- this.createEditor(wysiwygs[i], {
- onChangeEvent: 'keyup',
- styleSet: wysiwygs[i].dataset.stylesSet,
- formatTags: wysiwygs[i].dataset.formatTags,
- contentCss: wysiwygs[i].dataset.contentCss,
- height: wysiwygs[i].dataset.height,
- referrerEmsId: wysiwygs[i].dataset.referrerEmsId,
- tableDefaultCss: wysiwygs[i].dataset.tableDefaultCss,
- lang: wysiwygs[i].dataset.lang
- })
- }
+ loadInRevision(target) {
+ const wysiwygs = target.querySelectorAll('.ckeditor_ems')
+ for (let i = 0; i < wysiwygs.length; ++i) {
+ this.createEditor(wysiwygs[i], {
+ onChangeEvent: 'keyup',
+ styleSet: wysiwygs[i].dataset.stylesSet,
+ formatTags: wysiwygs[i].dataset.formatTags,
+ contentCss: wysiwygs[i].dataset.contentCss,
+ height: wysiwygs[i].dataset.height,
+ referrerEmsId: wysiwygs[i].dataset.referrerEmsId,
+ tableDefaultCss: wysiwygs[i].dataset.tableDefaultCss,
+ lang: wysiwygs[i].dataset.lang
+ })
}
+ }
- loadInAdminUI(target) {
- const wysiwygs = target.querySelectorAll('.ckeditor')
- for (let i = 0; i < wysiwygs.length; ++i) {
- this.createEditor(wysiwygs[i])
- }
+ loadInAdminUI(target) {
+ const wysiwygs = target.querySelectorAll('.ckeditor')
+ for (let i = 0; i < wysiwygs.length; ++i) {
+ this.createEditor(wysiwygs[i])
}
+ }
- createEditor(element, options = {}) {
- this.editors.push(new Editor(element, options))
- }
+ createEditor(element, options = {}) {
+ this.editors.push(new Editor(element, options))
+ }
}
export default WYSIWYG
diff --git a/EMS/admin-ui-bundle/assets/src/core/plugins/wysiwyg.ts b/EMS/admin-ui-bundle/assets/src/core/plugins/wysiwyg.ts
deleted file mode 100644
index b8207d4a1..000000000
--- a/EMS/admin-ui-bundle/assets/src/core/plugins/wysiwyg.ts
+++ /dev/null
@@ -1,38 +0,0 @@
-class WYSIWYG {
- editors = [];
-
- load(target) {
- this.loadInAdminUI(target);
- this.loadInRevision(target);
- }
-
- loadInRevision(target) {
- const wysiwygs = target.querySelectorAll(".ckeditor_ems");
- for (let i = 0; i < wysiwygs.length; ++i) {
- this.createEditor(wysiwygs[i], {
- onChangeEvent: "keyup",
- styleSet: wysiwygs[i].dataset.stylesSet,
- formatTags: wysiwygs[i].dataset.formatTags,
- contentCss: wysiwygs[i].dataset.contentCss,
- height: wysiwygs[i].dataset.height,
- referrerEmsId: wysiwygs[i].dataset.referrerEmsId,
- tableDefaultCss: wysiwygs[i].dataset.tableDefaultCss,
- lang: wysiwygs[i].dataset.lang,
- });
- }
- }
-
- loadInAdminUI(target) {
- const wysiwygs = target.querySelectorAll(".ckeditor");
- for (let i = 0; i < wysiwygs.length; ++i) {
- this.createEditor(wysiwygs[i]);
- }
- }
-
- async createEditor(element, options = {}) {
- const Editor = await import("../helpers/editor.ts");
- this.editors.push(new Editor.default(element, options));
- }
-}
-
-export default WYSIWYG;