Add Piano Hero rhythm game with song library and scoring

README.md

@@ -1,22 +1,34 @@
-# 🌸 Multilingual Calendar 2026
+# 🌸 Multilingual Calendar 2026 | 多语言日历 2026 | 다국어 달력 2026
 
-[![Deploy to GitHub Pages](https://github.com/mrfeixiang/2026/actions/workflows/deploy.yml/badge.svg)](https://github.com/mrfeixiang/2026/actions/workflows/deploy.yml)
-[![Live Demo](https://img.shields.io/badge/Live%20Demo-GitHub%20Pages-blue)](https://mrfeixiang.github.io/2026/)
+## Piano Hero
 
-A beautiful, interactive calendar application that combines date management with language learning features for English and Chinese, enhanced with stunning Portuguese flower imagery for each month.
+Play: https://mrfeixiang.github.io/piano-hero/
 
-## 🚀 [**Live Demo →**](https://mrfeixiang.github.io/2026/)
+A Guitar Hero-style piano game in the browser. Press keyboard keys when falling notes hit the bottom to score points.
 
-## ✨ Features
+- Free Play: improvise freely with any key
+- Practice Songs: Twinkle Twinkle, Ode to Joy, Happy Birthday, and more
+- Scoring: Perfect / Good hits build combos and multiply your score
+- Controls: A S D F G H J K = white keys C-C5, W E T Y U = black keys
 
-### 🗓️ Calendar Functionality
+---
+
+## 🇬🇧 English
+
+A beautiful, interactive calendar application for 2026 that combines date management with language learning features for English and Chinese, enhanced with stunning Portuguese flower imagery for each month.
+
+### 🚀 [Live Demo →](https://mrfeixiang.github.io/2026/)
+
+### ✨ Features
+
+#### 🗓️ Calendar Functionality
 - Complete 2026 calendar with intuitive navigation
 - Current date highlighting and weekend distinction
 - Responsive design that works on all devices
 - Smooth month-to-month transitions
 - Keyboard navigation support (arrow keys)
 
-### 🌺 Portuguese Flowers
+#### 🌺 Portuguese Flowers
 Each month features a beautiful Portuguese flower with names in three languages:
 
 | Month | Portuguese | English | Chinese | Seasonal Theme |
@@ -34,105 +46,179 @@ Each month features a beautiful Portuguese flower with names in three languages:
 | November | Ciclâmen | Cyclamen | 仙客来 | Late autumn beauty |
 | December | Bico-de-papagaio | Poinsettia | 一品红 | Holiday celebration |
 
-## 🎯 Language Learning Features
-
-### 📚 English Learning
-- Daily quotes and vocabulary explanations
-- Pronunciation guides for month names
-- Flower-related idioms and expressions
-- Grammar tips for time expressions
-- Fun facts across multiple categories (history, science, culture, nature)
-
-### 🈳 Chinese Learning
-- Chinese characters for dates and numbers
-- Month names in simplified and traditional characters
-- Weekday names with pinyin pronunciation
+#### 📚 Language Learning
+- Daily English quotes, vocabulary, idioms, and grammar tips
+- Chinese characters for dates, weekdays, and month names with pinyin
 - Cultural information about Chinese holidays and festivals
-- Traditional greetings and customs
 
-### 🏮 Chinese Holidays 2026
-- **New Year's Day**: January 1-3
-- **Spring Festival** (Year of Fire Horse): February 17-25 (Golden Week)
-- **Tomb-Sweeping Day**: April 5-6
-- **Labor Day**: May 1-2
+#### 🏮 Chinese Holidays 2026
+- **New Year's Day**: January 1–3
+- **Spring Festival** (Year of Fire Horse): February 17–25
+- **Tomb-Sweeping Day**: April 5–6
+- **Labor Day**: May 1–2
 - **Dragon Boat Festival**: June 19
 - **Mid-Autumn Festival**: September 25
-- **National Day**: October 1-7 (Golden Week)
-
-## 🛠️ Technical Features
-
-- **Pure Vanilla JS**: No external dependencies for maximum performance
-- **Responsive Design**: Perfect on desktop, tablet, and mobile devices
-- **Accessibility**: Full ARIA labels, keyboard navigation, and screen reader support
-- **Performance Optimized**: <50ms calendar generation, lazy loading, preloading
-- **Error Handling**: Graceful fallbacks and comprehensive error recovery
-- **Comprehensive Testing**: 30+ automated tests covering all functionality
-
-## 🧪 Testing
-
-The application includes a comprehensive test suite:
-
-- **Integration Tests**: Core functionality validation
-- **Unit Tests**: Individual component testing  
-- **Performance Tests**: Speed and efficiency validation
-- **Accessibility Tests**: ARIA labels and keyboard navigation
-- **Error Handling Tests**: Edge cases and invalid inputs
+- **National Day**: October 1–7
+
+#### 🛠️ Technical
+- Pure Vanilla JS — no external dependencies
+- Fully responsive (desktop, tablet, mobile)
+- WCAG 2.1 AA accessible (ARIA labels, keyboard navigation)
+- <50ms calendar generation
+- 30+ automated tests
+
+#### 🚀 Quick Start
+```bash
+git clone https://github.com/mrfeixiang/2026.git
+cd 2026
+python3 -m http.server 8000
+# Open http://localhost:8000
+```
+
+#### 📱 Browser Support
+Chrome · Firefox · Safari · Edge · iOS Safari · Chrome Mobile
 
-Run tests by opening any of these files:
-- `test-integration.html` - Basic integration tests
-- `comprehensive-test.html` - Full test suite
-- `final-test-report.html` - Professional test report
-
-## 🎨 Design Philosophy
-
-This calendar combines functionality with beauty, creating an immersive experience that makes learning enjoyable. The Portuguese flowers add natural elegance while multilingual features provide practical language learning opportunities in a culturally rich context.
-
-## 📱 Browser Support
-
-- ✅ Chrome (recommended)
-- ✅ Firefox  
-- ✅ Safari
-- ✅ Edge
-- ✅ Mobile browsers (iOS Safari, Chrome Mobile)
-
-## 🚀 Quick Start
-
-1. **Visit the live demo**: [https://mrfeixiang.github.io/2026/](https://mrfeixiang.github.io/2026/)
-2. **Or run locally**:
-   ```bash
-   git clone https://github.com/mrfeixiang/2026.git
-   cd 2026
-   python3 -m http.server 8000
-   # Open http://localhost:8000
-   ```
-
-## 🔧 Development
-
-Built with modern web standards:
-- **HTML5**: Semantic structure with accessibility features
-- **CSS3**: Flexbox/Grid layouts, custom properties, animations
-- **ES6+ JavaScript**: Classes, modules, async/await, modern APIs
-- **Progressive Enhancement**: Works without JavaScript for basic functionality
+---
 
-## 📊 Project Stats
+## 🇨🇳 中文
+
+一款精美的 2026 年互动日历应用，将日期管理与英语、中文语言学习相结合，并为每个月配以精美的葡萄牙花卉图像。
+
+### 🚀 [在线演示 →](https://mrfeixiang.github.io/2026/)
+
+### ✨ 功能特色
+
+#### 🗓️ 日历功能
+- 完整的 2026 年日历，支持直观导航
+- 当前日期高亮显示，区分工作日与周末
+- 响应式设计，适配所有设备
+- 流畅的月份切换过渡效果
+- 支持键盘方向键导航
+
+#### 🌺 葡萄牙花卉
+每个月都展示一种美丽的葡萄牙花卉，并提供三种语言的名称：
+
+| 月份 | 葡萄牙语 | 英语 | 中文 | 季节主题 |
+|------|----------|------|------|----------|
+| 一月 | Camélia | Camellia | 山茶花 | 冬日典雅 |
+| 二月 | Flor de Amendoeira | Almond Blossom | 杏花 | 早春希望 |
+| 三月 | Narciso | Daffodil | 水仙花 | 春日觉醒 |
+| 四月 | Flor de Cerejeira | Cherry Blossom | 樱花 | 焕然新生 |
+| 五月 | Rosa | Rose | 玫瑰 | 葡式园艺 |
+| 六月 | Alfazema | Lavender | 薰衣草 | 夏日芬芳 |
+| 七月 | Girassol | Sunflower | 向日葵 | 夏日阳光 |
+| 八月 | Buganvília | Bougainvillea | 三角梅 | 地中海暖意 |
+| 九月 | Dália | Dahlia | 大丽花 | 秋日丰盈 |
+| 十月 | Crisântemo | Chrysanthemum | 菊花 | 金秋传统 |
+| 十一月 | Ciclâmen | Cyclamen | 仙客来 | 深秋之美 |
+| 十二月 | Bico-de-papagaio | Poinsettia | 一品红 | 节日庆典 |
+
+#### 📚 语言学习功能
+- 每日英语名言、词汇讲解、习语与语法提示
+- 中文日期、星期与月份名称（含拼音）
+- 中国节假日与传统文化介绍
+
+#### 🏮 2026 年中国节假日
+- **元旦**：1月1日–3日
+- **春节**（丙午火马年）：2月17日–25日
+- **清明节**：4月5日–6日
+- **劳动节**：5月1日–2日
+- **端午节**：6月19日
+- **中秋节**：9月25日
+- **国庆节**：10月1日–7日
+
+#### 🛠️ 技术特点
+- 纯原生 JS，无第三方依赖
+- 完全响应式（桌面、平板、手机）
+- 符合 WCAG 2.1 AA 无障碍标准
+- 日历生成速度 <50ms
+- 覆盖 30+ 项自动化测试
+
+#### 🚀 快速开始
+```bash
+git clone https://github.com/mrfeixiang/2026.git
+cd 2026
+python3 -m http.server 8000
+# 打开 http://localhost:8000
+```
 
-- **Lines of Code**: ~1,500 (HTML/CSS/JS)
-- **Test Coverage**: 30+ comprehensive tests
-- **Performance**: <50ms calendar generation
-- **Accessibility**: WCAG 2.1 AA compliant
-- **Languages**: 3 (Portuguese, English, Chinese)
-- **Flowers**: 12 unique Portuguese flowers
+---
 
-## 🤝 Contributing
+## 🇰🇷 한국어
+
+2026년을 위한 아름다운 인터랙티브 달력 앱으로, 날짜 관리와 영어·중국어 언어 학습 기능을 결합하고 매달 포르투갈 꽃 이미지로 꾸며진 앱입니다.
+
+### 🚀 [라이브 데모 →](https://mrfeixiang.github.io/2026/)
+
+### ✨ 주요 기능
+
+#### 🗓️ 달력 기능
+- 직관적인 탐색이 가능한 완전한 2026년 달력
+- 오늘 날짜 강조 표시 및 주말 구분
+- 모든 기기에서 작동하는 반응형 디자인
+- 부드러운 월간 전환 효과
+- 키보드 방향키 탐색 지원
+
+#### 🌺 포르투갈 꽃
+매달 아름다운 포르투갈 꽃을 3개 언어 이름과 함께 소개합니다:
+
+| 월 | 포르투갈어 | 영어 | 중국어 | 계절 테마 |
+|----|-----------|------|--------|----------|
+| 1월 | Camélia | Camellia | 山茶花 | 겨울의 우아함 |
+| 2월 | Flor de Amendoeira | Almond Blossom | 杏花 | 이른 봄의 희망 |
+| 3월 | Narciso | Daffodil | 水仙花 | 봄의 각성 |
+| 4월 | Flor de Cerejeira | Cherry Blossom | 樱花 | 새로운 시작 |
+| 5월 | Rosa | Rose | 玫瑰 | 포르투갈 정원 |
+| 6월 | Alfazema | Lavender | 薰衣草 | 여름의 향기 |
+| 7월 | Girassol | Sunflower | 向日葵 | 여름의 밝음 |
+| 8월 | Buganvília | Bougainvillea | 三角梅 | 지중해의 따뜻함 |
+| 9월 | Dália | Dahlia | 大丽花 | 가을의 풍요 |
+| 10월 | Crisântemo | Chrysanthemum | 菊花 | 가을 전통 |
+| 11월 | Ciclâmen | Cyclamen | 仙客来 | 늦가을의 아름다움 |
+| 12월 | Bico-de-papagaio | Poinsettia | 一品红 | 연말 축제 |
+
+#### 📚 언어 학습 기능
+- 매일 영어 명언, 어휘, 관용어, 문법 팁 제공
+- 날짜·요일·월 이름의 중국어 한자 및 병음
+- 중국 공휴일과 전통 문화 정보
+
+#### 🏮 2026년 중국 공휴일
+- **신정**: 1월 1일–3일
+- **춘절** (병오년): 2월 17일–25일
+- **청명절**: 4월 5일–6일
+- **노동절**: 5월 1일–2일
+- **단오절**: 6월 19일
+- **중추절**: 9월 25일
+- **국경절**: 10월 1일–7일
+
+#### 🛠️ 기술적 특징
+- 순수 바닐라 JS — 외부 의존성 없음
+- 완전 반응형 (데스크톱, 태블릿, 모바일)
+- WCAG 2.1 AA 접근성 준수 (ARIA 레이블, 키보드 탐색)
+- 달력 생성 속도 <50ms
+- 30개 이상의 자동화 테스트
+
+#### 🚀 빠른 시작
+```bash
+git clone https://github.com/mrfeixiang/2026.git
+cd 2026
+python3 -m http.server 8000
+# http://localhost:8000 열기
+```
+
+#### 📱 브라우저 지원
+Chrome · Firefox · Safari · Edge · iOS Safari · Chrome Mobile
 
-Contributions are welcome! Please feel free to submit a Pull Request. For major changes, please open an issue first to discuss what you would like to change.
+---
 
-## 📄 License
+## 📄 License / 许可证 / 라이선스
 
-This project is open source and available under the [MIT License](LICENSE).
+MIT License — open source and free to use.
+MIT 许可证 — 开源免费使用。
+MIT 라이선스 — 오픈 소스, 자유롭게 사용 가능합니다.
 
 ---
 
-**🌸 Enjoy exploring the beautiful intersection of time, language, and nature! 📅🌍**
-
-*Made with ❤️ for language learners and calendar enthusiasts*
+**🌸 Enjoy the beautiful intersection of time, language, and nature!**
+**🌸 享受时间、语言与自然的美丽交汇！**
+**🌸 시간, 언어, 자연이 아름답게 만나는 곳을 즐겨보세요!**

index.html

@@ -85,6 +85,7 @@
         <header class="header">
             <h1>Multilingual Calendar 2026</h1>
             <p class="subtitle">Learn English & Chinese with Portuguese Flowers</p>
+            <a href="https://mrfeixiang.github.io/piano-hero/" class="piano-hero-link" aria-label="Play Piano Hero game">🎹 Play Piano Hero</a>
         </header>
 
         <nav class="calendar-navigation" role="navigation" aria-label="Calendar navigation">