Forum OpenACS Development: Re: CKEditor 5

Collapse
5: Re: CKEditor 5 (response to 4)
Posted by Antonio Pisano on
We will see what we can do, maybe we can try to wrap up what we do on LEARN.

In the meantime, TinyMCE own plugins for multimedia do work, but without a backend they will store files as base64 into the document.

A cheap approach, that we also applied to some use case, is to extract this base64 content on the server side and create a file on the fly, e.g. in the file-storage.

Just ideas for the impatients for now 😊

Collapse
6: Re: CKEditor 5 (response to 5)
Posted by Gustaf Neumann on
One should not use the file-storage (unless fiddling with stale images), but rather use the approach based on attachments and child-resources, as used with ckeditor4. (see ckfinder-procs)
Collapse
7: Re: CKEditor 5 (response to 6)
Posted by Antonio Pisano on
Chances are we can use the same ckfinder backend also for other editors. I will fiddle a bit.
Collapse
8: Re: CKEditor 5 (response to 7)
Posted by Gustaf Neumann on
would be cool. ... it might be moved to some core package (acs-templating or attachments).
Collapse
9: Re: CKEditor 5 (response to 8)
Posted by Antonio Pisano on

In attachments and richtext-tinymce I have implemented something similar to what we have done on LEARN: a generic UI that does not rely on the specific editor API, integrated via a trivial plugin in the editor package.

I have used some of the api from the previous implementation, but to keep the interface "editor agnostic", I could not use any of the "CKEditor tech".

If you have a look at the plugin code for tinymce, there is actually very little going on: it opens an iframe to the attachments page and waits until the iframe sends a message containing the content we are supposed to inject on the page. I expect this to be possible In a very similar way for other editors, e.g. ckeditor5.

To test it, install the latest richtext-tinymce, then in the site-wide DefaultConfig parameter input something like like:

relative_urls "false"
menu "{insert: { title: 'Insert', items: 'oacsAttachments | charmap hr' }}" 
external_plugins {{oacsAttachments: '/resources/richtext-tinymce/plugins/oacsAttachments.js'}}
plugins "oacsAttachments"
toolbar "blocks fontsize | bold italic underline strikethrough forecolor backcolor subscript superscript | link unlink anchor | oacsAttachments | alignleft aligncenter alignright alignjustify numlist bullist | removeformat table hr tlfMathJax | fullscreen code"

(the important is to load the plugin and make it part of menu, toolbar or both somehow)

Let me know if this goes in the right direction.

Ciao

Antonio