+ ${riskConfig.icon}
+
+ `;
+
+ alert.style.cssText = `
+ position: fixed !important;
+ top: 70px !important;
+ right: 20px !important;
+ z-index: 999998 !important;
+ background: linear-gradient(135deg, ${riskConfig.color}, ${this.adjustColor(riskConfig.color, -15)}) !important;
+ color: white !important;
+ padding: 16px !important;
+ border-radius: 12px !important;
+ max-width: 350px !important;
+ font-family: 'Segoe UI', Arial, sans-serif !important;
+ box-shadow: 0 6px 20px rgba(0,0,0,0.3) !important;
+ border: 2px solid rgba(255,255,255,0.2) !important;
+ animation: slideInRight 0.4s ease-out !important;
+ backdrop-filter: blur(10px) !important;
+ `;
+
+ document.body?.appendChild(alert);
+
+ // Événements
+ document.getElementById('dima-suspicious-details')?.addEventListener('click', () => {
+ this.showSuspiciousSiteDetails();
+ });
+
+ document.getElementById('dima-suspicious-close')?.addEventListener('click', () => {
+ alert.remove();
+ });
+
+ // Hover effects
+ const detailsBtn = document.getElementById('dima-suspicious-details');
+ if (detailsBtn) {
+ detailsBtn.addEventListener('mouseenter', () => {
+ detailsBtn.style.transform = 'translateY(-1px)';
+ detailsBtn.style.boxShadow = '0 2px 8px rgba(0,0,0,0.2)';
+ });
+ detailsBtn.addEventListener('mouseleave', () => {
+ detailsBtn.style.transform = 'translateY(0)';
+ detailsBtn.style.boxShadow = 'none';
+ });
+ }
+
+ const closeBtn = document.getElementById('dima-suspicious-close');
+ if (closeBtn) {
+ closeBtn.addEventListener('mouseenter', () => {
+ closeBtn.style.opacity = '1';
+ });
+ closeBtn.addEventListener('mouseleave', () => {
+ closeBtn.style.opacity = '0.7';
+ });
+ }
+ }
+
+ showSuspiciousSiteDetails() {
+ const { siteInfo, riskConfig } = this.suspiciousSiteCheck;
+
+ // Créer modal avec détails
+ const detailsModal = document.createElement('div');
+ detailsModal.id = 'dima-suspicious-details-modal';
+
+ detailsModal.style.cssText = `
+ position: fixed !important;
+ top: 0 !important;
+ left: 0 !important;
+ width: 100% !important;
+ height: 100% !important;
+ background: rgba(0,0,0,0.75) !important;
+ backdrop-filter: blur(5px) !important;
+ z-index: 10000000 !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ font-family: 'Segoe UI', Arial, sans-serif !important;
+ animation: fadeIn 0.3s ease-out !important;
+ `;
+
+ const logoUrl = chrome.runtime.getURL('M82-logo-16.png');
+
+ detailsModal.innerHTML = `
+
+
+
+
+ ${riskConfig.label}
+
+
+ Vigilance : ce site appartient à un dispositif de manipulation de l'information identifié.
+
+
+
+
+
+
+ `;
+
+ detailsModal.addEventListener('click', (e) => {
+ if (e.target === detailsModal) detailsModal.remove();
+ });
+
+ document.body.appendChild(detailsModal);
+ }
+
adjustColor(color, amount) {
const num = parseInt(color.replace("#", ""), 16);
const amt = Math.round(2.55 * amount);
@@ -101,116 +337,205 @@ class UIManager {
generateTooltip() {
const techniques = this.analysisResults.detectedTechniques.slice(0, 3);
- return `DIMA Score: ${this.analysisResults.globalScore} (${this.analysisResults.riskLevel})
+ let tooltip = `DIMA Score: ${this.analysisResults.globalScore} (${this.analysisResults.riskLevel})
${this.analysisResults.detectedTechniques.length} techniques détectées
-${techniques.map(t => `• ${t.nom}`).join('\n')}
-Contenu: ${this.analysisResults.contentLength} caractères`;
- }
-
- getScoreIcon(score) {
- if (score >= 75) return '🚨'; // Critique
- if (score >= 50) return '⚠️'; // Élevé
- if (score >= 30) return '⚡'; // Modéré
- if (score >= 15) return '👀'; // Faible
- return '✅'; // Très faible
- }
-
- generateExecutiveSummary() {
- const score = this.analysisResults.globalScore;
- const techniqueCount = this.analysisResults.detectedTechniques.length;
- const topTechniques = this.analysisResults.detectedTechniques.slice(0, 3);
-
- let summary = "";
-
- // Évaluation générale selon le score
- if (score >= 75) {
- summary = `🚨 Manipulation intensive détectée : Ce contenu présente un niveau critique de techniques manipulatoires (${techniqueCount} technique${techniqueCount > 1 ? 's' : ''}). `;
- } else if (score >= 50) {
- summary = `⚠️ Manipulation significative : Ce contenu utilise plusieurs techniques suspectes (${techniqueCount} technique${techniqueCount > 1 ? 's' : ''}). `;
- } else if (score >= 30) {
- summary = `⚡ Éléments manipulatoires présents : Quelques techniques détectées nécessitent votre attention (${techniqueCount} technique${techniqueCount > 1 ? 's' : ''}). `;
- } else {
- summary = `👀 Faible niveau de manipulation : Peu d'éléments manipulatoires détectés (${techniqueCount} technique${techniqueCount > 1 ? 's' : ''}). `;
- }
-
- // Analyse des phases dominantes
- if (this.analysisResults.phaseScores && Object.keys(this.analysisResults.phaseScores).length > 0) {
- const sortedPhases = Object.entries(this.analysisResults.phaseScores)
- .sort(([,a], [,b]) => b - a)
- .slice(0, 2);
+${techniques.map(t => `• ${t.nom}`).join('\n')}`;
- if (sortedPhases.length > 0) {
- const dominantPhase = sortedPhases[0][0];
- summary += `La manipulation se concentre principalement sur la phase "${dominantPhase}" (${this.getPhaseExplanation(dominantPhase)}). `;
+ if (this.suspiciousSiteCheck.isSuspicious) {
+ tooltip += `\n\n⚠️ SITE SUSPECT IDENTIFIÉ`;
}
- }
-
- // Technique principale
- if (topTechniques.length > 0) {
- const mainTechnique = topTechniques[0];
- summary += `La technique dominante est ${mainTechnique.nom} avec ${mainTechnique.confidence}% de confiance. `;
- // Conseil spécifique selon la technique
- summary += this.getTechniqueAdvice(mainTechnique.index);
- }
-
- return summary;
+ tooltip += `\nContenu: ${this.analysisResults.contentLength} caractères`;
+
+ return tooltip;
}
- getPhaseEmoji(phase) {
- const emojis = {
- 'Detect': '👁️',
- 'Informer': '📢',
- 'Mémoriser': '🧠',
- 'Act': '⚡'
- };
- return emojis[phase] || '📍';
+ generatePhaseAnalysis() {
+ if (!this.analysisResults || !this.analysisResults.detectedTechniques || this.analysisResults.detectedTechniques.length === 0) {
+ return '';
+ }
+
+ // Analyser les techniques par phase
+ const phaseStats = {
+ 'Detect': { count: 0, totalScore: 0, techniques: [], icon: '👁️', color: '#3498db' },
+ 'Informer': { count: 0, totalScore: 0, techniques: [], icon: '📢', color: '#e67e22' },
+ 'Mémoriser': { count: 0, totalScore: 0, techniques: [], icon: '🧠', color: '#9b59b6' },
+ 'Agir': { count: 0, totalScore: 0, techniques: [], icon: '⚡', color: '#e74c3c' }
+ };
+
+ this.analysisResults.detectedTechniques.forEach(technique => {
+ const phase = technique.phase || 'Detect';
+ if (phaseStats[phase]) {
+ phaseStats[phase].count++;
+ phaseStats[phase].totalScore += technique.weightedScore || technique.score || 0;
+ phaseStats[phase].techniques.push(technique);
+ }
+ });
+
+ // Calculer les pourcentages
+ const totalTechniques = this.analysisResults.detectedTechniques.length;
+ const totalScore = Object.values(phaseStats).reduce((sum, phase) => sum + phase.totalScore, 0);
+
+ // Trouver la phase dominante
+ let dominantPhase = null;
+ let maxCount = 0;
+ Object.entries(phaseStats).forEach(([phase, stats]) => {
+ if (stats.count > maxCount) {
+ maxCount = stats.count;
+ dominantPhase = phase;
+ }
+ });
+
+ // Générer l'explication contextuelle
+ const explanation = this.generatePhaseExplanation(dominantPhase, phaseStats, totalTechniques);
+
+ // Générer le HTML
+ return `
+
+
+
+
+
+ 
+
+ Site Suspect Identifié
+
+ ${riskConfig.icon} ${riskConfig.label}
+
+
+
+
+
+
+
+
+ ⚠️ Avertissement
++ ${riskConfig.message} +
+
+
+
+ 📋 Détails de l'identification
+
+
+
+ Raison :
+
+ ${siteInfo.reason}
+
+ Source du rapport :
+
+ ${siteInfo.source}
+
+ Date d'identification :
+
+ ${siteInfo.tags && siteInfo.tags.length > 0 ? `
+ ${new Date(siteInfo.identifiedDate).toLocaleDateString('fr-FR')}
+
+ Catégories :
+
+ ` : ''}
+
+ ${siteInfo.tags.map(tag => `
+
+ ${tag}
+
+ `).join('')}
+
+
+
+ 💡 Recommandations
+-
+
- Vérifiez les informations auprès de sources fiables +
- Consultez plusieurs sources avant de partager +
- Soyez attentif aux techniques de manipulation détectées +
- Signalez le contenu suspect si nécessaire +
+
+
+
+
+
+ Base de données maintenue par
+ M82 Project
+
+
+
+ `;
}
- getPhaseColor(phase) {
- const colors = {
- 'Detect': '#e3f2fd', // Bleu clair
- 'Informer': '#f3e5f5', // Violet clair
- 'Mémoriser': '#e8f5e8', // Vert clair
- 'Act': '#fff3e0' // Orange clair
- };
- return colors[phase] || '#f5f5f5';
+ generatePhaseExplanation(dominantPhase, phaseStats, totalTechniques) {
+ const explanations = {
+ 'Detect': `Le contenu utilise principalement des techniques de détection et captation d'attention (${phaseStats['Detect'].count}/${totalTechniques} techniques). Cela suggère une stratégie axée sur l'identification des publics réceptifs et l'accroche initiale. Le contenu cherche à attirer et cibler des audiences spécifiques.`,
+
+ 'Informer': `Le contenu se concentre sur des techniques de transmission et cadrage de l'information (${phaseStats['Informer'].count}/${totalTechniques} techniques). L'objectif est de contrôler la perception de l'information via le choix des faits présentés, leur contextualisation, et les biais introduits dans le message.`,
+
+ 'Mémoriser': `Le contenu privilégie des techniques de mémorisation et ancrage (${phaseStats['Mémoriser'].count}/${totalTechniques} techniques). Ces méthodes visent à inscrire durablement les messages dans la mémoire du public, souvent par répétition, simplification ou associations émotionnelles fortes.`,
+
+ 'Agir': `Le contenu met l'accent sur des techniques d'incitation à l'action (${phaseStats['Agir'].count}/${totalTechniques} techniques). L'objectif est de mobiliser le public vers des comportements spécifiques : partage, engagement, manifestation, ou modification d'opinions et de votes.`
+ };
+
+ // Si plusieurs phases sont également représentées
+ const topPhases = Object.entries(phaseStats)
+ .filter(([_, stats]) => stats.count > 0)
+ .sort((a, b) => b[1].count - a[1].count)
+ .slice(0, 2);
+
+ if (topPhases.length > 1 && topPhases[0][1].count === topPhases[1][1].count) {
+ return `Le contenu présente une stratégie équilibrée entre les phases "${topPhases[0][0]}" et "${topPhases[1][0]}" (${topPhases[0][1].count} techniques chacune). Cette combinaison indique une approche sophistiquée visant à la fois à attirer l'attention et à générer un impact durable.`;
+ }
+
+ return explanations[dominantPhase] || 'Analyse de la répartition des techniques de manipulation cognitive détectées selon le modèle DIMA.';
}
- getPhaseDescription(phase) {
- const descriptions = {
- 'Detect': 'Capter l\'attention',
- 'Informer': 'Influencer ou orienter la compréhension',
- 'Mémoriser': 'Ancrer l\'information',
- 'Act': 'Provoquer l\'action'
- };
- return descriptions[phase] || phase;
- }
-
- getPhaseExplanation(phase) {
- const explanations = {
- 'Detect': 'techniques pour attirer et capter votre attention',
- 'Informer': 'méthodes pour orienter votre interprétation des faits',
- 'Mémoriser': 'stratégies pour ancrer certaines idées dans votre mémoire',
- 'Act': 'pressions pour vous pousser à agir rapidement'
- };
- return explanations[phase] || 'manipulation cognitive';
- }
-
- getTechniqueAdvice(techniqueIndex) {
- const advices = {
- 'TE0500': 'Méfiez-vous des titres sensationnalistes et vérifiez les sources.',
- 'TE0132': 'Prenez du recul face aux messages alarmistes excessifs.',
- 'TE0501': 'Résistez à la pression de l\'urgence et prenez le temps de réfléchir.',
- 'TE0422': 'Vérifiez les qualifications réelles des "experts" cités.',
- 'TE0251': 'Questionnez les affirmations sur ce que "tout le monde" pense.',
- 'TE0221': 'Attention aux généralisations excessives sur des groupes.',
- 'TE0212': 'Ne tirez pas de conclusions générales à partir d\'anecdotes.',
- 'TE0321': 'Cherchez des sources contradictoires pour éviter le biais de confirmation.'
- };
- return advices[techniqueIndex] || 'Restez critique et vérifiez les informations.';
- }
-
showModal() {
try {
this.log('Affichage du modal');
@@ -235,9 +560,33 @@ Contenu: ${this.analysisResults.contentLength} caractères`;
font-family: 'Segoe UI', Arial, sans-serif !important;
animation: fadeIn 0.3s ease-out !important;
`;
- // Récupérer l'URL du logo
+
const logoUrl = chrome.runtime.getURL('M82-logo-16.png');
+ // Construire le contenu avec alerte site suspect si nécessaire
+ let suspiciousAlert = '';
+ if (this.suspiciousSiteCheck.isSuspicious) {
+ const { riskConfig, siteInfo } = this.suspiciousSiteCheck;
+ suspiciousAlert = `
+ + 📊 Analyse par Phase DIMA + + (Detect, Informer, Mémoriser, Agir) + +
+ + +
+
+
+
+
+ ${phaseStats[dominantPhase]?.icon || '💡'}
+
+
+
+ + Analyse : Phase dominante "${dominantPhase}" +
++ ${explanation} +
+
+ ${Object.entries(phaseStats).map(([phase, stats]) => {
+ const percentage = totalTechniques > 0 ? Math.round((stats.count / totalTechniques) * 100) : 0;
+ const scorePercentage = totalScore > 0 ? Math.round((stats.totalScore / totalScore) * 100) : 0;
+ const isActive = stats.count > 0;
+
+ return `
+
+
+
+
+
+ `;
+ }).join('')}
+ ${stats.icon}
+
+ ${phase}
+
+
+ ${stats.count}
+
+
+ ${percentage}% techniques
+
+ ${isActive ? `
+
+ ${scorePercentage}% du score
+
+ ` : ''}
+
+
+
+
+ Distribution du score par phase
+ ${Object.entries(phaseStats).map(([phase, stats]) => { + const percentage = totalScore > 0 ? (stats.totalScore / totalScore) * 100 : 0; + const displayScore = stats.totalScore.toFixed(1); + + return ` +
+
+ `;
+ }).join('')}
+
+
+ ${stats.icon} ${phase}
+
+
+ ${displayScore} pts (${Math.round(percentage)}%)
+
+
+
+
+
+
+
+ + ℹ️ Comprendre les phases DIMA +
+
+
+
+ 👁️ Detect (Détecter) :
+ Techniques visant à capter l'attention et identifier les cibles sensibles aux messages.
+
+
+ 📢 Informer :
+ Techniques de transmission et cadrage de l'information pour influencer la perception.
+
+
+ 🧠 Mémoriser :
+ Techniques d'ancrage mémoriel et de renforcement des messages dans la durée.
+
+
+ ⚡ Agir :
+ Techniques d'incitation à l'action et de mobilisation comportementale.
+
+
+
+ `;
+ }
+
modal.innerHTML = `
+ ${riskConfig.icon}
+
+
+
+ ${riskConfig.label}
++ ${riskConfig.message} +
+ +
@@ -257,6 +606,8 @@ Contenu: ${this.analysisResults.contentLength} caractères`;
+ ${suspiciousAlert}
+
@@ -277,17 +628,7 @@ Contenu: ${this.analysisResults.contentLength} caractères`;
-
- ` : ''}
+ ${this.generatePhaseAnalysis()}
- ${this.getScoreIcon(this.analysisResults.globalScore)} Résumé de l'analyse -
-- ${this.generateExecutiveSummary()} -
-
@@ -300,38 +641,6 @@ Contenu: ${this.analysisResults.contentLength} caractères`;
-
- ${this.analysisResults.phaseScores && Object.keys(this.analysisResults.phaseScores).length > 0 ? `
-
-
- ` : ''}
-
${this.analysisResults.detectedTechniques.length === 0 ? `
📊 Répartition par phase DIMA
-
- ${Object.entries(this.analysisResults.phaseScores).map(([phase, score]) => {
- const maxScore = Math.max(...Object.values(this.analysisResults.phaseScores));
- const percentage = maxScore > 0 ? (score / maxScore) * 100 : 0;
- return `
-
-
-
- `;
- }).join('')}
-
- ${this.getPhaseEmoji(phase)} ${phase}
-
-
-
- ${score.toFixed(1)} pts
-
-
- ${this.getPhaseDescription(phase)}
-
-
- 💡 La matrice DIMA analyse comment l'information traverse les 4 phases cognitives
-
-
@@ -370,7 +679,7 @@ Contenu: ${this.analysisResults.contentLength} caractères`;
${technique.matchedKeywords?.length > 0 ? `
- 🔍 Mots-clés détectés:
+ 🔎 Mots-clés détectés:
${technique.matchedKeywords.slice(0, 4).map(keyword =>
@@ -414,6 +723,10 @@ Contenu: ${this.analysisResults.contentLength} caractères`;
from { transform: translateY(30px); opacity: 0; }
to { transform: translateY(0); opacity: 1; }
}
+ @keyframes slideInRight {
+ from { transform: translateX(100%); opacity: 0; }
+ to { transform: translateX(0); opacity: 1; }
+ }
#dima-modal button:hover {
transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
@@ -425,6 +738,11 @@ Contenu: ${this.analysisResults.contentLength} caractères`;
modal.addEventListener('click', (e) => {
if (e.target === modal) modal.remove();
});
+
+ // Ajouter l'événement pour le bouton des détails du site suspect
+ modal.querySelector('.suspicious-details-btn')?.addEventListener('click', () => {
+ this.showSuspiciousSiteDetails();
+ });
document.body.appendChild(modal);
this.log('Modal affiché');
@@ -434,5 +752,6 @@ Contenu: ${this.analysisResults.contentLength} caractères`;
}
}
}
+
// Make UIManager available globally for Chrome extension
-window.UIManager = UIManager;
+window.UIManager = UIManager;
\ No newline at end of file