Support FireFox

This commit is contained in:
David Evans 2017-11-09 21:08:16 +00:00
parent 01e43fd3eb
commit b562120c33
2 changed files with 41 additions and 12 deletions

View File

@ -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 <svg> tag
code = code.replace(
/^<svg/,
'<svg width="' + size.width +
'" height="' + size.height + '" '
);
}
return code;
}
getSVGBlob(renderer) {
getSVGBlob(renderer, size = null) {
return new Blob(
[this.getSVGContent(renderer)],
[this.getSVGContent(renderer, size)],
{type: 'image/svg+xml'}
);
}
getSVGURL(renderer) {
const blob = this.getSVGBlob(renderer);
if(this.latestSVG) {
URL.revokeObjectURL(this.latestSVG);
getSVGURL(renderer, size = null) {
const blob = this.getSVGBlob(renderer, size);
if(size) {
if(this.latestInternalSVG) {
URL.revokeObjectURL(this.latestInternalSVG);
}
this.latestInternalSVG = URL.createObjectURL(blob);
return this.latestInternalSVG;
} else {
if(this.latestSVG) {
URL.revokeObjectURL(this.latestSVG);
}
this.latestSVG = URL.createObjectURL(blob);
return this.latestSVG;
}
this.latestSVG = URL.createObjectURL(blob);
return this.latestSVG;
}
getPNGBlob(renderer, resolution, callback) {
@ -68,7 +90,7 @@ define(() => {
this.canvas.toBlob(callback, 'image/png');
}, {once: true});
img.src = this.getSVGURL(renderer);
img.src = this.getSVGURL(renderer, {width, height});
}
getPNGURL(renderer, resolution, callback) {

View File

@ -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();
}