You can find an online demo here: http://ppr.cs.dal.ca:3002/n3/editor
Using the latest Notation3 grammar, I generated a JS lexer, parser and listener using the ANTLR tool support. See here for more information on how to generate the JS parser.
I then used the JS parsing code to flag errors for a CodeMirror lint-enabled editor. For syntax highlighting, I re-used the Turtle mode, extending it with Notation3 keywords.
The editor has a neat "show AST" function that will print the AST generated by the JS parsing code.
In lieu of a JavaScript Notation3 reasoner, I created a simple server that is called by the editor whenever "execute" is clicked. The server will execute the given formula using either the Eye or Cwm system. It can easily be configured with additional systems, when they become available.
This system requires NodeJS.
Clone the repository and run npm install in the main folder to install the NodeJs packages.
Update the ./config.js file with your hostname, port number and locations of Eye and Cwm executables.
If you simply want to try the editor locally, you can keep the localhost http config (as long as the port number isn't in use).
Update the ./editor/index.html file with the URL of the NodeJs server. If you're following the regular usage, this should simply be the editor's URL minus the editor part (e.g., http://127.0.0.1:3002/n3 for http://127.0.0.1:3002/n3/editor.
If you want to use the server's "link-shortening" service (to more easily share code samples; see usage), you'll need to have a mysql v.8+ database running, with the credentials filled into config.js. Also, you'll have to import the db.sql file. If you don't want to use this service, you can simply comment out the call to n3.link (see editor/index.html) and use the full url (link variable) for the generated link.
Run ./node app.js to start the server.
The server will be accessible at http://<hostname>:<port>/n3, and the editor at http://<hostname>:<port>/n3/editor.
If you're using localhost and port 3002, you will find the server at http://127.0.0.1:3002/n3, and the editor at http://127.0.0.1:3002/n3/editor.
After editing anything inside editor/ folder (aside from the lib/ folder), run npx webpack (requires webpack) to generate dist/main.js. You'll see that index.html directly references dist/main.js as well as the files from the lib/ folder.
Important: n3Parser.js requires a manual edit to make symbolicNames available outside of the module. Below var symbolicNames .. add n3Parser.symbolicNames = symbolicNames;.
Notes:
webpack.config.js. Enabling it will drastically reduce the size of main.js but also make it much harder to debug.You can use shortcuts "alt-x" and "alt-a" to execute the current formula or show its AST, respectively.
You can generate links to share examples of N3 code ("create link to formula"). Currently, this requires URL-encoding the N3 formula, which can lead to very long URLs. Hence, the server is outfitted with a simple "link-shortening" service (a la bit.ly) that will generata a unique 8-letter ID for the generated URL.
This service simply translates the URL-with-ID to the full URL-with-encoded-formula; meaning that the size of the formula will still be limited by the max. length of a URL (around 2000 characters). The service stores each ID with its corresponding full URL in a mysql database together with the timestamp.
E.g. (copy URL in address bar):
Pass a formula and print its AST:
http://ppr.cs.dal.ca:3002/n3/editor/?formula=:i :am :cool .&ast=true
Pass a formula and get its deductive closure from Cwm:
http://ppr.cs.dal.ca:3002/n3/editor/?formula=:i :is :cool . :you :know :i . { :you :know ?a . ?a :is :cool } => { :you :is :cool } .&exec=eye
(short link to formula only: http://ppr.cs.dal.ca:3002/n3/editor/s/RpcS93bN)