Revert 400 and 420 (#422)

* revert #400 font file

* Revert "Revert "Set scale for export images (#416)" (#420)"

This reverts commit d603921234.
This commit is contained in:
David Luzar 2020-01-17 15:43:24 +01:00 committed by Lipis
parent d603921234
commit 6892348c3d
10 changed files with 88 additions and 62 deletions

View file

@ -174,10 +174,12 @@ export function getExportCanvasPreview(
{
exportBackground,
exportPadding = 10,
viewBackgroundColor
viewBackgroundColor,
scale = 1
}: {
exportBackground: boolean;
exportPadding?: number;
scale?: number;
viewBackgroundColor: string;
}
) {
@ -200,8 +202,13 @@ export function getExportCanvasPreview(
}
const tempCanvas = document.createElement("canvas");
tempCanvas.width = distance(subCanvasX1, subCanvasX2) + exportPadding * 2;
tempCanvas.height = distance(subCanvasY1, subCanvasY2) + exportPadding * 2;
const width = distance(subCanvasX1, subCanvasX2) + exportPadding * 2;
const height = distance(subCanvasY1, subCanvasY2) + exportPadding * 2;
tempCanvas.style.width = width + "px";
tempCanvas.style.height = height + "px";
tempCanvas.width = width * scale;
tempCanvas.height = height * scale;
tempCanvas.getContext("2d")?.scale(scale, scale);
renderScene(
elements,
@ -230,58 +237,27 @@ export async function exportCanvas(
exportBackground,
exportPadding = 10,
viewBackgroundColor,
name
name,
scale = 1
}: {
exportBackground: boolean;
exportPadding?: number;
viewBackgroundColor: string;
scrollX: number;
scrollY: number;
name: string;
scale?: number;
}
) {
if (!elements.length) return window.alert("Cannot export empty canvas.");
// calculate smallest area to fit the contents in
let subCanvasX1 = Infinity;
let subCanvasX2 = 0;
let subCanvasY1 = Infinity;
let subCanvasY2 = 0;
elements.forEach(element => {
const [x1, y1, x2, y2] = getElementAbsoluteCoords(element);
subCanvasX1 = Math.min(subCanvasX1, x1);
subCanvasY1 = Math.min(subCanvasY1, y1);
subCanvasX2 = Math.max(subCanvasX2, x2);
subCanvasY2 = Math.max(subCanvasY2, y2);
const tempCanvas = getExportCanvasPreview(elements, {
exportBackground,
viewBackgroundColor,
exportPadding,
scale
});
function distance(x: number, y: number) {
return Math.abs(x > y ? x - y : y - x);
}
const tempCanvas = document.createElement("canvas");
tempCanvas.style.display = "none";
document.body.appendChild(tempCanvas);
tempCanvas.width = distance(subCanvasX1, subCanvasX2) + exportPadding * 2;
tempCanvas.height = distance(subCanvasY1, subCanvasY2) + exportPadding * 2;
renderScene(
elements,
rough.canvas(tempCanvas),
tempCanvas,
{
viewBackgroundColor: exportBackground ? viewBackgroundColor : null,
scrollX: 0,
scrollY: 0
},
{
offsetX: -subCanvasX1 + exportPadding,
offsetY: -subCanvasY1 + exportPadding,
renderScrollbars: false,
renderSelection: false
}
);
if (type === "png") {
const fileName = `${name}.png`;