Update app.py

app.py

@@ -8,14 +8,12 @@ from barcode.writer import ImageWriter
 import qrcode
 import tempfile
 
-
 def image_to_bytes(img):
     pil_image = Image.fromarray(cv2.cvtColor(img, cv2.COLOR_BGR2RGB))
     buffer = BytesIO()
     pil_image.save(buffer, format="PNG")
     return buffer.getvalue()
 
-
 def generate_barcode(link):
     code128 = barcode.get_barcode_class('code128')
     barcode_image = code128(link, writer=ImageWriter())
@@ -23,8 +21,6 @@ def generate_barcode(link):
     barcode_image.write(buffer)
     return Image.open(buffer)
 
-
-
 def generate_qrcode(link):
     qr = qrcode.QRCode(
         version=2,  
@@ -36,17 +32,115 @@ def generate_qrcode(link):
     qr.make(fit=True)
     qr_image = qr.make_image(fill_color="black", back_color="white")
 
-    small_qr_image = qr_image.resize((100, 100), Image.Resampling.LANCZOS)
+    small_qr_image = qr_image.resize((60, 60), Image.Resampling.LANCZOS)
 
     buffer = BytesIO()
     small_qr_image.save(buffer, format="PNG")
     return Image.open(buffer)
 
-
+def add_custom_css():
+    css = """
+    <style>
+        body {
+            background: linear-gradient(135deg, #a8dadc, #f1faee);
+            color: #1d3557;
+            font-family: 'Arial', sans-serif;
+            animation: backgroundAnimation 10s infinite alternate;
+        }
+
+        @keyframes backgroundAnimation {
+            0% {
+                background: linear-gradient(135deg, #a8dadc, #f1faee);
+            }
+            100% {
+                background: linear-gradient(135deg, #f1faee, #457b9d);
+            }
+        }
+
+        .stButton>button {
+            background-color: #457b9d;
+            color: white;
+            border-radius: 5px;
+            transition: transform 0.3s, background-color 0.3s;
+            box-shadow: 2px 2px 6px rgba(0,0,0,0.2);
+        }
+
+        .stButton>button:hover {
+            transform: scale(1.1);
+            background-color: #1d3557;
+        }
+
+        .stSidebar {
+            background: linear-gradient(135deg, #457b9d, #a8dadc);
+            color: white;
+            font-size: 16px;
+        }
+
+        .stImage {
+            animation: fadeIn 2s ease-in-out;
+        }
+
+        @keyframes fadeIn {
+            0% {
+                opacity: 0;
+            }
+            100% {
+                opacity: 1;
+            }
+        }
+
+        header, footer {
+            background: #457b9d;
+            color: white;
+        }
+
+        .stMarkdown {
+            animation: slideIn 1s ease-out;
+        }
+
+        @keyframes slideIn {
+            0% {
+                transform: translateY(-20px);
+                opacity: 0;
+            }
+            100% {
+                transform: translateY(0);
+                opacity: 1;
+            }
+        }
+    </style>
+    """
+    st.markdown(css, unsafe_allow_html=True)
+
+def add_custom_js():
+    js = """
+    <script>
+        document.addEventListener('DOMContentLoaded', function() {
+            const elements = document.querySelectorAll('.stButton>button');
+            elements.forEach(button => {
+                button.addEventListener('click', () => {
+                    button.style.backgroundColor = '#a8dadc';
+                    button.style.transform = 'rotate(360deg)';
+                    setTimeout(() => button.style.transform = 'rotate(0deg)', 300);
+                });
+            });
+        });
+    </script>
+    """
+    st.markdown(js, unsafe_allow_html=True)
 
 def main():
-    st.set_page_config(page_title="Application de Vision par Ordinateur", layout="wide")
-    st.title("Application de Vision par Ordinateur")
+    st.set_page_config(page_title="ADS VISOR - Un autre regard", layout="wide")
+
+    add_custom_css()
+    add_custom_js()
+
+
+    logo_path = "logo.jpg"  
+    logo = Image.open(logo_path)
+    st.image(logo, width=150, caption="ADS VISOR")
+
+    st.title("ADS VISOR - Un autre regard")
 
     st.sidebar.header("Chargement de l'image")
     if "default_image" not in st.session_state:
@@ -63,49 +157,75 @@ def main():
         return
 
     st.sidebar.header("Fonctionnalités")
-    menu_option = st.sidebar.selectbox("Choisissez une fonctionnalité", [
-        "Accueil",
-        "Transformations d'image",
-        "Cropping",
-        "Rotation",
-        "Floutage",
-        "Contours",
-        "Génération de Code-barres et QR Code",
-        "Détection Faciale"
-    ])
+    menu_option = st.sidebar.selectbox(
+        "Choisissez une fonctionnalité",
+        ["Accueil", "Transformations d'image", "Cropping", "Rotation", "Floutage", "Contours", "Génération de Code-barres et QR Code", "Détection Faciale"],
+        format_func=lambda x: {
+            "Accueil": "🏠 Accueil",
+            "Transformations d'image": "🖼️ Transformations",
+            "Cropping": "✂️ Cropping",
+            "Rotation": "🔄 Rotation",
+            "Floutage": "🌫️ Floutage",
+            "Contours": "🔍 Contours",
+            "Génération de Code-barres et QR Code": "📇 Codes",
+            "Détection Faciale": "��� Détection Faciale"
+        }.get(x, x)
+    )
 
     image_np = st.session_state["default_image"]
 
     if menu_option == "Accueil":
-        st.header("Bienvenue sur l'application de Vision par Ordinateur")
-        st.write(
-            "Cette application utilise OpenCV pour effectuer diverses transformations "
-            "et manipulations d'images. Charge une image depuis la barre latérale et explore les fonctionnalités."
+        st.header("Bienvenue sur ADS VISOR")
+        st.markdown(
+            """
+            <div class="stMarkdown">
+                <h2>ADS VISOR est une application innovante pour analyser, transformer et explorer vos images. 🖼️✨</h2>
+                <p>Elle a été concu par un groupe de trois étudiants dans le contexte du contrôle continu de Computer Vision.</p>
+                <p>Que vous soyez un professionnel ou un passionné, découvrez un large éventail de fonctionnalités interactives !</p>
+                <ul>
+                    <li><b>Transformations d'image :</b> Couleurs, niveaux de gris, etc.</li>
+                    <li><b>Découpage & Rotation :</b> Ajustez vos images à la perfection.</li>
+                    <li><b>Détection Faciale :</b> Identifiez les visages automatiquement.</li>
+                    <li><b>Codes-barres & QR Codes :</b> Génération rapide pour vos projets.</li>
+                </ul>
+            </div>
+            """,
+            unsafe_allow_html=True
+        )
+
+        st.write("### Équipe :")
+        st.markdown(
+            """
+            | **Nom**                | **Rôle**                  |
+            |------------------------|---------------------------|
+            | **Ngoue David**        | Master 2 Intelligence Artificielle et Big Data      |
+            | **Bidzanga Armel**     | Master 2 Intelligence Artificielle et Big Data       |
+            | **Nziou Serena**       | Master 2 Administration de Systèmes d'Information     |
+            """,
+            unsafe_allow_html=True
         )
 
     elif menu_option == "Transformations d'image":
         st.subheader("Transformations d'image")
 
-        col1, col2, col3, col4 = st.columns(4)
-        with col1:
-            if st.button("Transformer en gris"):
-                gray = cv2.cvtColor(image_np, cv2.COLOR_BGR2GRAY)
-                st.image(gray, caption="Image en Niveaux de Gris", use_container_width=True)
-        with col2:
-            if st.button("Couleur rouge"):
-                red = image_np.copy()
-                red[:, :, 1:] = 0
-                st.image(red, caption="Image Rouge", use_container_width=True)
-        with col3:
-            if st.button("Couleur verte"):
-                green = image_np.copy()
-                green[:, :, [0, 2]] = 0
-                st.image(green, caption="Image Verte", use_container_width=True)
-        with col4:
-            if st.button("Couleur jaune"):
-                yellow = image_np.copy()
-                yellow[:, :, 0] = 0
-                st.image(yellow, caption="Image Jaune", use_container_width=True)
+        tab1, tab2, tab3, tab4 = st.tabs([
+            "Gris 🖤", "Rouge ❤️", "Vert 💚", "Jaune 💛"
+        ])
+
+        with tab1:
+            st.image(cv2.cvtColor(image_np, cv2.COLOR_BGR2GRAY), caption="Image en Niveaux de Gris", use_container_width=True)
+        with tab2:
+            red = image_np.copy()
+            red[:, :, 1:] = 0
+            st.image(red, caption="Image Rouge", use_container_width=True)
+        with tab3:
+            green = image_np.copy()
+            green[:, :, [0, 2]] = 0
+            st.image(green, caption="Image Verte", use_container_width=True)
+        with tab4:
+            yellow = image_np.copy()
+            yellow[:, :, 0] = 0
+            st.image(yellow, caption="Image Jaune", use_container_width=True)
 
     elif menu_option == "Cropping":
         st.subheader("Cropping")
@@ -115,66 +235,58 @@ def main():
         x2 = st.number_input("x2", 1, image_np.shape[1], step=1)
         y2 = st.number_input("y2", 1, image_np.shape[0], step=1)
 
-        if st.button("Cropper"):
-            cropped = image_np[int(y1):int(y2), int(x1):int(x2)]
-            st.image(cropped, caption="Image Croppée", use_container_width=True)
+        cropped = image_np[int(y1):int(y2), int(x1):int(x2)]
+        st.image(cropped, caption="Image Croppée", use_container_width=True)
 
     elif menu_option == "Rotation":
         st.subheader("Rotation")
 
         angle = st.selectbox("Angle de rotation", [45, 90, 180])
 
-        if st.button("Tourner"):
-            rows, cols, _ = image_np.shape
-            rotation_matrix = cv2.getRotationMatrix2D((cols / 2, rows / 2), angle, 1)
-            rotated = cv2.warpAffine(image_np, rotation_matrix, (cols, rows))
-            st.image(rotated, caption=f"Image Rotée de {angle} degrés", use_container_width=True)
+        rows, cols, _ = image_np.shape
+        rotation_matrix = cv2.getRotationMatrix2D((cols / 2, rows / 2), angle, 1)
+        rotated = cv2.warpAffine(image_np, rotation_matrix, (cols, rows))
+        st.image(rotated, caption=f"Image Rotée de {angle} degrés", use_container_width=True)
 
     elif menu_option == "Floutage":
         st.subheader("Floutage")
 
         blur_level = st.slider("Niveau de flou (k)", min_value=1, max_value=51, step=2, value=15)
-        if st.button("Appliquer le flou"):
-            blurred = cv2.GaussianBlur(image_np, (blur_level, blur_level), 0)
-            st.image(blurred, caption=f"Image Floutée (k={blur_level})", use_container_width=True)
+        blurred = cv2.GaussianBlur(image_np, (blur_level, blur_level), 0)
+        st.image(blurred, caption=f"Image Floutée (k={blur_level})", use_container_width=True)
 
     elif menu_option == "Contours":
         st.subheader("Contours")
 
-        if st.button("Capturer les contours"):
-            gray = cv2.cvtColor(image_np, cv2.COLOR_BGR2GRAY)
-            edges = cv2.Canny(gray, 100, 200)
-            st.image(edges, caption="Contours de l'Image", use_container_width=True)
+        gray = cv2.cvtColor(image_np, cv2.COLOR_BGR2GRAY)
+        edges = cv2.Canny(gray, 100, 200)
+        st.image(edges, caption="Contours de l'Image", use_container_width=True)
 
     elif menu_option == "Génération de Code-barres et QR Code":
         st.subheader("Génération de Code-barres et QR Code")
         link = st.text_input("Entre un lien ou un texte pour générer le code-barres et le QR code")
-        if st.button("Générer"):
-            if link:
-                barcode_image = generate_barcode(link)
-                st.image(barcode_image, caption="Code-barres généré", use_container_width=True)
-
-                qrcode_image = generate_qrcode(link)
-                st.image(qrcode_image, caption="QR Code généré", use_container_width=True)
-            else:
-                st.error("Veuillez entrer un lien valide pour générer les codes.")
-                
+        if link:
+            barcode_image = generate_barcode(link)
+            st.image(barcode_image, caption="Code-barres généré", use_container_width=True)
+
+            qrcode_image = generate_qrcode(link)
+            st.image(qrcode_image, caption="QR Code généré", use_container_width=True)
+        else:
+            st.error("Veuillez entrer un lien valide pour générer les codes.")
+
     elif menu_option == "Détection Faciale":
         st.subheader("Détection Faciale")
 
-        # Charger le modèle Haarcascade pour la détection des visages
         face_cascade = cv2.CascadeClassifier(cv2.data.haarcascades + "haarcascade_frontalface_default.xml")
 
-        # Choix de la source
         detection_option = st.radio(
             "Choisis la source pour la détection faciale",
             options=["Webcam", "Vidéo téléversée"]
         )
 
         if detection_option == "Webcam":
-            # Option pour utiliser la webcam
             if st.button("Lancer la détection via webcam"):
-                cap = cv2.VideoCapture(0)  # 0 pour la webcam par défaut
+                cap = cv2.VideoCapture(0)
 
                 if not cap.isOpened():
                     st.error("Impossible d'accéder à la webcam, Hugging Face et le navigateur bloquent l'accès.")
@@ -188,27 +300,18 @@ def main():
                             st.error("Erreur lors de la capture vidéo.")
                             break
 
-                        # Convertir en niveaux de gris
                         gray = cv2.cvtColor(frame, cv2.COLOR_BGR2GRAY)
-
-                        # Détecter les visages
                         faces = face_cascade.detectMultiScale(gray, scaleFactor=1.1, minNeighbors=5, minSize=(30, 30))
 
-                        # Dessiner des rectangles autour des visages détectés
                         for (x, y, w, h) in faces:
                             cv2.rectangle(frame, (x, y), (x + w, y + h), (255, 0, 0), 2)
 
-                        # Convertir l'image pour Streamlit
                         frame = cv2.cvtColor(frame, cv2.COLOR_BGR2RGB)
-
-                        # Afficher l'image dans l'interface Streamlit
                         frame_placeholder.image(frame, channels="RGB", use_container_width=True)
 
-                    # Libérer la webcam une fois le flux terminé
                     cap.release()
 
         elif detection_option == "Vidéo téléversée":
-            # Option pour téléverser une vidéo
             uploaded_video = st.file_uploader("Charge une vidéo", type=["mp4", "avi", "mov"])
             if uploaded_video is not None:
                 video_bytes = uploaded_video.read()
@@ -224,26 +327,16 @@ def main():
                     if not ret:
                         break
 
-                    # Convertir en niveaux de gris
                     gray = cv2.cvtColor(frame, cv2.COLOR_BGR2GRAY)
-
-                    # Détecter les visages
                     faces = face_cascade.detectMultiScale(gray, scaleFactor=1.1, minNeighbors=5, minSize=(30, 30))
 
-                    # Dessiner des rectangles autour des visages détectés
                     for (x, y, w, h) in faces:
                         cv2.rectangle(frame, (x, y), (x + w, y + h), (255, 0, 0), 2)
 
-                    # Convertir l'image pour Streamlit
                     frame = cv2.cvtColor(frame, cv2.COLOR_BGR2RGB)
-
-                    # Afficher l'image dans l'interface Streamlit
                     frame_placeholder.image(frame, channels="RGB", use_container_width=True)
 
                 cap.release()
 
-
-
-
 if __name__ == "__main__":
     main()