42/42_INT_14_transcendence
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ajout de l'upload. Reste un mystérieux problème à régler avec l'extenstion et multer

Browse Source
This commit is contained in:
batche
2022-11-16 19:12:02 +01:00
parent fd61ea56d2
commit f98e1fdb4e
21 changed files with 609 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
srcs/requirements/svelte/api_front/src/pages/profil/updateProfil.svelte
View File

@@ -1,9 +1,10 @@
<script>
import { onMount } from "svelte";
import { onMount } from "svelte";
let avatarUser, postVar, newAvatar, fileinput;
let usernameSv = "";
let image_urlSv = "";
let uploadAvatarSuccess = false;
let gAuth = false;
let errors = {usernameSv, image_urlSv};
onMount(async () => {
@@ -11,11 +12,29 @@
then(response => response.json()).
then(data => {
usernameSv = data.username;
image_urlSv = data.image_url;
gAuth = data.isEnabledTwoFactorAuth;
});
await fetch("http://transcendance:8080/api/v2/user/avatar", {method: "GET"}).
then(response => {return response.blob()}).
then(data => {
const url = URL.createObjectURL(data);
avatarUser = url;
});
});
$: uploadAvatar = async() => {
const data = new FormData();
data.append("file", newAvatar[0]);
console.log(data);
await fetch("http://transcendance:8080/api/v2/user/avatar",
{
method : 'POST',
body : data,
})
.then(uploadAvatarSuccess = true)
.catch(errors.image_urlSv = "Something went wrong." )
}
$: submit = async() => {
errors.usernameSv = "";
errors.image_urlSv ="";
@@ -23,10 +42,6 @@
errors.usernameSv = "Username is required";
return;
}
if (image_urlSv === undefined || image_urlSv.trim() === "") {
errors.image_urlSv = "image_url is required";
return;
}
console.log(usernameSv);
await fetch("http://transcendance:8080/api/v2/user/",
{
@@ -36,46 +51,59 @@
},
body: JSON.stringify({
"username" : usernameSv,
"image_url" : image_urlSv,
"isEnabledTwoFactorAuth" : gAuth
})
})
};
}
</script>
<body>
<main class="form-signin w-100 m-auto">
<div class="p-20">
{#if errors.image_urlSv}
<div class="alert alert-danger" role="alert">
{errors.image_urlSv}
</div>
{/if}
{#if errors.username}
<div class="alert alert-danger" role="alert">
{errors.username}
</div>
{/if}
{#if errors.image_url}
{#if uploadAvatarSuccess}
<div class="alert alert-danger" role="alert">
{errors.image_url}
You avatar has been successfully uploaded !
</div>
{/if}
<form on:submit|preventDefault={uploadAvatar}>
{#if avatarUser}
<img class="avatar" src={avatarUser} alt="" />
{/if}
<input
type="text"
bind:value={postVar}
placeholder={"choose your file"}
/>
<br />
<input
type="file"
bind:files={newAvatar} />
<br />
<button type="submit" class="p-2 bg-blue-500 text-white mt-4 px-6">
Choose avatar
</button>
</form>
<form on:submit|preventDefault={submit}>
<label for="username" class="block text-sm text-gray-600">Username</label>
<input id="username" type="text" placeholder=${usernameSv} class="block px-1 py-2 mt-2 border-2 border-gray-100 text-gray-800" bind:value={usernameSv} />
<label for="image_url" class="block text-sm text-gray-600 mt-4">image_url</label>
<input id="image_url" type="image_url" bind:value={image_urlSv} placeholder=${image_urlSv} class="block px-1 py-2 mt-2 border-2 border-gray-100 text-gray-800" />
<div>
<input type="checkbox" bind:checked={gAuth} id="gAuth" name="gAuth">
<label for="gAuth">Enable google authenticator</label>
</div>
<button type="submit" class="p-2 bg-blue-500 text-white mt-4 px-6">
Change
</button>
</form>
</div>
</main>
</body>
<style>
body {