diff --git a/src/file-renderer/index.js b/src/file-renderer/index.js index 43d826f..4f2a409 100644 --- a/src/file-renderer/index.js +++ b/src/file-renderer/index.js @@ -2,7 +2,7 @@ import { jDataView } from "./jdataview"; import { supportedFormats } from "../format-readers"; import { Pattern } from "./pattern"; -function renderFile(filename, evt, canvas, colorView, stitchesView) { +function renderFile(filename, evt, canvas, colorView, stitchesView, sizeView) { const fileExtension = filename.toLowerCase().split(".").pop(); const view = jDataView(evt.target.result, 0, evt.size); const pattern = new Pattern(); @@ -13,6 +13,7 @@ function renderFile(filename, evt, canvas, colorView, stitchesView) { pattern.drawShapeTo(canvas); pattern.drawColorsTo(colorView); pattern.drawStitchesCountTo(stitchesView); + pattern.drawSizeValuesTo(stitchesView); } function renderAbortMessage(errorMessageRef) { @@ -54,12 +55,13 @@ export default function renderFileToCanvas( canvas, errorMessageRef, colorView, - stitchesView + stitchesView, + sizeView ) { const reader = new FileReader(); reader.onloadend = (evt) => - renderFile(fileObject.name, evt, canvas, colorView, stitchesView); + renderFile(fileObject.name, evt, canvas, colorView, stitchesView, sizeView); reader.abort = (/** @type {any} */ _) => renderAbortMessage(errorMessageRef); reader.onerror = (evt) => renderErrorMessage(evt.target.error.name, errorMessageRef); diff --git a/src/file-renderer/pattern.js b/src/file-renderer/pattern.js index 73a9802..59ebe24 100644 --- a/src/file-renderer/pattern.js +++ b/src/file-renderer/pattern.js @@ -184,4 +184,10 @@ Pattern.prototype.drawStitchesCountTo = function (stitchesContainer) { stitchesContainer.innerHTML += `
Stitches: ${this.stitches.length}
`; }; +Pattern.prototype.drawSizeValuesTo = function (sizeContainer) { + sizeContainer.innerHTML += `
Size (x, y): ${Math.round( + this.right / 10 + )}mm x ${Math.round(this.bottom / 10)}mm
`; +}; + export { Pattern, Color, stitchTypes }; diff --git a/src/lib/CardList.svelte b/src/lib/CardList.svelte index bf76066..2f5c4d5 100644 --- a/src/lib/CardList.svelte +++ b/src/lib/CardList.svelte @@ -5,6 +5,7 @@ let canvasRefs = []; let colorRefs = []; let stitchesRefs = []; + let sizeRefs = []; let errorMessageRef; @@ -13,8 +14,9 @@ {#each Array.from(files) as file, i}
-

{file.name}

+

{file.name}

+
{canvasRefs[i] && @@ -23,7 +25,8 @@ canvasRefs[i], errorMessageRef, colorRefs[i], - stitchesRefs[i] + stitchesRefs[i], + sizeRefs[i] )} {/each}