This site uses Codemirror
for syntax highlighting.
Sven Weller wrote a great article on how to implement this in Apex: Apex 5 – Region with syntax highlighting
My implementation is a bit different, using a universal Dynamic Action on page 0 instead of the pages themselves. This makes maintenance a bit easier.
The steps I used to get Codemirror to work on this site:
- Create an application item F_CODEMIRROR_VERSION.
Apex 5.0 includes Codemirror 4.4, Apex 5.1 includes Codemirror 5.16. At this moment, this site uses version 5.48.4. By using an item to store the version number, upgrading (and downgrading if needed) becomes a lot easier.
- Fill this item with "5.48.4" (or any other version number you are using) e.g. using an Application Computation.
- When using a newer version than the one included with Apex, copy the entire Codemirror directory to the right location, e.g. #IMAGE_PREFIX#libraries/codemirror/5.48.4
- On your Page Template(s), include the following:
- Function and Global Variable Declaration
- Cascading Style Sheet -> File URLs
- On Page 0, add the codemirror Dynamic Action listed in the Code section below.
- And to use all this, create textarea tags with the new codemirror-% classes, as shown in the Example regions (and Code section) below.
- When using Codemirror for textareas in reports, this dynamic action will not run when changing e.g. the number of rows of the report. That triggers a refresh of the region only, not the entire page, so the dynamic action on page 0 will not run. And the same applies to all other objects that are refreshed/changed dynamically of course.
To get that to work, you'll need a copy of the dynamic action from page 0, put it on the page containg the report, and change the jQuery selector a bit. An example of this can be found on my SQL History page.
Note: Codemirror has some issues with '\' in PL/SQL (and maybe some other formats as well).
In the example below, the first "escape" line causes formatting errors; the second "escape" line has --' at the end to fix this.