# pyWebLayout HTML Browser

A simple HTML browser built using the pyWebLayout library components from `pyWebLayout/io/` and `pyWebLayout/concrete/`.

## Features

This browser demonstrates the capabilities of pyWebLayout by implementing:

### Rendering Components
- **Text rendering** with various formatting (bold, italic, underline)
- **Headers** (H1-H6) with proper sizing and styling
- **Links** (clickable, with external browser opening for external URLs)
- **Images** (local files and web URLs with error handling)
- **Layout containers** for proper element positioning
- **Basic HTML parsing** and element conversion

### User Interface
- **Navigation controls**: Back, Forward, Refresh buttons
- **Address bar**: Enter URLs or file paths
- **File browser**: Open local HTML files
- **Scrollable content area** with both vertical and horizontal scrollbars
- **Mouse interaction**: Clickable links with hover effects
- **Status bar**: Shows current operation status

## Usage

### Starting the Browser
```bash
python html_browser.py
```

### Loading Content

1. **Load the test page**: The browser starts with a welcome page showing various features
2. **Open local files**: Click "Open File" to browse and select HTML files
3. **Enter URLs**: Type URLs in the address bar and press Enter or click "Go"
4. **Navigate**: Use back/forward buttons to navigate through history

### Test Files

- `test_page.html` - A comprehensive test page demonstrating all supported features including:
  - Text formatting (bold, italic, underline)
  - Headers of all levels (H1-H6)
  - Links (both internal and external)
  - Images (includes the sample image from tests/data/)
  - Line breaks and paragraphs

## Architecture

### HTML Parser (`HTMLParser` class)
- Simple regex-based HTML tokenizer
- Converts HTML elements to pyWebLayout abstract objects
- Handles font styling with a font stack for nested formatting
- Supports basic HTML tags: h1-h6, b, strong, i, em, u, a, img, br, p, div, span

### Browser Window (`BrowserWindow` class)
- Tkinter-based GUI with navigation controls
- Canvas-based rendering of pyWebLayout Page objects
- Mouse event handling for interactive elements
- Navigation history management
- File and URL loading capabilities

### pyWebLayout Integration

The browser uses these pyWebLayout components:

#### From `pyWebLayout/concrete/`:
- `Page` - Top-level container for web page content
- `Container` - Layout management for multiple elements
- `Box` - Basic rectangular container with positioning
- `Text` - Text rendering with font styling
- `RenderableImage` - Image loading and display with scaling
- `RenderableLink` - Interactive link elements
- `RenderableButton` - Interactive button elements

#### From `pyWebLayout/abstract/`:
- `Link` - Abstract link representation with types (internal, external, API, function)
- `Image` - Abstract image representation with dimensions and loading
- Font and styling classes for text appearance

#### From `pyWebLayout/style/`:
- `Font` - Font management with size, weight, style, and decoration
- `FontWeight`, `FontStyle`, `TextDecoration` - Typography enums
- `Alignment` - Layout positioning options

## Supported HTML Features

### Text Elements
- `<h1>` to `<h6>` - Headers with appropriate sizing
- `<p>` - Paragraphs with spacing
- `<b>`, `<strong>` - Bold text
- `<i>`, `<em>` - Italic text
- `<u>` - Underlined text
- `<br>` - Line breaks

### Interactive Elements
- `<a href="...">` - Links (opens external URLs in system browser)

### Media Elements
- `<img src="..." alt="..." width="..." height="...">` - Images with scaling

### Container Elements
- `<div>`, `<span>` - Generic containers (parsed but not specially styled)

## Example Usage

```python
# Start the browser
from html_browser import BrowserWindow

browser = BrowserWindow()
browser.run()
```

## Limitations

This is a demonstration browser with simplified HTML parsing:
- No CSS support (styling is done through pyWebLayout components)
- No JavaScript execution
- Limited HTML tag support
- No form submission (forms can be rendered but not submitted)
- No advanced layout features (flexbox, grid, etc.)

## Dependencies

- `tkinter` - GUI framework (usually included with Python)
- `PIL` (Pillow) - Image processing
- `requests` - HTTP requests for web URLs
- `pyWebLayout` - The core layout and rendering library

## Testing

Load `test_page.html` to see all supported features in action:
1. Run the browser: `python html_browser.py`
2. Click "Open File" and select `test_page.html`
3. Explore the different text formatting, links, and image rendering

The test page includes:
- Various header levels
- Text formatting examples
- Clickable links (try the Google link!)
- A sample image from the test data
- Mixed content demonstrations