This is purely an exercise in self improvement and education.I am trying to implement an extension for a vi-like text editor within a browser. Can anyone give any advice or pointers as to where and how I should start?
4
If you’re looking to implement a code editor in the browser it’s worth looking at the CodeMirror and the Ajax ACE projects. ACE is more fully featured, CodeMirror is lighter weight.
If nothing else, they should demonstrate that doing this well is a far from trivial job!
Short Answer: There are number of open-source text editors in the market. I would grab one and look at their code base. Improve it if you can, and share back with community.
For example, if you are using a CMS based framework system like Joomla, you may look at variety of editor tools here.
You may also look and select from variety of jQuery based text-editors from – 10 jQuery and non-jQuery javascript Rich Text Editors
Writing an editor to run inside a browser is not that different.
Use Javascript. Use a <div>
to render your buffer; when you update its contents or alter styles of elements inside it, the browser will repaint it for you. Quite probably, in a line-oriented vi-like editor it’s convenient to have every line in a separate nested div
, too.
Use onkeydown
, onclick
and other such event handlers to react on user actions.
The rest is up to you.