fri/rg
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Naloga 1: drag and drop

Browse Source
This commit is contained in:
Gašper Dobrovoljc 2024-10-23 15:43:29 +02:00
parent ff56a51b82
commit d825f4e090
No known key found for this signature in database
GPG Key ID: 0E7E037018CFA5A5
2 changed files with 31 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
naloga_1/index.html
View File

@ -7,7 +7,20 @@
<script defer src="script.js"></script> <script defer src="script.js"></script>
</head> </head>
<body style="margin: 0; padding: 0;"> <style>
body {
margin: 0;
padding: 0;
}
#drop-zone {
width: 100vw;
height: 100vh;
}
</style>
<body>
<div id="drop-zone">
<canvas id="canvas" width="512px" height="512px"></canvas> <canvas id="canvas" width="512px" height="512px"></canvas>
</div>
</body> </body>
</html> </html>

23
naloga_1/script.js
View File

@ -1,12 +1,21 @@
async function main() {
const canvas = document.getElementById("canvas"); const canvas = document.getElementById("canvas");
/**
* @type RenderingContext
*/
const ctx = canvas.getContext("2d"); const ctx = canvas.getContext("2d");
const { models, scene } = await fetch("test.json").then(res => res.json()); const dropZone = document.getElementById("drop-zone");
dropZone.addEventListener("dragenter", (e) => e.preventDefault());
dropZone.addEventListener("dragover", (e) => e.preventDefault());
dropZone.addEventListener("drop", (e) => {
const reader = new FileReader();
reader.addEventListener("loadend", async () => {
const data = JSON.parse(reader.result);
await run(data);
});
reader.readAsText(e.dataTransfer.files[0]);
e.preventDefault();
});
async function run({ models, scene }) {
ctx.clearRect(0, 0, canvas.width, canvas.height);
for (const { model, transforms } of scene) { for (const { model, transforms } of scene) {
let m = Matrix.identity(); let m = Matrix.identity();
@ -38,8 +47,6 @@ async function main() {
} }
} }
main();
class Matrix extends Array { class Matrix extends Array {
/** /**
* @param {number[][]} matrix * @param {number[][]} matrix