diff --git a/www/common/diffMarked.js b/www/common/diffMarked.js index 8fc8aab6e..adba02656 100644 --- a/www/common/diffMarked.js +++ b/www/common/diffMarked.js @@ -313,6 +313,15 @@ define([ // finally, find all 'clickable' items and remove the class $el.find('.clickable').removeClass('clickable'); }; + var renderMermaid = function ($el) { + Mermaid.init(undefined, $el); + // clickable elements in mermaid don't work well with our sandboxing setup + // the function below strips clickable elements but still leaves behind some artifacts + // tippy tooltips might still be useful, so they're not removed. It would be + // preferable to just support links, but this covers up a rough edge in the meantime + removeMermaidClickables($el); + }; + DiffMd.apply = function (newHtml, $content, common) { var contextMenu = common.importMediaTagMenu(); @@ -387,8 +396,15 @@ define([ var mts = []; $content.find('media-tag, pre.mermaid').each(function (i, el) { if (el.nodeName.toLowerCase() === "pre") { + var clone = el.cloneNode(); return void mts.push({ - svg: el.cloneNode(true) + svg: clone, + render: function () { + var $el = $(clone); + $el.text(clone.getAttribute('mermaid-source')); + $el.attr('data-processed', ''); + renderMermaid($el); + } }); } var $el = $(el); @@ -401,7 +417,7 @@ define([ // Find initial position var idx = -1; mts.some(function (obj, i) { - if (isSvg && $mt.find('svg').attr('id') === $(obj.svg).find('svg').attr('id')) { + if (isSvg && $mt.attr('mermaid-source') === $(obj.svg).attr('mermaid-source')) { idx = i; return true; } @@ -412,8 +428,15 @@ define([ }); if (idx === -1) { if (isSvg) { + var clone = $mt[0].cloneNode(); mts.unshift({ - svg: $mt[0].cloneNode(true) + svg: clone, + render: function () { + var $el = $(clone); + $el.text(clone.getAttribute('mermaid-source')); + $el.attr('data-processed', ''); + renderMermaid($el); + } }); } else { mts.unshift({ @@ -511,12 +534,7 @@ define([ // check if you had cached a pre-rendered instance of the supplied source if (typeof(cached) !== 'object') { try { - Mermaid.init(undefined, $el); - // clickable elements in mermaid don't work well with our sandboxing setup - // the function below strips clickable elements but still leaves behind some artifacts - // tippy tooltips might still be useful, so they're not removed. It would be - // preferable to just support links, but this covers up a rough edge in the meantime - removeMermaidClickables($el); + renderMermaid($el); } catch (e) { console.error(e); } return; } diff --git a/www/common/inner/common-mediatag.js b/www/common/inner/common-mediatag.js index f056904b5..40ae19059 100644 --- a/www/common/inner/common-mediatag.js +++ b/www/common/inner/common-mediatag.js @@ -250,36 +250,47 @@ define([ // Check src and cryptkey var cfg = tags[i]; + var tag; if (cfg.svg) { - $spinner.hide(); $inner.append(cfg.svg); - locked = false; - return; - } - - var src = cfg.src; - var key = cfg.key; - if (cfg.href) { - var parsed = Hash.parsePadUrl(cfg.href); - var secret = Hash.getSecrets(parsed.type, parsed.hash, cfg.password); - var host = priv.fileHost || priv.origin || ''; - src = host + Hash.getBlobPathFromHex(secret.channel); - var _key = secret.keys && secret.keys.cryptKey; - if (_key) { key = 'cryptpad:' + Nacl.util.encodeBase64(_key); } - } - if (!src || !key) { - locked = false; - $spinner.hide(); - return void UI.log(Messages.error); + if (!cfg.render) { + $spinner.hide(); + console.error('here'); + locked = false; + return; + } + console.error('there'); + setTimeout(cfg.render); + tag = cfg.svg; + } else { + var src = cfg.src; + var key = cfg.key; + if (cfg.href) { + var parsed = Hash.parsePadUrl(cfg.href); + var secret = Hash.getSecrets(parsed.type, parsed.hash, cfg.password); + var host = priv.fileHost || priv.origin || ''; + src = host + Hash.getBlobPathFromHex(secret.channel); + var _key = secret.keys && secret.keys.cryptKey; + if (_key) { key = 'cryptpad:' + Nacl.util.encodeBase64(_key); } + } + if (!src || !key) { + locked = false; + $spinner.hide(); + return void UI.log(Messages.error); + } + tag = h('media-tag', { + src: src, + 'data-crypto-key': key + }); + $inner.append(tag); + MediaTag(tag).on('error', function () { + locked = false; + $spinner.hide(); + UI.log(Messages.error); + }); } - var tag = h('media-tag', { - src: src, - 'data-crypto-key': key - }); - $inner.append(tag); - var observer = new MutationObserver(function(mutations) { mutations.forEach(function() { locked = false; @@ -291,11 +302,6 @@ define([ childList: true, characterData: false }); - MediaTag(tag).on('error', function () { - locked = false; - $spinner.hide(); - UI.log(Messages.error); - }); }; show(i);