The last big part of the Roundcube user interface not yet ported to Elastic was the HTML editor. And it was left untouched for so long for a reason. Read more to find out why and what I achieved throughout the last week.
The TinyMCE editor we use is probably the best open source HTML editor available (competing close with CKEditor). However its architecture or some techniques used to draw the UI look very old (and still buggy). So, it wasn’t an easy task to apply some styles to make it look (and behave) “elastic”. No wonder the old skin uses unmodified theme.
I also redesigned our image selector to look more unified with the rest (i.e. other upload forms).
TinyMCE isn’t really usable on mobile. Even the experimental mobile mode (available in v4.7) wasn’t what I’d expect. I did it in the Elastic-way. So, dialogs are nice, the toolbar is simplified and some elements are bigger. There’s still place for improvements. E.g. menus and selection lists are not displayed as other mobile (side-)menus. And some more refinements to elements size for touch devices will be needed.
To conclude, the more I work with TinyMCE in Roundcube the more thoughts I have like this: Do we really need all these editing features? Could we replace it with something simpler and modern? Could we get rid of HTML vs Plain text mode switching at all? Sounds like a big undertaking with a lot of research and planning, right? Something to think about in another time.