Сверстать игровой чат (HTML+CSS) и веб приложение на Vue.JS
События, которые должно обработать приложение:
- Игрок открыл окно набора текста
Триггер некого свойства приложения, которое скрывает/показывает input-поле под окном чата
- Игрок написал и отправил сообщение
Приложение должно понять по первому введенному символу, что именно хотел отправить игрок,
если первый символ был '/', то это команда и ее нужно отправить серверу как команду
иначе, отправить на сервер событие с сообщением
(отправка самих событий не требуется, достаточно сделать это с помощью console.log)
- Проверка введенных данных перед отправкой
Если у игрока в сообщении присутствуют спец символы,
то отправляем событие (console.log) о том, что обнаружены запрещенные символы,
а сообщение игрока стирается и не отправляется на сервер.
- Добавить сообщение в историю чата
Сервер отправляет broadcast служебные сообщения и сообщения от других игроков.
Нужно обработать это событие так, чтобы через консоль браузера можно было добавить сообщение
(например, chat.push('Сообщение от консоли'))
- Автоматический скролл и его блокировка
Если игрок проскроллил чат по истории вверх, то новые сообщения с сервера ни как не влияют на скролл.
Если игрок не взаимодействовал со скроллом более 10 секунд, то он возвращается в самое нижнее положение.
Если от сервера пришло сообщение и игрок не взаимодействовал с историей чата,
то он автоматически делает сколл к последнему сообщению
- Размер истории чата
Кол-во сообщений, которое может вместить в себя история – 15,
если это кол-во больше, то удаляются самые старые сообщения.
- Синхронизация времени
У каждого сообщения в чате есть временная отметка,
которая автоматически проставляется при получении каждого сообщения.
Для того, чтобы исключить проблемы часовых поясов игроков,
при инициализации чата сервер отправит событие со своим временем (или часовым поясом).
Заполнение времени делать относительно полученных данных.
Настройки чата:
- Изменение размера текста чата
В настройках чата есть ползунок. Нужно заставить его изменять размер текста от 10px до 16px во всем приложении.
- Временная отметка
Время рядом с сообщением можно скрыть с помощью чекбокса в настройках
- Действия администратора в чате
В чате имеется специальный тип сообщения "От администратора".
Эти сообщения можно скрыть из чата изменив настройку.
Игрок продолжает их получать и может в любой момент снова отобразить сообщения.
Верстку предоставим в Фигме. Цена договорная. В сообщение приложите стоимость и срок выполнения.
Applications 3
-
157 Добрый день, компания Hexide-digital, готовы помочь.
Наш сайт : https://hexide-digital.com/.
Адаптивная, семантичная, кроссбраузерная верстка, валиднный код.
-
678 19 0 Рейт 15$/час. Напишите в ЛС для обучения деталей ибо непонятно есть ли уже приложение и куда оно будет внедряться. Так же нужно обсудить каждый пункт для понимания общего времени и стоимости всей работы
-
Добрый день, мы отозвали ставку, так как изначально не указали, что можем сделать данный проект не на VueJS, а на ReactJS.
Если такая альтернатива Вам подходит, пожалуйста, напишите контактные данные, по которым с Вами можно связаться и и выслать наше предложение по сроку разработки и цене.
Здесь, к сожалению, повторно поставить ставку нельзя.
-
Это для Rage Mp?
-
Current freelance projects in the category HTML & CSS
Development of a WordPress + WooCommerce online store# Development of an Online Store for Agricultural Equipment The design mockup is currently in the final stages of development. I fully understand that without a ready mockup, the final estimate will be inaccurate. However, if you have already implemented similar e-commerce… Content Management Systems, HTML & CSS ∙ 3 hours 14 minutes back ∙ 13 proposals |
Layout designer for multi-page advertorial website (Health Media) — vibe coding, clean code
150 USD
We need to create a multi-page website in the style of health media, based on healthinsider.news. Not just a landing page — a full-fledged pseudo-editorial site (advertorial), designed to attract traffic from Meta Ads. IMPORTANT: the task is to be done through vibe coding… HTML & CSS, Web Programming ∙ 10 hours 32 minutes back ∙ 41 proposals |
Website design updateIt is necessary to update the design of the existing website using HTML, CSS, JS: refresh the appearance, make it modern and responsive for mobile devices. Smooth animations and interactive elements need to be added. HTML & CSS, Javascript and Typescript ∙ 1 day 14 hours back ∙ 85 proposals |
I am looking for a WordPress/Elementor/Woo specialist who has extensive experience with the Woodmart template.
113 USD
It is necessary to update the visual design and structure of the online store for dental products (link will be sent in a private message). The site operates on the WordPress + WooCommerce framework. The template is Woodmart. Tasks: Update the header, footer, and content on… Content Management Systems, HTML & CSS ∙ 1 day 18 hours back ∙ 34 proposals |
Website layoutTechnical assignment for website layout. Written by ChatGPT Link to design - https://www.figma.com/file/bBuR3yG2eSzLpBcBJURNZi?node-id=60:397&t=zQ9Kln2RtyBgNHKw-1&locale=en&type=design General information It is necessary to perform responsive cross-browser layout of the… HTML & CSS ∙ 1 day 18 hours back ∙ 113 proposals |