summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorPhil Hughes <me@iamphill.com>2017-11-22 18:40:11 +0000
committerPhil Hughes <me@iamphill.com>2017-11-22 18:51:06 +0000
commitffd7fbf53b25462809d3d38dca7f4523ebcc679e (patch)
tree63506188bb5cac0fa41c22edc7de48e467df4463
parent1374da4ca90ab1f8a0f539a2a95a45a1a2d1de14 (diff)
downloadgitlab-ce-fix-mermaid-import.tar.gz
moved to es6 modulesfix-mermaid-import
-rw-r--r--app/assets/javascripts/render_gfm.js8
-rw-r--r--app/assets/javascripts/render_math.js75
-rw-r--r--app/assets/javascripts/render_mermaid.js10
-rw-r--r--spec/javascripts/notes_spec.js2
4 files changed, 45 insertions, 50 deletions
diff --git a/app/assets/javascripts/render_gfm.js b/app/assets/javascripts/render_gfm.js
index cb935a6bea8..c91a0d9ba41 100644
--- a/app/assets/javascripts/render_gfm.js
+++ b/app/assets/javascripts/render_gfm.js
@@ -1,5 +1,5 @@
-import './render_math';
-import './render_mermaid';
+import renderMath from './render_math';
+import renderMermaid from './render_mermaid';
// Render Gitlab flavoured Markdown
//
@@ -7,8 +7,8 @@ import './render_mermaid';
//
$.fn.renderGFM = function renderGFM() {
this.find('.js-syntax-highlight').syntaxHighlight();
- this.find('.js-render-math').renderMath();
- this.find('.js-render-mermaid').renderMermaid();
+ renderMath(this.find('.js-render-math'));
+ renderMermaid(this.find('.js-render-mermaid'));
return this;
};
diff --git a/app/assets/javascripts/render_math.js b/app/assets/javascripts/render_math.js
index 8b3fee49cb9..a759992cd54 100644
--- a/app/assets/javascripts/render_math.js
+++ b/app/assets/javascripts/render_math.js
@@ -1,4 +1,3 @@
-/* eslint-disable func-names, space-before-function-paren, consistent-return, no-var, no-else-return, prefer-arrow-callback, max-len, no-console */
/* global katex */
// Renders math using KaTeX in any element with the
@@ -8,49 +7,45 @@
//
// <code class="js-render-math"></div>
//
-(function() {
// Only load once
- var katexLoaded = false;
+let katexLoaded = false;
- // Loop over all math elements and render math
- var renderWithKaTeX = function (elements) {
- elements.each(function () {
- var mathNode = $('<span></span>');
- var $this = $(this);
+// Loop over all math elements and render math
+function renderWithKaTeX(elements) {
+ elements.each(function katexElementsLoop() {
+ const mathNode = $('<span></span>');
+ const $this = $(this);
- var display = $this.attr('data-math-style') === 'display';
- try {
- katex.render($this.text(), mathNode.get(0), { displayMode: display });
- mathNode.insertAfter($this);
- $this.remove();
- } catch (err) {
- // What can we do??
- console.log(err.message);
- }
- });
- };
+ const display = $this.attr('data-math-style') === 'display';
+ try {
+ katex.render($this.text(), mathNode.get(0), { displayMode: display });
+ mathNode.insertAfter($this);
+ $this.remove();
+ } catch (err) {
+ throw err;
+ }
+ });
+}
- $.fn.renderMath = function() {
- var $this = this;
- if ($this.length === 0) return;
+export default function renderMath($els) {
+ if (!$els.length) return;
- if (katexLoaded) renderWithKaTeX($this);
- else {
- // Request CSS file so it is in the cache
- $.get(gon.katex_css_url, function() {
- var css = $('<link>',
- { rel: 'stylesheet',
- type: 'text/css',
- href: gon.katex_css_url,
- });
- css.appendTo('head');
+ if (katexLoaded) {
+ renderWithKaTeX($els);
+ } else {
+ $.get(gon.katex_css_url, () => {
+ const css = $('<link>', {
+ rel: 'stylesheet',
+ type: 'text/css',
+ href: gon.katex_css_url,
+ });
+ css.appendTo('head');
- // Load KaTeX js
- $.getScript(gon.katex_js_url, function() {
- katexLoaded = true;
- renderWithKaTeX($this); // Run KaTeX
- });
+ // Load KaTeX js
+ $.getScript(gon.katex_js_url, () => {
+ katexLoaded = true;
+ renderWithKaTeX($els); // Run KaTeX
});
- }
- };
-}).call(window);
+ });
+ }
+}
diff --git a/app/assets/javascripts/render_mermaid.js b/app/assets/javascripts/render_mermaid.js
index a253601f8e8..41942c04a4e 100644
--- a/app/assets/javascripts/render_mermaid.js
+++ b/app/assets/javascripts/render_mermaid.js
@@ -14,8 +14,8 @@
import Flash from './flash';
-$.fn.renderMermaid = function renderMermaid() {
- if (this.length === 0) return;
+export default function renderMermaid($els) {
+ if (!$els.length) return;
import(/* webpackChunkName: 'mermaid' */ 'blackst0ne-mermaid').then((mermaid) => {
mermaid.initialize({
@@ -23,8 +23,10 @@ $.fn.renderMermaid = function renderMermaid() {
theme: 'neutral',
});
- mermaid.init(undefined, this);
+ $els.each((i, el) => {
+ mermaid.init(undefined, el);
+ });
}).catch((err) => {
Flash(`Can't load mermaid module: ${err}`);
});
-};
+}
diff --git a/spec/javascripts/notes_spec.js b/spec/javascripts/notes_spec.js
index 63abac222c4..677a389b88f 100644
--- a/spec/javascripts/notes_spec.js
+++ b/spec/javascripts/notes_spec.js
@@ -4,8 +4,6 @@
import 'autosize';
import '~/gl_form';
import '~/lib/utils/text_utility';
-import '~/render_math';
-import '~/render_mermaid';
import '~/render_gfm';
import '~/notes';