noobannotator

This is a Rich Text Editor (based on DraftJs) that allows user to add comments and emoji's into articles.

Features

1. Add Comments and Emoji's into rich text editor

• Hover over the comments (right hand side) or the commented keywords to highlight the corresponding keyword or comment

2. Save the document to the browser's local storage, so that it can be loaded next time

How to use

1. Start editing document
2. To add comments, highlight some text, then click "Comment" button 2.1. To change the comment color, type in any CSS color like "blue" or "#00f" or "#0000ff"
3. To delete a comment, click the Red X button inside the comment dialog's top right hand corner.
4. To Save the document to the browser's local storage, stype in a file name into the editable dropdown control on the top right corner of the window, then select "Create " 4.1. Existing saved documents can also be deleted by clicking the "Delete" button in the droddown menu.

Demo Page:

https://raymond-ong.github.io/noobannotator/

• Best viewed in Desktop browser
• Although it would still work in mobile browsers, it's not as intuitive (e.g. selecting text)

TODO's

• Better placement of the comments (currently just stacking the comments
• Better mobile browser support
• Add in more Rich Text Box features (e.g. Colors, Highlighting, Images)