Quentin Marchand
7 months ago
committed by
GitHub
parent
dec2bd611d
commit
935fefe492
@ -0,0 +1,4 @@ |
||||
name: Module d'accessibilité |
||||
description: Ajoute éléments d'accessibilité pour Pléiade, Sites internets, GRU |
||||
core_version_requirement: ^10 |
||||
type: module |
||||
@ -0,0 +1,13 @@ |
||||
accessibility_tools: |
||||
version: 1.0 |
||||
js: |
||||
js/accessibility_tools.js: {} |
||||
dependencies: |
||||
- core/jquery |
||||
- core/drupal |
||||
- drupal:block |
||||
accessibility_tools_css: |
||||
version: 1.x |
||||
css: |
||||
theme: |
||||
css/accessibility_tools.css: {} |
||||
@ -0,0 +1,17 @@ |
||||
<?php |
||||
|
||||
/** |
||||
* Implements hook_system_info_alter(). |
||||
*/ |
||||
function accessibility_tools_system_info_alter(&$info, $file, $type) { |
||||
// Ajoute une nouvelle région de mise en page pour les blocs. |
||||
$info['regions']['accessibility_tools'] = ('Zone pour l\'Accessibilité'); |
||||
} |
||||
|
||||
function accessibility_tools_preprocess_page(&$variables){ |
||||
//Add the JS library |
||||
$variables['#attached']['library'][] = 'accessibility_tools/accessibility_tools_js'; |
||||
|
||||
//Add the CSS library |
||||
$variables['#attached']['library'][] = 'accessibility_tools/accessibility_tools_css'; |
||||
} |
||||
@ -0,0 +1,3 @@ |
||||
.form-check-input[type=checkbox]{ |
||||
float: inline-end; |
||||
} |
||||
@ -0,0 +1,238 @@ |
||||
(function ($, Drupal, drupalSettings) { |
||||
"use strict"; |
||||
Drupal.behaviors.AccessibilityBehavior = { |
||||
attach: function (context, settings) { |
||||
setTimeout(function () { |
||||
function increaseFontSize() { |
||||
var elements = $('#menuLemon .sidebar-link, .sidebar-nav ul .nav-small-cap, .sidebar-nav ul .sidebar-item .sidebar-link, #mes_applications .sidebar-link', context); |
||||
elements.each(function () { |
||||
var computedFontSize = window.getComputedStyle(this).fontSize; |
||||
var currentFontSize = parseInt(computedFontSize) || 16; |
||||
var newFontSize = currentFontSize + 2; |
||||
this.style.fontSize = newFontSize + 'px'; |
||||
}); |
||||
var currentBodyFontSize = parseInt(document.body.style.fontSize) || 16; |
||||
var newBodyFontSize = currentBodyFontSize + 2; |
||||
document.body.style.fontSize = newBodyFontSize + 'px'; |
||||
} |
||||
|
||||
function decreaseFontSize() { |
||||
var elements = $('#menuLemon .sidebar-link, .sidebar-nav ul .nav-small-cap, .sidebar-nav ul .sidebar-item .sidebar-link, #mes_applications .sidebar-link', context); |
||||
elements.each(function () { |
||||
var computedFontSize = window.getComputedStyle(this).fontSize; |
||||
var currentFontSize = parseInt(computedFontSize) || 16; |
||||
var newFontSize = currentFontSize - 2; |
||||
this.style.fontSize = newFontSize + 'px'; |
||||
}); |
||||
var currentBodyFontSize = parseInt(document.body.style.fontSize) || 16; |
||||
var newBodyFontSize = currentBodyFontSize - 2; |
||||
document.body.style.fontSize = newBodyFontSize + 'px'; |
||||
} |
||||
|
||||
function resetFontSize() { |
||||
var elements = $('#menuLemon .sidebar-link, .sidebar-nav ul .nav-small-cap, .sidebar-nav ul .sidebar-item .sidebar-link, #mes_applications .sidebar-link', context); |
||||
elements.each(function () { |
||||
this.style.fontSize = '18px'; // Réinitialiser à la taille par défaut
|
||||
}); |
||||
document.body.style.fontSize = '16px'; |
||||
} |
||||
|
||||
// Variable pour stocker l'espacement courant
|
||||
let currentSpacing = 0; |
||||
|
||||
function increaseSpaces() { |
||||
currentSpacing += 1; |
||||
document.body.style.letterSpacing = `${currentSpacing}px`; |
||||
} |
||||
|
||||
function decreaseSpaces() { |
||||
currentSpacing -= 1; |
||||
if (currentSpacing < 0) { |
||||
currentSpacing = 0; |
||||
} |
||||
document.body.style.letterSpacing = `${currentSpacing}px`; |
||||
} |
||||
|
||||
function resetSpaces() { |
||||
currentSpacing = 0; |
||||
document.body.style.letterSpacing = 'normal'; |
||||
} |
||||
|
||||
// Gestionnaire d'événements pour le bouton d'augmentation de l'espacement
|
||||
$('#increaseSpaces', context).on('click', increaseSpaces); |
||||
|
||||
// Gestionnaire d'événements pour le bouton de diminution de l'espacement
|
||||
$('#decreaseSpaces', context).on('click', decreaseSpaces); |
||||
|
||||
// Gestionnaire d'événements pour le bouton de réinitialisation de l'espacement
|
||||
$('#resetSpaces', context).on('click', resetSpaces); |
||||
|
||||
var checkbox = document.getElementById('mode-loupe'); |
||||
// Fonction pour gérer le changement d'état de la case à cocher
|
||||
|
||||
// Fonction pour créer la div d'info sur la souris
|
||||
function createMouseInfoDiv() { |
||||
// Crée une nouvelle div
|
||||
var mouseInfoDiv = document.createElement('div'); |
||||
|
||||
// Applique les styles CSS
|
||||
mouseInfoDiv.style.position = 'fixed'; |
||||
mouseInfoDiv.style.padding = '5px 10px'; |
||||
mouseInfoDiv.style.fontSize = '2rem'; |
||||
mouseInfoDiv.style.borderRadius = '5px'; |
||||
mouseInfoDiv.style.backgroundColor = 'rgba(0,0,0,.8)'; |
||||
mouseInfoDiv.style.border = '1px solid rgba(0,0,0,.8)'; |
||||
mouseInfoDiv.style.color = '#fff'; |
||||
mouseInfoDiv.style.display = 'none'; |
||||
mouseInfoDiv.style.zIndex = '9999999999999'; |
||||
mouseInfoDiv.style.lineHeight = '1.2'; |
||||
mouseInfoDiv.style.pointerEvents = 'none'; |
||||
mouseInfoDiv.style.userSelect = 'none'; |
||||
|
||||
// Ajoute la div au document
|
||||
document.body.appendChild(mouseInfoDiv); |
||||
|
||||
return mouseInfoDiv; |
||||
} |
||||
|
||||
// Crée la div pour les informations sur la souris
|
||||
var mouseInfoDiv = createMouseInfoDiv(); |
||||
function handleCheckboxChange() { |
||||
if (checkbox.checked) { |
||||
console.log("La case à cocher est cochée :", checkbox.checked); |
||||
var body = document.body; |
||||
body.addEventListener('mousemove', handleMouseMove); |
||||
} else { |
||||
// Cache la div lorsque la case à cocher est désactivée
|
||||
mouseInfoDiv.style.display = 'none'; |
||||
// Supprime l'écouteur d'événements 'mousemove'
|
||||
var body = document.body; |
||||
body.removeEventListener('mousemove', handleMouseMove); |
||||
} |
||||
} |
||||
function handleMouseMove(event) { |
||||
const element = event.target; |
||||
if (element.tagName === 'SPAN' || element.tagName === 'A' || element.tagName === 'TD' || element.tagName === 'TH' || element.tagName === 'BUTTON' || element.tagName === 'P' || (element.tagName >= 'H1' && element.tagName <= 'H6')) { |
||||
const posX = event.clientX + 50; |
||||
const posY = event.clientY + 50; |
||||
|
||||
// Met à jour la position de la div
|
||||
mouseInfoDiv.style.left = posX + 'px'; |
||||
mouseInfoDiv.style.top = posY + 'px'; |
||||
|
||||
// Met à jour le contenu de la div avec les coordonnées de la souris
|
||||
mouseInfoDiv.textContent = element.textContent; |
||||
|
||||
// Affiche la div
|
||||
mouseInfoDiv.style.display = 'block'; |
||||
} |
||||
} |
||||
// Ajouter un écouteur d'événement sur le changement de la case à cocher
|
||||
checkbox.addEventListener('change', handleCheckboxChange); |
||||
|
||||
|
||||
const contrastCheckbox = document.getElementById('contraste'); |
||||
const bwCheckbox = document.getElementById('black_and_white'); |
||||
|
||||
function updateFilter() { |
||||
let filter = ''; |
||||
|
||||
if (contrastCheckbox.checked) { |
||||
filter += 'contrast(200%) '; |
||||
} |
||||
|
||||
if (bwCheckbox.checked) { |
||||
filter += 'grayscale(100%) '; |
||||
} |
||||
|
||||
document.body.style.filter = filter.trim(); |
||||
} |
||||
|
||||
contrastCheckbox.addEventListener('change', updateFilter); |
||||
bwCheckbox.addEventListener('change', updateFilter); |
||||
|
||||
|
||||
// Assurez-vous que les gestionnaires d'événements sont attachés aux éléments corrects.
|
||||
$('.btn-group button', context).on('click', function () { |
||||
if ($(this).is('#increaseFontSize')) { |
||||
increaseFontSize(); |
||||
} else if ($(this).is('#decreaseFontSize')) { |
||||
decreaseFontSize(); |
||||
} else if ($(this).is('#resetFontSize')) { |
||||
resetFontSize(); |
||||
} |
||||
// Ajoutez d'autres conditions pour d'autres boutons si nécessaire.
|
||||
}); |
||||
|
||||
// Gestionnaire d'événements pour le bouton du thème sombre
|
||||
$('#theme-view', context).on('change', function () { |
||||
if ($(this).is(':checked')) { |
||||
// Logique pour activer le thème sombre
|
||||
|
||||
// Sauvegardez l'état de la case à cocher dans le stockage local
|
||||
localStorage.setItem('themeViewChecked', 'true'); |
||||
} else { |
||||
// Logique pour désactiver le thème sombre
|
||||
|
||||
// Supprimez l'état de la case à cocher du stockage local
|
||||
localStorage.removeItem('themeViewChecked'); |
||||
} |
||||
}); |
||||
|
||||
// Vérifiez si l'état de la case à cocher est sauvegardé dans le stockage local
|
||||
var themeViewChecked = localStorage.getItem('themeViewChecked'); |
||||
if (themeViewChecked === 'true') { |
||||
// Si oui, cochez la case à cocher et déclenchez le gestionnaire d'événements 'change'
|
||||
$('#theme-view', context).prop('checked', true).trigger('change'); |
||||
} |
||||
|
||||
|
||||
$('#contraste', context).on('change', function () { |
||||
if ($(this).is(':checked')) { |
||||
// Logique pour activer le thème sombre
|
||||
|
||||
// Sauvegardez l'état de la case à cocher dans le stockage local
|
||||
localStorage.setItem('contrasteChange', 'true'); |
||||
} else { |
||||
// Logique pour désactiver le thème sombre
|
||||
|
||||
// Supprimez l'état de la case à cocher du stockage local
|
||||
localStorage.removeItem('contrasteChange'); |
||||
} |
||||
}); |
||||
|
||||
// Vérifiez si l'état de la case à cocher est sauvegardé dans le stockage local
|
||||
var themeViewChecked = localStorage.getItem('contrasteChange'); |
||||
if (themeViewChecked === 'true') { |
||||
// Si oui, cochez la case à cocher et déclenchez le gestionnaire d'événements 'change'
|
||||
$('#contraste', context).prop('checked', true); |
||||
updateFilter(); |
||||
} |
||||
$('#black_and_white', context).on('change', function () { |
||||
if ($(this).is(':checked')) { |
||||
// Logique pour activer le thème sombre
|
||||
|
||||
// Sauvegardez l'état de la case à cocher dans le stockage local
|
||||
localStorage.setItem('black_and_whiteChange', 'true'); |
||||
} else { |
||||
// Logique pour désactiver le thème sombre
|
||||
|
||||
// Supprimez l'état de la case à cocher du stockage local
|
||||
localStorage.removeItem('black_and_whiteChange'); |
||||
} |
||||
}); |
||||
|
||||
// Vérifiez si l'état de la case à cocher est sauvegardé dans le stockage local
|
||||
var themeViewChecked = localStorage.getItem('black_and_whiteChange'); |
||||
if (themeViewChecked === 'true') { |
||||
// Si oui, cochez la case à cocher et déclenchez le gestionnaire d'événements 'change'
|
||||
$('#black_and_white', context).prop('checked', true); |
||||
updateFilter(); |
||||
} |
||||
|
||||
|
||||
}, 2000); // 1000 millisecondes = 1 seconde
|
||||
} |
||||
|
||||
}; |
||||
})(jQuery, Drupal, drupalSettings); |
||||
@ -0,0 +1,74 @@ |
||||
<?php |
||||
|
||||
|
||||
namespace Drupal\accessibility_tools\Plugin\Block; |
||||
use Drupal\Core\Block\BlockBase; |
||||
|
||||
|
||||
/** |
||||
* Provides a 'Custom HTML Block' block. |
||||
* |
||||
* @Block( |
||||
* id = "accessibility_tools", |
||||
* admin_label = "Bloc Accessibilité", |
||||
* ) |
||||
*/ |
||||
class AccessibilityToolsBlock extends BlockBase { |
||||
|
||||
/** |
||||
* {@inheritdoc} |
||||
*/ |
||||
public function build() { |
||||
|
||||
$build = [ |
||||
'#type' => 'inline_template', |
||||
'#template' => ' |
||||
<div> |
||||
<div class="p-3 border-bottom"> |
||||
<div class="mt-2"> |
||||
|
||||
</div> |
||||
<span>Taille de la police : </span> |
||||
<!-- Utilisation de Bootstrap pour créer les boutons --> |
||||
<div class="btn-group" role="group" aria-label="Taille de la police"> |
||||
<button type="button" class="btn" id="increaseFontSize"><i class="fa-solid fa-arrow-up"></i></button> |
||||
<button type="button" class="btn" id="decreaseFontSize"><i class="fa-solid fa-arrow-down"></i></button> |
||||
<button type="button" class="btn" id="resetFontSize"><i class="fa-solid fa-rotate-right"></i></button> |
||||
</div> |
||||
|
||||
<label class="form-check-label" for="space_letters">Espace entre les caractères : </label> |
||||
<div class="btn-group" role="group" aria-label="Espace entre les caractères"> |
||||
<button type="button" class="btn" id="increaseSpaces"><i class="fa-solid fa-arrow-up"></i></button> |
||||
<button type="button" class="btn" id="decreaseSpaces"><i class="fa-solid fa-arrow-down"></i></button> |
||||
<button type="button" class="btn" id="resetSpaces"><i class="fa-solid fa-rotate-right"></i></button> |
||||
</div> |
||||
<label class="form-check-label" for="mode-loupe">Mode loupe : </label> |
||||
<input type="checkbox" class="form-check-input" id="mode-loupe"> |
||||
<label class="form-check-label" for="theme-view"> |
||||
<span>Thème Sombre : </span> |
||||
</label> |
||||
<input |
||||
type="checkbox" |
||||
name="theme-view" |
||||
class="form-check-input" |
||||
id="theme-view" |
||||
/> |
||||
<label class="form-check-label" for="contraste">Contraste élevé : </label> |
||||
<input type="checkbox" class="form-check-input" id="contraste"> |
||||
<label class="form-check-label" for="black_and_white">Mode noir et blanc : </label> |
||||
<input type="checkbox" class="form-check-input" id="black_and_white"> |
||||
|
||||
</div> |
||||
</div>', |
||||
'#attached' => [ |
||||
'library' => [ |
||||
'accessibility_tools/accessibility_tools', |
||||
], |
||||
], |
||||
]; |
||||
|
||||
return $build; |
||||
} |
||||
|
||||
|
||||
} |
||||
@ -1,143 +1,242 @@ |
||||
// (function ($, Drupal, drupalSettings, once) {
|
||||
// "use strict";
|
||||
// Drupal.behaviors.HumhubBlockBehavior = {
|
||||
// attach: function (context, settings) {
|
||||
// // only on frontpage (desktop)
|
||||
// if (drupalSettings.path.isFront) {
|
||||
// setTimeout(function () {
|
||||
// once("HumhubBlockBehavior", "body", context).forEach(
|
||||
// function () {
|
||||
// // make ajax call
|
||||
// var xhr = new XMLHttpRequest();
|
||||
// xhr.open("GET", Drupal.url("v1/api_humhub_pleiade/humhub_query"));
|
||||
// xhr.responseType = "json";
|
||||
// xhr.onload = function () {
|
||||
// var bloc_humhub
|
||||
// if (xhr.status === 200) {
|
||||
// var donnees = (xhr.response);
|
||||
// if (donnees) {
|
||||
// var donnees_spaces = donnees['spaces']
|
||||
// var donnees_notif = donnees['notifs']
|
||||
// var donnees_messages = donnees['messages']
|
||||
(function ($, Drupal, drupalSettings, once) { |
||||
"use strict"; |
||||
Drupal.behaviors.HumhubBlockBehavior = { |
||||
attach: function (context, settings) { |
||||
// only on frontpage (desktop)
|
||||
if (drupalSettings.path.isFront) { |
||||
setTimeout(function () { |
||||
once("HumhubBlockBehavior", "body", context).forEach( |
||||
function () { |
||||
// make ajax call
|
||||
var xhr = new XMLHttpRequest(); |
||||
xhr.open("GET", Drupal.url("v1/api_humhub_pleiade/humhub_query")); |
||||
xhr.responseType = "json"; |
||||
xhr.onload = function () { |
||||
var bloc_humhub |
||||
if (xhr.status === 200) { |
||||
var donnees = (xhr.response); |
||||
if (donnees) { |
||||
var donnees_spaces = donnees['spaces'] |
||||
var donnees_notif = donnees['notifs'] |
||||
var donnees_messages = donnees['messages'] |
||||
|
||||
if (donnees_spaces && donnees_spaces.length > 6) { |
||||
var overflow = 'overflow-y:scroll;' |
||||
} |
||||
function getContrastColor(hexcolor) { |
||||
var r = parseInt(hexcolor.substr(0,2),16); |
||||
var g = parseInt(hexcolor.substr(2,2),16); |
||||
var b = parseInt(hexcolor.substr(4,2),16); |
||||
var yiq = ((r*299)+(g*587)+(b*114))/1000; |
||||
return (yiq >= 128) ? 'black' : 'white'; |
||||
} |
||||
bloc_humhub = '\ |
||||
<div class="mb-2">\ |
||||
<div class="card">\ |
||||
<div class="card-header rounded-top bg-white rounded-top">\ |
||||
<h4 class="card-title text-dark py-2">\ |
||||
Réseau social des agents territoriaux</h4>\ |
||||
</div>\ |
||||
<div class="card-body pt-0 d-flex justify-content-between">\ |
||||
' |
||||
bloc_humhub += '<div class="col-md-5 d-flex align-content-start row" id="col1">\ |
||||
<h4 class="text-dark py-2">\ |
||||
Mes espaces</h4><div style="height:256px; '+ overflow + '" class="d-flex flex-wrap align-items-center justify-content-center">' |
||||
if (donnees_spaces){ |
||||
if (donnees_spaces.length > 0) { |
||||
|
||||
// if (donnees_spaces.results.length > 6) {
|
||||
// var overflow = 'overflow-y:scroll;'
|
||||
// }
|
||||
// bloc_humhub = '\
|
||||
// <div class="mb-2">\
|
||||
// <div class="card">\
|
||||
// <div class="card-header rounded-top bg-white rounded-top">\
|
||||
// <h4 class="card-title text-dark py-2">\
|
||||
// Réseau Social Pléiade</h4>\
|
||||
// </div>\
|
||||
// <div class="card-body pt-0 d-flex justify-content-between">\
|
||||
// '
|
||||
// bloc_humhub += '<div class="col-md-5 d-flex align-content-start row" id="col1">\
|
||||
// <h5 class="card-title text-dark py-2">\
|
||||
// Mes espaces</h5><div style="height:256px; '+ overflow + '" class="d-flex flex-wrap align-items-center justify-content-center">'
|
||||
// if (donnees['spaces'].results.length > 0) {
|
||||
// for (var i = 0; i < donnees_spaces.results.length; i++) {
|
||||
// var text = donnees_spaces.results[i].name;
|
||||
// var url = donnees_spaces.results[i].url;
|
||||
// bloc_humhub += '\
|
||||
// <a href="'+ url + '" target="_blank" class="pb-2 px-2">\
|
||||
// <div class="square d-flex align-items-center justify-content-center">\
|
||||
// <span class="px-2 fs-4 text-uppercase text-align-center">'+ text + '</span>\
|
||||
// </div>\
|
||||
// </a>'
|
||||
// }
|
||||
// }
|
||||
// else {
|
||||
// bloc_humhub += '<h6 class="col-md-2">Aucun espace disponible ou erreur avec lors de la connexion à Humhub</h6>'
|
||||
// }
|
||||
// bloc_humhub += '</div></div>'
|
||||
// bloc_humhub += '<div class="col-md-7" id="col1">\
|
||||
// <h5 class="card-title text-dark py-2">\
|
||||
// Mes notifications</h5><div class="d-flex flex-column" style="height:256px; overflow-y:scroll;">'
|
||||
// if (donnees['notifs'] && donnees['notifs'].results.length > 0) {
|
||||
// console.log('1')
|
||||
// for (var i = 0; i < donnees_notif.results.length; i++) {
|
||||
// var text = donnees_notif.results[i].output;
|
||||
// var date = donnees_notif.results[i].createdAt;
|
||||
// var formattedDate = new Date(date); // Créer un objet de date
|
||||
// var day = formattedDate.getDate();
|
||||
// var month = formattedDate.getMonth() + 1; // Les mois sont indexés à partir de 0, donc ajouter 1
|
||||
// var year = formattedDate.getFullYear();
|
||||
// var hours = formattedDate.getHours();
|
||||
// var minutes = formattedDate.getMinutes();
|
||||
// // Formater la date et l'heure
|
||||
// var formattedString = day + '/' + (month < 10 ? '0' : '') + month + '/' + year + ' ' + hours + ':' + (minutes < 10 ? '0' : '') + minutes;
|
||||
// bloc_humhub += '\
|
||||
// <div class="">\
|
||||
// <div class="d-flex justify-content-start align-items-center">\
|
||||
// <span class="col-md-2 fs-2">'+ formattedString + '</span>\
|
||||
// <span>'+ text + '</span>\
|
||||
// </div>\
|
||||
// </div><hr>\
|
||||
// '
|
||||
// }
|
||||
for (var i = 0; i < donnees_spaces.length; i++) { |
||||
|
||||
var color = donnees_spaces[i].color; |
||||
var text = donnees_spaces[i].name; |
||||
var url = donnees_spaces[i].url; |
||||
var imgUrl = drupalSettings.api_humhub_pleiade.humhub_url + donnees_spaces[i].imgUrl; |
||||
|
||||
if (donnees_spaces[i].imgUrl !== "/static/img/default_space.jpg") { |
||||
|
||||
|
||||
bloc_humhub += '\ |
||||
<a href="'+ url + '" target="_blank" class="pb-2 px-2">\ |
||||
<div style="background-image: url('+ imgUrl +'); background-size: cover; opacity: 0.9;" class="square d-flex align-items-center justify-content-center">\ |
||||
<span style="width: 100%; background-color: #00000080; color: white;font-weight: 500;" class="px-2 fs-3 text-uppercase text-align-center">'+ text + '</span>\ |
||||
</div>\ |
||||
</a>' |
||||
} else { |
||||
var textColor = getContrastColor(color); |
||||
|
||||
bloc_humhub += '\ |
||||
<a href="'+ url + '" target="_blank" class="pb-2 px-2">\ |
||||
<div style="background-color: '+ color +'" class="square d-flex align-items-center justify-content-center">\ |
||||
<span style="width: 100%; background-color: #00000080; color: '+ textColor +';font-weight: 500;" class="px-2 fs-3 text-uppercase text-align-center">'+ text + '</span>\ |
||||
</div>\ |
||||
</a>' |
||||
} |
||||
} |
||||
} |
||||
else { |
||||
bloc_humhub += '<h4 class="">Vous n\'avez rejoint aucun espace</h6><br><a href="'+ drupalSettings.api_humhub_pleiade.humhub_url + '/spaces">Rejoindre un espace</a>' |
||||
} |
||||
} |
||||
else{ |
||||
bloc_humhub += '<h4 class="">Vous n\'avez rejoint aucun espace. <a href="'+ drupalSettings.api_humhub_pleiade.humhub_url + '/spaces">Je rejoins un espace</a></h6>' |
||||
} |
||||
|
||||
// }
|
||||
// else if (donnees['messages'] && donnees['messages'].results.length > 0) {
|
||||
// console.log('1')
|
||||
// for (var i = 0; i < donnees_messages.results.length; i++) {
|
||||
// var text = donnees_messages.results[i].title;
|
||||
// var date = donnees_messages.results[i].created_at;
|
||||
// var href = drupalSettings.api_humhub_pleiade.humhub_url + '/mail/mail/index?id=' + donnees_messages.results[i].id;
|
||||
// var formattedDate = new Date(date); // Créer un objet de date
|
||||
// var day = formattedDate.getDate();
|
||||
// var month = formattedDate.getMonth() + 1; // Les mois sont indexés à partir de 0, donc ajouter 1
|
||||
// var year = formattedDate.getFullYear();
|
||||
// var hours = formattedDate.getHours();
|
||||
// var minutes = formattedDate.getMinutes();
|
||||
// // Formater la date et l'heure
|
||||
// var formattedString = day + '/' + (month < 10 ? '0' : '') + month + '/' + year + ' ' + hours + ':' + (minutes < 10 ? '0' : '') + minutes;
|
||||
// if (donnees_messages.results[i].created_by == donnees_messages.results[i].updated_by) {
|
||||
// bloc_humhub += '\
|
||||
// <div class="">\
|
||||
// <div class="d-flex justify-content-start align-items-center">\
|
||||
// <span class="col-md-2 fs-2">'+ formattedString + '</span>\
|
||||
// <a href="'+ href + '" target="_blank">Vous avez un nouveau message sur la conversation "' + text + '"</a>\
|
||||
// </div>\
|
||||
// </div><hr>\
|
||||
// '
|
||||
// }
|
||||
// }
|
||||
bloc_humhub += '</div></div>' |
||||
bloc_humhub += '<div class="col-md-7" id="col1">\ |
||||
<h4 class="text-dark py-2">\ |
||||
Mes notifications</h4><div class="d-flex flex-column" style="height:256px; overflow-y:scroll;">' |
||||
if (donnees['notifs'] && donnees['notifs'].results.length > 0) { |
||||
|
||||
for (var i = 0; i < donnees_notif.results.length; i++) { |
||||
var text = donnees_notif.results[i].output; |
||||
if (donnees_notif.results[i].output.includes("You were added to Space")) { |
||||
// Remplace "You were added to Space" par "Vous avez été ajouté à l'espace"
|
||||
text = donnees_notif.results[i].output.replace("You were added to Space", "Vous avez été ajouté à l'espace"); |
||||
} |
||||
if (donnees_notif.results[i].output.includes("created post")) { |
||||
// Remplace "You were added to Space" par "Vous avez été ajouté à l'espace"
|
||||
text = donnees_notif.results[i].output.replace("created post", "a publié"); |
||||
} |
||||
if (donnees_notif.results[i].output.includes(" and ")) { |
||||
// Remplace "You were added to Space" par "Vous avez été ajouté à l'espace"
|
||||
text = donnees_notif.results[i].output.replace(" and ", " et "); |
||||
} |
||||
if (donnees_notif.results[i].output.includes("likes post")) { |
||||
// Remplace "You were added to Space" par "Vous avez été ajouté à l'espace"
|
||||
text = donnees_notif.results[i].output.replace("likes post", "aime"); |
||||
} |
||||
if (donnees_notif.results[i].output.includes("commented post")) { |
||||
// Remplace "You were added to Space" par "Vous avez été ajouté à l'espace"
|
||||
text = donnees_notif.results[i].output.replace("commented post", "a commenté"); |
||||
} |
||||
if (donnees_notif.results[i].output.includes("is now following you")) { |
||||
// Remplace "You were added to Space" par "Vous avez été ajouté à l'espace"
|
||||
text = donnees_notif.results[i].output.replace("is now following you", "vous suit"); |
||||
} |
||||
if (donnees_notif.results[i].output.includes("sent you a friend request")) { |
||||
// Remplace "You were added to Space" par "Vous avez été ajouté à l'espace"
|
||||
text = donnees_notif.results[i].output.replace("sent you a friend request", "vous a envoyé une demande d'amis"); |
||||
} |
||||
if (donnees_notif.results[i].output.includes("invited you to the space")) { |
||||
// Remplace "You were added to Space" par "Vous avez été ajouté à l'espace"
|
||||
text = donnees_notif.results[i].output.replace("invited you to the space", "vous a invité à rejoindre"); |
||||
} |
||||
if (donnees_notif.results[i].output.includes("accepted your invite for the space")) { |
||||
// Remplace "You were added to Space" par "Vous avez été ajouté à l'espace"
|
||||
text = donnees_notif.results[i].output.replace("accepted your invite for the space", "a accepté de rejoindre"); |
||||
} |
||||
if (donnees_notif.results[i].output.includes("mentioned you in comment")) { |
||||
// Remplace "You were added to Space" par "Vous avez été ajouté à l'espace"
|
||||
text = donnees_notif.results[i].output.replace("mentioned you in comment", "vous a mentionné : "); |
||||
} |
||||
var date = donnees_notif.results[i].createdAt; |
||||
var formattedDate = new Date(date); // Créer un objet de date
|
||||
var day = formattedDate.getDate(); |
||||
var month = formattedDate.getMonth() + 1; // Les mois sont indexés à partir de 0, donc ajouter 1
|
||||
var year = formattedDate.getFullYear(); |
||||
var hours = formattedDate.getHours(); |
||||
var minutes = formattedDate.getMinutes(); |
||||
// Formater la date et l'heure
|
||||
var formattedString = day + '/' + (month < 10 ? '0' : '') + month + '/' + year + ' ' + hours + ':' + (minutes < 10 ? '0' : '') + minutes; |
||||
bloc_humhub += '\ |
||||
<a target="_blank" href="'+ drupalSettings.api_humhub_pleiade.humhub_url +'/notification/overview" class="">\ |
||||
<div class="d-flex justify-content-start align-items-start">\ |
||||
<span class="pt-1 col-md-2 fs-2">'+ formattedString + '</span>\ |
||||
<span>'+ text + '</span>\ |
||||
</div>\ |
||||
</a><hr>\ |
||||
' |
||||
} |
||||
|
||||
// }
|
||||
// else {
|
||||
// bloc_humhub += '<h6 class="col-md-2">Aucune notification</h6>'
|
||||
} |
||||
if (donnees['messages'] && donnees['messages'].results.length > 0) { |
||||
var number_notif = donnees_messages.results[0].isUnread; |
||||
|
||||
var href = drupalSettings.api_humhub_pleiade.humhub_url + '/mail/mail/index'; |
||||
|
||||
// }
|
||||
// bloc_humhub += '</div></div>'
|
||||
// bloc_humhub += ''
|
||||
// "\
|
||||
// </div>\
|
||||
// </div>\
|
||||
// </div>\
|
||||
// ";
|
||||
// }
|
||||
if (donnees_messages.results[0].isUnread == 1) { |
||||
bloc_humhub += '\ |
||||
<div class="">\ |
||||
<div class="d-flex justify-content-start align-items-start">\ |
||||
<span class="pt-1 col-md-2 fs-2"></span>\ |
||||
<a href="'+ href + '" target="_blank">Vous avez '+ number_notif +' nouveau message privé</a>\ |
||||
</div>\ |
||||
</div><hr>\ |
||||
' |
||||
}
|
||||
else if (donnees_messages.results[0].isUnread > 1) { |
||||
bloc_humhub += '\ |
||||
<div class="">\ |
||||
<div class="d-flex justify-content-start align-items-start">\ |
||||
<span class="pt-1 col-md-2 fs-2"></span>\ |
||||
<a href="'+ href + '" target="_blank">Vous avez '+ number_notif +' nouveaux messages privés</a>\ |
||||
</div>\ |
||||
</div><hr>\ |
||||
' |
||||
}
|
||||
else
|
||||
{ |
||||
bloc_humhub += '\ |
||||
<div class="">\ |
||||
<div class="d-flex justify-content-start align-items-center">\ |
||||
<span class="col-md-2 fs-2"></span>\ |
||||
<a href="'+ href + '" target="_blank">Vous n\'avez pas de nouveau message privé</a>\ |
||||
</div>\ |
||||
</div><hr>' |
||||
} |
||||
|
||||
|
||||
|
||||
} |
||||
else if((donnees['messages'].results.length = 0) && (donnees['notifs'].results.length = 0)) { |
||||
bloc_humhub += '<h6 class="col-md-2">Aucune notification</h6>' |
||||
|
||||
// document.getElementById("humhub_block").innerHTML = bloc_humhub;
|
||||
} |
||||
bloc_humhub += '</div></div>' |
||||
bloc_humhub += '' |
||||
"\ |
||||
</div>\ |
||||
</div>\ |
||||
</div>\ |
||||
"; |
||||
} |
||||
else |
||||
{ |
||||
bloc_humhub = '\ |
||||
<div class="mb-2">\ |
||||
<div class="card">\ |
||||
<div class="card-header rounded-top bg-white rounded-top">\ |
||||
<h4 class="card-title text-dark py-2">\ |
||||
Réseau Social des agents territoriaux</h4>\ |
||||
</div>\ |
||||
<div class="card-body pt-0 d-flex justify-content-between">\ |
||||
'+ donnees +'\ |
||||
</div>\ |
||||
</div>\ |
||||
</div>\ |
||||
'
|
||||
} |
||||
|
||||
// };
|
||||
// xhr.onerror = function () {
|
||||
// console.log("Error making AJAX call");
|
||||
// };
|
||||
// xhr.onabort = function () {
|
||||
// console.log("AJAX call aborted");
|
||||
// };
|
||||
// xhr.ontimeout = function () {
|
||||
// console.log("AJAX call timed out");
|
||||
// };
|
||||
// xhr.onloadend = function () {
|
||||
// }
|
||||
// };
|
||||
// xhr.send();
|
||||
// }); // end once
|
||||
// }, 2000); // 1000 millisecondes = 1 seconde
|
||||
// }
|
||||
// },
|
||||
// };
|
||||
// })(jQuery, Drupal, drupalSettings, once);
|
||||
|
||||
document.getElementById("humhub_block").innerHTML = bloc_humhub; |
||||
|
||||
}; |
||||
xhr.onerror = function () { |
||||
console.log("Error making AJAX call"); |
||||
}; |
||||
xhr.onabort = function () { |
||||
console.log("AJAX call aborted"); |
||||
}; |
||||
xhr.ontimeout = function () { |
||||
console.log("AJAX call timed out"); |
||||
}; |
||||
xhr.onloadend = function () { |
||||
} |
||||
}; |
||||
xhr.send(); |
||||
}); // end once
|
||||
}, 2000); // 1000 millisecondes = 1 seconde
|
||||
} |
||||
}, |
||||
}; |
||||
})(jQuery, Drupal, drupalSettings, once); |
||||
|
||||
Loading…
Reference in new issue