pages/LIFE_CYCLE_OF_MACHINE_LEARNING.py

import streamlit as st
import pandas as pd
import json
import xml.etree.ElementTree as ET
from PIL import Image
import numpy as np
import matplotlib.pyplot as plt

# Inject custom CSS to style the buttons
st.markdown("""
    <style>
    .stButton>button {
        background-color: #4CAF50;
        color: white;
        width: 100%;
    }
    </style>
    """, unsafe_allow_html=True)

# Initialize page navigation state
if 'page' not in st.session_state:
    st.session_state.page = "home"  # Default page is "home"

# ----------------- Home Page -----------------
def home_page():
    st.title(":green[Lifecycle of a Machine Learning Project]")
    st.markdown("Click on a stage to learn more about it.")

    # Buttons for various stages of the ML project lifecycle
    if st.button(":blue[📊 Data Collection]"):
        st.session_state.page = "data_collection"

    if st.button(":blue[🌟 Problem Statement]"):
        st.markdown("### Problem Statement\nIdentify the problem you want to solve and set clear objectives and success criteria.")
    
    if st.button(":blue[🛠️ Simple EDA]"):
        st.markdown("### Simple EDA\nPerform exploratory data analysis to understand data distributions and relationships.")
    
    if st.button(":blue[🧹 Data Pre-Processing]"):
        st.markdown("### Data Pre-Processing\nConvert raw data into cleaned data.")

    if st.button(":blue[📈 Exploratory Data Analysis (EDA)]"):
        st.markdown("### Exploratory Data Analysis (EDA)\nVisualize and analyze the data to understand its distributions and relationships.")

    if st.button(":blue[🏋️ Feature Engineering]"):
        st.markdown("### Feature Engineering\nCreate new features from existing data.")

    if st.button(":blue[🤖 Model Training]"):
        st.markdown("### Model Training\nTrain the model using the training data and optimize its parameters.")

    if st.button(":blue[🔧 Model Testing]"):
        st.markdown("### Model Testing\nAssess the model's performance using various metrics and cross-validation techniques.")

    if st.button(":blue[🚀 Model Deployment]"):
        st.markdown("### Model Deployment\nIntegrate the trained model into a production environment and monitor its performance.")

    if st.button(":blue[📝 Monitoring]"):
        st.markdown("### Monitoring\nPeriodically retrain the model with new data and update features as needed.")

# ----------------- Data Collection Page -----------------
def data_collection_page():
    st.title(":red[Data Collection]")
    st.markdown("### Data Collection\nThis page discusses the process of Data Collection.")
    st.markdown("Types of Data: **Structured**, **Unstructured**, **Semi-Structured**")

    if st.button(":blue[🌟 Structured Data]"):
        st.session_state.page = "structured_data"

    if st.button(":blue[📷 Unstructured Data]"):
        st.session_state.page = "unstructured_data"

    if st.button(":blue[🗃️ Semi-Structured Data]"):
        st.session_state.page = "semi_structured_data"

    if st.button("Back to Home"):
        st.session_state.page = "home"

# ----------------- Structured Data Page -----------------
def structured_data_page():
    st.title(":blue[Structured Data]")
    st.markdown("""
    Structured data is highly organized and typically stored in tables like spreadsheets or databases. It is easy to search and analyze.
    """)
    st.markdown("### Examples: Excel files")

    if st.button(":green[📊 Excel]"):
        st.session_state.page = "excel"

    if st.button("Back to Data Collection"):
        st.session_state.page = "data_collection"

# ----------------- Excel Data Page -----------------
def excel_page():
    st.title(":green[Excel Data Format]")

    st.write("### What is Excel?")
    st.write("Excel is a spreadsheet tool for storing data in tabular format with rows and columns. Common file extensions: .xls, .xlsx.")

    st.write("### How to Read Excel Files")
    st.code("""
import pandas as pd

# Read an Excel file
df = pd.read_excel('data.xlsx', sheet_name='Sheet1')
print(df)
    """, language='python')

    st.write("### Issues Encountered")
    st.write("""
- **File not found**: Incorrect file path.
- **Sheet name error**: Specified sheet doesn't exist.
- **Missing libraries**: openpyxl or xlrd might be missing.
""")

    st.write("### Solutions to These Issues")
    st.code("""
# Install required libraries
# pip install openpyxl xlrd

# Handle missing file
try:
    df = pd.read_excel('data.xlsx', sheet_name='Sheet1')
except FileNotFoundError:
    print("File not found. Check the file path.")

# List available sheet names
excel_file = pd.ExcelFile('data.xlsx')
print(excel_file.sheet_names)
    """, language='python')

    st.markdown('[Jupyter Notebook](https://colab.research.google.com/drive/1Dv68m9hcRzXsLRlRit0uZc-8CB8U6VV3?usp=sharing)')
   
    if st.button("Back to Structured Data"):
        st.session_state.page = "structured_data"

# ----------------- Unstructured Data Page -----------------
def unstructured_data_page():
    st.title(":blue[Unstructured Data]")
    
    st.markdown("""
    *Unstructured data* does not have a predefined format. It consists of various data types like text, images, videos, and audio files.
    Examples include:
    - Images (e.g., .jpg, .png)
    - Videos (e.g., .mp4, .avi)
    - Social media posts
    """)

    # Button to Navigate to Introduction to Image
    if st.button("Introduction to Image"):
        st.session_state.page = "introduction_to_image"

# ----------------- Introduction to Image -----------------
def introduction_to_image_page():
    st.header("🖼️ What is Image")
    st.markdown("""
   An image is a two-dimensional visual representation of objects, people, scenes, or concepts. It can be captured using devices like cameras, scanners, or created digitally. Images are composed of individual units called pixels, which contain information about brightness and color.

Types of Images:
- **Raster Images (Bitmap)**: Composed of a grid of pixels. Common formats include:
    - JPEG
    - PNG
    - GIF
- **Vector Images**: Defined by mathematical equations and geometric shapes like lines and curves. Common format:
    - SVG (Scalable Vector Graphics)
- **3D Images**: Represent objects or scenes in three dimensions, often used for rendering and modeling.

Image Representation:
- **Grayscale Image**: Each pixel has a single intensity value, typically ranging from 0 (black) to 255 (white), representing different shades of gray.
- **Color Image**: Usually represented in the RGB color space, where each pixel consists of three values indicating the intensity of Red, Green, and Blue.

Applications of Images:
- **Photography & Visual Media**: Capturing moments and storytelling.
- **Medical Imaging**: Diagnosing conditions using X-rays, MRIs, etc.
- **Machine Learning & AI**: Tasks like image classification, object detection, and facial recognition.
- **Remote Sensing**: Analyzing geographic and environmental data using satellite imagery.
- **Graphic Design & Art**: Creating creative visual content for marketing and design.
""")

    st.code("""
from PIL import Image
import numpy as np
import matplotlib.pyplot as plt

# Open an image file
image = Image.open('sample_image.jpg')
image.show()

# Convert image to grayscale
gray_image = image.convert('L')
gray_image.show()

# Resize the image
resized_image = image.resize((200, 200))
resized_image.show()

# Rotate the image by 90 degrees
rotated_image = image.rotate(90)
rotated_image.show()

# Convert the image to a NumPy array and display its shape
image_array = np.array(image)
print(image_array.shape)

# Display the image array as a plot
plt.imshow(image)
plt.title("Original Image")
plt.axis('off')
plt.show()
    """, language='python')

    st.header("Color Spaces in Machine Learning")
    st.markdown("""
    A color space is a mathematical model for representing colors. In machine learning, different color spaces can be used for preprocessing and analyzing image data, depending on the task.

Common Color Spaces:
- **RGB (Red, Green, Blue)**: The most common color space for digital images. Each pixel is represented by a combination of three values corresponding to the red, green, and blue channels.
  - **Use Cases**: Image classification, general-purpose image analysis.
- **HSV (Hue, Saturation, Value)**: Separates color information (hue) from intensity (value), making it useful for tasks where distinguishing between color variations and intensity is important.
  - **Use Cases**: Color-based object detection, image segmentation, color tracking.
- **CMYK (Cyan, Magenta, Yellow, Black)**: Primarily used for printing, not commonly used in machine learning, but useful for preparing images for printers.
  - **Use Cases**: Printing applications.
- **LAB (Lightness, A, B)**: Designed to be perceptually uniform, meaning that the perceptual difference between colors is consistent across the space.
  - **Use Cases**: Color correction, image processing tasks requiring color consistency.
""")

    # Button to Navigate to Operations Using OpenCV
    if st.button("Operations Using OpenCV"):
        st.session_state.page = "operations_using_opencv"

     # Navigation Button
    if st.button("Back to Data Collection"):
        st.session_state.page = "data_collection"  
        
 #       ---------- OPERATIONS USING OPENCV --------------------------------


def  operations_using_opencv_page():
    # Header and description for cv2.imread
    st.header("🗂️ Reading an Image with cv2.imread()")
    st.markdown("""
    **`cv2.imread()` - Read an Image**

    **Purpose:** Load an image from a file and convert it to a NumPy array.

    **Syntax:**
    ```python
    image = cv2.imread(filename, flags)
    ```

    **Common Flags:**
    - `cv2.IMREAD_COLOR` (default, loads a color image).
    - `cv2.IMREAD_GRAYSCALE` (loads the image in grayscale).
    - `cv2.IMREAD_UNCHANGED` (loads the image as is, with alpha transparency if available).

    **Return:**
    - A NumPy array representing the image.
    - Returns `None` if the image cannot be loaded.

    **Example:**
    ```python
    import cv2
    image = cv2.imread('image.jpg', cv2.IMREAD_COLOR)
    ```
    """)

    # Header and description for cv2.imshow
    st.header("🖼️ Displaying an Image with cv2.imshow()")
    st.markdown("""
    **`cv2.imshow()` - Display an Image**

    **Purpose:** Show an image in a window.

    **Syntax:**
    ```python
    cv2.imshow(window_name, image)
    ```

    **Requirements:**
    - Call `cv2.waitKey()` to keep the window open until a key is pressed.
    - Call `cv2.destroyAllWindows()` to close the window(s).

    **Behavior:**
    - Displays the image in a resizable window.
    - The image must be a NumPy array.

    **Example:**
    ```python
    import cv2
    cv2.imshow('Image Window', image)
    cv2.waitKey(0)  # Wait for a key press
    cv2.destroyAllWindows()  # Close the window
    ```
    """)

    # Header and description for cv2.imwrite
    st.header("💾 Saving an Image with cv2.imwrite()")
    st.markdown("""
    **`cv2.imwrite()` - Write/Save an Image**

    **Purpose:** Save an image to a file.

    **Syntax:**
    ```python
    cv2.imwrite(filename, image)
    ```

    **File Format:**  
    Determined by the file extension (`.jpg`, `.png`, etc.).

    **Return:**  
    - `True` if the image is saved successfully, `False` otherwise.

    **Optional Parameters:**
    - **JPEG Quality:** `cv2.IMWRITE_JPEG_QUALITY` (0 to 100, default is 95).
    - **PNG Compression:** `cv2.IMWRITE_PNG_COMPRESSION` (0 to 9, default is 3).

    **Example:**
    ```python
    import cv2
    cv2.imwrite('output.jpg', image)
    ```
    """)

    ##Navigation Button 
    if st.button("Conversion of Images"):
        st.session_state.page = "Conversion_of_Images"

 

##------------CONVERSION OF IMAGE-----------------


def Conversion_of_Images_page():
    # Header for Image Conversion
    st.header("🔄 Converting Images Between Different Color Spaces")

    st.markdown("""
    **OpenCV supports many color spaces for image processing.**

    **Common Conversions:**
    
    - **BGR to Grayscale:** Converts a color image to grayscale.
    - **BGR to RGB:** Converts from OpenCV's default BGR format to the standard RGB format.
    - **BGR to HSV:** Converts the image to the HSV (Hue, Saturation, Value) color space.

    **Examples of Conversions:**

    ```python
    import cv2

    # Load the image
    image = cv2.imread('image.jpg')

    # Convert BGR to Grayscale
    gray_image = cv2.cvtColor(image, cv2.COLOR_BGR2GRAY)

    # Convert BGR to RGB
    rgb_image = cv2.cvtColor(image, cv2.COLOR_BGR2RGB)

    # Convert BGR to HSV
    hsv_image = cv2.cvtColor(image, cv2.COLOR_BGR2HSV)
    ```

    **Why Convert Color Spaces?**
    - **Grayscale:** Useful for reducing image complexity in tasks like edge detection.
    - **RGB:** Standard format for visualization in libraries like `matplotlib`.
    - **HSV:** Useful for color-based segmentation, as it separates color information from brightness.
    """)

    # Header for Splitting Channels
    st.header("🔹 Splitting Color Channels in an Image")

    st.markdown("""
    **Splitting an image into its individual color channels (B, G, R) allows you to analyze or modify each channel independently.**

    **Syntax:**
    ```python
    b, g, r = cv2.split(image)
    ```

    **Example:**
    ```python
    import cv2

    # Load the image
    image = cv2.imread('image.jpg')

    # Split the image into Blue, Green, and Red channels
    blue_channel, green_channel, red_channel = cv2.split(image)

    # Display the channels separately (Optional)
    cv2.imshow('Blue Channel', blue_channel)
    cv2.imshow('Green Channel', green_channel)
    cv2.imshow('Red Channel', red_channel)
    cv2.waitKey(0)
    cv2.destroyAllWindows()
    ```

    **Explanation:**
    - The `cv2.split()` function returns the Blue, Green, and Red channels as separate images (grayscale format).
    """)

    # Header for Merging Channels
    st.header("🔹 Merging Color Channels in an Image")

    st.markdown("""
    **You can merge the individual channels back into a color image using `cv2.merge()`.**

    **Syntax:**
    ```python
    merged_image = cv2.merge((b, g, r))
    ```

    **Example:**
    ```python
    import cv2

    # Load the image
    image = cv2.imread('image.jpg')

    # Split the image into channels
    b, g, r = cv2.split(image)

    # Merge the channels back into a color image
    merged_image = cv2.merge((b, g, r))

    # Display the merged image
    cv2.imshow('Merged Image', merged_image)
    cv2.waitKey(0)
    cv2.destroyAllWindows()
    ```

    **Explanation:**
    - The `cv2.merge()` function takes a tuple of channels `(b, g, r)` and combines them back into a single color image.
    - You can manipulate the individual channels before merging to achieve different effects.
    """)

    # Header for Combining with Modifications
    st.header("🎨 Modifying Channels Before Merging")

    st.markdown("""
    **You can modify each channel (e.g., increase brightness in the red channel) before merging them back together.**

    **Example:**
    ```python
    import cv2

    # Load the image
    image = cv2.imread('image.jpg')

    # Split channels
    b, g, r = cv2.split(image)

    # Increase the intensity of the red channel
    r = cv2.add(r, 50)

    # Merge the modified channels
    modified_image = cv2.merge((b, g, r))

    # Display the modified image                            
    cv2.imshow('Modified Image', modified_image)
    cv2.waitKey(0)
    cv2.destroyAllWindows()
    ```

    **Explanation:**
    - In this example, `cv2.add(r, 50)` increases the intensity of the red channel by 50.
    - After modification, the channels are merged back to create the final image.
    """)

  


     # Navigation Button
    if st.button("Video capture and explanation"):
        st.session_state.page = "Video capture and explanation"

       # Navigation Button
    if st.button("Back to Data Collection"):
        st.session_state.page = "data_collection"  
# ----------------- Semi-Structured Data Page -----------------
def semi_structured_data_page():
    st.title(":orange[Semi-Structured Data]")
    st.markdown("""
    Semi-structured data does not follow the rigid structure of relational databases but still has some organizational properties. Examples include:
    - JSON files
    - XML files
    """)

    if st.button(":green[💾 JSON]"):
        st.session_state.page = "json"
        
    if st.button(":green[📄 CSV]"):
        st.session_state.page = "csv"

    if st.button(":green[📄 XML]"):
        st.session_state.page = "xml"

    if st.button("Back to Data Collection"):
        st.session_state.page = "data_collection"

# ----------------- JSON Data Page -----------------
def json_page():
    st.title(":green[JSON Data Format]")

    st.write("### What is JSON?")
    st.write("""
    JSON (JavaScript Object Notation) is a lightweight data-interchange format that's easy for humans to read and write, and easy for machines to parse and generate. JSON is often used in APIs, configuration files, and data transfer applications.
    """)

    st.write("### Reading JSON Files")
    st.code("""
import json
# Read a JSON file
with open('data.json', 'r') as file:
    data = json.load(file)
    print(data)
    """, language='python')

    st.write("### Writing JSON Files")
    st.code("""
import json
# Write data to JSON file
data = {
    "name": "Alice",
    "age": 25,
    "skills": ["Python", "Machine Learning"]
}
with open('data.json', 'w') as file:
    json.dump(data, file, indent=4)
    """, language='python')

    st.markdown("### Tips for Handling JSON Files")
    st.write("""
    - JSON files can be nested, so you might need to navigate through dictionaries and lists.
    - If the structure is complex, you can use libraries like json_normalize() in pandas to flatten the JSON into a more tabular format for easier analysis.
    - JSON supports both strings and numbers, and other types like arrays and booleans, making it versatile for various data types.
    """)

    st.markdown('[Jupyter Notebook](https://huggingface.co/transformers/notebooks.html)')
    
    if st.button("Back to Semi-Structured Data"):
        st.session_state.page = "semi_structured_data"

# ----------------- Main Execution -----------------
def main():
    page = st.session_state.page

    if page == "home":
        home_page()
    elif page == "data_collection":
        data_collection_page()
    elif page == "structured_data":
        structured_data_page()
    elif page == "excel":
        excel_page()
    elif page == "unstructured_data":
        unstructured_data_page()
    elif page == "semi_structured_data":
        semi_structured_data_page()
    elif page == "json":
        json_page()
    elif page == "introduction_to_image":
        introduction_to_image_page()
    elif page == "operations_using_opencv":
         operations_using_opencv_page()
    elif page == "Conversion_of_Images":
         Conversion_of_Images_page()
    elif page == "video_capture_page":
         video_capture_page

        
if __name__ == "__main__":
    main()