AelitaAstroFinance

AelitaAstroFinance — випуск археофутуристичного вебчасопису "ЕНЕРГОБРАМА", що живить марсіянські колонії Української Самостійної Соборної Держави електроенергією зірок і гривнею, в обмін на іноземні валюти та дорогоцінні метали. Натхненний "Аелітою" Олексія Толстого, яку автор прочитав автором у шкільному віці, проєкт поєднує космічні зображення, фінансові дані та марсіянський вайб.

Що це?

• Космос: щоденні зображення від NASA APOD для натхнення в роботі.
• Гроші: курси валют і облікові ціни на метали від НБУ для космічної економіки.
• Атмосфера: "Місячна соната" Бетховена для не марсіянських, а земних ночей.
• Дизайн: футуристичні шрифти (Orbitron, Tektur), анімації та ефект скла.

Per aspera ad astra, per aurum ad potentiam!

Технології

• HTML5, CSS3, JS (ES6+): адаптивний інтерфейс із анімаціями.
• Axios: запити до API космічної агенції уряду З'єднаних Стейтів Америки.
• fetch: запити до API Національного банку України.
• API: NASA APOD, НБУ.
• Аудіо: Beethoven.

Перейдіть на GitHub Pages

Функції

• APOD: дивіться астрономічне зображення дня, завантажуйте у високій якості.
• Курси: перевіряйте курси валют та ціни металів за будь-яку дату.
• Музика: увімкніть "Місячну сонату" для єднання з Космосом.
• Календар: обирайте дату для історичних даних.
• Ефекти: пилові бурі, неонові тіні, сповіщення.

Використання

1. Відкриття сторінки:

   • Після запуску сторінка автоматично завантажує астрономічне зображення дня та актуальні курси валют/металів.
   • Фонове зображення встановлюється з NASA APOD (якщо це зображення, а не відео).

2. Інтерактивні елементи:

   • Кнопка "Згорнути/Розгорнути": ховає або показує основний контейнер.
   • Календар: оберіть дату для перегляду історичних курсів валют.
   • Кнопка "Per aspera ad astra": показує/ховає опис астрономічного зображення.
   • Кнопка "Заграти Бетховена": відтворює "Місячну сонату".
   • Кнопка "Стягнути APOD HD": відкриває або завантажує зображення дня у високій якості.

3. Обробка помилок:

   • У разі проблем із API (таймаут, ліміт запитів, відсутність даних) відображаються стилізовані сповіщення.

Структура проєкту

AelitaAstroFinance/
├── css/
│   ├── style.css        # Основні стилі
│   ├── homework.css     # Додаткові стилі з домашніх завдань
├── js/
│   ├── app.js           # Основна логіка (API-запити, обробники подій)
├── index.html           # Головна сторінка
├── README.md            # Опис проєкту
└── site.webmanifest     # Маніфест для PWA

Автор

Руслан Качуровський | GitHub: Ruthenus | Ruthenus's gists | Комп'ютерна Академія "ШАГ"

Збудуймо енергосистему Марса разом!