Experience using ACE Editor with a language implemented in ANTLR

[Mike Cargal]

I'm looking to set up a web-based IDE for a proprietary language used by my company.  I have the compiler implemented in Java using ANTLR, and am looking to leverage the JavaScript target to be able to provide syntax checking (perhaps code completion) in the ACE editor within the browser.  (I also have other places I'll use the parser in more graphical editor capability to come).

Has anyone had any experience trying to integrate the JavaScript target into ACE language modes?

ANY help; pointers to a post somewhere, you name it, are appreciated.

I have posted a related question in the ACE editor support group, but if anyone happens to have ANTLR specific experience and can point me down the right road, that would be doubly appreciated.

[Eric Vergnaud]

Hi Mike,

I'm in the exact same process, and I have the beginning of a working ACE editor for my language.

Happy to share the effort offline.

Eric

[Luis Daniel]

Hi Mike and Eric

I'm in this process too, but I have yet to achieve syntax checking.

How did you guys do the antlr import having global variable require already defined? (ace implicitly uses other require I suppose)
I'm kind of stuck with that issue. Any help would be really useful.

[Eric Vergnaud]

You can use this:

https://github.com/antlr/antlr4/blob/master/runtime/JavaScript/src/lib/require.js

Eric

[Himasha Guruge]

Hi Eric,

Could you please explain what is done in these 2 lines of https://github.com/antlr/antlr4/blob/master/doc/ace-javascript-target.md?

var Honey = { 'requirePath': ['..'] }; // walk up to js folder, see Honey docs
importScripts("../lib/require.js");

what should be in {'requirePath': ['..'] }; ? should it be the path to  https://github.com/antlr/antlr4/blob/master/runtime/JavaScript/src/lib/require.js ?

[Himasha Guruge]

On Thursday, October 6, 2016 at 6:32:14 PM UTC+5:30, Himasha Guruge wrote:

Hi Eric,

Could you please explain what is done in these 2 lines of https://github.com/antlr/antlr4/blob/master/doc/ace-javascript-target.md?

var Honey = { 'requirePath': ['..'] }; // walk up to js folder, see Honey docs
importScripts("../lib/require.js");

what should be in {'requirePath': ['..'] }; ? should it be the path to  https://github.com/antlr/antlr4/blob/master/runtime/JavaScript/src/lib/require.js ?

Also from where is 'importScripts' coming from? It seems to fail loading all the time...

[Eric Vergnaud]

Hi,

the 'requirePath' lists the paths on the server relative to 'require.js' where other scripts may be found when calling require().

importScripts is a standard web worker method, see https://developer.mozilla.org/fr/docs/Web/API/WorkerGlobalScope/importScripts.

this only works in a web worker, not in the browser UI.

Eric

[Himasha Guruge]

Thanks for the explanation Eric. Just one more issue to figure out. Now antlr is loading fine, but when I try to load my custom language there is an issue, because in my custom lexer/parser files I'm importing antlr like 'var antlr4 = require('lib/antlr4/lindex'); so this is giving an error because of ace require context.  In the doc it is stated "Assuming that your language files (generated or hand-built) are in a folder with an index.js file that calls require for each file, your parser loading code can be as simple as follows". 

I get that we can pack all custom files through an index, but how are we going to solve the referring to antlr here? Can we once again use Honey and do it?

[Himasha Guruge]

Got it sorted.

[Himasha Guruge]

Hi Mike,

Were you able to overcome the ANTLR errorListener issue? As in how did you pass the validation errors to ace editor? I tried what is explained in https://github.com/antlr/antlr4/blob/master/doc/ace-javascript-target.md  , the 'annotations' array get filled but it doesn't return the annotations because the ANTLR console error still lists those errors in the console.

[Mike Cargal]

You’ll need to set up your own Error Listener and add the errors to the ACE editor annotations.  It works just fine.

Let me know if you need more details. 

--
You received this message because you are subscribed to the Google Groups "antlr-discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email to antlr-discussi...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Himasha Guruge]

Hi Mike,

Thanks, got it to work. I have embedded Ace with the pre packed src-min folder added to my project. For code folding I need to add the new folding .js file... In 'src-min' folder how/where should I add this file to?

[Mike Cargal]

I’m not quite sure that there’s a “correct” answer to where you should put that file.  I would suggest that the logic be in the web worker, passing the fold info back to the UI process.