balki/collage-maker
1
0
Fork 0
Code Issues 10 Pull Requests Packages Projects Releases Wiki Activity

Snap button generates collage and shows link

Browse Source 
fixes #3
This commit is contained in:
Balakrishnan Balasubramanian 2023-08-31 23:31:51 -04:00
parent 1c742809a1
commit faa413c9b1
2 changed files with 22 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
web/index.html
View File

@ -69,7 +69,10 @@
<body onload="main()">
<div class="container">
<div class="controls">
<div>
<button class="showbuton" onClick="snap()">Snap Collage</button>
<p><a href="" target="_blank" id="collage-url"></a></p>
</div>
</div>
<div class="imagebox">
<div id="collage" class="image-surface letter-landscape-2">

23
web/index.js
View File

@ -44,9 +44,15 @@ function showCrop() {
}
}
async function ip() {
const resp = await fetch("dummy.txt")
console.log(await resp.text())
async function makeCollage(req) {
const resp = await fetch("make-collage", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(req),
})
return await resp.text();
}
function snap() {
@ -78,7 +84,7 @@ function snap() {
const fsy = elem.offsetTop - cot
const [sx, sy, ex, ey] = cpie.get().points;
const photo = {
image: elem.dataset.collageImageUrl,
image: elem.dataset.collageImageUrl.slice("images/".length),
crop: {
start: {
x: parseInt(sx),
@ -102,6 +108,13 @@ function snap() {
};
req.photos.push(photo)
}
console.log(JSON.stringify(req));
ip()
(async () => {
collagFile = await makeCollage(req)
// const collageUrlA = document.createElement("a");
const collageUrlA = document.getElementById("collage-url");
collageUrlA.href = `collages/${collagFile}`;
collageUrlA.text = `${collagFile} generated`;
})();
}