Way to much to put into a single commit message..

5 files changed, 350 insertions, 154 deletions

diff --git a/imgs/KochFlake.svg b/imgs/KochFlake.svg
new file mode 100644
index 0000000..9b83bed
--- /dev/null
+++ b/imgs/KochFlake.svg
@@ -0,0 +1,52 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   version="1.0"
+   width="362"
+   height="362"
+   id="svg4275">
+  <defs
+     id="defs4277" />
+  <g
+     id="layer1">
+    <path
+       d="M 97.000002,113.07622 L 71.419245,68.769055 L 45.838491,24.461891 L 97.000001,24.461889 L 148.16151,24.461888 L 122.58075,68.769056 L 97.000002,113.07622 z "
+       transform="matrix(-1,0,0,-1,198.66151,145.96189)"
+       style="opacity:1;fill:none;fill-opacity:1;stroke:#FFFFFF;stroke-width:1;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       id="path4352" />
+    <path
+       d="M 217.04036,91.999996 L 233.52018,62.280262"
+       style="fill:none;fill-rule:evenodd;stroke:#08ff00;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       id="path4358" />
+    <path
+       d="M 266.47982,62.280262 L 282.95965,91.999996"
+       style="fill:none;fill-rule:evenodd;stroke:#08ff00;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       id="path4360" />
+    <path
+       d="M 233.52018,121.71972 L 266.47982,121.71972"
+       style="fill:none;fill-rule:evenodd;stroke:#08ff00;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       id="path4362" />
+    <path
+       d="M 200.56053,62.280262 L 233.52018,62.280262 L 250,32.560528 L 266.47982,62.280262 L 299.43947,62.280262 L 282.95965,91.999996 L 299.43947,121.71972 L 266.47982,121.71972 L 250,151.43947 L 233.52018,121.71972 L 200.56053,121.71972 L 217.04036,91.999996 L 200.56053,62.280262"
+       style="fill:none;fill-opacity:1;stroke:#FFFFFF;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       id="path4338" />
+    <path
+       d="M 50.545365,222.73737 L 83.505015,222.73737 L 99.984835,193.01764 L 116.46466,222.73737 L 149.4243,222.73737 L 132.94448,252.45711 L 149.4243,282.17683 L 116.46466,282.17683 L 99.984835,311.89658 L 83.505015,282.17683 L 50.545365,282.17683 L 67.025195,252.45711 L 50.545365,222.73737"
+       style="fill:none;fill-opacity:1;stroke:#04ff00;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       id="path4385" />
+    <path
+       d="M 50.508456,282.17987 L 56.006248,272.27655 L 50.508457,262.37323 L 61.504038,262.37323 L 67.001828,252.46991 L 61.504038,242.56658 L 50.508457,242.56658 L 56.006248,232.66327 L 50.508457,222.75995 L 61.504038,222.75995 L 67.001829,212.85663 L 72.49962,222.75995 L 83.495201,222.75995 L 88.992992,212.85663 L 83.495202,202.95331 L 94.490784,202.95331 L 99.988575,193.04998 L 105.48637,202.95331 L 116.48195,202.95331 L 110.98416,212.85663 L 116.48195,222.75995 L 127.47754,222.75995 L 132.97533,212.85663 L 138.47311,222.75995 L 149.4687,222.75995 L 143.97089,232.66327 L 149.4687,242.56658 L 138.4731,242.56658 L 132.97532,252.46991 L 138.4731,262.37323 L 149.4687,262.37323 L 143.9709,272.27655 L 149.4687,282.17987 L 138.47311,282.17987 L 132.97533,292.08318 L 127.47754,282.17987 L 116.48195,282.17987 L 110.98415,292.08318 L 116.48195,301.98651 L 105.48636,301.98651 L 99.988571,311.88984 L 94.490784,301.98651 L 83.495202,301.98651 L 88.992993,292.08318 L 83.495202,282.17987 L 72.49962,282.17987 L 67.001828,292.08318 L 61.504038,282.17987 L 50.508456,282.17987"
+       style="fill:none;fill-opacity:1;stroke:#FFFFFF;stroke-width:0.9990893;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       id="path4374" />
+    <path
+       d="M 200.54997,282.31651 L 206.04771,272.39504 L 200.54997,262.47357 L 211.54545,262.47357 L 217.04319,252.55209 L 211.54545,242.63061 L 200.54997,242.63061 L 206.04771,232.70915 L 200.54997,222.78768 L 211.54545,222.78768 L 217.04319,212.8662 L 222.54093,222.78768 L 233.53641,222.78768 L 239.03415,212.8662 L 233.53641,202.94473 L 244.53189,202.94473 L 250.02963,193.02325 L 255.52737,202.94473 L 266.52285,202.94473 L 261.02511,212.8662 L 266.52285,222.78768 L 277.51834,222.78768 L 283.01608,212.8662 L 288.51381,222.78768 L 299.50929,222.78768 L 294.01154,232.70915 L 299.50929,242.63061 L 288.5138,242.63061 L 283.01607,252.55209 L 288.5138,262.47357 L 299.50929,262.47357 L 294.01155,272.39504 L 299.50929,282.31651 L 288.51381,282.31651 L 283.01608,292.23798 L 277.51834,282.31651 L 266.52285,282.31651 L 261.02511,292.23798 L 266.52285,302.15946 L 255.52737,302.15946 L 250.02963,312.08094 L 244.53189,302.15946 L 233.53641,302.15946 L 239.03415,292.23798 L 233.53641,282.31651 L 222.54093,282.31651 L 217.04319,292.23798 L 211.54545,282.31651 L 200.54997,282.31651"
+       style="fill:none;fill-opacity:1;stroke:#00ff00;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       id="path4412" />
+    <path
+       d="M 200.60887,282.29127 L 202.43951,278.98763 L 200.60887,275.68401 L 204.27015,275.68401 L 206.1008,272.38037 L 204.27015,269.07674 L 200.60886,269.07674 L 202.43951,265.77312 L 200.60887,262.46948 L 204.27015,262.46948 L 206.1008,259.16586 L 207.93146,262.46948 L 211.59274,262.46948 L 213.42339,259.16586 L 211.59274,255.86223 L 215.25403,255.86223 L 217.08469,252.5586 L 215.25403,249.25498 L 211.59274,249.25498 L 213.42339,245.95134 L 211.59274,242.64772 L 207.93145,242.64772 L 206.1008,245.95134 L 204.27015,242.64772 L 200.60887,242.64772 L 202.43951,239.34409 L 200.60886,236.04046 L 204.27015,236.04046 L 206.1008,232.73684 L 204.27015,229.4332 L 200.60887,229.4332 L 202.43951,226.12958 L 200.60886,222.82594 L 204.27015,222.82595 L 206.1008,219.52232 L 207.93145,222.82594 L 211.59274,222.82595 L 213.42339,219.52232 L 211.59274,216.2187 L 215.25403,216.2187 L 217.08469,212.91506 L 218.91533,216.2187 L 222.57662,216.2187 L 220.74598,219.52232 L 222.57662,222.82595 L 226.23792,222.82594 L 228.06855,219.52232 L 229.89923,222.82595 L 233.5605,222.82594 L 235.39115,219.52232 L 233.5605,216.2187 L 237.22179,216.2187 L 239.05246,212.91506 L 237.22179,209.61143 L 233.5605,209.61143 L 235.39115,206.3078 L 233.5605,203.00417 L 237.22179,203.00417 L 239.05245,199.70056 L 240.8831,203.00417 L 244.54439,203.00417 L 246.37502,199.70056 L 244.54439,196.39692 L 248.20569,196.39692 L 250.03633,193.0933 L 251.86696,196.39692 L 255.52826,196.39692 L 253.69763,199.70056 L 255.52826,203.00417 L 259.18956,203.00417 L 261.0202,199.70056 L 262.85086,203.00417 L 266.51215,203.00417 L 264.6815,206.3078 L 266.51215,209.61143 L 262.85086,209.61143 L 261.02019,212.91506 L 262.85086,216.2187 L 266.51215,216.2187 L 264.6815,219.52232 L 266.51215,222.82595 L 270.17343,222.82594 L 272.0041,219.52232 L 273.83473,222.82594 L 277.49603,222.82595 L 279.32667,219.52232 L 277.49603,216.2187 L 281.15733,216.2187 L 282.98796,212.91506 L 284.81862,216.2187 L 288.47991,216.2187 L 286.64926,219.52232 L 288.47991,222.82594 L 292.14119,222.82594 L 293.97185,219.52232 L 295.8025,222.82595 L 299.46378,222.82594 L 297.63314,226.12958 L 299.46379,229.4332 L 295.8025,229.4332 L 293.97185,232.73684 L 295.8025,236.04046 L 299.46379,236.04046 L 297.63314,239.34409 L 299.46378,242.64772 L 295.8025,242.64772 L 293.97185,245.95134 L 292.1412,242.64772 L 288.47991,242.64772 L 286.64926,245.95134 L 288.47991,249.25498 L 284.81862,249.25498 L 282.98796,252.5586 L 284.81862,255.86223 L 288.47991,255.86223 L 286.64926,259.16586 L 288.47991,262.46948 L 292.1412,262.46948 L 293.97185,259.16586 L 295.8025,262.46948 L 299.46379,262.46948 L 297.63314,265.77312 L 299.46379,269.07674 L 295.8025,269.07674 L 293.97185,272.38038 L 295.8025,275.68401 L 299.46378,275.68401 L 297.63314,278.98763 L 299.46379,282.29127 L 295.8025,282.29127 L 293.97185,285.59489 L 292.1412,282.29127 L 288.47991,282.29127 L 286.64926,285.59489 L 288.47991,288.89851 L 284.81862,288.89852 L 282.98796,292.20215 L 281.15732,288.89851 L 277.49603,288.89852 L 279.32667,285.59489 L 277.49603,282.29127 L 273.83473,282.29127 L 272.0041,285.59489 L 270.17343,282.29127 L 266.51215,282.29127 L 264.6815,285.59489 L 266.51215,288.89852 L 262.85086,288.89851 L 261.02019,292.20215 L 262.85086,295.50577 L 266.51215,295.50577 L 264.6815,298.8094 L 266.51215,302.11303 L 262.85086,302.11303 L 261.0202,305.41664 L 259.18956,302.11303 L 255.52826,302.11303 L 253.69763,305.41664 L 255.52826,308.72028 L 251.86696,308.72028 L 250.03632,312.0239 L 248.20569,308.72028 L 244.54439,308.72028 L 246.37502,305.41664 L 244.54439,302.11303 L 240.8831,302.11303 L 239.05246,305.41664 L 237.22179,302.11303 L 233.5605,302.11303 L 235.39115,298.8094 L 233.5605,295.50577 L 237.22179,295.50577 L 239.05246,292.20215 L 237.22179,288.89851 L 233.5605,288.89851 L 235.39115,285.59489 L 233.5605,282.29127 L 229.89922,282.29127 L 228.06855,285.59489 L 226.23792,282.29127 L 222.57662,282.29127 L 220.74598,285.59489 L 222.57662,288.89852 L 218.91532,288.89851 L 217.08469,292.20215 L 215.25403,288.89851 L 211.59274,288.89852 L 213.42339,285.59489 L 211.59274,282.29127 L 207.93146,282.29127 L 206.1008,285.59489 L 204.27015,282.29127 L 200.60887,282.29127"
+       style="fill:none;fill-opacity:1;stroke:#FFFFFF;stroke-width:1.03345299;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       id="path4399" />
+  </g>
+</svg>
diff --git a/index.html b/index.html
index 3d25082..b618856 100644
--- a/index.html
+++ b/index.html
@@ -48,14 +48,56 @@
                 </section>
 
                 <section>
-                    <h3>Koch Fraktal</h3>
-                    <div id="iterationCtr"></div>
-                    <div class="flexContainer">
-                        <canvas id="koch"></canvas>
+                    <!-- Vorstellung -->
+                    <section>
+                        <h3>Regeln</h3>
+                        <ol>
+                            <li>Mit einer geraden Linie starten</li>
+                            <li>Linie in drei Teile aufteilen</li>
+                            <li>Den mittleren Teil der Linie "radieren"</li>
+                            <li>Den mittleren Teil zu einem gleichseitigen Dreieck verbinden</li>
+                        </ol>
+                    </section>
+                    <section>
+                        <div id="iterationCtr"></div>
+                        <div class="flexContainer">
+                            <canvas id="koch"></canvas>
+                        </div>
+                    </section>
+                </section>
+
+                <section>
+                    <!-- Mit zwei browsern visualisieren (tiling!) -->
+                    <h3>Umfang des Koch Fraktals</h3>
+                    <div class="fragment fade-right" style="float: left;">
+                        <p>Anzahl der Linien:</p>
+                        <p>\[ N_n = N_{n-1} \cdot 4 = 4^n \]</p>
+                    </div>
+                    <div class="fragment fade-left" style="float: right;">
+                        <p>Länge der Linien:</p>
+                        <p>\[ S_n = \frac{S_{n-1}}{3} = \frac{s}{3^n} \]</p>
+                    </div>
+                    <div class="fragment fade-up" style="float: left;">
+                        <p>Umfang:</p>
+                        <p>\[ P_n = N_n\cdot S_n = s\cdot\left(\frac{4}{3}\right)^n \]</p>
+                    </div>
+                    <div class="fragment fade-up" style="float: right;">
+                        <p>Limes:</p>
+                        <p>\[ \lim_{n\to\infty}P_n = \infty \]</p>
                     </div>
                 </section>
 
                 <section>
+                    <h3>Varianten des Koch Fraktals</h3>
+                    <img
+                        class="plain"
+                        style="background: none;"
+                        src="imgs/KochFlake.svg"
+                        alt="Hier könnte ihre Werbung stehen!"
+                    />
+                </section>
+
+                <section>
                     <h3>Summenzeichen</h3>
                     <h1>\[ \sum_{n=-\infty}^{+\infty} f(x) \]</h1>
                 </section>
@@ -63,6 +105,18 @@
                 <section>
                     <h3>Fläche des Koch Fraktals</h3>
                 </section>
+
+                <section>
+                    <h3>Quellen</h3>
+                    <p>Bilder</p>
+                    <a href="https://en.wikipedia.org/wiki/Koch_snowflake#/media/File:KochFlake.svg" target="_blank">
+                        https://en.wikipedia.org/wiki/Koch_snowflake#/media/File:KochFlake.svg
+                    </a>
+                    <p>Wissen</p>
+                    <a href="https://en.wikipedia.org/wiki/Koch_snowflake" target="_blank">
+                        https://en.wikipedia.org/wiki/Koch_snowflake
+                    </a>
+                </section>
             </div>
         </div>
 
diff --git a/js/main.js b/js/main.js
index 3fa2566..0539d9f 100644
--- a/js/main.js
+++ b/js/main.js
@@ -1,23 +1,24 @@
 Reveal.initialize({
-  controls: false,
-  math: {
-    mathjax: 'node_modules/mathjax/MathJax.js',
-    config: 'TeX-AMS_HTML-full',
-    // pass other options into `MathJax.Hub.Config()`
-    TeX: {Macros: {RR: "{\\bf R}"}}
-  },
+    controls: false,
+    math: {
+        //mathjax: "node_modules/mathjax/MathJax.js", // local, but crashes sometimes
+        mathjax: "https://cdn.jsdelivr.net/gh/mathjax/mathjax@2.7.8/MathJax.js",
+        config: "TeX-AMS_HTML-full",
+        // pass other options into `MathJax.Hub.Config()`
+        TeX: { Macros: { RR: "{\\bf R}" } },
+    },
 
-  hash: true,
-  dependencies: [
-    {src: 'plugin/markdown/marked.js'},
-    {src: 'plugin/markdown/markdown.js'},
-    {src: 'plugin/highlight/highlight.js'},
-    {src: 'plugin/math/math.js', async: true},
-    {src: 'plugin/notes/notes.js', async: true}
-  ]
+    hash: true,
+    dependencies: [
+        { src: "plugin/markdown/marked.js" },
+        { src: "plugin/markdown/markdown.js" },
+        { src: "plugin/highlight/highlight.js" },
+        { src: "plugin/math/math.js", async: true },
+        { src: "plugin/notes/notes.js", async: true },
+        { src: "plugin/mouse-pointer/mouse-pointer.js", async: true },
+    ],
 });
 
-
 /******************
  * KOCH ANIMATION *
  ******************/
@@ -25,67 +26,101 @@ const canvas = document.getElementById("koch");
 const ctr = document.getElementById("iterationCtr");
 const ctx = canvas.getContext("2d");
 
+// Constants...
+const backgroundColor = "#191919";
+const previousLineColor = backgroundColor;
+// const previousLineColor = "white"; // Also looks okay
+const previousLineWidth = 3;
+const lineColor = "white";
+const lineWidth = 2;
+
+let triangleCount;
+
 canvas.width = window.innerWidth * 0.9;
 canvas.height = window.innerHeight * 0.9;
 const cx = canvas.width / 2;
 const cy = canvas.height / 2;
 ctx.translate(cx, cy);
-ctx.fillStyle = "#191919";
-ctx.lineWidth = 4;
-ctx.fillRect(-cx, -cy, 2 * cx, 2 * cy);
-ctx.strokeStyle = "white";
-koch([-cx, 100], [cx, 100], 0);
 
-window.onkeyup = event => {
-  switch (event.key) {
-    case "1":
-    case "2":
-    case "3":
-    case "4":
-    case "5":
-    case "6":
-    case "7":
-      ctr.innerText = event.key;
-      ctx.fillRect(-cx, -cy, 2 * cx, 2 * cy);
-      koch([-cx, 100], [cx, 100], Number(event.key) - 1);
-  }
+ctx.fillStyle = backgroundColor;
+ctx.lineWidth = lineWidth;
+ctx.strokeStyle = lineColor;
+koch([-cx, 100], [cx, 100], -1);
+
+window.onkeyup = (event) => {
+    switch (event.key) {
+        case "0":
+        case "1":
+        case "2":
+        case "3":
+        case "4":
+        case "5":
+        case "6":
+        case "7":
+        case "8":
+        case "9":
+            triangleCount = 0;
+            ctx.fillRect(-cx, -cy, 2 * cx, 2 * cy);
+            koch([-cx, 100], [cx, 100], Number(event.key) - 1);
+            ctr.innerText = "Generation: " + event.key + " - Dreiecke: " + triangleCount;
+            break;
+    }
 };
 
+function perimeter(generation) {
+    // Or just 4^n, but I like recursion :D
+    if (generation == 0) return 1;
+    return perimeter(generation - 1) * 4;
+}
+
 // Recursion!
 function koch(start, end, iteration) {
-  const x1 = (end[0] - start[0]) / 3 + start[0];
-  const y1 = (end[1] - start[1]) / 3 + start[1];
-  const x2 = (end[0] - start[0]) * 2 / 3 + start[0];
-  const y2 = (end[1] - start[1]) * 2 / 3 + start[1];
-  const x3 = ((x1 + x2) + Math.sqrt(3) * (-y1 + y2)) / 2;
-  const y3 = ((y1 + y2) + Math.sqrt(3) * (x1 - x2)) / 2;
+    if (iteration == -1) {
+        ctx.beginPath();
+        ctx.moveTo(start[0], start[1]);
+        ctx.lineTo(end[0], end[1]);
+        ctx.closePath();
+        ctx.stroke();
+        return;
+    }
+    triangleCount++;
+
+    const x1 = (end[0] - start[0]) / 3 + start[0];
+    const y1 = (end[1] - start[1]) / 3 + start[1];
+    const x2 = ((end[0] - start[0]) * 2) / 3 + start[0];
+    const y2 = ((end[1] - start[1]) * 2) / 3 + start[1];
+    const x3 = (x1 + x2 + Math.sqrt(3) * (-y1 + y2)) / 2;
+    const y3 = (y1 + y2 + Math.sqrt(3) * (x1 - x2)) / 2;
 
-  ctx.beginPath();
+    ctx.beginPath();
 
-  ctx.moveTo(start[0], start[1]);
-  ctx.lineTo(x1, y1);
-  ctx.moveTo(x2, y2);
-  ctx.lineTo(end[0], end[1]);
+    ctx.moveTo(start[0], start[1]);
+    ctx.lineTo(x1, y1);
+    ctx.moveTo(x2, y2);
+    ctx.lineTo(end[0], end[1]);
 
-  ctx.moveTo(x1, y1);
-  ctx.lineTo(x3, y3);
-  ctx.moveTo(x2, y2);
-  ctx.lineTo(x3, y3);
-  ctx.closePath();
-  ctx.stroke();
+    ctx.moveTo(x1, y1);
+    ctx.lineTo(x3, y3);
+    ctx.moveTo(x2, y2);
+    ctx.lineTo(x3, y3);
+    ctx.closePath();
+    ctx.stroke();
 
-  ctx.strokeStyle = "#191919";
-  ctx.beginPath();
-  ctx.moveTo(x1, y1);
-  ctx.lineTo(x2, y2);
-  ctx.closePath();
-  ctx.stroke();
-  ctx.strokeStyle = "white";
+    // Clear previous lines
+    ctx.strokeStyle = previousLineColor;
+    ctx.lineWidth = previousLineWidth;
+    ctx.beginPath();
+    ctx.moveTo(x1, y1);
+    ctx.lineTo(x2, y2);
+    ctx.closePath();
+    ctx.stroke();
+    ctx.strokeStyle = lineColor;
+    ctx.lineWidth = lineWidth;
 
-  if (iteration > 0) {
-    koch([start[0], start[1]], [x1, y1], iteration - 1);
-    koch([x1, y1], [x3, y3], iteration - 1);
-    koch([x3, y3], [x2, y2], iteration - 1);
-    koch([x2, y2], [end[0], end[1]], iteration - 1);
-  }
+    if (iteration > 0) {
+        koch([start[0], start[1]], [x1, y1], iteration - 1);
+        koch([x1, y1], [x3, y3], iteration - 1);
+        koch([x3, y3], [x2, y2], iteration - 1);
+        koch([x2, y2], [end[0], end[1]], iteration - 1);
+    }
 }
diff --git a/plugin/math/math.js b/plugin/math/math.js
index d76c9dd..32bc432 100755
--- a/plugin/math/math.js
+++ b/plugin/math/math.js
@@ -4,89 +4,82 @@
  *
  * @author Hakim El Hattab
  */
-var RevealMath = window.RevealMath || (function(){
-
-	var options = Reveal.getConfig().math || {};
-	var mathjax = options.mathjax || 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js';
-	var config = options.config || 'TeX-AMS_HTML-full';
-	var url = mathjax + '?config=' + config;
-
-	var defaultOptions = {
-		messageStyle: 'none',
-		tex2jax: {
-			inlineMath: [ [ '$', '$' ], [ '\\(', '\\)' ] ],
-			skipTags: [ 'script', 'noscript', 'style', 'textarea', 'pre' ]
-		},
-		skipStartupTypeset: true
-	};
-
-	function defaults( options, defaultOptions ) {
-
-		for ( var i in defaultOptions ) {
-			if ( !options.hasOwnProperty( i ) ) {
-				options[i] = defaultOptions[i];
-			}
-		}
-
-	}
-
-	function loadScript( url, callback ) {
-
-		var head = document.querySelector( 'head' );
-		var script = document.createElement( 'script' );
-		script.type = 'text/javascript';
-		script.src = url;
-
-		// Wrapper for callback to make sure it only fires once
-		var finish = function() {
-			if( typeof callback === 'function' ) {
-				callback.call();
-				callback = null;
-			}
-		}
-
-		script.onload = finish;
-
-		// IE
-		script.onreadystatechange = function() {
-			if ( this.readyState === 'loaded' ) {
-				finish();
-			}
-		}
-
-		// Normal browsers
-		head.appendChild( script );
-
-	}
-
-	return {
-		init: function() {
-
-			defaults( options, defaultOptions );
-			defaults( options.tex2jax, defaultOptions.tex2jax );
-			options.mathjax = options.config = null;
-
-			loadScript( url, function() {
-
-				MathJax.Hub.Config( options );
-
-				// Typeset followed by an immediate reveal.js layout since
-				// the typesetting process could affect slide height
-				MathJax.Hub.Queue( [ 'Typeset', MathJax.Hub ] );
-				MathJax.Hub.Queue( Reveal.layout );
-
-				// Reprocess equations in slides when they turn visible
-				Reveal.addEventListener( 'slidechanged', function( event ) {
-
-					MathJax.Hub.Queue( [ 'Typeset', MathJax.Hub, event.currentSlide ] );
-
-				} );
-
-			} );
-
-		}
-	}
-
-})();
-
-Reveal.registerPlugin( 'math', RevealMath );
+var RevealMath =
+    window.RevealMath ||
+    (function () {
+        var options = Reveal.getConfig().math || {};
+        var mathjax = options.mathjax || "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js";
+        var config = options.config || "TeX-AMS_HTML-full";
+        var url = mathjax + "?config=" + config;
+
+        var defaultOptions = {
+            messageStyle: "none",
+            tex2jax: {
+                inlineMath: [
+                    ["$", "$"],
+                    ["\\(", "\\)"],
+                ],
+                skipTags: ["script", "noscript", "style", "textarea", "pre"],
+            },
+            skipStartupTypeset: true,
+        };
+
+        function defaults(options, defaultOptions) {
+            for (var i in defaultOptions) {
+                if (!options.hasOwnProperty(i)) {
+                    options[i] = defaultOptions[i];
+                }
+            }
+        }
+
+        function loadScript(url, callback) {
+            var head = document.querySelector("head");
+            var script = document.createElement("script");
+            script.type = "text/javascript";
+            script.src = url;
+
+            // Wrapper for callback to make sure it only fires once
+            var finish = function () {
+                if (typeof callback === "function") {
+                    callback.call();
+                    callback = null;
+                }
+            };
+
+            script.onload = finish;
+
+            // IE
+            script.onreadystatechange = function () {
+                if (this.readyState === "loaded") {
+                    finish();
+                }
+            };
+
+            // Normal browsers
+            head.appendChild(script);
+        }
+
+        return {
+            init: function () {
+                defaults(options, defaultOptions);
+                defaults(options.tex2jax, defaultOptions.tex2jax);
+                options.mathjax = options.config = null;
+
+                loadScript(url, function () {
+                    MathJax.Hub.Config(options);
+
+                    // Typeset followed by an immediate reveal.js layout since
+                    // the typesetting process could affect slide height
+                    MathJax.Hub.Queue(["Typeset", MathJax.Hub]);
+                    MathJax.Hub.Queue(Reveal.layout);
+
+                    // Reprocess equations in slides when they turn visible
+                    Reveal.addEventListener("slidechanged", function (event) {
+                        MathJax.Hub.Queue(["Typeset", MathJax.Hub, event.currentSlide]);
+                    });
+                });
+            },
+        };
+    })();
+
+Reveal.registerPlugin("math", RevealMath);
diff --git a/plugin/mouse-pointer/mouse-pointer.js b/plugin/mouse-pointer/mouse-pointer.js
new file mode 100644
index 0000000..7c6d42d
--- /dev/null
+++ b/plugin/mouse-pointer/mouse-pointer.js
@@ -0,0 +1,62 @@
+(function (doc, win) {
+    "use strict";
+
+    const initial_css = {
+        position: "absolute",
+        float: "left",
+        borderRadius: "50%",
+        width: "50px",
+        height: "50px",
+        backgroundColor: "rgba(255, 0, 0, 0.8)",
+        zIndex: 20,
+        display: "none",
+    };
+    let toggleBind = false;
+    const body = doc.getElementsByTagName("body")[0];
+    let tail = doc.createElement("div");
+
+    function initModule() {
+        Object.assign(tail.style, initial_css);
+        body.appendChild(tail);
+        setKeyboards();
+        if (window.Reveal.registerKeyboardShortcut) {
+            Reveal.registerKeyboardShortcut("CAPSLOCK", "Toggle Mouse Pointer");
+        }
+    }
+
+    function mouse_pointing(e) {
+        tail.style.display = "block";
+        tail.style.left = e.pageX - 15 + "px";
+        tail.style.top = e.pageY - 15 + "px";
+    }
+
+    function toogleMousePointer() {
+        if (!toggleBind) {
+            document.removeEventListener("mousemove", mouse_pointing);
+            tail.style.display = "none";
+            body.style.cursor = "auto";
+        } else {
+            tail.style.display = "block";
+            tail.style.width = "50px";
+            tail.style.height = "50px";
+            body.style.cursor = "none";
+            document.addEventListener("mousemove", mouse_pointing);
+        }
+    }
+
+    function setKeyboards(params) {
+        document.addEventListener(
+            "keydown",
+            function (event) {
+                if (event.keyCode === 20) {
+                    event.preventDefault();
+                    toggleBind = !toggleBind;
+                    toogleMousePointer();
+                }
+            },
+            false
+        );
+    }
+
+    initModule();
+})(document, window);