from pathlib import Path

# Get the directory where this script is currently running
current_dir = Path(__file__).parent if "__file__" in locals() else Path.cwd()
output_file = current_dir / "photo_album.html"

# Supported image extensions
valid_extensions = {".jpg", ".jpeg", ".png", ".webp", ".gif", ".bmp"}

with open(output_file, "w", encoding="utf-8") as html_file:
    # HTML setup with grid styling and a zoom effect on hover
    html_file.write("""<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Photo Album</title>
    <style>
        body { font-family: sans-serif; background-color: #f4f4f4; margin: 20px; }
        .album-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 20px; }
        .photo-card { background: white; padding: 10px; border-radius: 8px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); text-align: center; }
        .photo-card img { max-width: 100%; height: 200px; object-fit: cover; border-radius: 4px; transition: transform 0.2s; }
        /* Slight zoom effect to let users know the image is clickable */
        .photo-card img:hover { transform: scale(1.03); }
        .photo-title { margin-top: 10px; font-size: 14px; color: #333; word-break: break-all; }
    </style>
</head>
<body>
    <h1>My Photo Album</h1>
    <p style="color: #666; margin-bottom: 20px;">Click any image to view it full size in a new window.</p>
    <div class="album-grid">
""")

    # Loop through the files in the current folder
    for f in current_dir.iterdir():
        if f.is_file() and f.suffix.lower() in valid_extensions:
            # The <a> tag wraps the <img> tag. target="_blank" opens it in a new window.
            img_tag = f"""        <div class="photo-card">
            <a href="{f.name}" target="_blank">
                <img src="{f.name}" alt="{f.stem}">
            </a>
            <div class="photo-title">{f.name}</div>
        </div>\n"""
            html_file.write(img_tag)

    html_file.write("""    </div>
</body>
</html>""")

print(f"Success! Created '{output_file.name}' with clickable images.")