feat: animated condition effects based on current weather#30
Conversation
There was a problem hiding this comment.
Pull request overview
This PR adds animated weather condition effects to the card, providing visual feedback that responds dynamically to current weather conditions. The feature includes effects for rain, snow, lightning, sun, moon, and sky backgrounds with configurable granularity.
Key changes include:
- New animation provider component with six distinct weather effects (rain, snow, lightning, sun, moon, sky)
- Configuration option to enable all effects or selectively enable specific ones
- Theme-aware styling with dark/light mode support and wind-based animation adjustments
- Comprehensive test coverage for animation rendering logic
Reviewed changes
Copilot reviewed 13 out of 13 changed files in this pull request and generated 12 comments.
Show a summary per file
| File | Description |
|---|---|
test/weather-forecast-card-animations.test.ts |
Comprehensive test suite covering all weather effects and configuration scenarios |
test/mocks/hass.ts |
Enhanced MockHass to support theme mode and custom weather conditions for testing |
test/app/index.html |
Updated test application with animation demos and theme toggle functionality |
src/weather-forecast-card.ts |
Integrated animation provider component into main card |
src/weather-forecast-card.css |
Added positioning context for absolute-positioned animations |
src/types.ts |
Defined weather effect types and extended HomeAssistant interface for theme support |
src/editor/weather-forecast-card-editor.ts |
Added UI controls for configuring condition effects with multi-select support |
src/data/weather.ts |
Implemented wind speed normalization utilities for realistic animation physics |
src/components/animation/wfc-animation-provider.ts |
Core animation component with effect rendering and intensity calculations |
src/components/animation/wfc-animation.styles.ts |
Style wrapper for CSS animation definitions |
src/components/animation/wfc-animation.css |
Comprehensive CSS animations with keyframes for all weather effects |
demo/index.html |
Enhanced demo page with theme toggle and condition rotation showcase |
README.md |
Documented weather condition effects feature with configuration examples |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> Signed-off-by: Tero Roininen <troinine@users.noreply.github.com>
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 13 out of 13 changed files in this pull request and generated 7 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 13 out of 13 changed files in this pull request and generated 3 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> Signed-off-by: Tero Roininen <troinine@users.noreply.github.com>
No description provided.