1 files changed, 31 insertions, 6 deletions

diff --git a/src/edit.js b/src/edit.js
index c1018d7..ed89de1 100644
--- a/src/edit.js
+++ b/src/edit.js
@@ -9,6 +9,31 @@ import 'codemirror/addon/search/searchcursor';
 import 'codemirror/addon/search/jump-to-line';
 import 'codemirror/addon/dialog/dialog';
 import 'codemirror/addon/dialog/dialog.css';
+import 'codemirror/addon/mode/overlay';
+import 'codemirror/addon/mode/simple';
+
+CodeMirror.defineSimpleMode('wcms', {
+    start: [
+        {
+            regex: /%(?:HEADER|NAV|ASIDE|MAIN|FOOTER|SUMMARY|LIST|MEDIA)(?:\?(?:[^ &]+=[^ &]+&?)+)?%/,
+            token: 'wcms',
+        },
+    ],
+});
+
+CodeMirror.defineMode('wcms-markdown', (config, parserConfig) => {
+    return CodeMirror.overlayMode(
+        CodeMirror.getMode(config, parserConfig.backdrop || 'markdown'),
+        CodeMirror.getMode(config, 'wcms')
+    );
+});
+
+CodeMirror.defineMode('wcms-html', (config, parserConfig) => {
+    return CodeMirror.overlayMode(
+        CodeMirror.getMode(config, parserConfig.backdrop || 'htmlmixed'),
+        CodeMirror.getMode(config, 'wcms')
+    );
+});
 
 /** @type {HTMLFormElement} */
 let form;
@@ -39,7 +64,7 @@ window.addEventListener('load', () => {
 
     editors = [
         CodeMirror.fromTextArea(document.getElementById('editmain'), {
-            mode: 'markdown',
+            mode: 'wcms-markdown',
             lineNumbers: true,
             lineWrapping: true,
             extraKeys: { 'Alt-F': 'findPersistent' },
@@ -50,31 +75,31 @@ window.addEventListener('load', () => {
             extraKeys: { 'Alt-F': 'findPersistent' },
         }),
         CodeMirror.fromTextArea(document.getElementById('editheader'), {
-            mode: 'markdown',
+            mode: 'wcms-markdown',
             lineNumbers: true,
             lineWrapping: true,
             extraKeys: { 'Alt-F': 'findPersistent' },
         }),
         CodeMirror.fromTextArea(document.getElementById('editnav'), {
-            mode: 'markdown',
+            mode: 'wcms-markdown',
             lineNumbers: true,
             lineWrapping: true,
             extraKeys: { 'Alt-F': 'findPersistent' },
         }),
         CodeMirror.fromTextArea(document.getElementById('editaside'), {
-            mode: 'markdown',
+            mode: 'wcms-markdown',
             lineNumbers: true,
             lineWrapping: true,
             extraKeys: { 'Alt-F': 'findPersistent' },
         }),
         CodeMirror.fromTextArea(document.getElementById('editfooter'), {
-            mode: 'markdown',
+            mode: 'wcms-markdown',
             lineNumbers: true,
             lineWrapping: true,
             extraKeys: { 'Alt-F': 'findPersistent' },
         }),
         CodeMirror.fromTextArea(document.getElementById('editbody'), {
-            mode: 'htmlmixed',
+            mode: 'wcms-html',
             lineNumbers: true,
             extraKeys: { 'Alt-F': 'findPersistent' },
         }),