Allow Mailbody formating [$100 awarded]

[Offerel]

Steps to reproduce

1. Open Mail App
2. Click on Button "New Message"
3. Type some Text in the Textarea for Mailbody

Expected behaviour

There should be a Buttonbar, which let me format the Mail with the most needed Formats like bold, italic, font color, font size, font name. Maybe its possible to add something like tinymce.

Actual behaviour

Currently, its a pure Textarea, only normal Text could be entered.

Mail app

Mail app version: 0.60

**Mailserver or service: Personal IMAP Server **

Server configuration

Operating system: Raspbian (Debian, Jessie)

Web server: Nginx

Database: MariaDB

PHP version: 5.6

Updated from an older version or fresh install: fresh install

Client configuration

Browser: Firefox 50

Operating system: Windows

---

The $100 bounty on this issue has been claimed at Bountysource.

[jancborchardt]

We talked about this in the past and even had a pull request for it at owncloud-archive/mail#1536
But we decided that this is a lot of work (and a lot to maintain) for little gain at the moment.

And for the record, like I said in that pull request – when we should ever go forward with this: Interface-wise this unobtrusive bar which appears when marking text would be great: https://yabwe.github.io/medium-editor/demo.html (Also used by pretty popular blogging platform Medium)
Instead of using a permanently-visible big button bar which distracts too much when writing the usual emails with no need of formatting.

[Offerel]

Personally, i like more the button bar, but that's not so problematic. Mainly, i write formatted HTML Mails since years and never looked back. Yes I'm a heavy Outlook User but i think, formatting Mails, should be a Optional thing. Some users like it, some need it and some hate it :-)

[jancborchardt]

@Offerel maybe at some point we will do it, but we have lots of other things higher on the priority list (like better performance, moving mails, maybe threading at some point, and fixing bugs). :)

It would be cool if you can help, for example by reviewing pull requests: https://github.com/nextcloud/mail/pulls – it’s very easy, you just check them out and test if stuff works. :)

[ChristophWurst]

So, I've yet again spent a few hours finding a suitable WYSIWYG editor. Here are some notes to the future me to know which ones I don't have to look into again:

• Trumbowyg looks great, but does not support to be loaded as js module, it simply injects itself to the global jQuery, which we don't use.
• Simditor also looks slick good, but apparently it's unmaintained and I also found some security reports that are probably unaddressed
• Quill looks okay-ish but its design doesn't really fit ours. Moreover, code snippets from the official docs didn't work for this app. The editor bar showed up, but the text was not editable.

Most other libs I've found seem to target a specific framework (mostly React, the some Vue and Angular).

[ChristophWurst]

This is so disappointing. TinyMCE claims to work with webpack, if I use it it doesn't do anything anything. The code is exactly the one from the documentation. If I initialize it via the tinymce global it somehow works, though. ☹️

[ChristophWurst]

As much as I personally would love to have a decent editor, I'm giving in on this. I didn't expect this to be that hard.

[Offerel]

Maybe you can try CKEditor. Personally, i like it more than TinyMCE, since TinyMCE is complicated under some circuumstates. Currently, i use both in my Notes Plugin for Roundcube. The user can switch the editor with a config parameter.

[ChristophWurst]

Spent a few minutes on getting CKEditor to run: failed. Basically, it's quite cumbersome to use it with Webpack at the moment: ckeditor/ckeditor5#139 (comment)

[Offerel]

I use CKEditor4. I don't know, if this is better in terms of Webpack.