Nono/gesthub
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

modif js

Browse Source
This commit is contained in:
nino
2025-05-17 23:51:56 +02:00
parent 5009865f95
commit 7050cd3d73
2 changed files with 96 additions and 97 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
web/static/assets/js/index.js Normal file
View File

@@ -0,0 +1,83 @@
// mode dark pour les gens qui ne sortent pas de chez eux voir la lumiere du jours
document.getElementById("toggle-darkmode").onclick = () => {
document.body.classList.toggle("dark");
};
// profil
document.querySelector(".profile-menu").addEventListener("click", (e) => {
e.stopPropagation();
document.querySelector(".profile-menu").classList.toggle("active");
});
// notif
document.querySelector(".notification").addEventListener("click", (e) => {
e.stopPropagation();
document.querySelector(".notification").classList.toggle("active");
});
// syteme contact
const contactOptions = document.querySelectorAll('.contact-option:not(.expandable)');
const contactModal = document.getElementById('contactModal');
const recipientName = document.getElementById('recipient-name');
const cancelBtn = document.getElementById('cancel-message');
const sendBtn = document.getElementById('send-message');
const dropdown = document.querySelector('.dropdown');
const nestedDropdowns = document.querySelectorAll('.nested-dropdown');
//menu princ
dropdown.addEventListener('click', (e) => {
e.stopPropagation();
const content = dropdown.querySelector('.dropdown-content');
content.style.display = content.style.display === 'block' ? 'none' : 'block';
});
// Gestion des sous-menus
nestedDropdowns.forEach(dropdown => {
dropdown.addEventListener('click', (e) => {
e.stopPropagation();
const nestedContent = dropdown.querySelector('.nested-content');
nestedContent.style.display = nestedContent.style.display === 'block' ? 'none' : 'block';
});
});
// Fermer les menus quand on clique ailleurs
document.addEventListener('click', () => {
document.querySelector('.dropdown-content').style.display = 'none';
document.querySelectorAll('.nested-content').forEach(el => {
el.style.display = 'none';
});
});
contactOptions.forEach(option => {
option.addEventListener('click', (e) => {
e.preventDefault();
if (option.dataset.role) {
recipientName.textContent = option.dataset.role;
contactModal.style.display = 'block';
}
});
});
document.querySelector('.close-modal').addEventListener('click', () => {
contactModal.style.display = 'none';
});
cancelBtn.addEventListener('click', () => {
contactModal.style.display = 'none';
});
sendBtn.addEventListener('click', () => {
const message = document.getElementById('message-content').value;
if (message.trim() !== '') {
contactModal.style.display = 'none';
document.getElementById('message-content').value = '';
}
});
// Fermer la modale si on clique en dehors
window.addEventListener('click', (e) => {
if (e.target === contactModal) {
contactModal.style.display = 'none';
}
});

110
web/templates/view/index.html
View File

@@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/> <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>HUB Nexium - Interface Web</title> <title>Gesthub</title>
<link rel="stylesheet" href="{{ url_for('static', filename='assets/css/index.css') }}" /> <link rel="stylesheet" href="{{ url_for('static', filename='assets/css/index.css') }}" />
</head> </head>
<body> <body>
@@ -69,108 +69,24 @@
<!-- Centre pr widget trello --> <!-- Centre pr widget trello -->
<section class="center-column"> <section class="center-column">
<h1 class="main-title">HUB Nexium</h1> <h1 class="main-title">Gesthub</h1>
<div class="trello">Zone Trello</div> <div class="trello">Zone Trello</div>
</section> </section>
<!-- colonne droite pr partie info user je vais changer ca dans cet emplacement <!-- colonne droite pr partie info user je vais changer ca dans cet emplacement
je vais metrre des boutons et autres features comme des doc etc ou jsp je vais metrre des boutons et autres features comme des doc etc ou jsp
je m en occupe --> je m en occupe -->
<!-- Colonne droite avec boutons simples --> <!-- Colonne droite avec boutons simples -->
<aside class="right-column"> <aside class="right-column">
<div class="button-container"> <div class="button-container">
<button class="simple-btn">Projet</button> <button class="simple-btn">Projet</button>
<button class="simple-btn">GDD Global</button> <button class="simple-btn">GDD Global</button>
<button class="simple-btn">Bible 3D Art</button> <button class="simple-btn">Bible 3D Art</button>
<button class="simple-btn">Bible GameDev</button> <button class="simple-btn">Bible GameDev</button>
<button class="simple-btn">Réglement du HUB</button> <button class="simple-btn">Réglement du HUB</button>
</div> </div>
</aside> </aside>
</main> </main>
<script> <script src="{{ url_for('static', filename='assets/js/index.js') }}"></script>
// mode dark pour les gens qui ne sortent pas de chez eux voir la lumiere du jours
document.getElementById("toggle-darkmode").onclick = () => {
document.body.classList.toggle("dark");
};
// profil
document.querySelector(".profile-menu").addEventListener("click", (e) => {
e.stopPropagation();
document.querySelector(".profile-menu").classList.toggle("active");
});
// notif
document.querySelector(".notification").addEventListener("click", (e) => {
e.stopPropagation();
document.querySelector(".notification").classList.toggle("active");
});
// ssyteme contact
const contactOptions = document.querySelectorAll('.contact-option:not(.expandable)');
const contactModal = document.getElementById('contactModal');
const recipientName = document.getElementById('recipient-name');
const cancelBtn = document.getElementById('cancel-message');
const sendBtn = document.getElementById('send-message');
const dropdown = document.querySelector('.dropdown');
const nestedDropdowns = document.querySelectorAll('.nested-dropdown');
//menu princ
dropdown.addEventListener('click', (e) => {
e.stopPropagation();
const content = dropdown.querySelector('.dropdown-content');
content.style.display = content.style.display === 'block' ? 'none' : 'block';
});
// Gestion des sous-menus
nestedDropdowns.forEach(dropdown => {
dropdown.addEventListener('click', (e) => {
e.stopPropagation();
const nestedContent = dropdown.querySelector('.nested-content');
nestedContent.style.display = nestedContent.style.display === 'block' ? 'none' : 'block';
});
});
// Fermer les menus quand on clique ailleurs
document.addEventListener('click', () => {
document.querySelector('.dropdown-content').style.display = 'none';
document.querySelectorAll('.nested-content').forEach(el => {
el.style.display = 'none';
});
});
contactOptions.forEach(option => {
option.addEventListener('click', (e) => {
e.preventDefault();
if (option.dataset.role) {
recipientName.textContent = option.dataset.role;
contactModal.style.display = 'block';
}
});
});
document.querySelector('.close-modal').addEventListener('click', () => {
contactModal.style.display = 'none';
});
cancelBtn.addEventListener('click', () => {
contactModal.style.display = 'none';
});
sendBtn.addEventListener('click', () => {
const message = document.getElementById('message-content').value;
if (message.trim() !== '') {
contactModal.style.display = 'none';
document.getElementById('message-content').value = '';
}
});
// Fermer la modale si on clique en dehors
window.addEventListener('click', (e) => {
if (e.target === contactModal) {
contactModal.style.display = 'none';
}
});
</script>
</body> </body>
</html> </html>