Here's a single-file HTML demo of a bouncing ball inside a rotating hexagon. The ball bounces off the hexagon's edges, and the hexagon rotates continuously. The code uses HTML5 Canvas and JavaScript for rendering and animation.
```html
Bouncing Ball in Rotating Hexagon
```
### Features:
- **Rotating Hexagon**: The hexagon rotates continuously around its center.
- **Bouncing Ball**: The ball moves with a velocity and bounces off the hexagon's edges.
- **Collision Detection**: The ball reverses direction when it hits the hexagon's boundary using vector reflection.
### How It Works:
1. **Canvas Setup**: A full-screen canvas is created.
2. **Hexagon Drawing**: A regular hexagon is drawn with six points calculated using trigonometric functions.
3. **Ball Movement**: The ball's position is updated every frame.
4. **Collision Detection**: The distance from the ball to the hexagon's center is compared to the apothem (distance from center to edge). If the ball is outside, its velocity is reflected.
5. **Rotation**: The hexagon rotates by incrementing the `rotationAngle` in each frame.
This demo is a simple approximation of a bouncing ball inside a rotating hexagon, using basic physics and trigonometry.