im crazy as fuck
This commit is contained in:
arussac
210
js/index.js
210
js/index.js
@@ -26,13 +26,16 @@ function formatStatus(status) {
|
||||
|
||||
function setupCarousel(global_project_list) {
|
||||
const formContainer = document.getElementById('form-container');
|
||||
const carousel = document.getElementById('carousel');
|
||||
const carouselDots = document.getElementById('carousel-dots');
|
||||
let currentIndex = 0;
|
||||
|
||||
function showForm() {
|
||||
formContainer.style.display = 'flex';
|
||||
formContainer.style.display = 'flex';
|
||||
}
|
||||
|
||||
function hideForm() {
|
||||
formContainer.style.display = 'none';
|
||||
formContainer.style.display = 'none';
|
||||
}
|
||||
|
||||
document.getElementById('show-form-button').addEventListener('click', showForm);
|
||||
@@ -40,105 +43,164 @@ function setupCarousel(global_project_list) {
|
||||
document.getElementById('submit').addEventListener('click', handleFormSubmit);
|
||||
|
||||
async function handleFormSubmit() {
|
||||
const nameProject = document.getElementById('name').value;
|
||||
const description = document.getElementById('description').value;
|
||||
if (nameProject.length === 0 || !checkName(global_project_list, nameProject)) {
|
||||
alert('Le nom : "' + nameProject + '" est déjà pris ou vide ! \n' +
|
||||
'veuillez en trouver un autre');
|
||||
return;
|
||||
}
|
||||
PostNewProject(nameProject, description).then(() => {
|
||||
location.reload();
|
||||
});
|
||||
const nameProject = document.getElementById('name').value;
|
||||
const description = document.getElementById('description').value;
|
||||
if (nameProject.length === 0 || !checkName(global_project_list, nameProject)) {
|
||||
alert('Le nom : "' + nameProject + '" est déjà pris ou vide ! \n' +
|
||||
'veuillez en trouver un autre');
|
||||
return;
|
||||
}
|
||||
PostNewProject(nameProject, description).then(() => {
|
||||
location.reload();
|
||||
});
|
||||
}
|
||||
|
||||
function checkName(Projects, name) {
|
||||
let res = true;
|
||||
Projects.forEach(project => {
|
||||
const ProjectName = project.name;
|
||||
if (ProjectName === name)
|
||||
res = false;
|
||||
});
|
||||
return res;
|
||||
let res = true;
|
||||
Projects.forEach(project => {
|
||||
const ProjectName = project.name;
|
||||
if (ProjectName === name)
|
||||
res = false;
|
||||
});
|
||||
return res;
|
||||
}
|
||||
|
||||
const carousel = document.getElementById('carousel');
|
||||
let currentIndex = 0;
|
||||
|
||||
function updateCarousel() {
|
||||
const projectWidth = document.querySelector('.project').clientWidth;
|
||||
carousel.style.transform = `translateX(-${currentIndex * projectWidth}px)`;
|
||||
const projectWidth = document.querySelector('.project').clientWidth;
|
||||
carousel.style.transform = `translateX(-${currentIndex * projectWidth}px)`;
|
||||
updateDots();
|
||||
}
|
||||
|
||||
function updateDots() {
|
||||
const dots = document.querySelectorAll('.dot');
|
||||
dots.forEach((dot, index) => {
|
||||
dot.classList.toggle('active', index === currentIndex);
|
||||
});
|
||||
}
|
||||
|
||||
function showPrevProject() {
|
||||
if (currentIndex > 0) {
|
||||
currentIndex--;
|
||||
updateCarousel();
|
||||
} else {
|
||||
currentIndex = global_project_list.length - 1;
|
||||
updateCarousel();
|
||||
}
|
||||
if (currentIndex > 0) {
|
||||
currentIndex--;
|
||||
updateCarousel();
|
||||
} else {
|
||||
currentIndex = global_project_list.length - 1;
|
||||
updateCarousel();
|
||||
}
|
||||
}
|
||||
|
||||
function showNextProject() {
|
||||
if (currentIndex < global_project_list.length - 1) {
|
||||
currentIndex++;
|
||||
updateCarousel();
|
||||
} else {
|
||||
currentIndex = 0;
|
||||
updateCarousel();
|
||||
}
|
||||
}
|
||||
if (currentIndex < global_project_list.length - 1) {
|
||||
currentIndex++;
|
||||
updateCarousel();
|
||||
} else {
|
||||
currentIndex = 0;
|
||||
updateCarousel();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
document.getElementById('prev-button').addEventListener('click', showPrevProject);
|
||||
document.getElementById('next-button').addEventListener('click', showNextProject);
|
||||
|
||||
// Populate the carousel with project data
|
||||
global_project_list.forEach(project => {
|
||||
const projectDiv = document.createElement('div');
|
||||
projectDiv.classList.add('project');
|
||||
projectDiv.innerHTML = `
|
||||
<h2>Nom : ${project.name}</h2>
|
||||
<p>Date : ${formatDate(project.start_date)}</p>
|
||||
const letter = ['a', 'b', 'c', 'd', 'e', 'f','g','h','i','j','k','l','m','n','o','p','q','r','s','t'];
|
||||
const degGlobal = 360 / global_project_list.length;
|
||||
|
||||
var carousel_css = $(".carousel"),
|
||||
currdeg = 0
|
||||
|
||||
global_project_list.forEach((project, index) => {
|
||||
const projectDiv = document.createElement('div');
|
||||
projectDiv.classList.add('project');
|
||||
projectDiv.classList.add('item');
|
||||
projectDiv.classList.add(letter[index]);
|
||||
projectDiv.innerHTML = `
|
||||
<h2>${project.name}</h2>
|
||||
<p>${formatDate(project.start_date)}</p>
|
||||
<p>Status : ${formatStatus(parseInt(project.status))}</p>
|
||||
<div class="project_buttons">
|
||||
<button class="default-access-button">détails de ${project.name}</button>
|
||||
<button class="default-delete-button">Supprimer</button>
|
||||
<button class="default-access-button">détails de ${project.name}</button>
|
||||
<button class="default-delete-button">Supprimer</button>
|
||||
</div>
|
||||
`;
|
||||
carousel.appendChild(projectDiv);
|
||||
`;
|
||||
carousel.appendChild(projectDiv);
|
||||
document.querySelector('.'.concat(letter[index])).style=`transform: rotateY(${index * degGlobal}deg) translateZ(250px);`;
|
||||
|
||||
// Add event listener for project details button
|
||||
const detailButton = projectDiv.querySelector('.default-access-button');
|
||||
detailButton.addEventListener('click', (event) => {
|
||||
event.stopPropagation();
|
||||
window.location.href = `html/projet_detail.html?id=${project.id}`;
|
||||
change_current_project(global_project_list.indexOf(project));
|
||||
});
|
||||
// Add event listener for project details button
|
||||
const detailButton = projectDiv.querySelector('.default-access-button');
|
||||
detailButton.addEventListener('click', (event) => {
|
||||
event.stopPropagation();
|
||||
window.location.href = `html/projet_detail.html?id=${project.id}`;
|
||||
change_current_project(global_project_list.indexOf(project));
|
||||
});
|
||||
|
||||
// Add event listener for project delete button
|
||||
const deleteButton = projectDiv.querySelector('.default-delete-button');
|
||||
deleteButton.addEventListener('click', (event) => {
|
||||
event.stopPropagation();
|
||||
const projectName = project.name;
|
||||
// Add event listener for project delete button
|
||||
const deleteButton = projectDiv.querySelector('.default-delete-button');
|
||||
deleteButton.addEventListener('click', (event) => {
|
||||
event.stopPropagation();
|
||||
const projectName = project.name;
|
||||
|
||||
document.getElementById('alertMessage').textContent = `Veux-tu vraiment supprimer le projet : ${projectName} ?`;
|
||||
document.getElementById('customAlert').style.display = 'block';
|
||||
document.getElementById('alertMessage').textContent = `Veux-tu vraiment supprimer le projet : ${projectName} ?`;
|
||||
document.getElementById('customAlert').style.display = 'block';
|
||||
|
||||
document.getElementById('okBtn').onclick = function() {
|
||||
document.getElementById('customAlert').style.display = 'none';
|
||||
// Call your delete function here
|
||||
deleteProject(project.id).then(() => {
|
||||
location.reload();
|
||||
document.getElementById('okBtn').onclick = function () {
|
||||
document.getElementById('customAlert').style.display = 'none';
|
||||
// Call your delete function here
|
||||
deleteProject(project.id).then(() => {
|
||||
location.reload();
|
||||
});
|
||||
};
|
||||
|
||||
document.getElementById('cancelBtn').onclick = function () {
|
||||
document.getElementById('customAlert').style.display = 'none';
|
||||
};
|
||||
});
|
||||
|
||||
// Create a dot for each project
|
||||
const dot = document.createElement('div');
|
||||
dot.classList.add('dot');
|
||||
dot.addEventListener('click', () => {
|
||||
const targetDeg = index * degGlobal;
|
||||
const diff = targetDeg - currdeg;
|
||||
currdeg +=diff;
|
||||
currdeg=-currdeg;
|
||||
currentIndex = index;
|
||||
carousel_css.css({
|
||||
"-webkit-transform": `rotateY(${currdeg}deg)`,
|
||||
"-moz-transform": `rotateY(${currdeg}deg)`,
|
||||
"-o-transform": `rotateY(${currdeg}deg)`,
|
||||
"transform": `rotateY(${currdeg}deg)`
|
||||
});
|
||||
};
|
||||
|
||||
document.getElementById('cancelBtn').onclick = function() {
|
||||
document.getElementById('customAlert').style.display = 'none';
|
||||
};
|
||||
});
|
||||
updateDots(); // Update active dot styles
|
||||
});
|
||||
carouselDots.appendChild(dot);
|
||||
});
|
||||
|
||||
// Initial update to set the correct position
|
||||
updateCarousel();
|
||||
|
||||
|
||||
|
||||
|
||||
$(".next").on("click", { d: "n" }, rotate);
|
||||
$(".prev").on("click", { d: "p" }, rotate);
|
||||
|
||||
function rotate(e){
|
||||
if(e.data.d=="n"){
|
||||
currdeg = currdeg - degGlobal;
|
||||
}
|
||||
if(e.data.d=="p"){
|
||||
currdeg = currdeg + degGlobal;
|
||||
}
|
||||
if(currdeg > 360){
|
||||
currdeg = currdeg%360;
|
||||
}
|
||||
carousel_css.css({
|
||||
"-webkit-transform": "rotateY("+currdeg+"deg)",
|
||||
"-moz-transform": "rotateY("+currdeg+"deg)",
|
||||
"-o-transform": "rotateY("+currdeg+"deg)",
|
||||
"transform": "rotateY("+currdeg+"deg)"
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user