diff --git a/scripts/interface/Exporter.js b/scripts/interface/Exporter.js index e1fe15c..27137ae 100644 --- a/scripts/interface/Exporter.js +++ b/scripts/interface/Exporter.js @@ -4,9 +4,13 @@ define(() => { // Thanks, https://stackoverflow.com/a/23522755/1180785 const safari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent); + // Thanks, https://stackoverflow.com/a/9851769/1180785 + const firefox = (typeof window.InstallTrigger !== 'undefined'); + return class Exporter { constructor() { this.latestSVG = null; + this.latestInternalSVG = null; this.canvas = null; this.context = null; this.indexPNG = 0; @@ -14,24 +18,42 @@ define(() => { this.latestPNG = null; } - getSVGContent(renderer) { - return renderer.svg().outerHTML; + getSVGContent(renderer, size = null) { + let code = renderer.svg().outerHTML; + if(firefox && size) { + // Firefox fails to render SVGs unless they have size + // attributes on the tag + code = code.replace( + /^ { this.canvas.toBlob(callback, 'image/png'); }, {once: true}); - img.src = this.getSVGURL(renderer); + img.src = this.getSVGURL(renderer, {width, height}); } getPNGURL(renderer, resolution, callback) { diff --git a/scripts/svg/SVGTextBlock.js b/scripts/svg/SVGTextBlock.js index 517cf76..6a6453a 100644 --- a/scripts/svg/SVGTextBlock.js +++ b/scripts/svg/SVGTextBlock.js @@ -1,6 +1,9 @@ define(['./SVGUtilities'], (svg) => { 'use strict'; + // Thanks, https://stackoverflow.com/a/9851769/1180785 + const firefox = (typeof window.InstallTrigger !== 'undefined'); + function fontDetails(attrs) { const size = Number(attrs['font-size']); const lineHeight = size * (Number(attrs['line-height']) || 1); @@ -130,7 +133,11 @@ define(['./SVGUtilities'], (svg) => { class SizeTester { constructor(container) { - this.testers = svg.make('g', {'display': 'none'}); + this.testers = svg.make('g', { + // Firefox fails to measure non-displayed text + 'display': firefox ? 'block' : 'none', + 'visibility': 'hidden', + }); this.container = container; this.cache = new Map(); }