Use a compatible browser (currently Chrome, Chromium and Edge) and one of these links, depending on which language you want the IDE to open in:
To customise start-up, you add further options after ? in the URL, separated by & and including no spaces, for example:
https://elan-lang.org?profile=1.0
Code does not parse as Elan.https://elan-lang.org?profile=1.0
Code does not parse as Elan.https://elan-lang.org?profile=1.0
Code does not parse as Elan.https://elan-lang.org?profile=1.0
Code does not parse as Elan.https://elan-lang.org?profile=1.0
Code does not parse as Elan.https://elan-lang.org?lang=python&cvd=1
Code does not parse as Elan.https://elan-lang.org?lang=python&cvd=1
Code does not parse as Elan.https://elan-lang.org?lang=python&cvd=1
Code does not parse as Elan.https://elan-lang.org?lang=python&cvd=1
Code does not parse as Elan.https://elan-lang.org?lang=python&cvd=1
Code does not parse as Elan.TODO
<Watch the video: Navigate around the IDE
Always use the browser in 'full screen mode' – it makes more space available and is safer.
To change the text size, hold down the Ctrl key and use the mouse scroll wheel, or change the magnification via the browser's zoom menu.
If an area has a blue tinted background, it does not have browser 'focus' and will not respond to keyboard input. Use keyboard shortcuts or mouse or touch gestures to change the focus (which is indicated by a white background):
| To focus on... | Keyboard shortcut | Mouse gesture | Notes |
|---|---|---|---|
| code editor | Ctrl+e | Click on background within editor | See also Browse code |
| display | Ctrl+d | Click on the 'display' tab | To clear the display pane, use the clear button shown within it |
| info | Ctrl+i | Click on the 'info' tab | To clear the Info pane, use the clear button shown within it |
| help | Ctrl+h | Click on the 'help' tab | to open a list of links to documents |
| worksheet | Ctrl+k | Click on the 'worksheet' tab | (Ctrl+w is interpreted by the browser as 'leave web site') |
| a button | Ctrl+b | Click on the button | Ctrl+b puts focus on the first active button Use Tab or Shift+Tab to navigate to another active button |
Watch the video: Load, run, and save programs
To access the demo or file menus via the keyboard:
| Intention | Menu action | Notes |
|---|---|---|
| load a demo program | demo then select desired program | |
| load a program file | file > load | if the editor contains unsaved code, you will be warned |
| append a file to the current code in the editor | file > append | external code is always appended to the end of the current code, but may then be moved |
| auto save a program file | file > auto save | any subsequent edits will be saved to the file (whenever the code parses) |
| cancel auto-saving | file > cancel auto save | this action appears only after setting up auto save |
| save a program manually | file > manual save | saves the code to file but does not automatically save subsequent changes |
| create a standalone Html page incorporating your program | file > save as standalone | the saved .html file contains the compiled program, and will run automatically when opened |
| To... | Keyboard shortcut | Mouse gesture | Notes |
|---|---|---|---|
| run a program | Ctrl+r | Click on 'run' button | disabled if there are any parse or compile issues. |
| stop a program that is running | Ctrl+s | Click on 'stop' button | Enabled only when the program is running |
If your program is doing intensive processing between interactions with you through the IDE, then clicking on the 'stop' button may not have an immediate effect. This is an unavoidable side effect within the browser, but you will be returned to editing after a short period. Avoid repeatedly clicking 'stop' as that might cause the browser tab to be closed.
See also Debugging programs
Watch the video: Debugging programs
You can debug a running program with or without having set breakpoints.
| To... | Keyboard shortcut | Mouse gesture | Notes |
|---|---|---|---|
| debug a program, or resume debugging a paused program | Ctrl+g | Click on 'debug' button | disabled if there are any parse or compile issues. |
| pause a program that is running | Ctrl+u | Click on 'pause' button | enabled only when program is being debugged |
| step to the next instruction in a paused program | Ctrl+p | Click on 'step' button | enabled only then program is paused |
Whenever the program is paused, all named values (variables, parameters and constant values) that are currently in scope have their values automatically listed in the Info pane. This list may be browsed as follows:
| To... | Keyboard shortcut | Mouse gesture |
|---|---|---|
| navigate to a specific line in the list when paused | Tab, Shift+Tab | Click on the line |
| expand/collapse a specific name within the list | Enter | Click on the + or - at the start of the line |
Before clicking on debug you can set breakpoints at one or more instructions where you want execution to pause. A red flash symbol appears at every instruction that has a breakpoint defined..
When run using debug the program will automatically pause at every breakpoint, and the in-scope named values will be listed in the Info pane.
| To... | Keyboard shortcut | Mouse gesture |
|---|---|---|
| set a breakpoint on a selected instruction | Ctrl+m on a selected instruction keyword then select set breakpoint | right-click for context menu, then select set breakpoint |
| clear existing breakpoints | Ctrl+m on a selected instruction keyword, then select clear breakpoint or clear all breakpoints | right-click for context menu, then select clear breakpoint or clear all breakpoints |
Where a keyboard shortcut is shown with the Ctrl control key, users of Apple's macOS should use the ⌘ Command key instead.
There are two ways in which to change the colour scheme for users with CVD: