WYSIWYG

It’s Friday, and that means it’s time for the third project in my open source fortnight. This one is a simple WYSIWYG text style editor that uses contenteditable for its rendering.

WYSIWYG

The library allows you to apply basic styles, such as bold and italic to a contenteditable HTML element. You can then read the HTML straight from that element. It’s written in CoffeeScript in a MVC ‘controller’ style and its only dependency is jQuery.

Content editable is a fickle beast, with an archaic API and poorly documented functionality. However in modern browsers, it does produce good HTML and is certainly a viable WYSIWYG solution.

I find the secret to creating WYSIWYGs (or software in general for that matter), is to keep things as simple as possible. That said, this library could certainly improve in a number of areas. For example:

  1. Have a way of overriding the alert() notices
  2. Show selected styles (this may be harder to do than I first anticipated)
  3. Cross-browser keyboard shortcuts

In the spirit of open source fortnight I’m releasing it to the community. I’m excited to see where it goes next.

 
218
Kudos
 
218
Kudos

Read this next

Abba - JavaScript a/b testing

Abba is a self-hosted a/b testing framework built to help improve conversion rates on your site. Tuning signup and payment forms can have huge effects on your business, and it’s a good idea to supplement design and copy changes... Continue →