initial commit

.dockerignore

@@ -0,0 +1,4 @@
+__pycache__/
+.pytest_cache/
+notebooks/
+*.pyc

.gitattributes

@@ -0,0 +1,39 @@
+*.7z filter=lfs diff=lfs merge=lfs -text
+*.arrow filter=lfs diff=lfs merge=lfs -text
+*.bin filter=lfs diff=lfs merge=lfs -text
+*.bz2 filter=lfs diff=lfs merge=lfs -text
+*.ckpt filter=lfs diff=lfs merge=lfs -text
+*.ftz filter=lfs diff=lfs merge=lfs -text
+*.gz filter=lfs diff=lfs merge=lfs -text
+*.h5 filter=lfs diff=lfs merge=lfs -text
+*.joblib filter=lfs diff=lfs merge=lfs -text
+*.lfs.* filter=lfs diff=lfs merge=lfs -text
+*.mlmodel filter=lfs diff=lfs merge=lfs -text
+*.model filter=lfs diff=lfs merge=lfs -text
+*.msgpack filter=lfs diff=lfs merge=lfs -text
+*.npy filter=lfs diff=lfs merge=lfs -text
+*.npz filter=lfs diff=lfs merge=lfs -text
+*.onnx filter=lfs diff=lfs merge=lfs -text
+*.ot filter=lfs diff=lfs merge=lfs -text
+*.parquet filter=lfs diff=lfs merge=lfs -text
+*.pb filter=lfs diff=lfs merge=lfs -text
+*.pickle filter=lfs diff=lfs merge=lfs -text
+*.pkl filter=lfs diff=lfs merge=lfs -text
+*.pt filter=lfs diff=lfs merge=lfs -text
+*.pth filter=lfs diff=lfs merge=lfs -text
+*.rar filter=lfs diff=lfs merge=lfs -text
+*.safetensors filter=lfs diff=lfs merge=lfs -text
+saved_model/**/* filter=lfs diff=lfs merge=lfs -text
+*.tar.* filter=lfs diff=lfs merge=lfs -text
+*.tar filter=lfs diff=lfs merge=lfs -text
+*.tflite filter=lfs diff=lfs merge=lfs -text
+*.tgz filter=lfs diff=lfs merge=lfs -text
+*.wasm filter=lfs diff=lfs merge=lfs -text
+*.xz filter=lfs diff=lfs merge=lfs -text
+*.zip filter=lfs diff=lfs merge=lfs -text
+*.zst filter=lfs diff=lfs merge=lfs -text
+*tfevents* filter=lfs diff=lfs merge=lfs -text
+*.png filter=lfs diff=lfs merge=lfs -text
+*.jpg filter=lfs diff=lfs merge=lfs -text
+*.jpeg filter=lfs diff=lfs merge=lfs -text
+*.JPG filter=lfs diff=lfs merge=lfs -text

.gitignore

@@ -0,0 +1,163 @@
+# Byte-compiled / optimized / DLL files
+__pycache__/
+*.py[cod]
+*$py.class
+
+# C extensions
+*.so
+
+# Distribution / packaging
+.Python
+build/
+develop-eggs/
+dist/
+downloads/
+eggs/
+.eggs/
+lib/
+lib64/
+parts/
+sdist/
+var/
+wheels/
+share/python-wheels/
+*.egg-info/
+.installed.cfg
+*.egg
+MANIFEST
+
+# PyInstaller
+#  Usually these files are written by a python script from a template
+#  before PyInstaller builds the exe, so as to inject date/other infos into it.
+*.manifest
+*.spec
+
+# Installer logs
+pip-log.txt
+pip-delete-this-directory.txt
+
+# Unit test / coverage reports
+htmlcov/
+.tox/
+.nox/
+.coverage
+.coverage.*
+.cache
+nosetests.xml
+coverage.xml
+*.cover
+*.py,cover
+.hypothesis/
+.pytest_cache/
+cover/
+
+# Translations
+*.mo
+*.pot
+
+# Django stuff:
+*.log
+local_settings.py
+db.sqlite3
+db.sqlite3-journal
+
+# Flask stuff:
+instance/
+.webassets-cache
+
+# Scrapy stuff:
+.scrapy
+
+# Sphinx documentation
+docs/_build/
+
+# PyBuilder
+.pybuilder/
+target/
+
+# Jupyter Notebook
+.ipynb_checkpoints
+
+# IPython
+profile_default/
+ipython_config.py
+
+# pyenv
+#   For a library or package, you might want to ignore these files since the code is
+#   intended to run in multiple environments; otherwise, check them in:
+# .python-version
+
+# pipenv
+#   According to pypa/pipenv#598, it is recommended to include Pipfile.lock in version control.
+#   However, in case of collaboration, if having platform-specific dependencies or dependencies
+#   having no cross-platform support, pipenv may install dependencies that don't work, or not
+#   install all needed dependencies.
+#Pipfile.lock
+
+# poetry
+#   Similar to Pipfile.lock, it is generally recommended to include poetry.lock in version control.
+#   This is especially recommended for binary packages to ensure reproducibility, and is more
+#   commonly ignored for libraries.
+#   https://python-poetry.org/docs/basic-usage/#commit-your-poetrylock-file-to-version-control
+#poetry.lock
+
+# pdm
+#   Similar to Pipfile.lock, it is generally recommended to include pdm.lock in version control.
+#pdm.lock
+#   pdm stores project-wide configurations in .pdm.toml, but it is recommended to not include it
+#   in version control.
+#   https://pdm.fming.dev/latest/usage/project/#working-with-version-control
+.pdm.toml
+.pdm-python
+.pdm-build/
+
+# PEP 582; used by e.g. github.com/David-OConnor/pyflow and github.com/pdm-project/pdm
+__pypackages__/
+
+# Celery stuff
+celerybeat-schedule
+celerybeat.pid
+
+# SageMath parsed files
+*.sage.py
+
+# Environments
+.env
+.venv
+env/
+venv/
+ENV/
+env.bak/
+venv.bak/
+
+# Spyder project settings
+.spyderproject
+.spyproject
+
+# Rope project settings
+.ropeproject
+
+# mkdocs documentation
+/site
+
+# mypy
+.mypy_cache/
+.dmypy.json
+dmypy.json
+
+# Pyre type checker
+.pyre/
+
+# pytype static type analyzer
+.pytype/
+
+# Cython debug symbols
+cython_debug/
+
+# PyCharm
+#  JetBrains specific template is maintained in a separate JetBrains.gitignore that can
+#  be found at https://github.com/github/gitignore/blob/main/Global/JetBrains.gitignore
+#  and can be added to the global gitignore or merged into this file.  For a more nuclear
+#  option (not recommended) you can uncomment the following to ignore the entire idea folder.
+models/
+notebooks/

Dockerfile

@@ -0,0 +1,19 @@
+FROM python:3.11-slim
+
+COPY ./requirements.txt /app/requirements.txt
+
+WORKDIR /app
+
+RUN pip install -r requirements.txt
+
+COPY . /app
+
+ENV PYTHONDONTWRITEBYTECODE=1
+ENV PYTHONUNBUFFERED=1
+ENV FLASK_APP=app.py
+ENV FLASK_ENV=production
+
+EXPOSE 5000
+
+CMD ["python", "app.py"]
+

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 Mohammed Zaloom
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

Makefile

@@ -0,0 +1,15 @@
+install:
+	pip install --upgrade pip &&\
+		pip install -r requirements.txt
+
+test:
+	python -m pytest -vv test_*.py 
+	python -m pytest --nbval notebooks/*/*.ipynb
+
+format:
+	black *.py 
+
+lint:
+	pylint --disable=R,C,E1120 *.py medgan/*.py
+
+all: install format lint test

README.md

@@ -0,0 +1,142 @@
+---
+title: Medgan
+emoji: ⚡
+colorFrom: blue
+colorTo: gray
+sdk: static
+pinned: false
+license: mit
+short_description: The project focuses on brain tumor MRI scans and includes im
+---
+
+<<<<<<< HEAD
+Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+=======
+[![CI](https://github.com/mozaloom/medgan/actions/workflows/main.yml/badge.svg)](https://github.com/mozaloom/medgan/actions/workflows/main.yml)
+[![Docker Image CI](https://github.com/mozaloom/medgan/actions/workflows/push-docker.yml/badge.svg)](https://github.com/mozaloom/medgan/actions/workflows/push-docker.yml)
+
+# MedGAN: Advanced Medical Image Generation
+
+<img src="static/css/Blue_ABstract_Brain_Technology_Logo__1_-removebg-preview.png" alt="medgan Logo" width="120" style="margin-bottom: 20px;">
+
+## Overview
+
+MedGAN is a comprehensive framework for generating high-quality synthetic medical images using state-of-the-art Generative Adversarial Networks (GANs). The project focuses on brain tumor MRI scans and includes implementations of multiple cutting-edge GAN architectures optimized for medical imaging applications.
+
+## Features
+
+- **Multiple GAN Implementations:**
+  - DCGAN (Deep Convolutional GAN)
+  - ProGAN (Progressive Growing of GANs)
+  - StyleGAN2 (Style-based Generator with improvements)
+  - WGAN (Wasserstein GAN with gradient penalty)
+
+- **Web Application Interface:**
+  - Generate synthetic brain MRI scans
+  - Detect tumor types from uploaded MRI images
+  - Interactive and user-friendly interface
+
+- **Pre-trained Models:**
+  - Models for three tumor types: Glioma, Meningioma, and Pituitary
+  - ViT-based tumor detection model (92% accuracy)
+
+## Architecture Performance Comparison
+
+| Architecture | Image Quality | Training Stability | Generation Diversity | Training Speed |
+|--------------|---------------|--------------------|-----------------------|---------------|
+| ProGAN       | ⭐⭐⭐⭐     | ⭐⭐⭐⭐⭐        | ⭐⭐⭐⭐            | ⭐⭐⭐        |
+| StyleGAN2    | ⭐⭐⭐⭐⭐   | ⭐⭐⭐⭐          | ⭐⭐⭐⭐⭐          | ⭐⭐         |
+| WGAN-GP      | ⭐⭐⭐       | ⭐⭐⭐⭐          | ⭐⭐⭐              | ⭐⭐⭐⭐     |
+| DCGAN        | ⭐⭐⭐       | ⭐⭐⭐            | ⭐⭐                | ⭐⭐⭐⭐⭐   |
+
+## Getting Started
+
+### Prerequisites
+- Python 3.9+
+- PyTorch 1.9+
+- Flask (for web application)
+- CUDA-capable GPU (recommended)
+
+### Installation
+
+1. Clone the repository:
+```bash
+git clone https://github.com/mozaloom/medgan.git
+cd medgan
+```
+
+2. Install required packages:
+```bash
+pip install -r requirements.txt
+```
+
+3. Run the web application:
+```bash
+python app.py
+```
+
+4. Access the web interface at `http://localhost:5000`
+
+## Usage
+
+### Web Application
+
+The MedGAN web application offers two primary functionalities:
+
+1. **Generate synthetic brain MRI scans:**
+   - Select tumor type (Glioma, Meningioma, Pituitary)
+   - Choose GAN architecture
+   - Generate high-quality synthetic MRI images
+
+2. **Detect tumor types:**
+   - Upload brain MRI scans
+   - Receive AI-powered tumor classification
+   - View detection confidence scores
+
+
+Check the individual model implementation files for specific training parameters.
+
+## Project Structure
+
+```
+medgan/
+├── app.py                   # Flask web application
+├── medgan/                  # Core GAN implementations
+│   ├── dcgan.py
+│   ├── progan.py
+│   ├── stylegan.py
+│   ├── wgan.py
+│   └── vit.py
+├── models/                  # Pre-trained model weights
+├── notebooks/               # Training notebooks
+│   ├── dcgan/
+│   ├── progan/
+│   ├── stylegan/
+│   └── wgan/
+├── static/                  # Web assets
+└── templates/               # HTML templates
+```
+
+## Contributing
+
+Contributions are welcome! Please feel free to submit a Pull Request.
+
+1. Fork the repository
+2. Create your feature branch (`git checkout -b feature/amazing-feature`)
+3. Commit your changes (`git commit -m 'Add some amazing feature'`)
+4. Push to the branch (`git push origin feature/amazing-feature`)
+5. Open a Pull Request
+
+## License
+
+This project is licensed under the MIT License - see the LICENSE file for details.
+
+## Acknowledgments
+
+- [Brain Tumor MRI Dataset](https://www.kaggle.com/datasets/masoudnickparvar/brain-tumor-mri-dataset/data) from Kaggle
+- Research papers implementing the original GAN architectures:
+  - [DCGAN](https://arxiv.org/abs/1511.06434)
+  - [ProGAN](https://arxiv.org/abs/1710.10196)
+  - [StyleGAN2](https://arxiv.org/abs/1912.04958)
+  - [WGAN](https://arxiv.org/abs/1701.07875)
+>>>>>>> c38c95c (Initial commit)

app.py

@@ -0,0 +1,238 @@
+import os
+import io
+import torch
+import base64
+import zipfile
+from flask import Flask, request, jsonify, render_template, send_file
+from medgan.dcgan import Generator_DCGAN, generate_examples_DCGAN
+from medgan.progan import Generator_ProGAN, generate_examples_ProGAN, seed_everything
+from medgan.stylegan import Generator_SG2, MappingNetwork, generate_examples_SG2
+from medgan.vit import TumorDetectionApp
+from medgan.wgan import Generator_WGAN, generate_examples_WGAN
+
+# Initialize Flask app
+app = Flask(__name__)
+
+# Set seeds for reproducibility
+seed_everything()
+
+# Constants
+Z_DIM = 256
+FEATURES_GEN = 64
+CHANNELS_IMG = 3
+progan_steps = 6  # Number of steps for ProGAN fade-in
+DEVICE = "cuda" if torch.cuda.is_available() else "cpu"
+
+# Model paths
+model_paths = {
+    "DCGAN": {
+        "Glioma": "models/DCGAN-Glioma.pth",
+        "Pituitary": "models/DCGAN-Meningioma.pth",
+        "Meningioma": "models/DCGAN-Pituitary.pth",
+    },
+    "ProGAN": {
+        "Glioma": "models/ProGAN-Glioma.pth",
+        "Meningioma": "models/ProGAN-Meningioma.pth",
+        "Pituitary": "models/ProGAN-Pituitary.pth",
+    },
+    "StyleGAN2": {
+        "Glioma": {
+            "generator": "models/StyleGAN2-Glioma.pth",
+            "mapping": "models/StyleGAN2-Glioma-MappingNet.pth"
+        },
+        "Meningioma": {
+            "generator": "models/StyleGAN2-Meningioma.pth",
+            "mapping": "models/StyleGAN2-Meningioma-MappingNet.pth"
+        },
+        "Pituitary": {
+            "generator": "models/StyleGAN2-Pituitary.pth",
+            "mapping": "models/StyleGAN2-Pituitary-MappingNet.pth"
+        },
+    },
+    "WGANs": {
+        "Glioma": "models/WGAN-Glioma.pth",
+        "Meningioma": "models/WGAN-Pituitary.pth",
+        "Pituitary": "models/WGAN-Pituitary.pth",
+    }
+}
+
+
+# Load DCGAN models
+dcgan_generators = {}
+for label, path in model_paths["DCGAN"].items():
+    model = Generator_DCGAN(1, 256, 64, 3).to(torch.device('cpu'))  # Corrected Z_DIM to 256
+    model.load_state_dict(torch.load(path, map_location=torch.device('cpu')))
+    model.eval()
+    dcgan_generators[label] = model
+
+# Load ProGAN models
+progan_generators = {}
+for label, path in model_paths["ProGAN"].items():
+    model = Generator_ProGAN(256, 256, 3).to(torch.device('cpu'))
+    model.load_state_dict(torch.load(path, map_location=torch.device('cpu')))
+    model.eval()
+    progan_generators[label] = model
+
+# Load StyleGAN2 models
+stylegan2_generators = {}
+stylegan2_mapping_networks = {}
+for label, paths in model_paths["StyleGAN2"].items():
+    gen_model = Generator_SG2(log_resolution=8, W_DIM=256)
+    map_net = MappingNetwork(256, 256).to(DEVICE)
+    gen_model.load_state_dict(torch.load(paths["generator"], map_location=torch.device('cpu')))
+    map_net.load_state_dict(torch.load(paths["mapping"], map_location=torch.device('cpu')))
+    gen_model.eval()
+    map_net.eval()
+    stylegan2_generators[label] = gen_model
+    stylegan2_mapping_networks[label] = map_net
+
+# Load WGAN models with weights_only and strict=False
+wgan_generators = {}
+for label, path in model_paths["WGANs"].items():
+    model = Generator_WGAN().to(torch.device('cpu'))
+    try:
+        # Load the state dict with weights_only=True
+        state_dict = torch.load(path, map_location=torch.device('cpu'))
+        model.load_state_dict(state_dict, strict=False)  # Allows partial compatibility
+        model.eval()
+        wgan_generators[label] = model
+    except FileNotFoundError:
+        print(f"Checkpoint file not found for {label}: {path}")
+    except RuntimeError as e:
+        print(f"Error loading WGAN model for {label}: {e}")
+
+
+# Routes
+@app.route("/")
+def home():
+    return render_template("index.html")
+
+@app.route("/about_us")
+def about_us():
+    return render_template("About_us.html")
+
+@app.route("/generate_info")
+def generate_info():
+    return render_template("generate.html")
+
+@app.route("/contact")
+def contact():
+    return render_template("contact.html")
+
+@app.route("/detect_info")
+def detect_info():
+    return render_template("detect.html")
+
+@app.route("/generate", methods=["POST"])
+def generate():
+    data = request.form
+    model_type = data.get("model")  # "DCGANs", "Progressive GANs", "StyleGAN2", or "WGAN"
+    class_name = data.get("class_name")
+    num_images = int(data.get("num_images", 1))
+
+    # Select the appropriate model
+    if model_type == "DCGANs":
+        generators = dcgan_generators
+        generation_function = generate_examples_DCGAN
+        noise = torch.randn(num_images, Z_DIM, 1, 1).to(torch.device('cpu'))
+    elif model_type == "Progressive GANs":
+        generators = progan_generators
+        generation_function = generate_examples_ProGAN
+        noise = torch.randn(num_images, Z_DIM, 1, 1).to(torch.device('cpu'))
+    elif model_type == "StyleGAN2":
+        generators = stylegan2_generators
+        mapping_networks = stylegan2_mapping_networks
+        generation_function = generate_examples_SG2
+    elif model_type == "WGANs":
+        generators = wgan_generators
+        generation_function = generate_examples_WGAN
+        noise = torch.randn(num_images, 256, 1, 1).to(torch.device('cpu'))
+    else:
+        return jsonify({"error": "Invalid model type"}), 400
+
+    if class_name not in generators:
+        return jsonify({"error": f"Invalid class name for {model_type}"}), 400
+
+    if model_type == "StyleGAN2":
+        generator = generators[class_name]
+        mapping_net = mapping_networks[class_name]
+        images_base64, image_buffers = generation_function(generator, mapping_net, num_images)
+    else:
+        generator = generators[class_name]
+        images_base64, image_buffers = generation_function(generator, noise, num_images)
+
+    # Create ZIP file for download
+    zip_buffer = io.BytesIO()
+    with zipfile.ZipFile(zip_buffer, "w", zipfile.ZIP_DEFLATED) as zip_file:
+        for i, buf in enumerate(image_buffers):
+            if buf:  # Ensure buffer is not empty
+                zip_file.writestr(f"generated_image_{i + 1}.png", buf.getvalue())
+    zip_buffer.seek(0)
+
+    # Render template with images and ZIP file link
+    return render_template("results.html", images=images_base64, zip_file=True)
+
+@app.route("/download_zip", methods=["GET"])
+def download_zip():
+    """Route to download the ZIP file containing all generated images."""
+    zip_buffer = io.BytesIO()
+    with zipfile.ZipFile(zip_buffer, "w", zipfile.ZIP_DEFLATED) as zip_file:
+        for i, image_base64 in enumerate(app.config.get("images_base64", [])):
+            img_data = base64.b64decode(image_base64)
+            zip_file.writestr(f"generated_image_{i + 1}.png", img_data)
+    zip_buffer.seek(0)
+    return send_file(
+        zip_buffer,
+        mimetype="application/zip",
+        as_attachment=True,
+        download_name="generated_images.zip"
+    )
+
+@app.route("/detect", methods=["POST"])
+def detect():
+    try:
+        # Define paths and device
+        model_path = "models/vit-35-Epochs-92-NTP-model.pth"
+        DEVICE = torch.device("cuda" if torch.cuda.is_available() else "cpu")
+
+        # Get the uploaded file
+        file = request.files.get("file")
+        if not file:
+            print("No file uploaded.")
+            return jsonify({"error": "No file uploaded"}), 400
+
+        # Save the uploaded file temporarily in the static folder
+        file_path = os.path.join("static", "temp_image.jpg")
+        os.makedirs("static", exist_ok=True)  # Ensure the directory exists
+        file.save(file_path)
+        print(f"File saved to: {file_path}")
+
+        # Initialize the detection app
+        detection_app = TumorDetectionApp(model_path=model_path, device=DEVICE)
+        print("Detection app initialized.")
+
+        # Predict the class
+        predicted_class = detection_app.predict_image(file_path)
+        if predicted_class is None:
+            print("Prediction failed.")
+            return jsonify({"error": "Prediction failed"}), 500
+
+        # Map the prediction to a class name
+        class_mapping = {
+            0: "Glioma",
+            1: "Meningioma",
+            2: "No Tumor",
+            3: "Pituitary"
+        }
+        result = class_mapping.get(predicted_class, "Unknown")
+        print(f"Prediction successful. Result: {result}")
+
+        # Serve results with the relative path
+        return render_template("results-detect.html", images=["temp_image.jpg"], result=result)
+
+    except Exception as e:
+        print(f"Error in /detect route: {e}")
+        return jsonify({"error": str(e)}), 500
+
+if __name__ == "__main__":
+    app.run(debug=True)

index.html

@@ -0,0 +1,19 @@
+<!doctype html>
+<html>
+	<head>
+		<meta charset="utf-8" />
+		<meta name="viewport" content="width=device-width" />
+		<title>My static Space</title>
+		<link rel="stylesheet" href="style.css" />
+	</head>
+	<body>
+		<div class="card">
+			<h1>Welcome to your static Space!</h1>
+			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
+			<p>
+				Also don't forget to check the
+				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
+			</p>
+		</div>
+	</body>
+</html>

medgan/dcgan.py

@@ -0,0 +1,109 @@
+import io
+import torch
+import base64
+import torch.nn as nn
+import matplotlib.pyplot as plt
+from matplotlib.backends.backend_agg import FigureCanvasAgg as FigureCanvas
+
+# Define the Generator class for DCGAN
+class Generator_DCGAN(nn.Module):
+    def __init__(self, ngpu, nz, ngf, nc):
+        super(Generator_DCGAN, self).__init__()
+        self.ngpu = ngpu
+        self.main = nn.Sequential(
+            nn.ConvTranspose2d(nz, ngf * 16, 4, 1, 0, bias=False),
+            nn.BatchNorm2d(ngf * 16),
+            nn.ReLU(True),
+            nn.ConvTranspose2d(ngf * 16, ngf * 8, 4, 2, 1, bias=False),
+            nn.BatchNorm2d(ngf * 8),
+            nn.ReLU(True),
+            nn.ConvTranspose2d(ngf * 8, ngf * 4, 4, 2, 1, bias=False),
+            nn.BatchNorm2d(ngf * 4),
+            nn.ReLU(True),
+            nn.ConvTranspose2d(ngf * 4, ngf * 2, 4, 2, 1, bias=False),
+            nn.BatchNorm2d(ngf * 2),
+            nn.ReLU(True),
+            nn.ConvTranspose2d(ngf * 2, ngf, 4, 2, 1, bias=False),
+            nn.BatchNorm2d(ngf),
+            nn.ReLU(True),
+            nn.ConvTranspose2d(ngf, ngf // 2, 4, 2, 1, bias=False),
+            nn.BatchNorm2d(ngf // 2),
+            nn.ReLU(True),
+            nn.ConvTranspose2d(ngf // 2, nc, 4, 2, 1, bias=False),
+            nn.Tanh()
+        )
+
+    def forward(self, x):
+        return self.main(x)
+
+
+def generate_examples_DCGAN_1(generator, z_dim, class_name="Example"):
+    """
+    Generate an example using a DCGAN generator and visualize it.
+
+    Args:
+        generator (torch.nn.Module): The trained DCGAN generator model.
+        z_dim (int): Dimension of the latent noise vector.
+        class_name (str): Class label for the generated images.
+
+    Returns:
+        matplotlib.figure.Figure: A matplotlib figure showing the generated image.
+    """
+    generator.eval()
+    noise = torch.randn(1, z_dim, 1, 1).to(torch.device('cpu'))
+
+    with torch.no_grad():
+        generated_image = generator(noise)
+
+    # Display the generated image
+    fig, ax = plt.subplots(figsize=(2, 2))
+    fig.patch.set_facecolor('white')  # Set the figure's background color
+    img_to_display = (generated_image[0].permute(1, 2, 0).cpu().numpy() * 0.5 + 0.5).clip(0, 1)
+    ax.imshow(img_to_display)  # Convert tensor to HxWxC for plt.imshow
+    ax.axis('off')  # Turn off axis
+    ax.set_facecolor('white')  # Set the axis background color
+    plt.subplots_adjust(left=0, right=1, top=1, bottom=0)  # Remove space around image
+
+    return fig
+
+
+
+def generate_examples_DCGAN(generator, noise, num_images):
+    """
+    Generate images using a DCGAN generator and return them as Base64-encoded strings.
+
+    Args:
+        generator (torch.nn.Module): Pre-trained DCGAN generator model.
+        noise (torch.Tensor): Random noise tensor for image generation.
+        num_images (int): Number of images to generate.
+
+    Returns:
+        list: Base64-encoded images.
+        list: BytesIO image buffers for optional ZIP creation.
+    """
+    images_base64 = []
+    image_buffers = []
+
+    with torch.no_grad():
+        generated_images = generator(noise)
+        for i in range(num_images):
+            img_tensor = (generated_images[i] + 1) / 2  # Normalize to [0, 1]
+            img_np = img_tensor.permute(1, 2, 0).cpu().numpy()
+
+            # Convert to Base64-encoded image
+            fig, ax = plt.subplots(figsize=(2, 2))
+            ax.imshow(img_np)
+            ax.axis('off')
+            buf = io.BytesIO()
+            FigureCanvas(fig).print_png(buf)
+            buf.seek(0)
+            image_base64 = base64.b64encode(buf.getvalue()).decode('utf-8')
+            images_base64.append(image_base64)
+
+            # Store the buffer for optional ZIP file creation
+            image_buffers.append(buf)
+            plt.close(fig)
+
+    return images_base64, image_buffers
+
+

medgan/progan.py

@@ -0,0 +1,190 @@
+# Standard library imports
+import base64
+import io
+import os
+import random
+
+# Third-party imports
+import numpy as np
+import torch
+import torch.nn.functional as F
+from torch import nn
+import matplotlib.pyplot as plt
+from matplotlib.backends.backend_agg import FigureCanvasAgg as FigureCanvas
+
+# Define the seed function for reproducibility
+def seed_everything():
+    seed = random.randint(0, 2**32 - 1)  # Generate a random seed between 0 and 2^32-1
+    os.environ['PYTHONHASHSEED'] = str(seed)
+    np.random.seed(seed)
+    torch.manual_seed(seed)
+    torch.cuda.manual_seed(seed)
+    torch.cuda.manual_seed_all(seed)
+    torch.backends.cudnn.deterministic = True
+    torch.backends.cudnn.benchmark = False
+    print(f"Random seed set to: {seed}")
+
+
+
+START_TRAIN_AT_IMG_SIZE = 4
+DEVICE = "cuda" if torch.cuda.is_available() else "cpu"
+LEARNING_RATE = 1e-3
+BATCH_SIZES = [32, 32, 32, 16, 16, 16]
+IMAGE_SIZE = 128
+CHANNELS_IMG = 3
+Z_DIM = 256
+IN_CHANNELS = 256
+LAMBDA_GP = 10
+PROGRESSIVE_EPOCHS = [30] * len(BATCH_SIZES)
+factors = [1, 1, 1, 1, 1 / 2, 1 / 4, 1 / 8, 1 / 16, 1 / 32]
+
+# Define the model components
+class WSConv2d(nn.Module):
+    def __init__(self, in_channels, out_channels, kernel_size=3, stride=1, padding=1):
+        super(WSConv2d, self).__init__()
+        self.conv = nn.Conv2d(in_channels, out_channels, kernel_size, stride, padding)
+        self.scale = (2 / (in_channels * (kernel_size ** 2))) ** 0.5
+        self.bias = self.conv.bias
+        self.conv.bias = None
+        nn.init.normal_(self.conv.weight)
+        nn.init.zeros_(self.bias)
+
+    def forward(self, x):
+        return self.conv(x * self.scale) + self.bias.view(1, self.bias.shape[0], 1, 1)
+
+
+class PixelNorm(nn.Module):
+    def __init__(self):
+        super(PixelNorm, self).__init__()
+        self.epsilon = 1e-8
+
+    def forward(self, x):
+        return x / torch.sqrt(torch.mean(x ** 2, dim=1, keepdim=True) + self.epsilon)
+
+
+class ConvBlock(nn.Module):
+    def __init__(self, in_channels, out_channels, use_pixelnorm=True):
+        super(ConvBlock, self).__init__()
+        self.use_pn = use_pixelnorm
+        self.conv1 = WSConv2d(in_channels, out_channels)
+        self.conv2 = WSConv2d(out_channels, out_channels)
+        self.leaky = nn.LeakyReLU(0.2)
+        self.pn = PixelNorm()
+
+    def forward(self, x):
+        x = self.leaky(self.conv1(x))
+        x = self.pn(x) if self.use_pn else x
+        x = self.leaky(self.conv2(x))
+        x = self.pn(x) if self.use_pn else x
+        return x
+
+
+class Generator_ProGAN(nn.Module):
+    def __init__(self, z_dim, in_channels, img_channels=3):
+        super(Generator_ProGAN, self).__init__()
+
+        # initial takes 1x1 -> 4x4
+        self.initial = nn.Sequential(
+            PixelNorm(),
+            nn.ConvTranspose2d(z_dim, in_channels, 4, 1, 0),
+            nn.LeakyReLU(0.2),
+            WSConv2d(in_channels, in_channels, kernel_size=3, stride=1, padding=1),
+            nn.LeakyReLU(0.2),
+            PixelNorm(),
+        )
+
+        self.initial_rgb = WSConv2d(
+            in_channels, img_channels, kernel_size=1, stride=1, padding=0
+        )
+        self.prog_blocks, self.rgb_layers = (
+            nn.ModuleList([]),
+            nn.ModuleList([self.initial_rgb]), 
+        )
+
+        for i in range(len(factors) - 1):  # -1 to prevent index error because of factors[i+1]
+            conv_in_c = int(in_channels * factors[i])
+            conv_out_c = int(in_channels * factors[i + 1])
+            self.prog_blocks.append(ConvBlock(conv_in_c, conv_out_c))
+            self.rgb_layers.append(
+                WSConv2d(conv_out_c, img_channels, kernel_size=1, stride=1, padding=0)
+            )
+
+    def fade_in(self, alpha, upscaled, generated):
+        return torch.tanh(alpha * generated + (1 - alpha) * upscaled)
+
+    def forward(self, x, alpha, steps):
+        out = self.initial(x)
+
+        if steps == 0:
+            return self.initial_rgb(out)
+
+        for step in range(steps):
+            upscaled = F.interpolate(out, scale_factor=2, mode="nearest")
+            out = self.prog_blocks[step](upscaled)
+
+        final_upscaled = self.rgb_layers[steps - 1](upscaled)
+        final_out = self.rgb_layers[steps](out)
+        return self.fade_in(alpha, final_upscaled, final_out)
+
+
+def generate_example_and_show_ProGAN_1(gen, steps, n=1):
+    gen.eval()  # Set the model to evaluation mode
+    alpha = 1.0
+    with torch.no_grad():  # Disable gradient computation
+        noise = torch.randn(1, Z_DIM, 1, 1).to(DEVICE)  # Generate random noise
+        img = gen(noise, alpha, steps)  # Generate an image
+        img = (img * 0.5 + 0.5).clamp(0, 1)  # Normalize the image to [0, 1] range
+
+        # Display the image with enhancements
+        fig, ax = plt.subplots(figsize=(2, 2))
+        fig.patch.set_facecolor('white')  # Set the figure's background color
+        ax.imshow(img.squeeze(0).permute(1, 2, 0).cpu().numpy())  # Convert to HxWxC for plt.imshow
+        ax.axis('off')  # Turn off axis
+        ax.set_facecolor('white')  # Set the axis background color
+        plt.subplots_adjust(left=0, right=1, top=1, bottom=0)  # Remove space around image
+        return fig
+    
+
+
+def generate_examples_ProGAN(generator, noise, num_images):
+    """
+    Generate images using a ProGAN generator and return them as Base64-encoded strings.
+
+    Args:
+        generator (torch.nn.Module): Pre-trained ProGAN generator model.
+        noise (torch.Tensor): Random noise tensor for image generation.
+        num_images (int): Number of images to generate.
+        steps (int): Number of steps for the ProGAN fade-in mechanism.
+
+    Returns:
+        list: Base64-encoded images.
+        list: BytesIO image buffers for optional ZIP creation.
+    """
+    steps = 6
+    images_base64 = []
+    image_buffers = []
+
+    with torch.no_grad():
+        noise = noise.to(next(generator.parameters()).device)
+        for i in range(num_images):
+            alpha = 1.0  # Set alpha to 1.0 for full fade-in
+            img_tensor = generator(noise[i:i+1], alpha, steps).squeeze(0)  # Generate an image
+            img_tensor = (img_tensor * 0.5 + 0.5).clamp(0, 1)  # Normalize to [0, 1]
+            img_np = img_tensor.permute(1, 2, 0).cpu().numpy()
+
+            # Convert to Base64-encoded image
+            fig, ax = plt.subplots(figsize=(2, 2))
+            ax.imshow(img_np)
+            ax.axis('off')
+            buf = io.BytesIO()
+            FigureCanvas(fig).print_png(buf)
+            buf.seek(0)
+            image_base64 = base64.b64encode(buf.getvalue()).decode('utf-8')
+            images_base64.append(image_base64)
+
+            # Store the buffer for optional ZIP file creation
+            image_buffers.append(buf)
+            plt.close(fig)
+
+    return images_base64, image_buffers
+

medgan/stylegan.py

@@ -0,0 +1,419 @@
+# Standard library imports
+import base64
+import io
+import os
+import random
+from math import sqrt
+
+# Third-party imports
+import numpy as np
+import matplotlib.pyplot as plt
+from matplotlib.backends.backend_agg import FigureCanvasAgg as FigureCanvas
+
+# PyTorch imports
+import torch
+import torch.nn.functional as F
+from torch import nn
+from torchvision.utils import save_image
+
+
+
+#mapping_network_path = r"C:\Users\mzlwm\OneDrive\Desktop\MEDGAN\StyleGan2\StyleGAN2-256\StyleGAN2-256\StyleGAN2-256-Meningioma\mapping_net.pth"  # Replace with actual path
+# Define the seed function for reproducibility
+def seed_everything():
+    seed = random.randint(0, 2**32 - 1)  # Generate a random seed between 0 and 2^32-1
+    os.environ['PYTHONHASHSEED'] = str(seed)
+    np.random.seed(seed)
+    torch.manual_seed(seed)
+    torch.cuda.manual_seed(seed)
+    torch.cuda.manual_seed_all(seed)
+    torch.backends.cudnn.deterministic = True
+    torch.backends.cudnn.benchmark = False
+    print(f"Random seed set to: {seed}")
+
+
+
+DEVICE = "cuda" if torch.cuda.is_available() else "cpu"
+EPOCHS = 300
+LEARNING_RATE = 1e-3
+BATCH_SIZE = 64
+LOG_RESOLUTION = 8
+Z_DIM = 256
+W_DIM = 256
+LAMBDA_GP = 10
+factors = [1, 1, 1, 1, 1 / 2, 1 / 4, 1 / 8, 1 / 16, 1 / 32]
+
+
+class MappingNetwork(nn.Module):
+    def __init__(self, z_dim, w_dim):
+        super().__init__()
+        self.mapping = nn.Sequential(
+            EqualizedLinear(z_dim, w_dim),
+            nn.ReLU(),
+            EqualizedLinear(z_dim, w_dim),
+            nn.ReLU(),
+            EqualizedLinear(z_dim, w_dim),
+            nn.ReLU(),
+            EqualizedLinear(z_dim, w_dim),
+            nn.ReLU(),
+            EqualizedLinear(z_dim, w_dim),
+            nn.ReLU(),
+            EqualizedLinear(z_dim, w_dim),
+            nn.ReLU(),
+            EqualizedLinear(z_dim, w_dim)
+        )
+
+    def forward(self, x):
+        x = x / torch.sqrt(torch.mean(x ** 2, dim=1, keepdim=True) + 1e-8)  # for PixelNorm
+        return self.mapping(x)
+    
+    
+class Generator_SG2(nn.Module):
+
+    def __init__(self, log_resolution, W_DIM, n_features = 32, max_features = 256, device="cpu"):
+
+        super().__init__()
+
+        features = [min(max_features, n_features * (2 ** i)) for i in range(log_resolution - 2, -1, -1)]
+        self.n_blocks = len(features)
+
+        self.initial_constant = nn.Parameter(torch.randn((1, features[0], 4, 4)))
+
+        self.style_block = StyleBlock(W_DIM, features[0], features[0])
+        self.to_rgb = ToRGB(W_DIM, features[0])
+        self.device = torch.device(device)
+
+        blocks = [GeneratorBlock(W_DIM, features[i - 1], features[i]) for i in range(1, self.n_blocks)]
+        self.blocks = nn.ModuleList(blocks)
+
+    def forward(self, w, input_noise):
+
+        batch_size = w.shape[1]
+
+        x = self.initial_constant.expand(batch_size, -1, -1, -1)
+        x = self.style_block(x, w[0], input_noise[0][1])
+        rgb = self.to_rgb(x, w[0])
+
+        for i in range(1, self.n_blocks):
+            x = F.interpolate(x, scale_factor=2, mode="bilinear")
+            x, rgb_new = self.blocks[i - 1](x, w[i], input_noise[i])
+            rgb = F.interpolate(rgb, scale_factor=2, mode="bilinear") + rgb_new
+
+        return torch.tanh(rgb)
+    
+
+class GeneratorBlock(nn.Module):
+
+    def __init__(self, W_DIM, in_features, out_features):
+
+        super().__init__()
+
+        self.style_block1 = StyleBlock(W_DIM, in_features, out_features)
+        self.style_block2 = StyleBlock(W_DIM, out_features, out_features)
+
+        self.to_rgb = ToRGB(W_DIM, out_features)
+
+    def forward(self, x, w, noise):
+
+        x = self.style_block1(x, w, noise[0])
+        x = self.style_block2(x, w, noise[1])
+
+        rgb = self.to_rgb(x, w)
+
+        return x, rgb
+
+
+class StyleBlock(nn.Module):
+
+    def __init__(self, W_DIM, in_features, out_features):
+
+        super().__init__()
+
+        self.to_style = EqualizedLinear(W_DIM, in_features, bias=1.0)
+        self.conv = Conv2dWeightModulate(in_features, out_features, kernel_size=3)
+        self.scale_noise = nn.Parameter(torch.zeros(1))
+        self.bias = nn.Parameter(torch.zeros(out_features))
+
+        self.activation = nn.LeakyReLU(0.2, True)
+
+    def forward(self, x, w, noise):
+
+        s = self.to_style(w)
+        x = self.conv(x, s)
+        if noise is not None:
+            x = x + self.scale_noise[None, :, None, None] * noise
+        return self.activation(x + self.bias[None, :, None, None])
+
+class ToRGB(nn.Module):
+
+    def __init__(self, W_DIM, features):
+
+        super().__init__()
+        self.to_style = EqualizedLinear(W_DIM, features, bias=1.0)
+
+        self.conv = Conv2dWeightModulate(features, 3, kernel_size=1, demodulate=False)
+        self.bias = nn.Parameter(torch.zeros(3))
+        self.activation = nn.LeakyReLU(0.2, True)
+
+    def forward(self, x, w):
+
+        style = self.to_style(w)
+        x = self.conv(x, style)
+        return self.activation(x + self.bias[None, :, None, None])
+    
+class Conv2dWeightModulate(nn.Module):
+
+    def __init__(self, in_features, out_features, kernel_size,
+                 demodulate = True, eps = 1e-8):
+
+        super().__init__()
+        self.out_features = out_features
+        self.demodulate = demodulate
+        self.padding = (kernel_size - 1) // 2
+
+        self.weight = EqualizedWeight([out_features, in_features, kernel_size, kernel_size])
+        self.eps = eps
+
+    def forward(self, x, s):
+
+        b, _, h, w = x.shape
+
+        s = s[:, None, :, None, None]
+        weights = self.weight()[None, :, :, :, :]
+        weights = weights * s
+
+        if self.demodulate:
+            sigma_inv = torch.rsqrt((weights ** 2).sum(dim=(2, 3, 4), keepdim=True) + self.eps)
+            weights = weights * sigma_inv
+
+        x = x.reshape(1, -1, h, w)
+
+        _, _, *ws = weights.shape
+        weights = weights.reshape(b * self.out_features, *ws)
+
+        x = F.conv2d(x, weights, padding=self.padding, groups=b)
+
+        return x.reshape(-1, self.out_features, h, w)
+
+class EqualizedLinear(nn.Module):
+
+    def __init__(self, in_features, out_features, bias = 0.):
+
+        super().__init__()
+        self.weight = EqualizedWeight([out_features, in_features])
+        self.bias = nn.Parameter(torch.ones(out_features) * bias)
+
+    def forward(self, x: torch.Tensor):
+        return F.linear(x, self.weight(), bias=self.bias)
+    
+class EqualizedConv2d(nn.Module):
+
+    def __init__(self, in_features, out_features,
+                 kernel_size, padding = 0):
+
+        super().__init__()
+        self.padding = padding
+        self.weight = EqualizedWeight([out_features, in_features, kernel_size, kernel_size])
+        self.bias = nn.Parameter(torch.ones(out_features))
+
+    def forward(self, x: torch.Tensor):
+        return F.conv2d(x, self.weight(), bias=self.bias, padding=self.padding)
+    
+class EqualizedWeight(nn.Module):
+
+    def __init__(self, shape):
+
+        super().__init__()
+
+        self.c = 1 / sqrt(np.prod(shape[1:]))
+        self.weight = nn.Parameter(torch.randn(shape))
+
+    def forward(self):
+        return self.weight * self.c
+    
+class PathLengthPenalty(nn.Module):
+
+    def __init__(self, beta):
+
+        super().__init__()
+
+        self.beta = beta
+        self.steps = nn.Parameter(torch.tensor(0.), requires_grad=False)
+
+        self.exp_sum_a = nn.Parameter(torch.tensor(0.), requires_grad=False)
+
+    def forward(self, w, x):
+
+        device = x.device
+        image_size = x.shape[2] * x.shape[3]
+        y = torch.randn(x.shape, device=device)
+
+        output = (x * y).sum() / sqrt(image_size)
+        sqrt(image_size)
+
+        gradients, *_ = torch.autograd.grad(outputs=output,
+                                            inputs=w,
+                                            grad_outputs=torch.ones(output.shape, device=device),
+                                            create_graph=True)
+
+        norm = (gradients ** 2).sum(dim=2).mean(dim=1).sqrt()
+
+        if self.steps > 0:
+
+            a = self.exp_sum_a / (1 - self.beta ** self.steps)
+
+            loss = torch.mean((norm - a) ** 2)
+        else:
+            loss = norm.new_tensor(0)
+
+        mean = norm.mean().detach()
+        self.exp_sum_a.mul_(self.beta).add_(mean, alpha=1 - self.beta)
+        self.steps.add_(1.)
+
+        return loss
+    
+def gradient_penalty(critic, real, fake,device="cpu"):
+    BATCH_SIZE, C, H, W = real.shape
+    beta = torch.rand((BATCH_SIZE, 1, 1, 1)).repeat(1, C, H, W).to(device)
+    interpolated_images = real * beta + fake.detach() * (1 - beta)
+    interpolated_images.requires_grad_(True)
+
+    # Calculate critic scores
+    mixed_scores = critic(interpolated_images)
+
+    # Take the gradient of the scores with respect to the images
+    gradient = torch.autograd.grad(
+        inputs=interpolated_images,
+        outputs=mixed_scores,
+        grad_outputs=torch.ones_like(mixed_scores),
+        create_graph=True,
+        retain_graph=True,
+    )[0]
+    gradient = gradient.view(gradient.shape[0], -1)
+    gradient_norm = gradient.norm(2, dim=1)
+    gradient_penalty = torch.mean((gradient_norm - 1) ** 2)
+    return gradient_penalty
+
+
+def get_w(batch_size, mapping_net):
+    z = torch.randn(batch_size, W_DIM).to(DEVICE)
+    w = mapping_net(z)
+    return w[None, :, :].expand(LOG_RESOLUTION, -1, -1)
+
+def get_noise(batch_size):
+
+        noise = []
+        resolution = 4
+
+        for i in range(LOG_RESOLUTION):
+            if i == 0:
+                n1 = None
+            else:
+                n1 = torch.randn(batch_size, 1, resolution, resolution, device=DEVICE)
+            n2 = torch.randn(batch_size, 1, resolution, resolution, device=DEVICE)
+
+            noise.append((n1, n2))
+
+            resolution *= 2
+
+        return noise
+
+def generate_examples(gen, epoch, n=100):
+    gen.eval()
+    alpha = 1.0
+    base_dir = '/content/drive/MyDrive/StyleGAN2-256/StyleGAN2-256-Pituitary/saved_examples'
+    if not os.path.exists(base_dir):
+        os.makedirs(base_dir)
+    epoch_dir = os.path.join(base_dir, f'epoch{epoch}')
+    if not os.path.exists(epoch_dir):
+        os.makedirs(epoch_dir)
+    for i in range(n):
+        with torch.no_grad():
+            w = get_w(1)
+            noise = get_noise(1)
+            img = gen(w, noise)
+            save_image(img * 0.5 + 0.5, os.path.join(epoch_dir, f"img_{i}.png"))
+
+
+def generate_example_and_show_SG2(gen, mapping_net, steps=1, n=1):
+    """
+    Generate and display an example image using StyleGAN2.
+
+    Args:
+        gen (torch.nn.Module): Generator model.
+        mapping_net (torch.nn.Module): Mapping network model.
+        steps (int): Number of steps (unused in StyleGAN2 but kept for consistency).
+        n (int): Number of examples to generate (unused here but retained for consistency).
+
+    Returns:
+        matplotlib.figure.Figure: A matplotlib figure containing the generated image.
+    """
+    gen.eval()  # Set the generator to evaluation mode
+    mapping_net.eval()  # Set the mapping network to evaluation mode
+
+    with torch.no_grad():
+        # Generate latent vector and noise
+        w = get_w(1, mapping_net).to(DEVICE)  # Generate a single latent vector
+        noise = get_noise(1)  # Generate noise for all resolution levels
+
+        # Generate the image using the generator
+        img = gen(w, noise).to("cpu") * 0.5 + 0.5  # Scale to [0, 1]
+
+        # Prepare the matplotlib figure for display
+        fig, ax = plt.subplots(figsize=(2, 2))
+        fig.patch.set_facecolor('white')  # Set the figure's background color
+        ax.imshow(img[0].permute(1, 2, 0).numpy())  # Convert tensor to HxWxC for plt.imshow
+        ax.axis('off')  # Turn off axis
+        ax.set_facecolor('white')  # Set the axis background color
+        plt.subplots_adjust(left=0, right=1, top=1, bottom=0)  # Remove space around image
+
+        return fig
+    
+
+def generate_examples_SG2(generator, mapping_net, num_images):
+    """
+    Generate images using a StyleGAN2 generator and return them as Base64-encoded strings.
+
+    Args:
+        generator (torch.nn.Module): Pre-trained StyleGAN2 generator model.
+        mapping_net (torch.nn.Module): Pre-trained mapping network model.
+        num_images (int): Number of images to generate.
+
+    Returns:
+        list: Base64-encoded images.
+        list: BytesIO image buffers for optional ZIP creation.
+    """
+    images_base64 = []
+    image_buffers = []
+
+    generator.eval()  # Set generator to evaluation mode
+    mapping_net.eval()  # Set mapping network to evaluation mode
+
+    with torch.no_grad():
+        for i in range(num_images):
+            # Generate latent vector and noise
+            w = get_w(1, mapping_net).to(generator.device)  # Generate a single latent vector
+            noise = get_noise(1)  # Generate noise for all resolution levels
+
+            # Generate the image using the generator
+            img = generator(w, noise).to("cpu") * 0.5 + 0.5  # Normalize to [0, 1]
+            img_np = img[0].permute(1, 2, 0).numpy()  # Convert tensor to HxWxC format
+
+            # Convert to Base64-encoded image
+            fig, ax = plt.subplots(figsize=(2, 2))
+            ax.imshow(img_np)
+            ax.axis('off')
+            buf = io.BytesIO()
+            FigureCanvas(fig).print_png(buf)
+            buf.seek(0)
+            image_base64 = base64.b64encode(buf.getvalue()).decode('utf-8')
+            images_base64.append(image_base64)
+
+            # Store the buffer for optional ZIP file creation
+            image_buffers.append(buf)
+            plt.close(fig)
+
+    return images_base64, image_buffers
+
+
+

medgan/vit.py

@@ -0,0 +1,46 @@
+import torch
+import torchvision
+import torchvision.transforms as transforms
+
+from PIL import Image
+
+class TumorDetectionApp:
+    def __init__(self, model_path, device):
+        self.device = device
+        self.model_path = model_path
+
+    def predict_image(self, image_path):
+        # Load the model
+        model = torchvision.models.vit_b_16()
+        num_classes = 4  # Replace with the actual number of classes
+        num_features = model.heads[0].in_features
+        model.heads = torch.nn.Linear(num_features, num_classes)
+        model.load_state_dict(torch.load(self.model_path, map_location=self.device))
+        model.to(self.device)
+        model.eval()
+
+        # Define image transformations
+        IMG_SIZE = 224  # Ensure this matches the size used during training
+        transform = transforms.Compose([
+            transforms.Resize((IMG_SIZE, IMG_SIZE)),
+            transforms.ToTensor(),
+            transforms.Normalize((0.485, 0.456, 0.406), (0.229, 0.224, 0.225))
+        ])
+
+        # Load and preprocess the image
+        try:
+            img = Image.open(image_path)
+            img = transform(img).unsqueeze(0).to(self.device)  # Add batch dimension
+        except FileNotFoundError:
+            print(f"Error: Image file not found at {image_path}")
+            return None
+        except Exception as e:
+            print(f"Error processing image: {e}")
+            return None
+
+        # Perform inference
+        with torch.no_grad():
+            outputs = model(img)
+            _, predicted = torch.max(outputs, 1)
+
+        return predicted.item()

medgan/wgan.py

@@ -0,0 +1,60 @@
+import io
+import torch
+import base64
+import torch.nn as nn
+import matplotlib.pyplot as plt
+from matplotlib.backends.backend_agg import FigureCanvasAgg as FigureCanvasgit
+
+class Generator_WGAN(nn.Module):
+    def __init__(self, z_dim=256, img_channels=1, features_g=32):
+        super(Generator_WGAN, self).__init__()
+        self.gen = nn.Sequential(
+            self._block(z_dim, features_g * 32, 4, 2, 0),
+            self._block(features_g * 32, features_g * 16, 4, 2, 1),
+            self._block(features_g * 16, features_g * 8, 4, 2, 1),
+            self._block(features_g * 8, features_g * 4, 4, 2, 1),
+            self._block(features_g * 4, features_g * 2, 4, 2, 1),
+            self._block(features_g * 2, features_g, 4, 2, 1),
+            nn.ConvTranspose2d(features_g, img_channels, kernel_size=4, stride=2, padding=1),
+            nn.Tanh()
+        )
+
+    def _block(self, in_channels, out_channels, kernel_size, stride, padding):
+        return nn.Sequential(
+            nn.ConvTranspose2d(in_channels, out_channels, kernel_size, stride, padding, bias=False),
+            nn.BatchNorm2d(out_channels),
+            nn.ReLU()
+        )
+
+    def forward(self, x):
+        return self.gen(x)
+
+# Function to generate WGAN images
+def generate_examples_WGAN(generator, noise, num_images):
+    images_base64 = []
+    image_buffers = []
+
+    with torch.no_grad():
+        generated_images = generator(noise)
+        generated_images = (generated_images + 1) / 2  # Normalize to [0, 1]
+
+        for i in range(num_images):
+            img_tensor = generated_images[i].cpu().squeeze(0)
+            img_np = (img_tensor.numpy() * 255).astype('uint8')
+
+            # Convert to Base64-encoded image
+            fig, ax = plt.subplots(figsize=(2, 2))
+            ax.imshow(img_np, cmap='gray')
+            ax.axis('off')
+            buf = io.BytesIO()
+            FigureCanvas(fig).print_png(buf)
+            buf.seek(0)
+            image_base64 = base64.b64encode(buf.getvalue()).decode('utf-8')
+            images_base64.append(image_base64)
+
+            # Store the buffer for optional ZIP file creation
+            image_buffers.append(buf)
+            plt.close(fig)
+
+    return images_base64, image_buffers
+

static/css/style.css

@@ -0,0 +1,804 @@
+/* General Reset */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+body {
+    font-family: 'Inter', sans-serif;
+    color: #333;
+    background: linear-gradient(120deg, #f5f7fa, #eaeff1);
+    line-height: 1.6;
+    overflow-x: hidden;
+    transition: all 0.3s ease-in-out;
+}
+
+/* Smooth Scroll */
+html {
+    scroll-behavior: smooth;
+}
+
+/* Ultra-Enhanced Navbar */
+.navbar {
+    background: linear-gradient(135deg, #1e3a8a, #1d4ed8, #60a5fa);
+    background-size: 400% 400%;
+    color: white;
+    padding: 10px 30px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    position: sticky;
+    top: 0;
+    z-index: 1000;
+    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
+    animation: gradientShift 8s ease infinite;
+    transition: all 0.5s ease;
+}
+
+.navbar:hover {
+    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5);
+    transform: translateY(-2px);
+}
+
+@keyframes gradientShift {
+    0% { background-position: 0% 50%; }
+    50% { background-position: 100% 50%; }
+    100% { background-position: 0% 50%; }
+}
+
+.navbar .logo {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    font-size: 1.8rem;
+    font-weight: bold;
+    color: white;
+    text-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
+    cursor: pointer;
+    transition: transform 0.5s ease, text-shadow 0.5s ease;
+}
+
+.navbar .logo img {
+    width: 50px;
+    height: auto;
+    border-radius: 50%;
+    transition: transform 0.6s ease, box-shadow 0.5s ease;
+}
+
+.navbar .logo img:hover {
+    transform: scale(1.3) rotate(360deg);
+    box-shadow: 0 8px 20px rgba(255, 255, 255, 0.4);
+}
+
+.navbar nav {
+    display: flex;
+    align-items: center;
+    gap: 20px;
+}
+
+.navbar nav ul {
+    list-style: none;
+    display: flex;
+    gap: 20px;
+    margin: 0;
+    padding: 0;
+}
+
+.navbar nav ul li {
+    position: relative;
+}
+
+.navbar nav ul li a {
+    text-decoration: none;
+    color: white;
+    font-weight: bold;
+    font-size: 1.1rem;
+    padding: 8px 16px;
+    border-radius: 8px;
+    background: linear-gradient(135deg, #0044ff, #0044ff, #60a5fa);
+    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
+    transition: background 0.4s ease, transform 0.4s ease, box-shadow 0.4s ease;
+    position: relative;
+}
+
+.navbar nav ul li a:hover {
+    background: #b37ed4;
+    color: #ffffff;
+    transform: translateY(-5px);
+    box-shadow: 0 8px 25px rgba(255, 223, 87, 0.5);
+}
+
+.navbar nav ul li ul {
+    display: none;
+    position: absolute;
+    top: calc(100% + 5px);
+    left: 0;
+    background: rgba(30, 41, 59, 0.95);
+    border-radius: 10px;
+    overflow: hidden;
+    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
+    opacity: 0;
+    transform: translateY(-10px);
+    transition: opacity 0.4s ease, transform 0.4s ease;
+    z-index: 100;
+}
+
+.navbar nav ul li:hover ul {
+    display: block;
+    opacity: 1;
+    transform: translateY(0);
+}
+
+.navbar nav ul li ul li {
+    padding: 10px;
+}
+
+.navbar nav ul li ul li a {
+    color: white;
+    padding: 8px 12px;
+    display: block;
+    background: none;
+    transition: color 0.3s ease, background 0.3s ease;
+}
+
+.navbar nav ul li ul li a:hover {
+    background: rgba(255, 255, 255, 0.2);
+    color: #38bdf8;
+}
+
+@keyframes fadeIn {
+    from { opacity: 0; transform: translateY(-15px); }
+    to { opacity: 1; transform: translateY(0); }
+}
+
+
+/* Hero Section */
+.hero {
+    background: linear-gradient(135deg, #1e3a8a, #60a5fa);
+    color: white;
+    text-align: center;
+    padding: 150px 20px;
+    border-bottom-left-radius: 50px;
+    border-bottom-right-radius: 50px;
+    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
+    animation: fadeInHero 1.5s ease;
+}
+
+@keyframes fadeInHero {
+    from {
+        opacity: 0;
+        transform: translateY(-30px);
+    }
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+.hero h1 {
+    font-size: 3.5rem;
+    margin-bottom: 20px;
+    font-weight: bold;
+    text-shadow: 0 0 10px #ffffff, 0 0 15px #007BFF;
+    animation: textGlow 2s infinite alternate;
+}
+
+@keyframes textGlow {
+    0% {
+        text-shadow: 0 0 10px #ffffff, 0 0 15px #007BFF;
+    }
+    100% {
+        text-shadow: 0 0 20px #ffffff, 0 0 30px #86E3CE;
+    }
+}
+
+.hero p {
+    font-size: 1.2rem;
+    max-width: 800px;
+    margin: 0 auto 30px;
+    color: #e0f7ff;
+}
+
+.btn-primary {
+    background: #007BFF;
+    color: white;
+    padding: 12px 30px;
+    border-radius: 30px;
+    font-size: 1rem;
+    font-weight: bold;
+    text-decoration: none;
+    transition: background 0.3s ease, transform 0.3s ease;
+    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.2);
+}
+
+.btn-primary:hover {
+    background: #0056b3;
+    transform: translateY(-5px) scale(1.1);
+}
+
+/* About Section */
+.about {
+    padding: 80px 20px;
+    text-align: center;
+    background: #f9f9fc;
+    border-radius: 20px;
+    animation: fadeInSection 1.5s ease;
+    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
+}
+
+.about h2 {
+    font-size: 2.8rem;
+    color: #007BFF;
+    margin-bottom: 20px;
+    position: relative;
+}
+
+.about h2::after {
+    content: '';
+    position: absolute;
+    width: 80px;
+    height: 4px;
+    background: linear-gradient(135deg, #007BFF, #86E3CE);
+    bottom: -10px;
+    left: 50%;
+    transform: translateX(-50%);
+    animation: slideIn 1s ease;
+}
+
+.about p {
+    font-size: 21px;
+    color: #1d1d1d;
+    max-width: 800px;
+    margin: 20px auto 40px;
+    line-height: 1.8;
+}
+
+/* Features Grid */
+.features-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+    gap: 30px;
+    margin-top: 40px;
+    align-items: stretch;
+}
+
+.feature-card {
+    background: linear-gradient(135deg, #007BFF, #86E3CE);
+    color: white;
+    padding: 30px;
+    border-radius: 15px;
+    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
+    text-align: center;
+    transform: scale(0.95);
+    transition: transform 0.3s ease, box-shadow 0.3s ease;
+    position: relative;
+    overflow: hidden;
+}
+
+.feature-card::before {
+    content: '';
+    position: absolute;
+    top: -50%;
+    left: -50%;
+    width: 200%;
+    height: 200%;
+    background: radial-gradient(circle, rgba(255, 255, 255, 0.2), transparent 70%);
+    opacity: 0;
+    transform: scale(0);
+    transition: transform 0.5s ease, opacity 0.5s ease;
+    z-index: 0;
+}
+
+.feature-card:hover::before {
+    transform: scale(1);
+    opacity: 1;
+}
+
+.feature-card:hover {
+    transform: scale(1.05);
+    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.3);
+}
+
+.feature-card h3 {
+    font-size: 1.8rem; /* Increased font size for the heading */
+    margin-bottom: 15px;
+    font-weight: bold;
+    position: relative;
+    z-index: 1;
+}
+
+.feature-card p {
+    font-size: 1.8rem; /* Increased font size for the paragraph */
+    line-height: 2; /* Adjusted line height for readability */
+    position: relative;
+    z-index: 1;
+    color: #ffffff; /* Optional: Ensure contrast with the background */
+}
+
+
+.feature-card:hover h3 {
+    text-shadow: 0 0 10px rgba(255, 255, 255, 0.8);
+}
+
+
+/* Features Section */
+.features-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+    gap: 20px;
+    margin-top: 40px;
+}
+
+.feature-card {
+    background: linear-gradient(135deg, #1e3a8a, #60a5fa);
+    color: white;
+    padding: 30px;
+    border-radius: 15px;
+    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
+    text-align: center;
+    transform: scale(0.95);
+    transition: transform 0.3s ease, box-shadow 0.3s ease;
+}
+
+.feature-card:hover {
+    transform: scale(1.05);
+    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
+}
+
+.feature-card h3 {
+    font-size: 1.5rem;
+    margin-bottom: 15px;
+}
+
+.feature-card p {
+    font-size: 1rem;
+    line-height: 1.5;
+}
+
+/* Generate Section */
+.generate {
+    padding: 70px 20px;
+    background: linear-gradient(135deg, #ffffff, #f5f7fa);
+    text-align: center;
+    border-radius: 20px;
+    margin: 50px auto;
+    max-width: 700px;
+    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
+    position: relative;
+    overflow: hidden;
+    z-index: 1;
+}
+
+.generate::before,
+.generate::after {
+    content: '';
+    position: absolute;
+    width: 200%;
+    height: 200%;
+    top: -50%;
+    left: -50%;
+    background: radial-gradient(circle, rgba(0, 123, 255, 0.1), transparent 80%);
+    animation: rotateGlow 10s linear infinite;
+    z-index: -1;
+}
+
+@keyframes rotateGlow {
+    0% {
+        transform: rotate(0deg);
+    }
+    100% {
+        transform: rotate(360deg);
+    }
+}
+
+/* Generate Section */
+.generate {
+    padding: 80px 20px;
+    background: linear-gradient(135deg, #e3f2fd, #ffffff);
+    text-align: center;
+    border-radius: 30px;
+    margin: 50px auto;
+    max-width: 700px;
+    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
+    position: relative;
+    overflow: hidden;
+    z-index: 1;
+}
+
+.generate::before {
+    content: '';
+    position: absolute;
+    top: -50%;
+    left: -50%;
+    width: 200%;
+    height: 200%;
+    background: radial-gradient(circle, rgba(0, 123, 255, 0.1), transparent 70%);
+    animation: rotateGlow 8s linear infinite;
+    z-index: -1;
+}
+
+@keyframes rotateGlow {
+    0% {
+        transform: rotate(0deg);
+    }
+    100% {
+        transform: rotate(360deg);
+    }
+}
+
+.generate h2 {
+    font-size: 2.5rem;
+    color: #007BFF;
+    font-weight: bold;
+    margin-bottom: 30px;
+    animation: fadeInTitle 1s ease-in-out;
+}
+
+@keyframes fadeInTitle {
+    0% {
+        opacity: 0;
+        transform: translateY(-20px);
+    }
+    100% {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+/* Form Styling */
+.form {
+    background: #ffffff;
+    padding: 40px;
+    border-radius: 20px;
+    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
+    animation: slideInForm 1.5s ease;
+    max-width: 500px;
+    margin: 0 auto;
+}
+
+@keyframes slideInForm {
+    0% {
+        opacity: 0;
+        transform: translateY(30px);
+    }
+    100% {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+.form-group {
+    margin-bottom: 20px;
+    text-align: left;
+}
+
+label {
+    font-size: 1rem;
+    font-weight: bold;
+    color: #333;
+    display: block;
+    margin-bottom: 8px;
+}
+
+select, input {
+    width: 100%;
+    padding: 12px;
+    font-size: 1rem;
+    border: 1px solid #ddd;
+    border-radius: 10px;
+    transition: border 0.3s ease, box-shadow 0.3s ease;
+    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+select:focus, input:focus {
+    border-color: #007BFF;
+    box-shadow: 0 0 10px rgba(0, 123, 255, 0.5);
+    outline: none;
+    transform: scale(1.02);
+}
+
+button {
+    display: inline-block;
+    background: linear-gradient(135deg, #007BFF, #0056b3);
+    color: white;
+    padding: 15px 40px;
+    border: none;
+    border-radius: 30px;
+    font-size: 1.2rem;
+    font-weight: bold;
+    text-transform: uppercase;
+    cursor: pointer;
+    position: relative;
+    transition: all 0.3s ease-in-out;
+    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
+}
+
+button:hover {
+    background: linear-gradient(135deg, #0056b3, #003f7f);
+    transform: translateY(-3px) scale(1.05);
+    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3);
+}
+
+button:active {
+    transform: translateY(2px);
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
+}
+
+
+/* Results Section */
+.results {
+    padding: 60px 20px;
+    background: #ffffff;
+    margin: 40px auto;
+    max-width: 1200px;
+    border-radius: 15px;
+    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
+    text-align: center;
+}
+
+.results h1 {
+    font-size: 2.5rem;
+    color: #007BFF;
+    margin-bottom: 20px;
+    font-weight: bold;
+}
+
+.results p {
+    font-size: 1.2rem;
+    margin-bottom: 30px;
+    color: #555;
+}
+
+.gallery {
+    display: grid;
+    grid-template-columns: repeat(4, 1fr);
+    gap: 20px;
+    justify-items: center;
+}
+
+.image-card {
+    background: white;
+    border-radius: 15px;
+    overflow: hidden;
+    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
+    padding: 15px;
+    transition: transform 0.3s ease, box-shadow 0.3s ease;
+    text-align: center;
+}
+
+.image-card img {
+    width: 100%;
+    height: auto;
+    border-radius: 10px;
+}
+
+.image-card:hover {
+    transform: scale(1.1);
+    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
+}
+
+/* Button Styles */
+.results .btn-primary, .results .btn-secondary {
+    display: inline-block;
+    background: linear-gradient(135deg, #007BFF, #0056b3);
+    color: white;
+    padding: 12px 30px;
+    border: none;
+    border-radius: 25px;
+    font-size: 1rem;
+    font-weight: bold;
+    text-align: center;
+    text-transform: uppercase;
+    text-decoration: none;
+    cursor: pointer;
+    position: relative;
+    transition: all 0.3s ease-in-out;
+    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
+}
+
+.results .btn-primary:hover, .results .btn-secondary:hover {
+    background: linear-gradient(135deg, #0056b3, #003f7f);
+    box-shadow: 0 12px 20px rgba(0, 0, 0, 0.3), 0 0 10px #007BFF, 0 0 20px #0056b3;
+    transform: translateY(-3px);
+}
+
+.results .btn-primary:active, .results .btn-secondary:active {
+    transform: translateY(2px);
+    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
+}
+
+/* Glow Effect on Hover */
+.results .btn-primary::after, .results .btn-secondary::after {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    border-radius: 25px;
+    background: radial-gradient(circle, rgba(255, 255, 255, 0.3), transparent 70%);
+    opacity: 0;
+    transition: opacity 0.3s ease-in-out;
+    z-index: -1;
+}
+
+.results .btn-primary:hover::after, .results .btn-secondary:hover::after {
+    opacity: 1;
+}
+.results .btn-primary {
+    margin-top: 40px; /* Add space above the button */
+    display: inline-block;
+    background: linear-gradient(135deg, #007BFF, #0056b3);
+    color: white;
+    padding: 12px 30px;
+    border: none;
+    border-radius: 25px;
+    font-size: 1rem;
+    font-weight: bold;
+    text-align: center;
+    text-transform: uppercase;
+    text-decoration: none;
+    cursor: pointer;
+    transition: all 0.3s ease-in-out;
+    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
+}
+
+.results .btn-primary:hover {
+    background: linear-gradient(135deg, #0056b3, #003f7f);
+    transform: translateY(-3px);
+    box-shadow: 0 12px 20px rgba(0, 0, 0, 0.3), 0 0 10px #007BFF, 0 0 20px #0056b3;
+}
+
+/* Footer */
+.footer {
+    background: linear-gradient(135deg, #007BFF, #1100fd);
+    padding: 40px 20px;
+    text-align: center;
+    position: relative;
+    overflow: hidden;
+    border-top: 5px solid #0056b3;
+    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.3);
+    z-index: 1;
+}
+
+.footer::before, 
+.footer::after {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: -50%;
+    width: 200%;
+    height: 200%;
+    background: radial-gradient(circle at center, rgba(255, 255, 255, 0.2) 0%, transparent 70%);
+    animation: shineEffect 8s infinite linear;
+    transform: rotate(45deg);
+    z-index: -1;
+}
+
+@keyframes shineEffect {
+    0% {
+        transform: translateX(-100%) rotate(45deg);
+    }
+    100% {
+        transform: translateX(100%) rotate(45deg);
+    }
+}
+
+.footer p {
+    font-size: 1.1rem;
+    font-weight: 600;
+    color: #fff;
+    margin-bottom: 15px;
+    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
+}
+
+
+
+
+.footer {
+    text-align: center;
+    padding: 20px;
+    background: linear-gradient(135deg, #1e3a8a, #60a5fa);
+    color: white;
+    font-size: 1rem;
+    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
+}
+
+.footer .footer-links {
+    margin-top: 10px;
+    display: flex;
+    justify-content: center;
+    gap: 15px;
+}
+
+.footer .footer-links a {
+    color: white;
+    font-size: 1.2rem;
+    text-decoration: none;
+    transition: color 0.3s;
+}
+
+@keyframes fadeInLinks {
+    0% {
+        opacity: 0;
+        transform: translateY(20px);
+    }
+    100% {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+.footer-links a {
+    color: #fff;
+    text-decoration: none;
+    font-size: 1rem;
+    font-weight: bold;
+    background: rgba(255, 255, 255, 0.1);
+    padding: 10px 20px;
+    border-radius: 25px;
+    transition: background 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
+    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
+}
+
+.footer-links a:hover {
+    background: #b37ed4;
+    color: #ffffff;
+    transform: translateY(-5px);
+    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.3);
+}
+
+.footer-social {
+    margin-top: 20px;
+    display: flex;
+    justify-content: center;
+    gap: 20px;
+    animation: socialIconsPulse 2s infinite;
+}
+
+@keyframes socialIconsPulse {
+    0%, 100% {
+        transform: scale(1);
+    }
+    50% {
+        transform: scale(1.2);
+    }
+}
+
+.footer-social a {
+    font-size: 1.5rem;
+    color: #fff;
+    transition: color 0.3s ease, transform 0.3s ease;
+}
+
+.footer-social a:hover {
+    color: #e5e5e5;
+    transform: scale(1.5) rotate(15deg);
+}
+.action-buttons {
+    display: flex;
+    justify-content: center;
+    gap: 15px; /* Space between buttons */
+    margin-top: 20px;
+}
+
+.action-buttons .btn-primary,
+.action-buttons .btn-secondary {
+    display: inline-block;
+    padding: 10px 20px;
+    font-size: 16px;
+    color: #fff;
+    background: #007BFF;
+    border: none;
+    border-radius: 25px;
+    text-align: center;
+    text-decoration: none;
+    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
+    transition: background 0.3s ease;
+}
+
+.action-buttons .btn-primary:hover,
+.action-buttons .btn-secondary:hover {
+    background: #0056b3;
+}

static/script.js

@@ -0,0 +1,30 @@
+document.getElementById("generate-form").addEventListener("submit", function (event) {
+    event.preventDefault();
+
+    const formData = new FormData(event.target);
+    const resultDiv = document.getElementById("result");
+    resultDiv.innerHTML = "Generating images...";
+
+    fetch("/generate", {
+        method: "POST",
+        body: formData,
+    })
+        .then((response) => response.json())
+        .then((data) => {
+            resultDiv.innerHTML = "";
+            if (data.error) {
+                resultDiv.innerHTML = `<p>Error: ${data.error}</p>`;
+                return;
+            }
+
+            data.images.forEach((image) => {
+                const img = document.createElement("img");
+                img.src = image;
+                resultDiv.appendChild(img);
+            });
+        })
+        .catch((error) => {
+            console.error("Error:", error);
+            resultDiv.innerHTML = "<p>Something went wrong. Please try again.</p>";
+        });
+});

style.css

@@ -0,0 +1,28 @@
+body {
+	padding: 2rem;
+	font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
+}
+
+h1 {
+	font-size: 16px;
+	margin-top: 0;
+}
+
+p {
+	color: rgb(107, 114, 128);
+	font-size: 15px;
+	margin-bottom: 10px;
+	margin-top: 5px;
+}
+
+.card {
+	max-width: 620px;
+	margin: 0 auto;
+	padding: 16px;
+	border: 1px solid lightgray;
+	border-radius: 16px;
+}
+
+.card p:last-child {
+	margin-bottom: 0;
+}

templates/About_us.html

@@ -0,0 +1,161 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>About Us</title>
+    <link rel="icon" type="image/png" href="static/css/Blue_ABstract_Brain_Technology_Logo__1_-removebg-preview.png">
+    <link rel="stylesheet" href="/static/css/style.css">
+    <style>
+        /* Additional styling for About Us page */
+        .about {
+            text-align: center;
+            padding: 50px 20px;
+            background: linear-gradient(135deg, #f0f7ff, #e0f4ff);
+            border-radius: 20px;
+            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
+            margin: 50px auto;
+            max-width: 1200px;
+            animation: fadeInAbout 1.5s ease-in-out;
+        }
+
+        .about h2 {
+            font-size: 2.5rem;
+            color: #007BFF;
+            margin-bottom: 30px;
+            position: relative;
+        }
+
+        .features-grid {
+            display: flex;
+            justify-content: center;
+            flex-wrap: wrap;
+            gap: 30px;
+        }
+
+        .feature-card {
+            text-align: center;
+            padding: 20px;
+            background: linear-gradient(135deg, #a47abe, #006eff);
+            border-radius: 15px;
+            box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
+            width: 280px;
+            color: white;
+            position: relative;
+        }
+
+        .feature-card img {
+            width: 150px;
+            height: 150px;
+            object-fit: cover;
+            border-radius: 50%;
+            margin-bottom: 15px;
+            border: 4px solid #ffffff;
+        }
+
+        .feature-card h3 {
+            font-size: 1.5rem;
+            color: white;
+            margin-bottom: 10px;
+        }
+
+        .feature-card p {
+            font-size: 1rem;
+            color: #f0f0f0;
+            line-height: 1.6;
+        }
+
+        .contact-links {
+            display: flex;
+            justify-content: center;
+            gap: 15px;
+            margin-top: 10px;
+        }
+
+        .contact-link {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            width: 40px;
+            height: 40px;
+            border-radius: 50%;
+            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
+            transition: transform 0.3s ease, box-shadow 0.3s ease;
+        }
+
+        .contact-link img {
+            width: 50px;
+            height: 50px;
+        }
+
+        .contact-link:hover {
+            transform: scale(1.1);
+            box-shadow: 0 6px 15px rgba(0, 0, 0, 0.3);
+        }
+    </style>
+</head>
+<body>
+    <header class="navbar">
+        <div class="logo">
+            <img src="static/css/Blue_ABstract_Brain_Technology_Logo__1_-removebg-preview.png" alt="MedGAN Logo">
+            <span>MedGAN Studio</span>
+        </div>
+        <nav>
+            <ul>
+                <li><a href="/">Home</a></li>
+                <li><a href="{{ url_for('generate_info') }}">Generate</a></li>
+                <li><a href="{{ url_for('detect_info') }}">Detect</a></li>
+                <li><a href="{{ url_for('about_us') }}">About Us</a></li>
+                <li><a href="{{ url_for('contact') }}">Contact</a></li>
+            </ul>
+        </nav>
+    </header>
+
+    <section class="about">
+        <div class="container">
+            <h2>About Our Team</h2>
+            <div class="features-grid">
+                <div class="feature-card">
+                    <img src="static/css/hamza.jpeg" alt="Hamza Nasser">
+                    <h3>Hamza Nasser</h3>
+                    <p>Experienced in implementing effective data preprocessing strategies and specializing in optimizing GAN architectures for enhanced application outcomes.</p>
+                    <div class="contact-links">
+                        <a href="mailto:[email protected]" class="contact-link"><img src="static/icons/email-icon.png" alt="Email"></a>
+                        <a href="https://www.linkedin.com/in/hamza-waseem-nasser" target="_blank" class="contact-link"><img src="static/icons/linkedin-icon.png" alt="LinkedIn"></a>
+                    </div>
+                </div>
+                <div class="feature-card">
+                    <img src="static\css\profile-pic - 2025-01-02T222023.790.png" alt="Mohammed Zaloom">
+                    <h3>Mohammed Zaloom</h3>
+                    <p>
+                        Bachelor’s in AI and Robotics with a strong focus on AI and Deep Learning technologies. Experienced in designing, training, and optimizing deep learning models.</p>
+                    <div class="contact-links">
+                        <a href="mailto:[email protected]" class="contact-link"><img src="static/icons/email-icon.png" alt="Email"></a>
+                        <a href="https://linkedin.com/in/mozaloom" target="_blank" class="contact-link"><img src="static/icons/linkedin-icon.png" alt="LinkedIn"></a>
+                    </div>
+                </div>
+                <div class="feature-card">
+                    <img src="static/css/me.jpeg" alt="Mahmoud AbuAwd">
+                    <h3>Mahmoud AbuAwd</h3>
+                    <p>Highly skilled in data preprocessing techniques and optimization, with a strong expertise in tuning, and implementing advanced GAN architectures for applications.</p>
+                    <div class="contact-links">
+                        <a href="mailto:@gmail.com" class="contact-link"><img src="static/icons/email-icon.png" alt="Email"></a>
+                        <a href="https://linkedin.com/in/mahmoudabuawd" target="_blank" class="contact-link"><img src="static/icons/linkedin-icon.png" alt="LinkedIn"></a>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <footer class="footer">
+        <div class="container">
+            <p>&copy; 2024 MedGAN Studio. All Rights Reserved.</p>
+            <div class="footer-links">
+                <a href="mailto:[email protected]">Email Us</a>
+                <a href="https://instagram.com/medgan" target="_blank">Instagram</a>
+                <a href="https://www.linkedin.com/company/medgan/" target="_blank">LinkedIn</a>
+            </div>
+        </div>
+    </footer>
+</body>
+</html>

templates/contact.html

@@ -0,0 +1,182 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Contact Us</title>
+    <link rel="icon" type="image/png" href="static/css/Blue_ABstract_Brain_Technology_Logo__1_-removebg-preview.png">
+    <link rel="stylesheet" href="/static/css/style.css">
+    <style>
+        /* Contact Section */
+        .contact-section {
+            text-align: center;
+            padding: 60px 20px;
+            background: linear-gradient(135deg, #e0f7fa, #f3e5f5);
+            border-radius: 20px;
+            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
+            margin: 50px auto;
+            max-width: 900px;
+            animation: fadeIn 1.5s ease-in-out;
+            position: relative;
+            overflow: hidden;
+        }
+
+        .contact-section::before {
+            content: '';
+            position: absolute;
+            top: -50%;
+            left: -50%;
+            width: 200%;
+            height: 200%;
+            background: radial-gradient(circle, rgba(0, 198, 255, 0.2), transparent 70%);
+            z-index: -1;
+            transform: scale(0);
+            transition: transform 0.4s ease-in-out, opacity 0.4s ease-in-out;
+        }
+
+        .contact-section:hover::before {
+            transform: scale(1);
+            opacity: 1;
+        }
+
+        @keyframes fadeIn {
+            from {
+                opacity: 0;
+                transform: translateY(20px);
+            }
+            to {
+                opacity: 1;
+                transform: translateY(0);
+            }
+        }
+
+        .contact-section h2 {
+            font-size: 3rem;
+            color: #007BFF;
+            margin-bottom: 20px;
+            font-weight: bold;
+            text-transform: uppercase;
+            position: relative;
+            animation: slideIn 1s ease-in-out;
+        }
+
+        .contact-section h2::after {
+            content: '';
+            position: absolute;
+            width: 80px;
+            height: 4px;
+            background: linear-gradient(90deg, #007BFF, #86E3CE);
+            bottom: -10px;
+            left: 50%;
+            transform: translateX(-50%);
+            animation: expand 1s ease-in-out;
+        }
+
+        @keyframes slideIn {
+            from {
+                opacity: 0;
+                transform: translateY(-20px);
+            }
+            to {
+                opacity: 1;
+                transform: translateY(0);
+            }
+        }
+
+        @keyframes expand {
+            from {
+                width: 0;
+            }
+            to {
+                width: 80px;
+            }
+        }
+
+        .contact-section p {
+            font-size: 1.3rem;
+            color: #555;
+            margin-bottom: 30px;
+        }
+
+        /* Contact Links */
+        .contact-links {
+            display: flex;
+            justify-content: center;
+            flex-wrap: wrap;
+            gap: 30px;
+        }
+
+        .contact-links a {
+            display: inline-block;
+            background: linear-gradient(135deg, #007BFF, #0056b3);
+            color: white;
+            padding: 15px 40px;
+            border-radius: 30px;
+            font-size: 1.2rem;
+            font-weight: bold;
+            text-decoration: none;
+            position: relative;
+            overflow: hidden;
+            transition: all 0.4s ease-in-out;
+            box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
+        }
+
+        .contact-links a:hover {
+            background: linear-gradient(135deg, #0056b3, #003f7f);
+            transform: translateY(-5px);
+            box-shadow: 0 12px 25px rgba(0, 0, 0, 0.3);
+        }
+
+        .contact-links a::before {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: -100%;
+            width: 200%;
+            height: 100%;
+            background: rgba(255, 255, 255, 0.1);
+            z-index: 1;
+            transform: skewX(-45deg);
+            transition: left 0.5s ease;
+        }
+
+        .contact-links a:hover::before {
+            left: 100%;
+        }
+    </style>
+</head>
+<body>
+    <header class="navbar">
+        <div class="logo">
+            <img src="static/css/Blue_ABstract_Brain_Technology_Logo__1_-removebg-preview.png" alt="MedGAN Logo">
+            <span>MedGAN Studio</span>
+        </div>
+        <nav>
+            <ul>
+                <li><a href="/">Home</a></li>
+                <li><a href="{{ url_for('generate_info') }}">Generate</a></li>
+                <li><a href="{{ url_for('detect_info') }}">Detect</a></li>
+                <li><a href="{{ url_for('about_us') }}">About Us</a></li>
+                <li><a href="{{ url_for('contact') }}">Contact</a></li>
+            </ul>
+        </nav>
+    </header>
+
+    <section class="contact-section">
+        <h2>Contact Us</h2>
+        <p>Reach out to us through the following channels:</p>
+        <div class="contact-links">
+            <a href="mailto:[email protected]">Email Us</a>
+            <a href="https://instagram.com/medgan"target="_blank">Instagram</a>
+            <a href="https://www.linkedin.com/company/medgan/" target="_blank">LinkedIn</a>
+        </div>
+    </section>
+
+    <footer class="footer">
+        <div class="container">
+            <p>&copy; 2024 MedGAN Studio. All Rights Reserved.</p>
+            <p>Created by AI Students at Al- Balqa Applied University (BAU)</p>
+        </div>
+    </footer>
+</body>
+</html>

templates/detect.html

@@ -0,0 +1,196 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Brain Tumor Detection</title>
+    <link rel="icon" type="image/png" href="static/css/Blue_Abstract_Brain_Technology_Logo__1_-removebg-preview.png">
+    <link rel="stylesheet" href="/static/css/style.css">
+    <style>
+        body {
+            background: linear-gradient(120deg, #f0f7ff, #e0f4ff);
+            font-family: 'Inter', sans-serif;
+        }
+
+        .container {
+            max-width: 900px;
+            margin: 50px auto;
+            padding: 20px;
+        }
+
+        .detect-section {
+            text-align: center;
+            padding: 60px 20px;
+            background: linear-gradient(135deg, #ffffff, #f8f9fa);
+            border-radius: 25px;
+            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
+            animation: fadeInDetect 1.5s ease-in-out;
+        }
+
+        @keyframes fadeInDetect {
+            from {
+                opacity: 0;
+                transform: translateY(20px);
+            }
+            to {
+                opacity: 1;
+                transform: translateY(0);
+            }
+        }
+
+        .detect-section h2 {
+            font-size: 2.5rem;
+            color: #007BFF;
+            margin-bottom: 20px;
+            font-weight: bold;
+            position: relative;
+            text-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
+        }
+
+        .detect-section h2::after {
+            content: '';
+            position: absolute;
+            width: 100px;
+            height: 4px;
+            background: linear-gradient(90deg, #007BFF, #86E3CE);
+            bottom: -10px;
+            left: 50%;
+            transform: translateX(-50%);
+        }
+
+        .detect-section p {
+            font-size: 1.2rem;
+            color: #555;
+            margin-bottom: 40px;
+        }
+
+        .detect-section form {
+            text-align: left;
+            background: linear-gradient(135deg, #f9f9fc, #e3e9ff);
+            padding: 30px;
+            border-radius: 20px;
+            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
+            display: inline-block;
+        }
+
+        .detect-section input[type="file"] {
+            width: 100%;
+            padding: 12px;
+            font-size: 1rem;
+            border: 1px solid #ddd;
+            border-radius: 10px;
+            background: #f7f9fc;
+            transition: all 0.3s ease;
+            margin-bottom: 20px;
+        }
+
+        .detect-section input[type="file"]:focus {
+            border-color: #007BFF;
+            box-shadow: 0 0 10px rgba(0, 123, 255, 0.5);
+            outline: none;
+            transform: scale(1.02);
+        }
+
+        .btn-primary {
+            background: linear-gradient(135deg, #007BFF, #0056b3);
+            color: white;
+            padding: 12px 30px;
+            border-radius: 25px;
+            font-size: 1.2rem;
+            font-weight: bold;
+            text-transform: uppercase;
+            text-decoration: none;
+            cursor: pointer;
+            transition: all 0.3s ease-in-out;
+            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
+            display: inline-block;
+        }
+
+        .btn-primary:hover {
+            background: linear-gradient(135deg, #0056b3, #003f7f);
+            transform: translateY(-3px);
+        }
+
+        .btn-primary::after {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            border-radius: 25px;
+            background: radial-gradient(circle, rgba(255, 255, 255, 0.4), transparent 70%);
+            opacity: 0;
+            transition: opacity 0.3s ease-in-out;
+            z-index: -1;
+        }
+
+        .btn-primary:hover::after {
+            opacity: 1;
+        }
+
+        .footer {
+            text-align: center;
+            padding: 20px;
+            background: linear-gradient(135deg, #1e3a8a, #60a5fa);
+            color: white;
+            font-size: 1rem;
+            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
+        }
+
+        .footer .footer-links {
+            margin-top: 10px;
+            display: flex;
+            justify-content: center;
+            gap: 15px;
+        }
+
+        .footer .footer-links a {
+            color: white;
+            font-size: 1.2rem;
+            text-decoration: none;
+            transition: color 0.3s;
+        }
+
+
+    </style>
+</head>
+<body>
+    <header class="navbar">
+        <div class="logo">
+            <img src="static/css/Blue_Abstract_Brain_Technology_Logo__1_-removebg-preview.png" alt="MedGAN Logo">
+            <span>MedGAN Studio</span>
+        </div>
+        <nav>
+            <ul>
+                <li><a href="/">Home</a></li>
+                <li><a href="{{ url_for('generate_info') }}">Generate</a></li>
+                <li><a href="{{ url_for('detect_info') }}">Detect</a></li>
+                <li><a href="{{ url_for('about_us') }}">About Us</a></li>
+                <li><a href="{{ url_for('contact') }}">Contact</a></li>
+
+            </ul>
+        </nav>
+    </header>
+
+    <section class="detect-section">
+        <h2>Brain Tumor Detection</h2>
+        <p>Upload a brain scan image to predict its tumor type.</p>
+        <form action="/detect" method="post" enctype="multipart/form-data">
+            <input type="file" name="file" accept="image/*" required>
+            <button type="submit" class="btn-primary">Predict</button>
+        </form>
+    </section>
+
+    <footer class="footer">
+        <div class="container">
+            <p>&copy; 2024 MedGAN Studio. All Rights Reserved.</p>
+            <div class="footer-links">
+                <a href="mailto:[email protected]">Email Us</a>
+                <a href="https://instagram.com/medgan" target="_blank">Instagram</a>
+                <a href="https://www.linkedin.com/company/medgan/" target="_blank">LinkedIn</a>
+            </div>
+        </div>
+    </footer>
+</body>
+</html>

templates/error.html

@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Error</title>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css">
+    <style>
+        body {
+            padding: 20px;
+        }
+        .error-container {
+            margin-top: 50px;
+            padding: 20px;
+            border-radius: 5px;
+            background-color: #f8d7da;
+            border: 1px solid #f5c6cb;
+        }
+        .btn-home {
+            margin-top: 20px;
+        }
+    </style>
+</head>
+<body>
+    <div class="container">
+        <div class="row">
+            <div class="col-md-8 offset-md-2">
+                <div class="error-container">
+                    <h2 class="text-danger">Error Occurred</h2>
+                    <p>{{ error }}</p>
+                    <p>Please try again or contact support if the issue persists.</p>
+                    <a href="/" class="btn btn-primary btn-home">Return to Home</a>
+                </div>
+            </div>
+        </div>
+    </div>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/js/bootstrap.bundle.min.js"></script>
+</body>
+</html>

templates/generate.html

@@ -0,0 +1,502 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Generate Images</title>
+    <link rel="icon" type="image/png" href="static/css/Blue_ABstract_Brain_Technology_Logo__1_-removebg-preview.png">
+    <link rel="stylesheet" href="/static/css/style.css">
+    
+    <style>
+        body {
+            background: linear-gradient(120deg, #f0f7ff, #e0f4ff);
+            font-family: 'Inter', sans-serif;
+        }
+
+        .container {
+            max-width: 900px;
+            margin: 50px auto;
+            padding: 20px;
+        }
+
+        .manual {
+            background: linear-gradient(135deg, #1e3a8a, #60a5fa);
+            padding: 30px;
+            border-radius: 25px;
+            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
+            margin-bottom: 30px;
+            text-align: left;
+            animation: fadeInManual 1.5s ease-in-out;
+        }
+
+        @keyframes fadeInManual {
+            from {
+                opacity: 0;
+                transform: translateX(20px);
+            }
+            to {
+                opacity: 1;
+                transform: translateX(0);
+            }
+        }
+
+        .manual h3 {
+            font-size: 2rem;
+            color: #ffffff;
+            margin-bottom: 15px;
+            text-align: center;
+            text-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
+        }
+
+        .manual ol {
+            font-size: 1.2rem;
+            color: #ffffff;
+            line-height: 1.8;
+            margin-left: 20px;
+        }
+
+        .manual ol li {
+            margin-bottom: 15px;
+        }
+
+        .manual ol li span {
+            font-weight: bold;
+            color: #ffdd57;
+            text-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+        }
+
+        .generate {
+            text-align: center;
+            padding: 40px 20px;
+            background: #ffffff;
+            border-radius: 25px;
+            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
+            margin-top: 30px;
+            animation: fadeInGenerate 1.5s ease-in-out;
+        }
+
+        @keyframes fadeInGenerate {
+            from {
+                opacity: 0;
+                transform: translateY(20px);
+            }
+            to {
+                opacity: 1;
+                transform: translateY(0);
+            }
+        }
+
+        .generate h2 {
+            font-size: 2.5rem;
+            color: #007BFF;
+            margin-bottom: 20px;
+            font-weight: bold;
+            position: relative;
+            text-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
+        }
+
+        .generate h2::after {
+            content: '';
+            position: absolute;
+            width: 100px;
+            height: 4px;
+            background: linear-gradient(90deg, #007BFF, #86E3CE);
+            bottom: -10px;
+            left: 50%;
+            transform: translateX(-50%);
+        }
+
+        .generate p {
+            font-size: 1.2rem;
+            color: #555;
+            margin-bottom: 40px;
+        }
+
+        .form {
+            text-align: left;
+            background: linear-gradient(135deg, #f9f9fc, #e3e9ff);
+            padding: 30px;
+            border-radius: 20px;
+            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
+            animation: slideInForm 1.5s ease-in-out;
+        }
+
+        @keyframes slideInForm {
+            from {
+                opacity: 0;
+                transform: translateX(-20px);
+            }
+            to {
+                opacity: 1;
+                transform: translateX(0);
+            }
+        }
+
+        .form-group {
+            margin-bottom: 20px;
+        }
+
+        .form-group label {
+            font-size: 1rem;
+            font-weight: bold;
+            color: #333;
+            display: block;
+            margin-bottom: 8px;
+        }
+
+        .form-group select, .form-group input {
+            width: 100%;
+            padding: 12px;
+            font-size: 1rem;
+            border: 1px solid #ddd;
+            border-radius: 10px;
+            transition: all 0.3s ease;
+            background: #f7f9fc;
+        }
+
+        .form-group select:focus, .form-group input:focus {
+            border-color: #007BFF;
+            box-shadow: 0 0 10px rgba(0, 123, 255, 0.5);
+            outline: none;
+            transform: scale(1.02);
+        }
+
+        .btn-primary {
+            display: inline-block;
+            background: linear-gradient(135deg, #007BFF, #0056b3);
+            color: white;
+            padding: 12px 30px;
+            border-radius: 25px;
+            font-size: 1.2rem;
+            font-weight: bold;
+            text-align: center;
+            cursor: pointer;
+            transition: all 0.3s ease;
+            box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3);
+            position: relative;
+            overflow: hidden;
+        }
+
+        .btn-primary:hover {
+            background: linear-gradient(135deg, #0056b3, #003f7f);
+            transform: translateY(-3px);
+            box-shadow: 0 12px 20px rgba(0, 0, 0, 0.3);
+        }
+
+        .btn-primary::after {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            border-radius: 25px;
+            background: radial-gradient(circle, rgba(255, 255, 255, 0.4), transparent 70%);
+            opacity: 0;
+            transition: opacity 0.3s ease-in-out;
+            z-index: -1;
+        }
+
+        .btn-primary:hover::after {
+            opacity: 1;
+        }
+
+        body {
+            background: linear-gradient(120deg, #f0f7ff, #e0f4ff);
+            font-family: 'Inter', sans-serif;
+        }
+
+        .container {
+            max-width: 1200px;
+            margin: 50px auto;
+            padding: 20px;
+        }
+
+        .steps {
+            display: flex;
+            justify-content: space-between;
+            align-items: stretch;
+            gap: 20px;
+            flex-wrap: wrap;
+        }
+
+        .step {
+            flex: 1 1 calc(25% - 20px); /* Four items in one row */
+            background: #ffffff;
+            border-radius: 15px;
+            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
+            padding: 20px;
+            text-align: center;
+            transition: transform 0.3s ease, box-shadow 0.3s ease;
+            max-width: 220px; /* Ensures cards remain uniform */
+        }
+
+        .step:hover {
+            transform: scale(1.05);
+            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
+        }
+
+        .step-icon {
+            width: 60px;
+            height: 60px;
+            margin: 0 auto 15px;
+            background: linear-gradient(135deg, #007BFF, #0056b3);
+            border-radius: 50%;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
+        }
+
+        .step-icon img {
+            width: 50px;
+            height: 50px;
+        }
+
+        .step-text h4 {
+            font-size: 1.5rem;
+            color: #333;
+            margin-bottom: 10px;
+        }
+
+        .step-text p {
+            font-size: 1rem;
+            color: #666;
+            line-height: 1.6;
+        }
+
+        .manual {
+            background: linear-gradient(135deg, #1e3a8a, #60a5fa);
+            padding: 30px;
+            border-radius: 25px;
+            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
+            margin-bottom: 30px;
+            text-align: left;
+            animation: fadeInManual 1.5s ease-in-out;
+        }
+
+        @keyframes fadeInManual {
+            from {
+                opacity: 0;
+                transform: translateX(20px);
+            }
+            to {
+                opacity: 1;
+                transform: translateX(0);
+            }
+        }
+
+        .manual h3 {
+            font-size: 2rem;
+            color: #ffffff;
+            margin-bottom: 15px;
+            text-align: center;
+            text-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
+        }
+
+        .manual ol {
+            font-size: 1.2rem;
+            color: #ffffff;
+            line-height: 1.8;
+            margin-left: 20px;
+        }
+
+        .manual ol li {
+            margin-bottom: 15px;
+        }
+
+        .manual ol li span {
+            font-weight: bold;
+            color: #ffdd57;
+            text-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+        }
+
+        .generate {
+            text-align: center;
+            padding: 40px 20px;
+            background: #ffffff;
+            border-radius: 25px;
+            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
+            margin-top: 30px;
+            animation: fadeInGenerate 1.5s ease-in-out;
+        }
+
+        .generate h2 {
+            font-size: 2.5rem;
+            color: #007BFF;
+            margin-bottom: 20px;
+            font-weight: bold;
+            position: relative;
+            text-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
+        }
+
+        .generate h2::after {
+            content: '';
+            position: absolute;
+            width: 100px;
+            height: 4px;
+            background: linear-gradient(90deg, #007BFF, #86E3CE);
+            bottom: -10px;
+            left: 50%;
+            transform: translateX(-50%);
+        }
+
+        .generate p {
+            font-size: 1.2rem;
+            color: #555;
+            margin-bottom: 40px;
+        }
+
+        .form {
+            text-align: left;
+            background: linear-gradient(135deg, #f9f9fc, #e3e9ff);
+            padding: 30px;
+            border-radius: 20px;
+            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
+        }
+
+        .form-group {
+            margin-bottom: 20px;
+        }
+
+        .form-group label {
+            font-size: 1rem;
+            font-weight: bold;
+            color: #333;
+            display: block;
+            margin-bottom: 8px;
+        }
+
+        .form-group select, .form-group input {
+            width: 100%;
+            padding: 12px;
+            font-size: 1rem;
+            border: 1px solid #ddd;
+            border-radius: 10px;
+            transition: all 0.3s ease;
+            background: #f7f9fc;
+        }
+
+        .btn-primary {
+            display: inline-block;
+            background: linear-gradient(135deg, #007BFF, #0056b3);
+            color: white;
+            padding: 12px 30px;
+            border-radius: 25px;
+            font-size: 1.2rem;
+            font-weight: bold;
+            text-align: center;
+            cursor: pointer;
+            transition: all 0.3s ease;
+        }
+
+        
+    </style>
+</head>
+<body>
+    <header class="navbar">
+        <div class="logo">
+            <img src="static/css/Blue_Abstract_Brain_Technology_Logo__1_-removebg-preview.png" alt="MedGAN Logo">
+            <span>MedGAN Studio</span>
+        </div>
+        <nav>
+            <ul>
+                <li><a href="/">Home</a></li>
+                <li><a href="{{ url_for('generate_info') }}">Generate</a></li>
+                <li><a href="{{ url_for('detect_info') }}">Detect</a></li>
+                <li><a href="{{ url_for('about_us') }}">About Us</a></li>
+                <li><a href="{{ url_for('contact') }}">Contact</a></li>
+            </ul>
+        </nav>
+    </header>
+
+    <div class="container">
+        <!-- User Manual Section -->
+        <section class="manual">
+            <h3>How to Use?</h3>
+            <div class="steps">
+                <div class="step">
+                    <div class="step-icon">
+                        <img src="static/icons/icons8-number-1-64.png" alt="Select Model">
+                    </div>
+                    <div class="step-text">
+                        <h4>Select the Model</h4>
+                        <p>Choose the GAN model you want to use from the "Model" dropdown menu.</p>
+                    </div>
+                </div>
+                <div class="step">
+                    <div class="step-icon">
+                        <img src="static/icons/icons8-2-circled-64.png" alt="Select Tumor Type">
+                    </div>
+                    <div class="step-text">
+                        <h4>Select the Tumor Type</h4>
+                        <p>Pick the tumor type (Glioma, Pituitary, or Meningioma) from the "Tumor Type" dropdown.</p>
+                    </div>
+                </div>
+                <div class="step">
+                    <div class="step-icon">
+                        <img src="static/icons/icons8-circled-3-c-64.png" alt="Set Number of Images">
+                    </div>
+                    <div class="step-text">
+                        <h4>Set the Number of Images</h4>
+                        <p>Enter the number of images to generate in the "Number of Images" field (1–100).</p>
+                    </div>
+                </div>
+                <div class="step">
+                    <div class="step-icon">
+                        <img src="static/icons/icons8-circled-4-c-64.png" alt="Generate Images">
+                    </div>
+                    <div class="step-text">
+                        <h4>Generate Images</h4>
+                        <p>Click the "Generate Images" button to create your selected images.</p>
+                    </div>
+                </div>
+            </div>
+        </section>
+    </div>
+
+        <!-- Generate Form Section -->
+        <section class="generate">
+            <h2>Generate Brain Tumor Images</h2>
+            <p>Select a model, tumor type, and the number of images to generate.</p>
+
+            <form action="/generate" method="post" class="form">
+                <div class="form-group">
+                    <label for="model">Model:</label>
+                    <select name="model" id="model">
+                        <option value="Progressive GANs">Progressive GANs</option>
+                        <option value="DCGANs">DCGANs</option>
+                        <option value="StyleGAN2">StyleGAN2</option>
+                        <option value="WGANs">WGANs</option>
+                    </select>
+                </div>
+                <div class="form-group">
+                    <label for="class_name">Tumor Type:</label>
+                    <select name="class_name" id="class_name">
+                        <option value="Glioma">Glioma</option>
+                        <option value="Pituitary">Pituitary</option>
+                        <option value="Meningioma">Meningioma</option>
+                    </select>
+                </div>
+                <div class="form-group">
+                    <label for="num_images">Number of Images:</label>
+                    <input type="number" name="num_images" id="num_images" min="1" max="100" value="1">
+                </div>
+                <button type="submit" class="btn-primary">Generate Images</button>
+            </form>
+        </section>
+    </div>
+
+
+    <footer class="footer">
+        <div class="container">
+            <p>&copy; 2024 MedGAN Studio. All Rights Reserved.</p>
+            <div class="footer-links">
+                <a href="mailto:[email protected]">Email Us</a>
+                <a href="https://instagram.com/medgan"target="_blank">Instagram</a>
+                <a href="https://www.linkedin.com/company/medgan/" target="_blank">LinkedIn</a>
+            </div>
+        </div>
+    </footer>
+</body>
+</html>

templates/index.html

@@ -0,0 +1,208 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>MedGAN Studio</title>
+    <link rel="icon" type="image/png" href="static/css/Blue_ABstract_Brain_Technology_Logo__1_-removebg-preview.png">
+    <link rel="stylesheet" href="/static/css/style.css">
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700&display=swap" rel="stylesheet">
+    <style>
+        .models {
+            padding: 80px 20px;
+            text-align: center;
+            background: linear-gradient(120deg, #f8fbff, #eef5fc);
+            border-radius: 20px;
+            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
+            animation: fadeInModels 1.5s ease-in-out;
+        }
+
+        @keyframes fadeInModels {
+            from {
+                opacity: 0;
+                transform: translateY(20px);
+            }
+            to {
+                opacity: 1;
+                transform: translateY(0);
+            }
+        }
+
+        .models h2 {
+            font-size: 2.8rem;
+            color: #007BFF;
+            margin-bottom: 20px;
+            font-weight: bold;
+            position: relative;
+        }
+
+        .models h2::after {
+            content: '';
+            position: absolute;
+            width: 100px;
+            height: 4px;
+            background: linear-gradient(90deg, #007BFF, #ffffff);
+            bottom: -10px;
+            left: 50%;
+            transform: translateX(-50%);
+        }
+
+        .models p {
+            font-size: 1.2rem;
+            color: #555;
+            margin-bottom: 50px;
+            max-width: 700px;
+            margin-left: auto;
+            margin-right: auto;
+        }
+
+        .models-grid {
+            display: flex;
+            justify-content: center;
+            flex-wrap: wrap;
+            gap: 30px;
+            margin-top: 30px;
+        }
+
+        .model-card {
+            background: linear-gradient(135deg,#60a5fa, #1e3a8a);
+            border-radius: 20px;
+            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.61);
+            text-align: center;
+            padding: 30px;
+            width: 280px;
+            transition: transform 0.4s ease, box-shadow 0.4s ease;
+            position: relative;
+            overflow: hidden;
+        }
+
+        .model-card:hover {
+            transform: translateY(-15px);
+            box-shadow: 0 15px 40px rgba(0, 0, 0, 0.2);
+        }
+
+        .model-card h3 {
+            font-size: 1.5rem;
+            color: #ffffff;
+            margin-bottom: 15px;
+            font-weight: bold;
+        }
+
+        .model-card p {
+            font-size: 1rem;
+            color: #ffffff;
+            line-height: 1.6;
+            padding: 0 10px;
+        }
+
+        .model-card::before {
+            content: '';
+            position: absolute;
+            top: -50%;
+            left: -50%;
+            width: 200%;
+            height: 200%;
+            background: radial-gradient(circle, rgba(0, 123, 255, 0.1), transparent 70%);
+            z-index: 0;
+            transform: scale(0);
+            transition: transform 0.4s ease;
+        }
+
+        .model-card:hover::before {
+            transform: scale(1);
+        }
+
+        @media screen and (max-width: 768px) {
+            .model-card {
+                width: 90%;
+            }
+        }
+    </style>
+</head>
+<body>
+    <header class="navbar">
+        <div class="logo">
+            <img src="static/css/Blue_ABstract_Brain_Technology_Logo__1_-removebg-preview.png" alt="MedGAN Logo">
+            <span>MedGAN Studio</span>
+        </div>
+        <nav>
+            <ul>
+                <li><a href="/">Home</a></li>
+                <li><a href="{{ url_for('generate_info') }}">Generate</a></li>
+                <li><a href="{{ url_for('detect_info') }}">Detect</a></li>
+                <li><a href="{{ url_for('about_us') }}">About Us</a></li>
+                <li><a href="{{ url_for('contact') }}">Contact</a></li>
+                
+            </ul>
+        </nav>
+    </header>
+
+    <!-- Hero Section -->
+    <section class="hero" id="home">
+        <div class="container">
+            <h1>AI-Powered Medical Imaging</h1>
+            <p>Transform your research with advanced AI-generated medical images that are fast reliable and cutting-edge technology.</p>
+            <a href="{{ url_for('generate_info') }}" class="btn-primary">Generate Images</a>
+        </div>
+    </section>
+
+    <!-- About Section -->
+    <section class="about" id="about">
+        <div class="container">
+            <h2>Why Choose MedGAN Studio?</h2>
+            <p>MedGAN Studio is a platform built for researchers and medical professionals to leverage AI technology for generating brain tumor images.</p>
+            <div class="features-grid">
+                <div class="feature-card">
+                    <h3>High Accuracy</h3>
+                    <p>Our models deliver ultra-realistic images with unparalleled accuracy for your research needs.</p>
+                </div>
+                <div class="feature-card">
+                    <h3>Fast Processing</h3>
+                    <p>Generate images in seconds with our highly optimized platform.</p>
+                </div>
+                <div class="feature-card">
+                    <h3>Custom Solutions</h3>
+                    <p>Scale your image generation from small projects to large datasets effortlessly.</p>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Models Section -->
+    <section class="models" id="models">
+        <div class="container">
+            <h2>Our Models</h2>
+            <p>Explore the advanced GAN architectures we utilize to generate medical images with exceptional quality and precision.</p>
+            <div class="models-grid">
+                <div class="model-card">
+                    <h3>Progressive GANs</h3>
+                    <p>Enables high-quality image synthesis by progressively growing the generator and discriminator networks.</p>
+                </div>
+                <div class="model-card">
+                    <h3>DCGANs</h3>
+                    <p>Deep Convolutional GANs leverage convolutional layers for generating realistic medical images efficiently.</p>
+                </div>
+                <div class="model-card">
+                    <h3>StyleGAN2</h3>
+                    <p>State-of-the-art GAN architecture offering unprecedented control over image style and quality.</p>
+                </div>
+                <div class="model-card">
+                    <h3>WGANs</h3>
+                    <p>Wasserstein GANs optimize stability and improve training dynamics for generating sharp and stable images.</p>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <footer class="footer" id="contact">
+        <div class="container">
+            <p>&copy; 2024 MedGAN Studio. All Rights Reserved.</p>
+            <div class="footer-links">
+                    <a href="mailto:[email protected]">Email Us</a>
+                    <a href="https://instagram.com/medgan"target="_blank">Instagram</a>
+                    <a href="https://www.linkedin.com/company/medgan/" target="_blank">LinkedIn</a>
+            </div>
+        </div>
+    </footer>
+</body>
+</html>

templates/results-detect.html

@@ -0,0 +1,120 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Detection Results</title>
+    <link rel="icon" type="image/png" href="static/css/Blue_ABstract_Brain_Technology_Logo__1_-removebg-preview.png">
+    <link rel="stylesheet" href="/static/css/style.css">
+    <style>
+        .results-section {
+            text-align: center;
+            padding: 60px 20px;
+            background: linear-gradient(135deg, #ffffff, #f8f9fa);
+            border-radius: 20px;
+            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
+            margin: 50px auto;
+            max-width: 900px;
+        }
+
+        .results-section h2 {
+            font-size: 2.5rem;
+            color: #007BFF;
+            margin-bottom: 20px;
+        }
+
+        .results-section p {
+            font-size: 1.2rem;
+            color: #555;
+            margin-bottom: 30px;
+        }
+
+        .image-container {
+            display: flex;
+            justify-content: center;
+            flex-wrap: wrap;
+            gap: 20px;
+        }
+
+        .image-card {
+            background: #ffffff;
+            border-radius: 15px;
+            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
+            overflow: hidden;
+            transition: transform 0.3s ease, box-shadow 0.3s ease;
+        }
+
+        .image-card img {
+            width: 100%;
+            height: auto;
+        }
+
+        .image-card:hover {
+            transform: scale(1.05);
+            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
+        }
+
+        .btn-primary {
+            background: linear-gradient(135deg, #007BFF, #0056b3);
+            color: white;
+            padding: 12px 30px;
+            border-radius: 25px;
+            font-size: 1.2rem;
+            font-weight: bold;
+            text-transform: uppercase;
+            text-decoration: none;
+            cursor: pointer;
+            transition: all 0.3s ease-in-out;
+            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
+            margin-top: 30px;
+        }
+
+        .btn-primary:hover {
+            background: linear-gradient(135deg, #0056b3, #003f7f);
+            transform: translateY(-3px);
+        }
+    </style>
+</head>
+<body>
+    <header class="navbar">
+        <div class="logo">
+            <img src="static/css/Blue_ABstract_Brain_Technology_Logo__1_-removebg-preview.png" alt="MedGAN Logo">
+            <span>MedGAN Studio</span>
+        </div>
+        <nav>
+            <ul>
+                <li><a href="/">Home</a></li>
+                <li><a href="{{ url_for('generate_info') }}">Generate</a></li>
+                <li><a href="{{ url_for('detect_info') }}">Detect</a></li>
+                <li><a href="{{ url_for('about_us') }}">About Us</a></li>
+                <li><a href="{{ url_for('contact') }}">Contact</a></li>
+            </ul>
+        </nav>
+    </header>
+
+    <!-- Results Section -->
+    <section class="results-section">
+        <h2>Detection Results</h2>
+        <p>Predicted Tumor Type: <strong>{{ result }}</strong></p>
+        <div class="image-container">
+            {% for image in images %}
+                <div class="image-card">
+                    <img src="{{ url_for('static', filename=image) }}" alt="Uploaded Image">
+                </div>
+            {% endfor %}
+        </div>
+        <a href="{{ url_for('detect_info') }}" class="btn-primary">Analyze Another Image</a>
+    </section>
+
+    <footer class="footer">
+        <div class="container">
+            <p>&copy; 2024 MedGAN Studio. All Rights Reserved.</p>
+            <div class="footer-links">
+                    <a href="mailto:[email protected]">Email Us</a>
+                    <a href="https://instagram.com/medgan"target="_blank">Instagram</a>
+                    <a href="https://www.linkedin.com/company/medgan/" target="_blank">LinkedIn</a>
+            </div>
+        </div>
+    </footer>
+</body>
+</html>

templates/results.html

@@ -0,0 +1,65 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Generated Images</title>
+    <link rel="icon" type="image/png" href="static/css/Blue_ABstract_Brain_Technology_Logo__1_-removebg-preview.png">
+    <link rel="stylesheet" href="/static/css/style.css">
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&display=swap" rel="stylesheet">
+</head>
+<body>
+    <header class="navbar">
+        <div class="logo">
+            <img src="static/css/Blue_ABstract_Brain_Technology_Logo__1_-removebg-preview.png" alt="MedGAN Logo">
+            <span>MedGAN Studio</span>
+        </div>
+        <nav>
+            <ul>
+                <li><a href="/">Home</a></li>
+                <li><a href="{{ url_for('generate_info') }}">Generate</a></li>
+                <li><a href="{{ url_for('detect_info') }}">Detect</a></li>
+                <li><a href="{{ url_for('about_us') }}">About Us</a></li>
+                <li><a href="{{ url_for('contact') }}">Contact</a></li>
+            </ul>
+        </nav>
+    </header>
+
+    <!-- Results Section -->
+    <section class="results">
+        <div class="container">
+            <h1>Your AI-Generated Images</h1>
+            <p>View, download individual images, or download all images as a ZIP file below.</p>
+            
+            <!-- Gallery -->
+            <div class="gallery">
+                {% for image in images %}
+                    <div class="image-card">
+                        <img src="data:image/png;base64,{{ image }}" alt="Generated Image">
+                        <a href="data:image/png;base64,{{ image }}" download="Generated_Image.png" class="btn-secondary">Download</a>
+                    </div>
+                {% endfor %}
+            </div>
+
+            <!-- ZIP Download -->
+            <div class="zip-download">
+                <a href="{{ url_for('download_zip') }}" class="btn-primary">Download All as ZIP</a>
+            </div>
+            
+            <a href="{{ url_for('generate_info') }}" class="btn-primary">Generate More Images</a>
+        </div>
+    </section>
+
+    <!-- Footer -->
+    <footer class="footer" id="contact">
+        <div class="container">
+            <p>&copy; 2024 MedGAN Studio. All Rights Reserved.</p>
+            <div class="footer-links">
+                <a href="mailto:[email protected]">Email Us</a> |
+                <a href="https://instagram.com/medgan" target="_blank">Instagram</a> |
+                <a href="https://www.linkedin.com/company/medgan/" target="_blank">LinkedIn</a>
+            </div>
+        </div>
+    </footer>
+</body>
+</html>