tom/METH_Transcendence
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Site

Browse Source 
- add gif support on pfp and banner
    - center image on pfp and banner in profil page
This commit is contained in:
Kum1ta
2024-09-29 02:15:45 +02:00
parent 31a70311cc
commit 8aac415275
2 changed files with 8 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
docker-compose/requirements/nginx/static/javascript/profilPage/main.js
View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/09/19 23:08:31 by edbernar #+# #+# */ /* Created: 2024/09/19 23:08:31 by edbernar #+# #+# */
/* Updated: 2024/09/28 19:47:17 by edbernar ### ########.fr */ /* Updated: 2024/09/29 02:08:41 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
@ -89,7 +89,7 @@ class ProfilPage
inputPfp.click(); inputPfp.click();
}); });
inputPfp.setAttribute('accept', '.png, .jpeg, .jpg, .gif'); inputPfp.setAttribute('accept', '.png, .jpeg, .jpg, .gif');
inputPfp.addEventListener('change', () => inputChange(true)); inputPfp.addEventListener('change', (event) => inputChange(true, event));
editPenBanner = document.getElementsByClassName('editPen')[0]; editPenBanner = document.getElementsByClassName('editPen')[0];
inputBanner = document.getElementById('inputBanner'); inputBanner = document.getElementById('inputBanner');
@ -98,7 +98,7 @@ class ProfilPage
inputBanner.click(); inputBanner.click();
}); });
inputBanner.setAttribute('accept', '.png, .jpeg, .jpg, .gif'); inputBanner.setAttribute('accept', '.png, .jpeg, .jpg, .gif');
inputBanner.addEventListener('change', () => inputChange(false)); inputBanner.addEventListener('change', (event) => inputChange(false, event));
} }
if (userInfo.id != userMeInfo.id) if (userInfo.id != userMeInfo.id)
{ {
@ -142,10 +142,10 @@ function externButtons(userInfo)
discordButton.remove(); discordButton.remove();
} }
function inputChange(isPfp) function inputChange(isPfp, event)
{ {
const reader = new FileReader(); const reader = new FileReader();
const validTypes = ['image/png', 'image/jpeg', 'image/webp'] const validTypes = ['image/png', 'image/jpeg', 'image/webp', 'image/gif'];
const file = event.target.files[0]; const file = event.target.files[0];
function arrayBufferToBase64(buffer) { function arrayBufferToBase64(buffer) {

2
docker-compose/requirements/nginx/static/style/profilPage/profil.css
View File

@ -37,6 +37,7 @@
background-color: #D3D3D3; background-color: #D3D3D3;
margin-bottom: 20px; margin-bottom: 20px;
position: relative; position: relative;
background-position: center;
} }
#profil .background-card img { #profil .background-card img {
@ -59,6 +60,7 @@
background-color: #D3D3D3; background-color: #D3D3D3;
border: 10px solid #020202; border: 10px solid #020202;
position: absolute; position: absolute;
background-position: center;
top: -100px; top: -100px;
left: 40px; left: 40px;
} }