Rich text collaborative editors?

1,019 views
Skip to first unread message

Eric Eslinger

unread,
Oct 21, 2014, 6:32:52 PM10/21/14
to ang...@googlegroups.com
Not strictly an angularjs question, but I wonder if anyone has had any experience with rich text (possibly collaborative) editors?

I'm building what can be thought of as a special-case CMS.

I specifically need:

1) rich text entry (not markdown - it's a user issue)
2) table editing (at least basic tables)
3) extensibility (to add angular additions to the editor interface, ideally)
4) collaborative features (operational transforms, etc)
5) my own backend (no firebase)

I know that this is asking a lot. I have 1 4 and 5 in QuillJs more or less out of the box. The rich text support is good, it's moderately extensible (and looks like that will improve a lot as they approach 1.0), and I've gotten a prototype-grade collaborative editing system built by wiring the editor into socket.io as QuillJS emits delta events that are more or less Operational Transform packets. If nothing else, this lets a few users edit the same page without worrying about locks and clobbering. 

The extensibility isn't great, as it's pure jquery, so I would need to shift gears to add or change behavior and the last time I looked (a few versions back), it wasn't really modular in the sense that I could add new behaviors to the editor.

Table editing is the real killer here- my users are demanding this feature. Doesn't have to be <table> items, of course, but they really want a tabular layout. 

I've fiddled around with some other editors, but nothing comes close to Quill in terms of good rich-text OT support (all the other collab editors I've seen required the user to edit in plain text, and then maybe used markdown parsing to generate a rich text). 

So, before I go off to my cave to build something on my own, I'm wondering: anybody have any suggestions?

Eric


Sander Elias

unread,
Oct 25, 2014, 2:39:26 AM10/25/14
to ang...@googlegroups.com
Hi Eric,


There are ton's of those editors out there, I haven't seen one without issues. The hard part is finding one where your project and the issues don't collide :)
I know quite s few, but it would have been helpful if you would have put in a list of the ones you already considered!

ok, just the plain links, in no particular order:

http://www.tinymce.com/

And this list is far from complete. TinyMCE has everything you asked for you asked for for sure. I used it in the past. Its an heavy load on your app though.
I know there are a few that already some form of angular integration. If I'm up to speed again I might even remember some more. I know there is a 
particular one, that has a really nice page integration, but the name eludes me for the moment.

Regards
Sander





Eric Eslinger

unread,
Oct 25, 2014, 12:42:16 PM10/25/14
to ang...@googlegroups.com
Yeah, I've checked out a lot of those, and I agree on TinyMCE. We used both TinyMCE and CKEdit, and both sure are huge. The big problem I am wrestling with is the collaborative part. QuillJS http://quilljs.com is built on an operational transform model for rich text, meaning that it is at least feasible to consider realtime collaboration based on that editor. It does not, however, support tables. At this point the decision looks like:

  • spend a lot of time figuring out how to put a table model into the QuillJS's rich text OT datatype
  • accept that there's no table editing in my collaborative editor
  • accept that there's no collaborating in my table editor
The last option would be a real bummer, as it means I have to build locks and clobbering into my otherwise pretty multiuser, multieditor CMS functionality.

Maybe I could finesse it and have some kind of purpose-built table-only editor as a plugin, and make the tables locked and clobbered

e

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.

Sachin Rekhi

unread,
Feb 13, 2016, 9:20:15 PM2/13/16
to AngularJS
Eric,

I came across this post from 2014 and am having the exact same debate today you had between leveraging Quill w/o table support & getting collaborative editing or leveraging TinyMCE and losing the ability to do collaborative editing.

I was curious if you had an update on what you ultimately decided to do for this project? Were you able to add table support to Quill? Or if you came across any other solutions that avoided some of these trade-offs? Any tips would be greatly appreciated!

Thanks!
Sachin

Mickael Bailly

unread,
Feb 17, 2016, 2:49:26 AM2/17/16
to AngularJS
Hello Sachin,

we are investigating this type of features too, and there are lots of projects, all work in progress. Here are the projects I find interesting:

https://github.com/y-js/y-richtext is a layer on top of YJS to bridge it with quill.
https://github.com/xwiki-labs/cryptpad is using ckeditor, with the blockchain algorithm and an HTML diff/patch algorithm.

I hope you'll find something in there.

Regards
Reply all
Reply to author
Forward
0 new messages