diff --git a/index.html b/index.html index 9158c7ce..19b5e4f7 100644 --- a/index.html +++ b/index.html @@ -330,11 +330,9 @@ var MyNewFoldMode = require("./folding/mynew").MyNewFoldMode; var Mode = function() { // set everything up - var highlighter = new MyNewHighlightRules(); + this.HighlightRules = MyNewHighlightRules; this.$outdent = new MatchingBraceOutdent(); this.foldingRules = new MyNewFoldMode(); - - this.$tokenizer = new Tokenizer(highlighter.getRules()); }; oop.inherits(Mode, TextMode); @@ -343,9 +341,8 @@ oop.inherits(Mode, TextMode); this.lineCommentStart = "//"; this.blockComment = {start: "/*", end: "*/"}; - // Extra logic goes here--we won't be covering all of this - - /* These are all optional pieces of code! + // special logic for indent/outdent. + // By default ace keeps indentation of previous line this.getNextLineIndent = function(state, line, tab) { var indent = this.$getIndent(line); return indent; @@ -358,14 +355,17 @@ oop.inherits(Mode, TextMode); this.autoOutdent = function(state, doc, row) { this.$outdent.autoOutdent(doc, row); }; - + + // create worker for live syntax checking this.createWorker = function(session) { var worker = new WorkerClient(["ace"], "ace/mode/mynew_worker", "NewWorker"); worker.attachToDocument(session.getDocument()); - + worker.on("errors", function(e) { + session.setAnnotations(e.data); + }); return worker; }; - */ + }).call(Mode.prototype); exports.Mode = Mode; @@ -499,7 +499,7 @@ var fonts = lang.arrayToMap(
npm install to install required dependencies.node tmlanguage.js <path_to_tmlanguage_file>; for example, node <path_to_tmlanguage_file> /Users/Elrond/elven.tmLanguageTwo files are created and placed in lib/ace/mode: one for the language mode, and one for the set of highlight rules. You will still need to add the code into kitchen_sink.html and demo.js, as well as write any tests for the highlighting.
+Two files are created and placed in lib/ace/mode: one for the language mode, and one for the set of highlight rules. You will still need to add the code into ace/ext/modelist.js, and add a sample file for testing.
Your .tmlanguage file will then be converted to the best of the converter’s ability. It is an understatement to say that the tool is imperfect. Probably, language mode creation will never be able to be fully autogenerated. There's a list of non-determinable items; for example:
The best way to test your tokenizer is to see it live, right? To do that, you'll want to modify the live Ace demo to preview your changes. You can find this file in the root Ace directory with the name kitchen-sink.html.
-The file that defines the behavior for this live demo is defined in demo/kitchen-sink/demo.js. You'll want to add lines to two separate objects:
modesByName needs a new entry that defines all the rules regarding your new mode. Entries looks like propertyName: [dropdownName, arrayOfExtensions], where:
propertyName is the name of the new language you're highlightingdropdownName is an arbitrary string that lists your language in the live demo's Mode dropdown menuarrayOfExtensions is an array of strings (seperated by |) that defines valid extensions to use for the new language. supportedModes in ace/ext/modelist.js
docs also needs a new entry, which defines the location of your sample document showing all the power of your new language. Entries look like filenamePath: modeToUse, where:
filenamePath is the path to your example document. This should just be in docs/.modeToUse is the same arbitrary string as dropdownNameadd a sample file to demo/kitchen-sink/docs/ with same name as the mode file
Once you set this up, you should see be able to witness a live demonstration of your new highlighter.
+Once you set this up, you should be able to witness a live demonstration of your new highlighter.
Adding automated tests for a highlighter is trivial so you are not required to do it, but it can help during development.
In lib/ace/mode/_test create a file named with some example code. (You can skip this if the document you have added in text_<modeName>.txtdemo/docs both looks good and covers various edge cases in your language syntax).