Skip to content

menur4/imageCompare

Repository files navigation

Comparateur d'Images

Application web interactive pour comparer visuellement deux images côte à côte.

🎯 Fonctionnalités

Chargement d'images

  • 📎 Entrée par URL
  • 📁 Upload de fichiers locaux
  • 🖱️ Drag & Drop (fichiers ou URLs)
  • 🎨 Support PSD : conversion automatique des fichiers Photoshop en PNG

Comparaison interactive

  • Slider vertical : glissez pour comparer les deux images
  • Zoom & Pan :
    • Zoom à la molette (jusqu'à 10x)
    • Déplacement par drag & drop
    • Double-clic pour réinitialiser
  • Mode Blink : alternance rapide entre les images pour détecter les différences subtiles
  • Plein écran : visualisation immersive
  • Conteneur redimensionnable : ajustez la taille selon vos besoins

Outils d'analyse

  • 🔒 Calcul MD5 : vérification de l'intégrité des fichiers (indication visuelle si identiques)
  • 🏷️ Badges informatifs : affichent les différences entre les URLs
  • 📐 Ajustement des tailles : superposition parfaite pour images de dimensions différentes

Intégration Cloudinary

  • Ajout automatique de paramètres de transformation
  • Support du profil sRGB
  • Exemples pré-configurés

🚀 Utilisation

Démo en ligne

Accédez à l'application : Comparateur d'Images

Versions disponibles

  • compare.html : Version standard avec exemples Chanel
  • compare_WFJ.html : Version WFJ avec paramètres Cloudinary optimisés

Utilisation locale

  1. Ouvrez simplement compare.html ou compare_WFJ.html dans votre navigateur
  2. Pas de serveur nécessaire, l'application fonctionne entièrement côté client

📋 Formats supportés

  • Images standards : PNG, JPG/JPEG, WEBP, GIF, AVIF, BMP
  • Fichiers Photoshop : PSD (conversion automatique en PNG)

🛠️ Technologies

  • HTML5 / CSS3 / JavaScript vanilla (pur)
  • Grid CSS pour le layout responsive
  • ag-psd : bibliothèque pour la lecture des fichiers PSD
  • API Cloudinary pour les transformations d'images

⌨️ Raccourcis

  • Double-clic sur l'image : réinitialiser le zoom
  • Molette : zoom in/out
  • Drag (quand zoomé) : déplacer l'image
  • Slider : comparer les deux images

👥 Crédits

Développé par la DAM Team

📝 License

MIT

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors