Merge pull request #434 from ZeusWPI/katex

Add Katex (Math mode) support

Gemfile

@@ -5,6 +5,12 @@ gem 'nanoc'
 
 gem 'icalendar' # ical files
 gem 'kramdown'
+
+# Kramdown math mode gems
+gem 'kramdown-math-katex'
+# Also needed for autoprefixing
+gem 'mini_racer'
+
 gem 'sassc'
 gem 'typogruby'
 
@@ -26,8 +32,6 @@ group :development do
 end
 
 group :production do
-  # Faster css autoprefixing
-  gem 'mini_racer'
   # Autoprefixing for class
   gem 'autoprefixer-rails'
   gem 'htmlcompressor'

Gemfile.lock

@@ -62,8 +62,13 @@ GEM
     ice_cube (0.16.3)
     json (2.5.1)
     json_schema (0.20.9)
+    katex (0.6.1)
+      execjs (~> 2.7)
     kramdown (2.3.0)
       rexml
+    kramdown-math-katex (1.0.1)
+      katex (~> 0.4)
+      kramdown (~> 2.0)
     libv8 (8.4.255.0)
     listen (3.4.1)
       rb-fsevent (~> 0.10, >= 0.10.3)
@@ -176,6 +181,7 @@ DEPENDENCIES
   htmlcompressor
   icalendar
   kramdown
+  kramdown-math-katex
   mini_racer
   nanoc
   nanoc-live

Rules

@@ -4,6 +4,7 @@
 require 'json'
 require 'icalendar'
 
+
 # Important!!!
 # First ignore the node_modules, we do not need any of it on the site directly.
 ignore '/node_modules/**/*'
@@ -103,7 +104,7 @@ end
 compile '/blog/*/*.md' do
   filter :erb
   layout '/blogpost.md'
-  filter :kramdown
+  filter :kramdown, {math_engine: :katex}
   filter :typogruby
 
   layout '/blogpost.erb'

layouts/blogpost.erb

@@ -14,6 +14,9 @@
 
 <!-- Animate.css -->
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
+
+<!-- KaTeX math css -->
+<link rel="stylesheet" type="text/css" href="/assets/stylesheets/katex.css">
 <% end %>
 
 <div class="blog-heading">

lib/data_sources/katex.rb

@@ -0,0 +1,17 @@
+require 'katex'
+
+class KatexDataSource < ::Nanoc::DataSource
+  identifier :katex
+
+  def items
+    katex_css_path = File.join(Katex.gem_path, 'vendor', 'katex', 'stylesheets', 'katex.css')
+
+    [
+      new_item(
+        File.open(katex_css_path).read,
+        {},
+        "/katex.css"
+      )
+    ]
+  end
+end

nanoc.yaml

@@ -90,6 +90,9 @@ data_sources:
     items_root: /about/verslagen/
     content_dir: drive/verslagen/
     layouts_dir: null
+  -
+    type: katex
+    items_root: /assets/stylesheets
 
 # Configuration for the “check” command, which run unit tests on the site.
 checks: