# Wafer Map Pro

Wafer Map Pro is a modern, web-based tool designed for the visualization and interactive editing of semiconductor wafer maps. Built with a Python Flask backend and a dynamic HTML5 Canvas frontend, it provides a fluid and intuitive user experience for engineers and technicians working with wafer data.
---

## ✨ Features

- **Interactive Canvas Renderer**: The wafer map is rendered on an HTML5 Canvas, allowing for smooth and efficient handling of large datasets.
- **Dynamic Pan & Zoom**: Effortlessly navigate the wafer map by clicking and dragging to pan, and using the mouse wheel to zoom in on areas of interest.
- **Advanced Selection Tools**:
  - **Single Die**: Click to select a single die.
  - **Multi-Select**: Hold `Ctrl` while clicking to select multiple, non-contiguous dies.
  - **Region/Box Select**: Hold `Shift` and drag the mouse to select a rectangular area of dies.
- **Bin Code Editing**: Instantly change the bin code (`Good`, `NG`, `Dummy`, `Ignore`) of any selected die or region.
- **Map Transformation**: Rotate the entire wafer map 90 degrees clockwise with a single click.
- **Real-Time Data Analysis**: A persistent display shows the live count of each bin code, updating automatically after every edit.
- **File Handling**:
  - Upload wafer maps from simple `.txt` files.
  - Download the edited wafer map, preserving its structure.
- **Modern UI/UX**:
  - A sleek dark mode theme reduces eye strain.
  - A professional sidebar layout keeps controls organized and the map view unobstructed.
  - Smooth animations and transitions provide a polished user experience.

---

## 🛠️ Tech Stack

- **Backend**:
  - **Python 3**
  - **Flask**: A lightweight web framework for serving the application and handling API requests.
  - **NumPy**: Used for efficient numerical operations and array manipulations (e.g., map rotation).
- **Frontend**:
  - **HTML5**
  - **CSS3**: For modern styling, animations, and the dark theme.
  - **JavaScript (Vanilla)**: Powers all the client-side interactivity, including the canvas rendering engine, event handling, and API communication.

---

## 🚀 Getting Started

Follow these instructions to get a copy of the project up and running on your local machine.

### Prerequisites

- Python 3.6 or higher
- pip (Python package installer)

### Installation

1.  **Clone the repository to your local machine:**
    ```bash
    git clone https://github.com/your-username/wafer-map-pro.git
    cd wafer-map-pro
    ```

2.  **Create and activate a virtual environment (recommended):**
    ```bash
    # For Windows
    python -m venv venv
    .\venv\Scripts\activate

    # For macOS/Linux
    python3 -m venv venv
    source venv/bin/activate
    ```

3.  **Install the required Python packages:**
    ```bash
    pip install -r requirements.txt
    ```

4.  **Run the Flask application:**
    ```bash
    python app.py
    ```

5.  **Open your web browser** and navigate to the following address:
    [http://127.0.0.1:5000](http://127.0.0.1:5000)

---

## 📖 How to Use

1.  **Step 1: Upload File**
    - Click the file input area or drag and drop a `.txt` file containing your wafer map data.
    - Click "Upload & Analyze".

2.  **Step 2: Define Bin Codes**
    - The application will automatically detect all unique characters in your file.
    - For each character, use the dropdown menu to assign its corresponding bin type (`Good`, `NG`, `Dummy`, or `Ignore`).
    - Click "Generate Map".

3.  **Step 3: Interact and Edit**
    - Your wafer map will be displayed in the main view.
    - Use the controls to **Pan**, **Zoom**, **Select**, **Edit**, and **Rotate** the map.
    - The bin code counts will update in real-time.
    - The hint `Pro-tip: Hold Shift and drag to select a region.` is provided for quick reference.

4.  **Step 4: Download**
    - Once you have finished editing, click the "Download .txt" button to save your work. A new text file with the updated map will be downloaded.

---

### Expected `.txt` File Format

The application expects a simple text file where each character represents a die. Spacing is used to separate dies. The parser is designed to handle non-uniform rows and columns gracefully.

**Example:**

```
  1111
 112211
11222211
11222211
 112211
  1111
```