fix syntax highlighting in markdown

3 files changed, 54 insertions, 28 deletions

diff --git a/mmm/mmmfs/plugins/code.moon b/mmm/mmmfs/plugins/code.moon
index 3024c99..c3c6c50 100644
--- a/mmm/mmmfs/plugins/code.moon
+++ b/mmm/mmmfs/plugins/code.moon
@@ -2,7 +2,7 @@ import div from require 'mmm.dom'
 import languages from require 'mmm.highlighting'
 
 class Editor
-  o = do
+  o = if MODE == 'CLIENT'
     mkobj = window\eval "(function () { return {}; })"
     (tbl) ->
       with obj = mkobj!
diff --git a/mmm/mmmfs/plugins/markdown.moon b/mmm/mmmfs/plugins/markdown.moon
index 5024320..afa0307 100644
--- a/mmm/mmmfs/plugins/markdown.moon
+++ b/mmm/mmmfs/plugins/markdown.moon
@@ -3,10 +3,34 @@ markdown = if MODE == 'SERVER'
   assert success, "couldn't require 'discount'"
 
   (md) ->
-    res = assert discount.compile md, 'githubtags'
+    res = assert discount.compile md, 'githubtags', 'fencedcode'
     res.body
 else
   assert window and window.marked, "marked.js not found"
+
+  o = do
+    mkobj = window\eval "(function () { return {}; })"
+    (tbl) ->
+      with obj = mkobj!
+        for k,v in pairs(tbl)
+          obj[k] = v
+
+  trim = (str) -> str\match '^ *(..-) *$'
+
+  window.marked\setOptions o {
+    gfm: true
+    smartypants: true
+    langPrefix: 'lang-'
+    highlight: (code, lang) =>
+      code = trim code
+      result = if lang and #lang > 0
+        window.hljs\highlight lang, code, true
+      else
+        window.hljs\highlightAuto code
+
+      result.value
+  }
+
   window\marked
 
 assert markdown, "no markdown implementation found"
diff --git a/root/articles/mmmfs/ba_log/2019-10-27/text$markdown.md b/root/articles/mmmfs/ba_log/2019-10-27/text$markdown.md
index 752c355..3e9f886 100644
--- a/root/articles/mmmfs/ba_log/2019-10-27/text$markdown.md
+++ b/root/articles/mmmfs/ba_log/2019-10-27/text$markdown.md
@@ -19,35 +19,37 @@ First, here is the convert itself:
 
 and the main part of the code, the `Editor` widget:
 
-    class Editor
-      new: (value, mode, @fileder, @key) =>
-        @node = div class: 'editor'
-        -- 'o' is a little helper for converting a Lua table to a JS object
-        @cm = window\CodeMirror @node, o {
-          :value
-          :mode
-          lineNumber: true
-          lineWrapping: true
-          autoRefresh: true
-          theme: 'hybrid'
-        }
+```moonscript
+class Editor
+  new: (value, mode, @fileder, @key) =>
+    @node = div class: 'editor'
+    -- 'o' is a little helper for converting a Lua table to a JS object
+    @cm = window\CodeMirror @node, o {
+      :value
+      :mode
+      lineNumber: true
+      lineWrapping: true
+      autoRefresh: true
+      theme: 'hybrid'
+    }
 
-        @cm\on 'changes', (_, mirr) ->
-          window\clearTimeout @timeout if @timeout
-          @timeout = window\setTimeout (-> @change!), 300
+    @cm\on 'changes', (_, mirr) ->
+      window\clearTimeout @timeout if @timeout
+      @timeout = window\setTimeout (-> @change!), 300
 
-      change: =>
-        @timeout = nil
-        doc = @cm\getDoc!
-        if @lastState and doc\isClean @lastState
-          -- no changes since last event
-          return
-        
-        @lastState = doc\changeGeneration true
-        value = doc\getValue!
+  change: =>
+    @timeout = nil
+    doc = @cm\getDoc!
+    if @lastState and doc\isClean @lastState
+      -- no changes since last event
+      return
+    
+    @lastState = doc\changeGeneration true
+    value = doc\getValue!
 
-        @fileder.facets[@key] = value
-        BROWSER\refresh!
+    @fileder.facets[@key] = value
+    BROWSER\refresh!
+```
 
 I chose the [CodeMirror][codemirror] library as the basis for the editor,
 because it seemed like one of the leanest ones I could find