diff --git a/canavs-api/basic-image-example/.vscode/settings.json b/canavs-api/basic-image-example/.vscode/settings.json index e695fc7..601efbd 100644 --- a/canavs-api/basic-image-example/.vscode/settings.json +++ b/canavs-api/basic-image-example/.vscode/settings.json @@ -7,5 +7,5 @@ "prettier.singleQuote": true, "prettier.semi": true, "editor.formatOnSave": true, - "cSpell.words": [] + "cSpell.words": ["tileset"] } diff --git a/canavs-api/basic-image-example/src/encoded-image.js b/canavs-api/basic-image-example/src/encoded-image.js new file mode 100644 index 0000000..9b629c0 --- /dev/null +++ b/canavs-api/basic-image-example/src/encoded-image.js @@ -0,0 +1,2 @@ +export const encodedImage = + 'data:image/png;base64,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'; diff --git a/canavs-api/basic-image-example/src/main.js b/canavs-api/basic-image-example/src/main.js index a44833b..995743d 100644 --- a/canavs-api/basic-image-example/src/main.js +++ b/canavs-api/basic-image-example/src/main.js @@ -1,3 +1,40 @@ +import { encodedImage } from './encoded-image.js'; + +/** + * @param {string} src + * @returns {Promise} + */ +function loadImage(src) { + return new Promise((resolve) => { + const img = new Image(); + img.addEventListener( + 'load', + () => { + resolve(img); + }, + false + ); + img.src = src; + }); +} + +/** + * @returns {Promise} + */ +function getEncodedImage() { + return new Promise((resolve) => { + const img = new Image(); + img.addEventListener( + 'load', + () => { + resolve(img); + }, + false + ); + img.src = encodedImage; + }); +} + void (async function () { const canvas = document.getElementById('game'); if (!(canvas instanceof HTMLCanvasElement)) { @@ -10,5 +47,18 @@ void (async function () { return; } - // TODO: add main logic + const img = await loadImage('assets/grunge-tileset.png'); + // const img = await getEncodedImage(); + + // example of drawing image directly + // drawImage(image, dx, dy) + ctx.drawImage(img, 0, 0); + + // example of scaling by providing width and height on destination + // drawImage(image, dx, dy, dWidth, dHeight) + // ctx.drawImage(img, 0, 0, img.width * 1.5, img.height * 1.5); + + // example of slicing image by providing the source image values and destination canvas details + // drawImage(image, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight) + // ctx.drawImage(img, 200, 0, 200, 160, 100, 0, 200, 160); })();