creating simple editor

i am on the search for ways and pointers to create a simple text editor(cant call it exactly a text editor).the functions of it are described as below...

1. a simple text area where user types commands.
2. commands are my own implementation and not specific to any programming languages..

3. basic commands such as

            drawSqaure(side);
   

4. As the user progresses to the next line of code i want the above code to get reflected in a WYSIWYG panel(as of our example should开发者_如何转开发 draw a circle square) which is a part of editor.

5. Naturally as the editor matures it should help users with the commands(syntax hints) while they type.

can somebody help me out by providing pointers and valuable advices...

Actual motive is to let user type commands and to let them see the changes visually...

is it possible to develop this kind of application and if so is it feasible to use HTML+Javascript for development ????

or is it wise to use build upon some pre-built editors instead of starting from scratch???

This certainly can be done using HTML and javascript, but I doubt there is an out of the box tool that will do all of this for you. I would check out TinyMCE, but you will probably need to put in the work to make things like drawSquare actually render into a canvas.

There are frameworks out there to help with drawing on canvas. I don't know what exactly do you wish to allow your app to do, but there sure is a framework that would be helpful.

See if you like any of these: http://javascript.open-libraries.com/utilities/drawing/10-best-javascript-drawing-and-canvas-libraries/

The idea I see here is surely possible to do with javascript and canvas object, but will require some proficiency to work fast when heavily used.