add: profile avatar

frontend/static/js/api/client.js

@@ -1,4 +1,5 @@
 import { Account } from "./account.js";
+import { Profile } from "./profile.js";
 
 function getCookie(name)
 {
@@ -73,12 +74,26 @@ class Client
         return response;
     }
 
+	async _patch_file(uri, file)
+    {
+        let response = await fetch(this._url + uri, {
+			method: "PATCH",
+			headers: {
+				"X-CSRFToken": getCookie("csrftoken"),
+			},		  
+			body: file,
+		});
+        return response;
+    }
+
 	async login(username, password)
 	{
 		let response = await this._post("/api/accounts/login", {username: username, password: password})
 		let data = await response.json();
-		if (data == "user connected")
+		if (data.id != undefined)
 		{
+			this.me = new Profile(this)
+			await this.me.init(data.id)
 			this.logged = true;
 			return null;
 		}
@@ -95,7 +110,13 @@ class Client
 	{
 		let response = await this._get("/api/accounts/logged");
 		let data = await response.json();
-		return data === "True";
+
+		if (data.id !== undefined)
+		{
+			this.me = new Profile(this)
+			await this.me.init(data.id)
+		}
+		return data.id !== undefined;
 	}
 }
 

frontend/static/js/api/profile.js

@@ -0,0 +1,34 @@
+class Profile
+{
+	constructor (client)
+	{
+		this.client = client;
+		this.username = undefined;
+		this.avatar_url = undefined
+	}
+
+	async init(id)
+	{
+		let response = await this.client._get(`/api/profiles/${id}`);
+		let response_data = await response.json();
+
+		this.id = id;
+		this.username = response_data.username;
+		this.avatar_url = response_data.avatar_url;
+	}
+
+	async change_avatar(form_data)
+	{
+		let response = await this.client._patch_file(`/api/profiles/${this.id}`, form_data);
+		let response_data = await response.json()
+
+		return response_data;
+	}
+
+	async setData (data)
+	{
+		
+	}
+}
+
+export {Profile}

frontend/static/js/views/MeView.js

@@ -91,18 +91,31 @@ export default class extends AbstractAuthentificateView
             if (error_display != null)
                 error_display.innerHTML = response_data[error_field];
         });
+        let avatar = document.getElementById("avatar");
+
+        if (avatar.files[0] !== undefined)
+        {
+            let form_data = new FormData();
+            form_data.append("file", avatar.files[0]);
+            await client.me.change_avatar(form_data)
+        }
     }
     
     async getHtml()
     {
         return `
 			<h1>ME</h1>
-            <input type=text placeholder="username" id="username">
-            <span id="error_username"></span>
-            <input type=password placeholder="new password" id="new_password">
-            <span id="error_new_password"></span>
-            <input type=password placeholder="current password" id="current_password">
-            <span id="error_current_password"></span>
+            <div class="accounts">
+                <input type="text" placeholder="username" id="username">
+                <span id="error_username"></span>
+                <input type=password placeholder="new password" id="new_password">
+                <span id="error_new_password"></span>
+                <input type=password placeholder="current password" id="current_password">
+                <span id="error_current_password"></span>
+            </div>
+            <div class="profile">
+                <input type="file" placeholder="username" id="avatar" accept="image/png, image/jpeg">
+            </div>
             <input type="button" value="Save" id="save-button">
             <span id="error_save"></span>
             <input type="button" value="Delete" id="delete-button">