diff --git a/index.html b/index.html index e0e9cae..1c11ed4 100644 --- a/index.html +++ b/index.html @@ -24,11 +24,20 @@ FILMORA - - 🇷🇺 RU - 🇺🇸 EN - 🇰🇿 KZ - + + + 🇷🇺 + RU + + + 🇺🇸 + EN + + + 🇰🇿 + KZ + + ❤️ diff --git a/script.js b/script.js index 87e3452..f497671 100644 --- a/script.js +++ b/script.js @@ -212,7 +212,8 @@ const MOVIES = [ genres: ["crime", "drama"], moods: ["think", "drive"], description: "Крёстный отец — драма о мафиозной семье Корлеоне. История о власти, семье и предательстве в мире организованной преступности.", - poster: "https://image.tmdb.org/t/p/w500/3bhkrj58Vtu7enYsRolD1fZdja1.jpg" + poster: "https://image.tmdb.org/t/p/w500/3bhkrj58Vtu7enYsRolD1fZdja1.jpg", + streaming: [{ name: "HBO Max", icon: "🎬", url: "https://www.hbomax.com" }, { name: "Ivi", icon: "📺", url: "https://www.ivi.ru" }] }, { id: 3, @@ -224,7 +225,8 @@ const MOVIES = [ genres: ["action", "crime", "drama"], moods: ["drive", "think"], description: "Бэтмен поднимает ставки в войне с криминалом. С помощью лейтенанта Джима Гордона и прокурора Харви Дента он намерен очистить улицы от преступности.", - poster: "https://image.tmdb.org/t/p/w500/qJ2tW6WMUDux911r6m7haRef0WH.jpg" + poster: "https://image.tmdb.org/t/p/w500/qJ2tW6WMUDux911r6m7haRef0WH.jpg", + streaming: [{ name: "Amazon Prime", icon: "📦", url: "https://www.primevideo.com" }, { name: "Okko", icon: "🎪", url: "https://okko.tv" }] }, { id: 4, @@ -236,7 +238,8 @@ const MOVIES = [ genres: ["scifi", "action", "thriller"], moods: ["think", "drive", "unusual"], description: "Кобб — талантливый вор, лучший в опасном искусстве извлечения секретов подсознания во время сна. Он получает шанс начать всё заново.", - poster: "https://image.tmdb.org/t/p/w500/9gk7adHYeDvHkCSEqAvQNLV5Uge.jpg" + poster: "https://image.tmdb.org/t/p/w500/9gk7adHYeDvHkCSEqAvQNLV5Uge.jpg", + streaming: [{ name: "Disney+", icon: "🏰", url: "https://www.disneyplus.com" }, { name: "Premier", icon: "🎭", url: "https://premier.one" }] }, { id: 5, @@ -248,7 +251,8 @@ const MOVIES = [ genres: ["scifi", "drama", "adventure"], moods: ["think", "unusual"], description: "Когда засуха и пыльные бури приводят человечество к продовольственному кризису, бывший пилот НАСА Купер отправляется в миссию через червоточину.", - poster: "https://image.tmdb.org/t/p/w500/gEU2QniL6E8AHtMYfHM159D5xh.jpg" + poster: "https://image.tmdb.org/t/p/w500/gEU2QniL6E8AHtMYfHM159D5xh.jpg", + streaming: [{ name: "Apple TV+", icon: "🍎", url: "https://tv.apple.com" }, { name: "More.tv", icon: "📱", url: "https://more.tv" }] }, { id: 6, @@ -260,7 +264,8 @@ const MOVIES = [ genres: ["crime", "thriller"], moods: ["drive", "unusual", "fun"], description: "Два бандита Винсент Вега и Джулс Винфилд обсуждают свои предпочтения в еде и разница между европейской и американской поп-культурой.", - poster: "https://image.tmdb.org/t/p/w500/d5iIlFn5s0ImszYzBPb8JPIfbXD.jpg" + poster: "https://image.tmdb.org/t/p/w500/d5iIlFn5s0ImszYzBPb8JPIfbXD.jpg", + streaming: [{ name: "YouTube", icon: "▶️", url: "https://www.youtube.com/movies" }] }, { id: 7, @@ -272,7 +277,8 @@ const MOVIES = [ genres: ["drama", "thriller"], moods: ["think", "drive", "unusual"], description: "Сотрудник страховой компании страдает хронической бессонницей и отчаянно пытается вырваться из мучительно скучной жизни.", - poster: "https://image.tmdb.org/t/p/w500/pB8BM7pdSp6B6Ih7QZ4DrQ3PmJK.jpg" + poster: "https://image.tmdb.org/t/p/w500/pB8BM7pdSp6B6Ih7QZ4DrQ3PmJK.jpg", + streaming: [{ name: "Rakuten", icon: "🛒", url: "https://rakuten.tv" }, { name: "Kinopoisk", icon: "🎭", url: "https://www.kinopoisk.ru" }] }, { id: 8, @@ -284,7 +290,8 @@ const MOVIES = [ genres: ["drama", "romance", "comedy"], moods: ["fun", "romance", "sad"], description: "История простого человека с большим сердцем, который становится свидетелем и участником ключевых событий американской истории.", - poster: "https://image.tmdb.org/t/p/w500/arw2vcBveWOVZr6pxd9XTd1TdQa.jpg" + poster: "https://image.tmdb.org/t/p/w500/arw2vcBveWOVZr6pxd9XTd1TdQa.jpg", + streaming: [{ name: "Netflix", icon: "🎬", url: "https://www.netflix.com" }] }, { id: 9, @@ -296,7 +303,8 @@ const MOVIES = [ genres: ["scifi", "action"], moods: ["drive", "think", "unusual"], description: "Хакер Нео узнаёт, что наш мир — это иллюзия, созданная машинами. Он присоединяется к восстанию против машин.", - poster: "https://image.tmdb.org/t/p/w500/f89U3ADr1oiB1s9GkdPOEpXUk5H.jpg" + poster: "https://image.tmdb.org/t/p/w500/f89U3ADr1oiB1s9GkdPOEpXUk5H.jpg", + streaming: [{ name: "Hulu", icon: "🎬", url: "https://www.hulu.com" }, { name: "Ivi", icon: "📺", url: "https://www.ivi.ru" }] }, { id: 10, @@ -308,7 +316,8 @@ const MOVIES = [ genres: ["action", "adventure"], moods: ["drive", "fun"], description: "Три охотника за сокровищами конкурируют в поисках конфедеративного золота во время Гражданской войны в США.", - poster: "https://image.tmdb.org/t/p/w500/bX2xnavhMYjWDoZp1VM6VnU1xwe.jpg" + poster: "https://image.tmdb.org/t/p/w500/bX2xnavhMYjWDoZp1VM6VnU1xwe.jpg", + streaming: [{ name: "Netflix", icon: "🎬", url: "https://www.netflix.com" }, { name: "Kinopoisk", icon: "🎭", url: "https://www.kinopoisk.ru" }] }, { id: 11, @@ -320,7 +329,8 @@ const MOVIES = [ genres: ["fantasy", "adventure", "action"], moods: ["drive", "think"], description: "Фродо и Сэм приближаются к Роковой горе, чтобы уничтожить Кольцо, в то время как Арагорн ведёт битву за Гондор.", - poster: "https://image.tmdb.org/t/p/w500/rCzpDGLbOoPwLjy3OAm5NUPOTrC.jpg" + poster: "https://image.tmdb.org/t/p/w500/rCzpDGLbOoPwLjy3OAm5NUPOTrC.jpg", + streaming: [{ name: "HBO Max", icon: "🎬", url: "https://www.hbomax.com" }, { name: "Ivi", icon: "📺", url: "https://www.ivi.ru" }] }, { id: 12, @@ -332,7 +342,8 @@ const MOVIES = [ genres: ["drama"], moods: ["think", "unusual"], description: "Офисный работник встречает харизматичного продавца мыла и создаёт подпольный бойцовский клуб.", - poster: "https://image.tmdb.org/t/p/w500/pB8BM7pdSp6B6Ih7QZ4DrQ3PmJK.jpg" + poster: "https://image.tmdb.org/t/p/w500/pB8BM7pdSp6B6Ih7QZ4DrQ3PmJK.jpg", + streaming: [{ name: "Amazon Prime", icon: "📦", url: "https://www.primevideo.com" }, { name: "Okko", icon: "🎪", url: "https://okko.tv" }] }, { id: 13, @@ -344,7 +355,8 @@ const MOVIES = [ genres: ["scifi", "adventure", "fantasy"], moods: ["drive", "fun"], description: "Люк Скайуокер начинает обучение джедая у магистра Йоды, в то время как Дарт Вейдер преследует друзей Люка.", - poster: "https://image.tmdb.org/t/p/w500/2l05cFWJacyIsTpsqSgH0wQXe4V.jpg" + poster: "https://image.tmdb.org/t/p/w500/2l05cFWJacyIsTpsqSgH0wQXe4V.jpg", + streaming: [{ name: "Disney+", icon: "🏰", url: "https://www.disneyplus.com" }, { name: "Premier", icon: "🎭", url: "https://premier.one" }] }, { id: 14, @@ -356,7 +368,8 @@ const MOVIES = [ genres: ["comedy", "adventure"], moods: ["fun", "comedy"], description: "Восьмилетний Кевин остаётся один дома на Рождество и должен защитить свой дом от двух грабителей.", - poster: "https://image.tmdb.org/t/p/w500/onTSipZ8R3amIkoc8xWrLXl5hV.jpg" + poster: "https://image.tmdb.org/t/p/w500/onTSipZ8R3amIkoc8xWrLXl5hV.jpg", + streaming: [{ name: "Apple TV+", icon: "🍎", url: "https://tv.apple.com" }, { name: "More.tv", icon: "📱", url: "https://more.tv" }] }, { id: 15, @@ -368,7 +381,8 @@ const MOVIES = [ genres: ["animation", "fantasy", "adventure"], moods: ["unusual", "think"], description: "Девочка попадает в таинственный мир духов и должна найти способ освободить себя и своих родителей.", - poster: "https://image.tmdb.org/t/p/w500/39wmItIWsg5sZMyRUKGnDbALpd1.jpg" + poster: "https://image.tmdb.org/t/p/w500/39wmItIWsg5sZMyRUKGnDbALpd1.jpg", + streaming: [{ name: "YouTube", icon: "▶️", url: "https://www.youtube.com/movies" }] }, { id: 16, @@ -380,7 +394,8 @@ const MOVIES = [ genres: ["horror", "thriller"], moods: ["scary", "think"], description: "Писатель Джек Торранс становится зимним смотрителем отеля «Оверлук», где происходят сверхъестественные события.", - poster: "https://image.tmdb.org/t/p/w500/b6ko0IKC8MdYBBPkkA1aBPLe2yz.jpg" + poster: "https://image.tmdb.org/t/p/w500/b6ko0IKC8MdYBBPkkA1aBPLe2yz.jpg", + streaming: [{ name: "Rakuten", icon: "🛒", url: "https://rakuten.tv" }, { name: "Kinopoisk", icon: "🎭", url: "https://www.kinopoisk.ru" }] }, { id: 17, @@ -392,7 +407,8 @@ const MOVIES = [ genres: ["horror", "scifi"], moods: ["scary", "drive"], description: "Экипаж космического корабля сталкивается с смертоносным инопланетным существом.", - poster: "https://image.tmdb.org/t/p/w500/vfrQk5IPloGg1v9Rzbh2Eg3VGyM.jpg" + poster: "https://image.tmdb.org/t/p/w500/vfrQk5IPloGg1v9Rzbh2Eg3VGyM.jpg", + streaming: [{ name: "Netflix", icon: "🎬", url: "https://www.netflix.com" }] }, { id: 18, @@ -404,7 +420,8 @@ const MOVIES = [ genres: ["romance", "drama"], moods: ["romance", "sad"], description: "История любви между аристократкой и художником из бедных слоёв общества на борту обречённого лайнера.", - poster: "https://image.tmdb.org/t/p/w500/9xjZS2rlVxm8SFx8kPC3aIGCOYQ.jpg" + poster: "https://image.tmdb.org/t/p/w500/9xjZS2rlVxm8SFx8kPC3aIGCOYQ.jpg", + streaming: [{ name: "Hulu", icon: "🎬", url: "https://www.hulu.com" }, { name: "Ivi", icon: "📺", url: "https://www.ivi.ru" }] }, { id: 19, @@ -416,7 +433,8 @@ const MOVIES = [ genres: ["comedy", "romance", "fantasy"], moods: ["fun", "comedy", "romance"], description: "Циничный метеоролог попадает в временную петлю и вынужден проживать один и тот же день снова и снова.", - poster: "https://image.tmdb.org/t/p/w500/gCgt1WARPZaXnq5zeJRYrWwFZ2.jpg" + poster: "https://image.tmdb.org/t/p/w500/gCgt1WARPZaXnq5zeJRYrWwFZ2.jpg", + streaming: [{ name: "Netflix", icon: "🎬", url: "https://www.netflix.com" }, { name: "Kinopoisk", icon: "🎭", url: "https://www.kinopoisk.ru" }] }, { id: 20, @@ -428,7 +446,8 @@ const MOVIES = [ genres: ["thriller", "drama", "comedy"], moods: ["think", "unusual", "drive"], description: "Бедная семья обманом проникает в богатый дом, выдавая себя за квалифицированных специалистов.", - poster: "https://image.tmdb.org/t/p/w500/7IiTTgloJzvGI1TAYymCfbfl3vT.jpg" + poster: "https://image.tmdb.org/t/p/w500/7IiTTgloJzvGI1TAYymCfbfl3vT.jpg", + streaming: [{ name: "HBO Max", icon: "🎬", url: "https://www.hbomax.com" }, { name: "Ivi", icon: "📺", url: "https://www.ivi.ru" }] }, { id: 21, @@ -440,7 +459,8 @@ const MOVIES = [ genres: ["crime", "thriller", "drama"], moods: ["think", "sad", "drive"], description: "История происхождения самого известного злодея вселенной DC — Артура Флека.", - poster: "https://image.tmdb.org/t/p/w500/udDclJoHjfjb8EkGsdr7ZKRN44.jpg" + poster: "https://image.tmdb.org/t/p/w500/udDclJoHjfjb8EkGsdr7ZKRN44.jpg", + streaming: [{ name: "Amazon Prime", icon: "📦", url: "https://www.primevideo.com" }, { name: "Okko", icon: "🎪", url: "https://okko.tv" }] }, { id: 22, @@ -452,7 +472,8 @@ const MOVIES = [ genres: ["action", "adventure", "scifi"], moods: ["drive", "fun"], description: "Мстители собираются в последний раз, чтобы восстановить порядок во вселенной после событий Войны Бесконечности.", - poster: "https://image.tmdb.org/t/p/w500/or06FN3Dka5tukK1e9sl16pB3iy.jpg" + poster: "https://image.tmdb.org/t/p/w500/or06FN3Dka5tukK1e9sl16pB3iy.jpg", + streaming: [{ name: "Disney+", icon: "🏰", url: "https://www.disneyplus.com" }, { name: "Premier", icon: "🎭", url: "https://premier.one" }] }, { id: 23, @@ -464,7 +485,8 @@ const MOVIES = [ genres: ["romance", "drama", "comedy"], moods: ["romance", "fun", "sad"], description: "История любви между начинающей актрисой и талантливым музыкантом в Лос-Анджелесе.", - poster: "https://image.tmdb.org/t/p/w500/uDO8zWDhfWu7x6O0k0006Oe2M7.jpg" + poster: "https://image.tmdb.org/t/p/w500/uDO8zWDhfWu7x6O0k0006Oe2M7.jpg", + streaming: [{ name: "Apple TV+", icon: "🍎", url: "https://tv.apple.com" }, { name: "More.tv", icon: "📱", url: "https://more.tv" }] }, { id: 24, @@ -476,7 +498,8 @@ const MOVIES = [ genres: ["scifi", "adventure"], moods: ["think", "drive", "unusual"], description: "Пол Атрейдес отправляется на самую опасную планету во Вселенной, чтобы обеспечить будущее своей семьи.", - poster: "https://image.tmdb.org/t/p/w500/d5NXSklXo0qyIYkgV94XAgMIckC.jpg" + poster: "https://image.tmdb.org/t/p/w500/d5NXSklXo0qyIYkgV94XAgMIckC.jpg", + streaming: [{ name: "YouTube", icon: "▶️", url: "https://www.youtube.com/movies" }] }, { id: 25, @@ -488,7 +511,8 @@ const MOVIES = [ genres: ["fantasy", "adventure"], moods: ["fun", "drive"], description: "Мальчик-сирота узнаёт, что он волшебник, и отправляется в школу магии Хогвартс.", - poster: "https://image.tmdb.org/t/p/w500/wuMc08IPKEatf9rnMNXvIDxqP4W.jpg" + poster: "https://image.tmdb.org/t/p/w500/wuMc08IPKEatf9rnMNXvIDxqP4W.jpg", + streaming: [{ name: "Rakuten", icon: "🛒", url: "https://rakuten.tv" }, { name: "Kinopoisk", icon: "🎭", url: "https://www.kinopoisk.ru" }] }, { id: 26, @@ -500,7 +524,8 @@ const MOVIES = [ genres: ["action", "scifi"], moods: ["drive", "fun"], description: "Киборг отправляется в прошлое, чтобы защитить будущего лидера сопротивления машин.", - poster: "https://image.tmdb.org/t/p/w500/5M0j0B18abtBI5gi2RhfjjurTqb.jpg" + poster: "https://image.tmdb.org/t/p/w500/5M0j0B18abtBI5gi2RhfjjurTqb.jpg", + streaming: [{ name: "Netflix", icon: "🎬", url: "https://www.netflix.com" }] }, { id: 27, @@ -512,7 +537,8 @@ const MOVIES = [ genres: ["scifi", "adventure", "comedy"], moods: ["fun", "drive", "comedy"], description: "Подросток Марти Макфлай случайно отправляется в 1955 год на машине времени.", - poster: "https://image.tmdb.org/t/p/w500/fNOH9f9aA7XRTzl1sAd7k1i0qHc.jpg" + poster: "https://image.tmdb.org/t/p/w500/fNOH9f9aA7XRTzl1sAd7k1i0qHc.jpg", + streaming: [{ name: "Hulu", icon: "🎬", url: "https://www.hulu.com" }, { name: "Ivi", icon: "📺", url: "https://www.ivi.ru" }] }, { id: 28, @@ -524,7 +550,8 @@ const MOVIES = [ genres: ["crime", "thriller", "mystery"], moods: ["scary", "think"], description: "Агент ФБР обращается за помощью к каннибалу Ганнибалу Лектеру, чтобы поймать другого серийного убийцу.", - poster: "https://image.tmdb.org/t/p/w500/uS9m8OBk1A8eM9I042bx8XXpqAq.jpg" + poster: "https://image.tmdb.org/t/p/w500/uS9m8OBk1A8eM9I042bx8XXpqAq.jpg", + streaming: [{ name: "Netflix", icon: "🎬", url: "https://www.netflix.com" }, { name: "Kinopoisk", icon: "🎭", url: "https://www.kinopoisk.ru" }] }, { id: 29, @@ -536,7 +563,8 @@ const MOVIES = [ genres: ["drama", "history", "action"], moods: ["think", "sad", "drive"], description: "Отряд солдат отправляется на поиски парашютиста, чьи три брата погибли в бою.", - poster: "https://image.tmdb.org/t/p/w500/uqx37cS8cpHg8U35f9U5IBlrCV3.jpg" + poster: "https://image.tmdb.org/t/p/w500/uqx37cS8cpHg8U35f9U5IBlrCV3.jpg", + streaming: [{ name: "HBO Max", icon: "🎬", url: "https://www.hbomax.com" }, { name: "Ivi", icon: "📺", url: "https://www.ivi.ru" }] }, { id: 30, @@ -548,7 +576,8 @@ const MOVIES = [ genres: ["drama", "fantasy"], moods: ["think", "sad"], description: "История о тюремном охраннике и заключённом с божественным даром.", - poster: "https://image.tmdb.org/t/p/w500/velWPhVMQeQKcxggNEU8YmIo51R.jpg" + poster: "https://image.tmdb.org/t/p/w500/velWPhVMQeQKcxggNEU8YmIo51R.jpg", + streaming: [{ name: "Amazon Prime", icon: "📦", url: "https://www.primevideo.com" }, { name: "Okko", icon: "🎪", url: "https://okko.tv" }] }, { id: 31, @@ -560,7 +589,8 @@ const MOVIES = [ genres: ["action", "drama", "history"], moods: ["drive", "think"], description: "Римский генерал становится гладиатором и ищет мести за убийство своей семьи.", - poster: "https://image.tmdb.org/t/p/w500/ty8TGRuvJLPUmAR1H1nRIsgwvim.jpg" + poster: "https://image.tmdb.org/t/p/w500/ty8TGRuvJLPUmAR1H1nRIsgwvim.jpg", + streaming: [{ name: "Disney+", icon: "🏰", url: "https://www.disneyplus.com" }, { name: "Premier", icon: "🎭", url: "https://premier.one" }] }, { id: 32, @@ -572,7 +602,8 @@ const MOVIES = [ genres: ["animation", "adventure", "drama"], moods: ["fun", "sad"], description: "Лев Симба должен принять свою судьбу и стать королём Прайдленда.", - poster: "https://image.tmdb.org/t/p/w500/sKCr78MXSLixwmZ8DyJLrpMsd15.jpg" + poster: "https://image.tmdb.org/t/p/w500/sKCr78MXSLixwmZ8DyJLrpMsd15.jpg", + streaming: [{ name: "Apple TV+", icon: "🍎", url: "https://tv.apple.com" }, { name: "More.tv", icon: "📱", url: "https://more.tv" }] }, { id: 33, @@ -584,7 +615,8 @@ const MOVIES = [ genres: ["romance", "scifi", "drama"], moods: ["romance", "think", "sad"], description: "Пара проходит процедуру удаления воспоминаний о болезненных отношениях.", - poster: "https://image.tmdb.org/t/p/w500/5MwkWH9tYHv3m89PXxNulFo7Xug.jpg" + poster: "https://image.tmdb.org/t/p/w500/5MwkWH9tYHv3m89PXxNulFo7Xug.jpg", + streaming: [{ name: "YouTube", icon: "▶️", url: "https://www.youtube.com/movies" }] }, { id: 34, @@ -596,7 +628,8 @@ const MOVIES = [ genres: ["crime", "thriller", "drama"], moods: ["drive", "think"], description: "Два крота работают по обе стороны закона в полицейском департаменте Бостона.", - poster: "https://image.tmdb.org/t/p/w500/nT97ifVT2J1yMQmeq20Qblg61T.jpg" + poster: "https://image.tmdb.org/t/p/w500/nT97ifVT2J1yMQmeq20Qblg61T.jpg", + streaming: [{ name: "Rakuten", icon: "🛒", url: "https://rakuten.tv" }, { name: "Kinopoisk", icon: "🎭", url: "https://www.kinopoisk.ru" }] }, { id: 35, @@ -608,7 +641,8 @@ const MOVIES = [ genres: ["mystery", "thriller", "drama"], moods: ["think", "unusual"], description: "Два фокусника ведут ожесточённую борьбу, которая приводит к трагическим последствиям.", - poster: "https://image.tmdb.org/t/p/w500/tRNlZbgNCNOpLpbPEz5L8G8A0JN.jpg" + poster: "https://image.tmdb.org/t/p/w500/tRNlZbgNCNOpLpbPEz5L8G8A0JN.jpg", + streaming: [{ name: "Netflix", icon: "🎬", url: "https://www.netflix.com" }] }, { id: 36, @@ -620,7 +654,8 @@ const MOVIES = [ genres: ["animation", "adventure", "comedy"], moods: ["fun", "comedy", "sad"], description: "78-летний Карл Фредриксен отправляется в приключение на воздушных шарах.", - poster: "https://image.tmdb.org/t/p/w500/mFvoEwSfLqbr3N7xzWF8vB5lSj.jpg" + poster: "https://image.tmdb.org/t/p/w500/mFvoEwSfLqbr3N7xzWF8vB5lSj.jpg", + streaming: [{ name: "Hulu", icon: "🎬", url: "https://www.hulu.com" }, { name: "Ivi", icon: "📺", url: "https://www.ivi.ru" }] }, { id: 37, @@ -632,7 +667,8 @@ const MOVIES = [ genres: ["animation", "adventure", "fantasy"], moods: ["fun", "sad"], description: "Мальчик Мигель мечтает стать музыкантом и попадает в страну мёртвых.", - poster: "https://image.tmdb.org/t/p/w500/gGEsBPAijhVUFoiNpgZXqRVWJt2.jpg" + poster: "https://image.tmdb.org/t/p/w500/gGEsBPAijhVUFoiNpgZXqRVWJt2.jpg", + streaming: [{ name: "Netflix", icon: "🎬", url: "https://www.netflix.com" }, { name: "Kinopoisk", icon: "🎭", url: "https://www.kinopoisk.ru" }] }, { id: 38, @@ -644,7 +680,8 @@ const MOVIES = [ genres: ["action", "drama"], moods: ["drive", "fun"], description: "Освобождённый раб Джанго отправляется спасать свою жену от жестокого владельца плантации.", - poster: "https://image.tmdb.org/t/p/w500/7oWY8VDWW7thTzWh3OKYRkWUlD5.jpg" + poster: "https://image.tmdb.org/t/p/w500/7oWY8VDWW7thTzWh3OKYRkWUlD5.jpg", + streaming: [{ name: "HBO Max", icon: "🎬", url: "https://www.hbomax.com" }, { name: "Ivi", icon: "📺", url: "https://www.ivi.ru" }] }, { id: 39, @@ -656,7 +693,8 @@ const MOVIES = [ genres: ["animation", "scifi", "adventure"], moods: ["fun", "think"], description: "Робот-уборщик на заброшенной Земле влюбляется в робота-разведчика ЕВУ.", - poster: "https://image.tmdb.org/t/p/w500/hBnYqza876OMhRJRXxkFz4jjZPt.jpg" + poster: "https://image.tmdb.org/t/p/w500/hBnYqza876OMhRJRXxkFz4jjZPt.jpg", + streaming: [{ name: "Amazon Prime", icon: "📦", url: "https://www.primevideo.com" }, { name: "Okko", icon: "🎪", url: "https://okko.tv" }] }, { id: 40, @@ -668,7 +706,8 @@ const MOVIES = [ genres: ["comedy", "drama"], moods: ["fun", "sad", "think"], description: "Отец использует своё воображение, чтобы защитить сына от ужасов концлагеря.", - poster: "https://image.tmdb.org/t/p/w500/74hLDKjD5aGYOotO6esUVaeISa2.jpg" + poster: "https://image.tmdb.org/t/p/w500/74hLDKjD5aGYOotO6esUVaeISa2.jpg", + streaming: [{ name: "Disney+", icon: "🏰", url: "https://www.disneyplus.com" }, { name: "Premier", icon: "🎭", url: "https://premier.one" }] }, { id: 41, @@ -680,7 +719,8 @@ const MOVIES = [ genres: ["action", "scifi"], moods: ["drive", "think"], description: "Нео и его друзья готовятся к войне против машин.", - poster: "https://image.tmdb.org/t/p/w500/9TGHDvWrqKBzwDxDodHYXEmOE5J.jpg" + poster: "https://image.tmdb.org/t/p/w500/9TGHDvWrqKBzwDxDodHYXEmOE5J.jpg", + streaming: [{ name: "Apple TV+", icon: "🍎", url: "https://tv.apple.com" }, { name: "More.tv", icon: "📱", url: "https://more.tv" }] }, { id: 42, @@ -692,7 +732,8 @@ const MOVIES = [ genres: ["scifi", "adventure", "fantasy"], moods: ["drive", "unusual"], description: "Морпех Джейк Салли оказывается на планете Пандора и становится частью народа На'ви.", - poster: "https://image.tmdb.org/t/p/w500/6EiRUJpuoeQPghrs3YNktfnqOVh.jpg" + poster: "https://image.tmdb.org/t/p/w500/6EiRUJpuoeQPghrs3YNktfnqOVh.jpg", + streaming: [{ name: "YouTube", icon: "▶️", url: "https://www.youtube.com/movies" }] }, { id: 43, @@ -704,7 +745,8 @@ const MOVIES = [ genres: ["action", "adventure", "scifi"], moods: ["drive", "fun"], description: "Мстители и их союзники должны остановить безумного титана Таноса.", - poster: "https://image.tmdb.org/t/p/w500/7WsyChQLEftFiDOVTGkv3hFpyyt.jpg" + poster: "https://image.tmdb.org/t/p/w500/7WsyChQLEftFiDOVTGkv3hFpyyt.jpg", + streaming: [{ name: "Rakuten", icon: "🛒", url: "https://rakuten.tv" }, { name: "Kinopoisk", icon: "🎭", url: "https://www.kinopoisk.ru" }] }, { id: 44, @@ -716,7 +758,8 @@ const MOVIES = [ genres: ["animation", "romance", "fantasy"], moods: ["romance", "think", "unusual"], description: "Два подростка mysteriously меняются телами и пытаются найти друг друга.", - poster: "https://image.tmdb.org/t/p/w500/q719jXXEzOoYaps6babgKnONONX.jpg" + poster: "https://image.tmdb.org/t/p/w500/q719jXXEzOoYaps6babgKnONONX.jpg", + streaming: [{ name: "Netflix", icon: "🎬", url: "https://www.netflix.com" }] }, { id: 45, @@ -728,7 +771,8 @@ const MOVIES = [ genres: ["drama", "comedy"], moods: ["fun", "comedy", "think"], description: "Аристократ-инвалид нанимает парня из гетто в качестве сиделки.", - poster: "https://image.tmdb.org/t/p/w500/323BP0QQpxYZxhI7nwmANpLHR0u.jpg" + poster: "https://image.tmdb.org/t/p/w500/323BP0QQpxYZxhI7nwmANpLHR0u.jpg", + streaming: [{ name: "Hulu", icon: "🎬", url: "https://www.hulu.com" }, { name: "Ivi", icon: "📺", url: "https://www.ivi.ru" }] }, { id: 46, @@ -740,7 +784,8 @@ const MOVIES = [ genres: ["drama"], moods: ["sad", "think"], description: "История о преданной собаке, которая ждёт своего хозяина на вокзале.", - poster: "https://image.tmdb.org/t/p/w500/8Vt7mXHRo6bEj8nT5sD7bL8pF0.jpg" + poster: "https://image.tmdb.org/t/p/w500/8Vt7mXHRo6bEj8nT5sD7bL8pF0.jpg", + streaming: [{ name: "Netflix", icon: "🎬", url: "https://www.netflix.com" }, { name: "Kinopoisk", icon: "🎭", url: "https://www.kinopoisk.ru" }] }, { id: 47, @@ -752,7 +797,8 @@ const MOVIES = [ genres: ["crime", "drama", "comedy"], moods: ["think", "drive"], description: "Мать убитой дочери требует справедливости через три билборда.", - poster: "https://image.tmdb.org/t/p/w500/pZRhqJj0DBy4ghB7g6pG7MG9xW.jpg" + poster: "https://image.tmdb.org/t/p/w500/pZRhqJj0DBy4ghB7g6pG7MG9xW.jpg", + streaming: [{ name: "HBO Max", icon: "🎬", url: "https://www.hbomax.com" }, { name: "Ivi", icon: "📺", url: "https://www.ivi.ru" }] }, { id: 48, @@ -764,7 +810,8 @@ const MOVIES = [ genres: ["comedy", "crime"], moods: ["fun", "comedy", "unusual"], description: "Чувака путают с миллионером и втягивают в странную историю.", - poster: "https://image.tmdb.org/t/p/w500/d4ftZu4dWypDlVE5p3V0p3e3i4.jpg" + poster: "https://image.tmdb.org/t/p/w500/d4ftZu4dWypDlVE5p3V0p3e3i4.jpg", + streaming: [{ name: "Amazon Prime", icon: "📦", url: "https://www.primevideo.com" }, { name: "Okko", icon: "🎪", url: "https://okko.tv" }] }, { id: 49, @@ -776,7 +823,8 @@ const MOVIES = [ genres: ["crime", "drama"], moods: ["drive", "think"], description: "История о жизни в фавелах Рио-де-Жанейро на протяжении нескольких десятилетий.", - poster: "https://image.tmdb.org/t/p/w500/k7eYdWvhYQyDYR1p5MjZnJ4n2.jpg" + poster: "https://image.tmdb.org/t/p/w500/k7eYdWvhYQyDYR1p5MjZnJ4n2.jpg", + streaming: [{ name: "Disney+", icon: "🏰", url: "https://www.disneyplus.com" }, { name: "Premier", icon: "🎭", url: "https://premier.one" }] }, { id: 50, @@ -788,7 +836,8 @@ const MOVIES = [ genres: ["drama", "history"], moods: ["think", "sad"], description: "История Оскара Шиндлера, спасшего более тысячи евреев во время Холокоста.", - poster: "https://image.tmdb.org/t/p/w500/sF1U4EUQS8YHUYjNl3pTXMYC4mV.jpg" + poster: "https://image.tmdb.org/t/p/w500/sF1U4EUQS8YHUYjNl3pTXMYC4mV.jpg", + streaming: [{ name: "Apple TV+", icon: "🍎", url: "https://tv.apple.com" }, { name: "More.tv", icon: "📱", url: "https://more.tv" }] }, { id: 51, @@ -800,7 +849,8 @@ const MOVIES = [ genres: ["adventure", "fantasy", "action"], moods: ["fun", "drive", "comedy"], description: "Кузнец Уилл Тёрнер объединяется с эксцентричным пиратом Джеком Воробьём.", - poster: "https://image.tmdb.org/t/p/w500/z8onk7LV9Mmw6zKz4hT6pzzvmvl.jpg" + poster: "https://image.tmdb.org/t/p/w500/z8onk7LV9Mmw6zKz4hT6pzzvmvl.jpg", + streaming: [{ name: "YouTube", icon: "▶️", url: "https://www.youtube.com/movies" }] }, { id: 52, @@ -812,7 +862,8 @@ const MOVIES = [ genres: ["comedy", "drama"], moods: ["fun", "comedy"], description: "Молодая девушка становится ассистенткой жестокого редактора модного журнала.", - poster: "https://image.tmdb.org/t/p/w500/8916As6Y7bYPVr9pWzuBQQnrTHU.jpg" + poster: "https://image.tmdb.org/t/p/w500/8916As6Y7bYPVr9pWzuBQQnrTHU.jpg", + streaming: [{ name: "Rakuten", icon: "🛒", url: "https://rakuten.tv" }, { name: "Kinopoisk", icon: "🎭", url: "https://www.kinopoisk.ru" }] }, { id: 53, @@ -824,7 +875,8 @@ const MOVIES = [ genres: ["mystery", "thriller", "drama"], moods: ["think", "unusual", "scary"], description: "Женщина с амнезией и начинающая актриса исследуют тёмные стороны Голливуда.", - poster: "https://image.tmdb.org/t/p/w500/tVxGt7uffR6IIbGlQpSP3yJhqqa.jpg" + poster: "https://image.tmdb.org/t/p/w500/tVxGt7uffR6IIbGlQpSP3yJhqqa.jpg", + streaming: [{ name: "Netflix", icon: "🎬", url: "https://www.netflix.com" }] }, { id: 54, @@ -836,7 +888,8 @@ const MOVIES = [ genres: ["crime", "mystery", "thriller"], moods: ["scary", "think", "drive"], description: "Два детектива ищут серийного убийцу, который наказывает жертв за семь смертных грехов.", - poster: "https://image.tmdb.org/t/p/w500/6yoghtyTpznpBik8EngEmJskVUO.jpg" + poster: "https://image.tmdb.org/t/p/w500/6yoghtyTpznpBik8EngEmJskVUO.jpg", + streaming: [{ name: "Hulu", icon: "🎬", url: "https://www.hulu.com" }, { name: "Ivi", icon: "📺", url: "https://www.ivi.ru" }] }, { id: 55, @@ -848,7 +901,8 @@ const MOVIES = [ genres: ["comedy", "adventure"], moods: ["fun", "comedy", "unusual"], description: "История о легендарном консьерже Густаве и его друге Zero.", - poster: "https://image.tmdb.org/t/p/w500/eWdyYQreja6JGCzqHWXpWHDrrPo.jpg" + poster: "https://image.tmdb.org/t/p/w500/eWdyYQreja6JGCzqHWXpWHDrrPo.jpg", + streaming: [{ name: "Netflix", icon: "🎬", url: "https://www.netflix.com" }, { name: "Kinopoisk", icon: "🎭", url: "https://www.kinopoisk.ru" }] }, { id: 56, @@ -860,7 +914,8 @@ const MOVIES = [ genres: ["action", "adventure", "scifi"], moods: ["drive", "fun"], description: "В постапокалиптической пустоши Макс и Фуриоса бегут от тирана.", - poster: "https://image.tmdb.org/t/p/w500/hA2ple9q4qnwxp3hKVNhroipsir.jpg" + poster: "https://image.tmdb.org/t/p/w500/hA2ple9q4qnwxp3hKVNhroipsir.jpg", + streaming: [{ name: "HBO Max", icon: "🎬", url: "https://www.hbomax.com" }, { name: "Ivi", icon: "📺", url: "https://www.ivi.ru" }] }, { id: 57, @@ -872,7 +927,8 @@ const MOVIES = [ genres: ["crime", "thriller", "drama"], moods: ["think", "scary", "drive"], description: "Охотник находит деньги от наркосделки и становится мишенью психопата.", - poster: "https://image.tmdb.org/t/p/w500/bj1v6YKF8yHqA489VFfnQvOJp9n.jpg" + poster: "https://image.tmdb.org/t/p/w500/bj1v6YKF8yHqA489VFfnQvOJp9n.jpg", + streaming: [{ name: "Amazon Prime", icon: "📦", url: "https://www.primevideo.com" }, { name: "Okko", icon: "🎪", url: "https://okko.tv" }] }, { id: 58, @@ -884,7 +940,8 @@ const MOVIES = [ genres: ["scifi", "drama"], moods: ["think", "unusual"], description: "Учёный из будущего отправляется на планету, где застряла средневековая цивилизация.", - poster: "https://image.tmdb.org/t/p/w500/iR79ieYRZ5fBmXVL7fOe0y7xIJ.jpg" + poster: "https://image.tmdb.org/t/p/w500/iR79ieYRZ5fBmXVL7fOe0y7xIJ.jpg", + streaming: [{ name: "Disney+", icon: "🏰", url: "https://www.disneyplus.com" }, { name: "Premier", icon: "🎭", url: "https://premier.one" }] }, { id: 59, @@ -896,7 +953,8 @@ const MOVIES = [ genres: ["drama"], moods: ["think", "drive"], description: "Молодой барабанщик мечтает стать великим, но сталкивается с жестоким преподавателем.", - poster: "https://image.tmdb.org/t/p/w500/7fn624j5lj3xTme2SgiZErnGSwC.jpg" + poster: "https://image.tmdb.org/t/p/w500/7fn624j5lj3xTme2SgiZErnGSwC.jpg", + streaming: [{ name: "Apple TV+", icon: "🍎", url: "https://tv.apple.com" }, { name: "More.tv", icon: "📱", url: "https://more.tv" }] }, { id: 60, @@ -908,7 +966,8 @@ const MOVIES = [ genres: ["crime", "thriller"], moods: ["fun", "drive", "unusual"], description: "Несколько переплетающихся историй из криминального мира Лос-Анджелеса.", - poster: "https://image.tmdb.org/t/p/w500/d5iIlFn5s0ImszYzBPb8JPIfbXD.jpg" + poster: "https://image.tmdb.org/t/p/w500/d5iIlFn5s0ImszYzBPb8JPIfbXD.jpg", + streaming: [{ name: "YouTube", icon: "▶️", url: "https://www.youtube.com/movies" }] } ]; @@ -1409,14 +1468,24 @@ function updateTexts() { } // Language switcher -const languageSelect = document.getElementById('languageSelect'); -if (languageSelect) { - languageSelect.value = currentLang; - languageSelect.addEventListener('change', (e) => { - currentLang = e.target.value; +const langBtns = document.querySelectorAll('.lang-btn'); +langBtns.forEach(btn => { + btn.addEventListener('click', () => { + const lang = btn.dataset.lang; + currentLang = lang; + + // Update active state + langBtns.forEach(b => b.classList.remove('active')); + btn.classList.add('active'); + updateTexts(); }); -} + + // Set initial active state + if (btn.dataset.lang === currentLang) { + btn.classList.add('active'); + } +}); // ==================== INITIALIZATION ==================== document.addEventListener('DOMContentLoaded', () => { diff --git a/style.css b/style.css index b7aad2c..aea8532 100644 --- a/style.css +++ b/style.css @@ -140,32 +140,74 @@ body { gap: 16px; } -.language-select { - padding: 10px 16px; +/* Beautiful Language Switcher */ +.language-switcher { + display: flex; background: linear-gradient(145deg, var(--bg-card), var(--bg-hover)); - border: 1px solid rgba(255, 255, 255, 0.1); + border: 1px solid rgba(255, 255, 255, 0.08); border-radius: var(--border-radius-sm); - color: var(--text-primary); + padding: 4px; + gap: 4px; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); +} + +.lang-btn { + display: flex; + align-items: center; + gap: 6px; + padding: 8px 12px; + background: transparent; + border: none; + border-radius: 8px; + color: var(--text-secondary); cursor: pointer; transition: var(--transition); - font-size: 14px; + font-size: 13px; font-weight: 600; - appearance: none; - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23f5a623' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E"); - background-repeat: no-repeat; - background-position: right 12px center; - background-size: 18px; - padding-right: 40px; + position: relative; + overflow: hidden; } -.language-select:hover { - border-color: var(--accent); +.lang-btn::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: linear-gradient(135deg, rgba(245, 166, 35, 0.1), transparent); + opacity: 0; + transition: var(--transition); } -.language-select:focus { - outline: none; - border-color: var(--accent); - box-shadow: 0 0 20px var(--accent-glow); +.lang-btn:hover::before { + opacity: 1; +} + +.lang-btn:hover { + color: var(--text-primary); + transform: translateY(-1px); +} + +.lang-btn.active { + background: linear-gradient(135deg, var(--accent), var(--accent-hover)); + color: var(--bg-primary); + box-shadow: 0 4px 12px var(--accent-glow); +} + +.lang-btn.active .lang-flag { + transform: scale(1.1); +} + +.lang-flag { + font-size: 16px; + transition: var(--transition); + filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3)); +} + +.lang-code { + font-weight: 700; + letter-spacing: 0.5px; } .header::after { @@ -1166,11 +1208,20 @@ body { .header-controls { width: 100%; - justify-content: space-between; + justify-content: center; order: 2; + flex-wrap: wrap; + gap: 12px; + } + + .language-switcher { + order: 1; + width: 100%; + justify-content: center; } .nav { + order: 2; gap: 8px; } @@ -1186,9 +1237,16 @@ body { font-size: 22px; } - .language-select { - padding: 10px 14px; - font-size: 13px; + .lang-btn { + padding: 6px 10px; + } + + .lang-flag { + font-size: 14px; + } + + .lang-code { + display: none; } .hero {