Monaco Speech Editor is an online code editor for visually impaired people. It provides several built-in functions to make it easy to read, edit and compile.
Try the editor out on my website.
Since this web application was written with pure JS and didn't use any framework, it is easy to run locally.
First, download the repository.
git clone https://github.com/luochang212/monaco-speech-editor.git
Then, open monaco-speech-editor.
Now, click index.html, it will open in your browser.
File Manager:
- Create a file
- Delete a file
- Rename a file
- Upload a file
- Download a file
- Restore a file
Console:
- Display HTML file in an iframe
- Display HTML file in a new tab
- Display HTML file in a new window
- Display the output of console.log()
Themes:
- Day mode
- Night mode
Accessibility:
-
Toolbar: Including Syntax highlighting, Jump to line, play previous line, Play current line, Play next line.
-
Reading mode: Including Character Mode, Code Mode, Music Mode, Overview mode.
-
Spotlight: It is a list of settings that allows you to turn on or turn off settings.
-
Linear Index: It is a list of features and corresponding hotkeys.
If you are a visually impaired user, Please open the website above and add a router #tutorial after the address to play an audio tutorial automatically. PS: this audio might not be played on google chrome because of the policy of google chrome.
If you are a person with normal vision, Please open the website above and add a router #mute to disable any autoplay event.
Complete list of routers
| Router | Setting |
|---|---|
| #load-demo | Load demo |
| #dark | Turn on night mode |
| #full-screen | Full screen |
| #run | Open console bar |
| #tutorial | Play audio tutorial |
| #spotlight | Turn on spotlight |
| #linear-index | Turn on linear index |
| #character-mode | Turn on character mode |
| #code-mode | Turn on code mode |
| #overview-mode | Turn on overview mode |
| #voice-feedback | Turn on voice feedback |
| #voice-cue | Turn on voice cue |
| #mute | Disable any autoplay event |
| #dark&run | Turn on night mode and console bar |
| #dark&mute | Turn on night mode and disable any autoplay event |
❓Is the editor supported in mobile browsers or mobile web app frameworks?
No, both Monaco Editor and Web Speech API can't work well on mobile browser.
❓How to use routers to configure the initial setting？
For example, If you open https://luochang212.github.io/gadget/monaco-speech-editor/#dark&mute. Monaco Speech Editor will turn on night mode and disable any autoplay event for you.
MIT License