React-компонент в виде вращающейся рулетки
111 USDЗдравствуйте, дорогие коллеги!
Цель:
На своем ютуб канале https://www.youtube.com/c/HikariSenshi/
Я планирую провести розыгрыш аккаунтов из игры Pubg Mobile, а также разных наушников и прочих призов.
Мне нужна анимированная рулетка, которая будет вращаться после нажатия и выбирать случайное значение,
среди секторов размещенных на ней. Обращаю внимание, что просто использовать функцию Math.random недостаточно, так как нужна именно "повышенная случайность" . Поэтому желательно их комбинировать.
ТехЗадание:
Здесь вкратце описаны мои требования
- Рулетка должна быть компонентом одного из топ-3 фреймворка
- Рулетка должна быть доступна в мобильной версии
- Логика
- Рулетка должна вращаться по нажатию и выбирать один из секторов случайным (или не очень) образом, повторений быть не должно
- Рулетка должна поддерживать консольные команды, которые позволяют управлять ее элементами
- addSector()
- removeSector()
- setGroupChance()
- setNextPrize()
- Состояние рулетки должно меняться для всех пользователей
- Доступ к запуску рулетки должен быть только у победителей
- Нужна будет базовая авторизация; данные можно хранить хоть в текстовом файле и парсить сплитом, вообще фиолетово
- Если вы прочитали тз, включите в ставку слово hikari
- Требования к виду
- Рулетка состоит из трех ключевых элементов
- Внешний круг
- Должен смотреться красиво, смысловой нагрузки не несет. Представляю его как деревянный ободок, обсуждается
- Собственно рулетка
- На рулетке должны располагаться секторы с призами
- Чем больше секторов тем меньше их доля от круга 360, думаю это понятно
- Элементы на секторах не должны вылезать за его пределы, а также должны быть различимыми
- Секторы которые уже выиграны, должны быть затемненными, и явно отличаться от доступных, призы на них также должны быть различимыми
- При нажатии на сектор должна открываться модалка с данными о призе. Если это аккаунт, то это ник, айди, краткое описание его ключевых преимуществ, ссылка на видеообзор
- Если это деньги или наушники, то тогда другие характеристики
- Данные можно хранить в пропсах, тут по желанию исполнителя
- Анимация вращения
- Можно реализовать ее разными путями, можно сделать чтобы рулетка вращалась, и сверху стрелка показывала на приз. Можно просто чтобы секторы поочередно закрашивались специальным цветом, и затем закрашенным становился в итоге выигранный приз
2.Затем должно всплыть анимация выигранного приза, это должно выглядеть более-менее красиво, в случае если приз не выигран, это так называемые нулевые сектора, тогда плачущий смайл
- Можно реализовать ее разными путями, можно сделать чтобы рулетка вращалась, и сверху стрелка показывала на приз. Можно просто чтобы секторы поочередно закрашивались специальным цветом, и затем закрашенным становился в итоге выигранный приз
- Виды призов
- Секторы 0
- Секторы с красным крестиком, при нажатии должно отображаться сообщение, если рулетка попадет сюда, значит вы проиграли
- Секторы с деньгами, можно использовать картинку с деньгами, в зависимости от их количества, либо мешочки рисовать, по желанию
- В описании категория: реальные деньги и количество: х
- Секторы с вещами
- Пока планируются аирподсы и напальчники
- Секторы с аккаунтами
- ID
- Nickname
- Ссылка на видос
- Краткое описание
- История аккаунта
- Секторы 0
- На рулетке должны располагаться секторы с призами
- Внешний круг
- Рулетка состоит из трех ключевых элементов
- Дополнительно: никаких дыр в логике, все должно отрабатывать четки и без "приветов" на стримах, в том числе и команды. Также рекомендую выводить в консоль дебаг информацию, чтобы не было сюрпризов
- Бюджет можно расширить
Current freelance projects in the category Javascript and Typescript
Fix the CSS/DOM layout of cards in the Chrome extension for localizing D&D BeyondThere is a Chrome extension Manifest V3 that localizes the D&D Beyond website into Ukrainian. The project is written in TypeScript + WXT. The extension works through a content script: it finds English text on D&D Beyond pages and replaces it with the Ukrainian translation. The… HTML & CSS, Javascript and Typescript ∙ 1 day 7 hours back ∙ 37 proposals |
Development of the AM Mobility platform (car service, parking, insurance, car rental)
5770 USD
We are looking for a team or an experienced Full Stack developer to create the MVP of the AM Mobility platform. AM Mobility is a unified digital ecosystem for motorists, combining in one application and web platform: parking; car service; tire fitting; car wash; car rental;… Javascript and Typescript, Web Programming ∙ 1 day 16 hours back ∙ 98 proposals |
Gsap animations
22 USD
Good day. Corrections need to be made in the current project. A specialist is needed who works well with gsap/lenis. Animation of cards needs to be done. Detailed specifications here:… Javascript and Typescript, Web Programming ∙ 1 day 21 hours back ∙ 21 proposals |
Commercial on-premise video communication platform "ViM"It is required to develop an on-premise video conferencing system with a basic calculation for 100 simultaneous connections (10 isolated rooms of 10 people each). The platform should have a built-in architecture for future horizontal scaling up to 1000 users by adding new media… Javascript and Typescript, Web Programming ∙ 2 days 17 hours back ∙ 32 proposals |
I am looking for a mentor with Claude Code to launch a web project from scratch.Brief about the task: I am a beginner with no programming experience. I have a ready specification for website development (42 pages, Next.js, PostgreSQL). I want to implement it myself using Claude Code - I need a specialist who will set up the environment and teach me how to… Javascript and Typescript, Tuition ∙ 3 days 20 hours back ∙ 18 proposals |