', {class: 'posts-02__item posts-02__item--accent posts-02__item-scrollable', href: item.href});
const postItemText = $('
', {class: 'posts-02__text'});
const postItemTitle = $('', {class: 'posts-02__title', text: item.title});
const postItemInfo = $('
', {class: 'posts-02__title', text: item.title});
const postItemInfo = $('', {class: 'posts-02__info', text: item.info});
const postItemImgBox = $('', {class: 'posts-02__img_box'});
const postItemImage = $('![]()
', {class: 'posts-02__img', src: item.image});
postItemText.append(postItemTitle, postItemInfo);
postItemImgBox.append(postItemImage);
postItem.append(postItemText, postItemImgBox);
return postItem;
});
wrapperIdentifier.html(htmlGen);
}
// Searchbar filter
function filteredAndSearched(search, block = 0, container = null) {
const gotDataBlock = window['dataBlock' + block];
const projects = gotDataBlock.projects.filter((project) => {
return (
(project.nom.toLowerCase().includes(search.toLowerCase()) ||
project.metier.toLowerCase().includes(search.toLowerCase()) ||
project.title.toLowerCase().includes(search.toLowerCase())) &&
project.category.indexOf(gotDataBlock.currentFilter) !== -1
);
});
if (container === null) {
generateProjects(projects, $('.projects'));
} else {
const projectContainer = $('.' + container);
generateProjects(projects, projectContainer, true, gotDataBlock.projectsTextColor, gotDataBlock.projectsBackgroundColor);
}
}
// Set category filter
function setFilter(thiis, category, block = 0, container = null, description = null) {
const gotDataBlock = window['dataBlock' + block];
$('.filter').removeClass('active');
$(thiis).addClass('active');
const selected = gotDataBlock.filterButtons.filter((button) => { return button.value === category })[0];
this.currentFilter = selected.value;
const projects = gotDataBlock.projects.filter((project) => {
return project.category.includes(category);
});
if (description !== null) {
$('.' + description).text(gotDataBlock.categories[category]);
}
if (container === null) {
generateProjects(projects, $('.projects'));
} else {
const projectContainer = $('.' + container);
generateProjects(projects, projectContainer, true, gotDataBlock.projectsTextColor, gotDataBlock.projectsBackgroundColor);
}
}
// Bubbel Navbar
function setBubbleFilter(thiis, category, block = 0, container = null, cards = true) {
const gotDataBlock = window['dataBlock' + block];
$('.bubbleNavItem').removeClass('active');
$(thiis).addClass('active');
const selected = gotDataBlock.filterButtons.filter((button) => { return button.value === category })[0];
this.currentFilter = selected.value;
const projects = gotDataBlock.list.filter((project) => {
return project.category.includes(category);
});
if (cards) {
generateCards(projects, container);
} else {
generateLongs(projects, container);
}
}
function alloGetTimeDifference(targetDateTime) {
const now = new Date();
const targetDate = new Date(targetDateTime);
if (targetDate < now) return false;
const difference = targetDate - now;
const days = Math.floor(difference / (1000 * 60 * 60 * 24));
const hours = Math.floor((difference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
const minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60));
const seconds = Math.floor((difference % (1000 * 60)) / 1000);
return { days, hours, minutes, seconds };
}
function alloStartCounter(days, hours, minutes, seconds, uniqId) {
const interval = setInterval(() => {
if (seconds > 0) {
seconds--;
$('.seconds' + uniqId).text(seconds);
} else {
seconds = 59;
$('.seconds' + uniqId).text(seconds);
if (minutes > 0) {
minutes--;
$('.minutes' + uniqId).text(minutes);
} else {
minutes = 59;
$('.minutes' + uniqId).text(minutes);
if (hours > 0) {
hours--;
$('.hours' + uniqId).text(hours);
} else {
hours = 23;
$('.hours' + uniqId).text(hours);
if (days > 0) {
days--;
$('.days' + uniqId).text(days);
} else {
clearInterval(interval);
}
}
}
}
}, 1000);
}
function alloShowPopup(id) {
$('.popup' + id).show();
}
// ================== BLOCK 0
function Block0(data) {
if (data.visible !== 'oui') return;
const parentDiv = $('');
const innerDiv = $('', {
class: 'page-component__wrapper',
style: 'z-index: 15; padding-top: 50px; padding-bottom: 50px'
}).css('background-color', data.backgroundColor);
const containerDiv1 = $('', {class: 'containor container--small'});
const containerDiv2 = $('', {class: 'containor container--mid title-container'});
// Randoms
const randomCategoryDescription = "categoryDescription" + Math.floor(Math.random() * 1000000000);
// TITRE / DESCRIPTION
const titleBox = $('', {class: 'title-box title-box--center', style: 'margin-bottom:20px;'});
const heading = $('', {class: 'heading', text: data.title, style: 'color:' + data.textColor});
titleBox.append(heading);
const contentBox = $('', {class: 'title-box__text content_box'});
const contentParagraph = $('', {text: data.text, style: 'color: ' + data.textColor});
contentBox.append(contentParagraph);
titleBox.append(contentBox);
containerDiv1.append(titleBox);
innerDiv.append(containerDiv1);
const projectsContainer = $('', {class: 'projects'});
const filtersContainer = document.createElement('div');
filtersContainer.className = 'filters';
data.filterButtons.forEach(button => {
const filterButton = document.createElement('button');
const activeClass = (button.value === data.currentFilter) ? 'active' : '';
filterButton.className = 'filter ' + activeClass;
filterButton.textContent = button.label;
filterButton.setAttribute('onclick', `setFilter(this, '${button.value}', 0, null, '${randomCategoryDescription}')`);
filterButton.style.color = data.listColor;
filtersContainer.appendChild(filterButton);
});
const searchWrapper = $('').addClass('search-wrapper');
const selectElement = $('
', {class: 'posts-02__img_box'});
const postItemImage = $('![]()
', {class: 'posts-02__img', src: item.image});
postItemText.append(postItemTitle, postItemInfo);
postItemImgBox.append(postItemImage);
postItem.append(postItemText, postItemImgBox);
return postItem;
});
wrapperIdentifier.html(htmlGen);
}
// Searchbar filter
function filteredAndSearched(search, block = 0, container = null) {
const gotDataBlock = window['dataBlock' + block];
const projects = gotDataBlock.projects.filter((project) => {
return (
(project.nom.toLowerCase().includes(search.toLowerCase()) ||
project.metier.toLowerCase().includes(search.toLowerCase()) ||
project.title.toLowerCase().includes(search.toLowerCase())) &&
project.category.indexOf(gotDataBlock.currentFilter) !== -1
);
});
if (container === null) {
generateProjects(projects, $('.projects'));
} else {
const projectContainer = $('.' + container);
generateProjects(projects, projectContainer, true, gotDataBlock.projectsTextColor, gotDataBlock.projectsBackgroundColor);
}
}
// Set category filter
function setFilter(thiis, category, block = 0, container = null, description = null) {
const gotDataBlock = window['dataBlock' + block];
$('.filter').removeClass('active');
$(thiis).addClass('active');
const selected = gotDataBlock.filterButtons.filter((button) => { return button.value === category })[0];
this.currentFilter = selected.value;
const projects = gotDataBlock.projects.filter((project) => {
return project.category.includes(category);
});
if (description !== null) {
$('.' + description).text(gotDataBlock.categories[category]);
}
if (container === null) {
generateProjects(projects, $('.projects'));
} else {
const projectContainer = $('.' + container);
generateProjects(projects, projectContainer, true, gotDataBlock.projectsTextColor, gotDataBlock.projectsBackgroundColor);
}
}
// Bubbel Navbar
function setBubbleFilter(thiis, category, block = 0, container = null, cards = true) {
const gotDataBlock = window['dataBlock' + block];
$('.bubbleNavItem').removeClass('active');
$(thiis).addClass('active');
const selected = gotDataBlock.filterButtons.filter((button) => { return button.value === category })[0];
this.currentFilter = selected.value;
const projects = gotDataBlock.list.filter((project) => {
return project.category.includes(category);
});
if (cards) {
generateCards(projects, container);
} else {
generateLongs(projects, container);
}
}
function alloGetTimeDifference(targetDateTime) {
const now = new Date();
const targetDate = new Date(targetDateTime);
if (targetDate < now) return false;
const difference = targetDate - now;
const days = Math.floor(difference / (1000 * 60 * 60 * 24));
const hours = Math.floor((difference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
const minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60));
const seconds = Math.floor((difference % (1000 * 60)) / 1000);
return { days, hours, minutes, seconds };
}
function alloStartCounter(days, hours, minutes, seconds, uniqId) {
const interval = setInterval(() => {
if (seconds > 0) {
seconds--;
$('.seconds' + uniqId).text(seconds);
} else {
seconds = 59;
$('.seconds' + uniqId).text(seconds);
if (minutes > 0) {
minutes--;
$('.minutes' + uniqId).text(minutes);
} else {
minutes = 59;
$('.minutes' + uniqId).text(minutes);
if (hours > 0) {
hours--;
$('.hours' + uniqId).text(hours);
} else {
hours = 23;
$('.hours' + uniqId).text(hours);
if (days > 0) {
days--;
$('.days' + uniqId).text(days);
} else {
clearInterval(interval);
}
}
}
}
}, 1000);
}
function alloShowPopup(id) {
$('.popup' + id).show();
}
// ================== BLOCK 0
function Block0(data) {
if (data.visible !== 'oui') return;
const parentDiv = $('
');
const innerDiv = $('
', {
class: 'page-component__wrapper',
style: 'z-index: 15; padding-top: 50px; padding-bottom: 50px'
}).css('background-color', data.backgroundColor);
const containerDiv1 = $('
', {class: 'containor container--small'});
const containerDiv2 = $('
', {class: 'containor container--mid title-container'});
// Randoms
const randomCategoryDescription = "categoryDescription" + Math.floor(Math.random() * 1000000000);
// TITRE / DESCRIPTION
const titleBox = $('
', {class: 'title-box title-box--center', style: 'margin-bottom:20px;'});
const heading = $('', {class: 'heading', text: data.title, style: 'color:' + data.textColor});
titleBox.append(heading);
const contentBox = $('
', {class: 'heading', text: data.title, style: 'color:' + data.textColor});
titleBox.append(heading);
const contentBox = $('', {class: 'title-box__text content_box'});
const contentParagraph = $('', {text: data.text, style: 'color: ' + data.textColor});
contentBox.append(contentParagraph);
titleBox.append(contentBox);
containerDiv1.append(titleBox);
innerDiv.append(containerDiv1);
const projectsContainer = $('', {class: 'projects'});
const filtersContainer = document.createElement('div');
filtersContainer.className = 'filters';
data.filterButtons.forEach(button => {
const filterButton = document.createElement('button');
const activeClass = (button.value === data.currentFilter) ? 'active' : '';
filterButton.className = 'filter ' + activeClass;
filterButton.textContent = button.label;
filterButton.setAttribute('onclick', `setFilter(this, '${button.value}', 0, null, '${randomCategoryDescription}')`);
filterButton.style.color = data.listColor;
filtersContainer.appendChild(filterButton);
});
const searchWrapper = $('').addClass('search-wrapper');
const selectElement = $('
', {text: data.text, style: 'color: ' + data.textColor});
contentBox.append(contentParagraph);
titleBox.append(contentBox);
containerDiv1.append(titleBox);
innerDiv.append(containerDiv1);
const projectsContainer = $('', {class: 'projects'});
const filtersContainer = document.createElement('div');
filtersContainer.className = 'filters';
data.filterButtons.forEach(button => {
const filterButton = document.createElement('button');
const activeClass = (button.value === data.currentFilter) ? 'active' : '';
filterButton.className = 'filter ' + activeClass;
filterButton.textContent = button.label;
filterButton.setAttribute('onclick', `setFilter(this, '${button.value}', 0, null, '${randomCategoryDescription}')`);
filterButton.style.color = data.listColor;
filtersContainer.appendChild(filterButton);
});
const searchWrapper = $('').addClass('search-wrapper');
const selectElement = $('