CODE EDITOR

Code editor prefab is designed in wavemaker to simplify and speed up typing of source code with features such as syntax highlightingindentationautocomplete and brace matching functionality. The code editor is implemented using Ace plugin.

ACE PLUGIN

Ace is an embeddable code editor written in JavaScript. It matches the features and performance of native editors such as Sublime, Vim, etc. It can be easily embedded in any web page and JavaScript application. Ace is maintained as the primary editor for Cloud9 IDE and is the successor of the Mozilla Skywriter (Bespin) project.

FEATURES OF ACE PLUGIN

  • Syntax highlighting for over 110 languages (TextMate/Sublime Text.tmlanguage files can be imported)
  • Automatic indent and outdent
  • An optional command line
  • Handles huge documents (four million lines seems to be the limit!)
  • Fully customizable key bindings including vim and Emacs modes
  • Search and replace with regular expressions
  • Highlight matching parentheses
  • Toggle between soft tabs and real tabs
  • Live syntax checker (currently JavaScript/CoffeeScript/CSS/XQuery)
  • Cut, copy, and paste functionality

IMPLEMENTATION

Ace jquery plugin plays an important role in this prefab. This jquery plugin is included in index.html of the project. A java service is created to read the content of the file and Ace plugin methods are called in javascript to display the content in the editor which matches the features and performance of native editors such as Sublime, Vim, and TextMate. The following methods are called to display the content in the editor