From 9f3d969508114c692949b55de39277fd6584c7d3 Mon Sep 17 00:00:00 2001
From: n-peugnet <n.peugnet@free.fr>
Date: Thu, 9 Apr 2020 16:43:10 +0200
Subject: feat: Coloration for W synthax in CodeMirror

Closes #54
---
 assets/css/edit.css |  5 +++++
 src/edit.js         | 37 +++++++++++++++++++++++++++++++------
 webpack.config.js   |  2 +-
 3 files changed, 37 insertions(+), 7 deletions(-)

diff --git a/assets/css/edit.css b/assets/css/edit.css
index c7fe67b..17465fa 100644
--- a/assets/css/edit.css
+++ b/assets/css/edit.css
@@ -379,6 +379,11 @@ div#showthumbnail img {
     cursor: text;
 }
 
+/* CodeMirror Wcms mode */
+.cm-wcms {
+    color: red;
+}
+
 
 @media (max-width: 600px) {
     .bar, .hidephone {
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' },
         }),
diff --git a/webpack.config.js b/webpack.config.js
index f6af5a3..6611148 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -6,7 +6,7 @@ module.exports = (env) => {
 		// Environment dependent
 		mode: env == 'dev' ? 'development' : 'production',
 		devtool: env == 'dev' ?
-			'cheap-eval-source-map' :
+			'eval-cheap-module-source-map' :
 			env == 'dist' ?
 				'hidden-source-map' :
 				'source-map',
-- 
cgit v1.2.3