Реализацию сервиса сообщений

Сообщения

В личном кабинете всех пользователей портала присутствует раздел «Сообщения» Данный раздел делится на два поля:

• 1.Контакты(слева) – в данном поле в алфавитном порядке отображаются пользователи портала, которых данный пользователь добавил себе в контакты;
• 2.Сообщения(справа) – в данном поле отображается лента сообщений (между двумя пользователями, либо тематическая)

• 1.Список пользователей в поле «Контакты» затягивается из раздела «Мои контакты» личного кабинета.
• В данном поле пользователи отображаются в форме вертикального списка, в котором друг под другом присутствуют:
• Аватар, размером 50х50 пикселей (В профиле данный аватар отображается в размере 150х150 пикселей как в кабинете, так и в публичном. В комментариях аватар пользователей отображается размером 70х70 пикселей)
• Фамилия имя
• Название компании

При нажатии на пользователя из этого списка, справа от него появляется боковая выноска с расширенными функциями(аналогично как на фейсбуке при наведении на друга в правом нижнем поле со списком друзей). Выноска выглядит следующим образом:

Сверху над списком контактов присутствует поле поиска контактов по Фамилии имени. Слева от данного поля присутствует кнопка «Перейти к расширенному поиску». При вводе имени контакта в данное поле – фильтрация контактов начинается после ввода третьего символа без перезагрузки страницы. В плейсхолдере данного поля отображается фраза «Найти контакт».

При нажатии на кнопку «Перейти к расширенному поиску», пользователь попадает в раздел личного кабинета «Мои контакты»(раздел будет описан в ТЗ «Мои контакты»)

• 2.В правом поле формируются ленты сообщений двух типов:
• Между двумя пользователями – лента сообщений между двумя пользователями создается при условии, если один пользователь пытается написать сообщение другому пользователю, посредством нажатия на кнопку «Написать сообщение» в профиле второго пользователя. Данная лента сообщений формируется по id двух пользователей портала.
• Тематическая – лента сообщений, объединяющая под одной темой нескольких пользователей портала. Данная лента создается при нажатии на кнопку «Создать тему», которая располагается над блоком «Сообщения» в правом верхнем углу.
• При нажатии на данную кнопку открывается пустая лента сообщений такого вида:

Поле для ввода сообщений Прикрепить

По умолчанию слово «Участники» является ссылкой на модал, в котором участники тематической ленты отображаются в виде плитки аватарок участников беседы(размер аватарок в данном модале будет определяться версткой, исходя из существующих размеров аватарок), под которыми отображаются Фамилия и имя собеседников. Данные аватарки и имена являются ссылками на публичный профиль.

В самом же поле «Участники» отображаются только аватары пользователей, размером 50 на 50.

Сверху в ленте сообщений отображается кнопка «Вернуться к общему списку», которая возвращает пользователя к общему списку сообщений без перезагрузки страницы:

Поле для ввода сообщений Прикрепить

Справа от кнопки возврата к общему списку находится форма живого поиска по выбранной переписке. Данная форма при наборе трех и более символов должна отображать выборку сообщений в ленте, для которых результат поискового запроса совпадает. Данный принцип поиска реализован на vk.com, но по списку переписок на этой странице: https://vk.com/im

Справа от формы поиска расположена кнопка «Действия», которая при нажатии разворачивает выпадающий список со следующими кнопками:

• Добавить участника – вызывает модал со списком контактов, который подтягивается из вкладки «Мои контакты». В данном модале контакты отображаются в алфавитном порядке, а сверху присутствует форма поиска:
  • Поиск по контактам
  • Выбранные: Фамилия имя Х Фамилия имя Х
  • Фамилия имя(ссылкой на публичный профиль)
• Выбрать
  • Фамилия имя(ссылкой на публичный профиль)
• Выбрать

Добавить

При нажатии на кнопку «Выбрать», пользователь добавляется в поле «Выбранные». При нажатии на кнопку добавить, выбранные пользователи добавляются в ленту сообщений. При этом, в ленте сообщений отображается уведомление: «Имя Фамилия добавил к этому чату пользователя(ей): Имя Фамилия, Имя Фамилия и т.д. (список выбранных пользователей через запятую)».

Из поля «Выбранные» пользователя можно удалить, кликнув по крестику, рядом с его именем.

• Удалить переписку – данная кнопка удаляет ленту сообщений. При нажатии на данную кнопку отображается модал с подтверждением намерений об удалении.
• Пожаловаться на спам и уведомить администрацию – при нажатии на данную кнопку отображается модал с подтверждением намерения отправки заявки с текстом: «Если вы считаете, что Ваш собеседник рассылает спам со своего аккаунта, нажмите на кнопку «Отправить заявку» и мы рассмотрим Ваш запрос в ближайшее время», и кнопками «Отправить заявку» и «Отмена». При нажатии на кнопку «Отправить заявку», у пользователей, участвовавших в данной ленте сообщений она отображается в общем списке с описанием «Помечена как спам пользователем «Фамилия Имя». При выставлении данной метки участники беседы не могут войти в данную ленту сообщений до рассмотрения заявки администрацией и принятии решения(нажатия определенной кнопки действия в разделе «Заявки» по данному запросу.
• Сразу после пометки администрации портала отправляется заявка, которая отображается в разделе админки «Заявки» со статусом «Спам». При переходе внутрь заявки она отображается в следующем виде:
• Статус заявки: Спам
• ID пользователя: 1697
• IDкомпании: 1(если заявка поступила от СА или ПУ, а также их сотрудников)
• Статус пользователя: Пользователь/СМ/СК/ПУ/СА
• В этом поле отображается 30 последних сообщений из ленты в аналогичной форме, как и в самой ленте сообщений.
• В данной таблице отображается информация об участниках беседы, помеченной как спам. В столбце «Действия» отображаются кнопки для произведения действий с пользователем:
• Участники беседы:

• Заблокировать пользователя – графическая кнопка. При нажатии на нее пользователь блокируется. При попытке войти в личный кабинет – ему отображается сообщение следующего типа алертом: «Ваш аккаунт на портале был заблокирован администрацией в связи с рассылкой спама. Если Вы желаете восстановить свой аккаунт, пожалуйста, свяжитесь с администрацией по адресу [email protected]и мы рассмотрим Ваш запрос.» После нажатия на кнопку «Ок», пользователя разлогинивает и переадресовывает на главную страницу портала.
• Запретить писать сообщения – графическая кнопка. При нажатии на нее у пользователя блокируется раздел «Сообщения» личного кабинета. При попытке в него войти, пользователю отображается сообщение следующего типа алертом: «Возможность писать сообщения была заблокирована для Вашего аккаунта администрацией портала в связи с жалобами других участников на рассылку спама, либо нарушения действующих правил. Для разблокировки данной функции, пожалуйста, свяжитесь с администрацией по адресу [email protected]и мы рассмотрим Ваш запрос.»
• Удалить пользователя – графическая кнопка. При нажатии на данную кнопку модератор удаляет пользователя из базы данных.
• Отмена – при нажатии на данную кнопку блокировка ленты сообщений снимается и в ленте последним сообщением отображается автоматическое уведомление от администрации: «Пользовательская заявка о рассылке спама была отклонена администрацией.»
• Отметить как прочитанное/не прочитанное – В зависимости от того, прочитано ли последнее сообщение пользователем в ленте сообщений, или нет – отображается кнопка либо «Отметить как прочитанное», либо «Отметить как не прочитанное». При условии, если в ленте участвует несколько человек, данное свойство действительно только для того пользователя, который производит действие с данной кнопкой. На остальных участников беседы это действие не распространяется.
• Показать всю историю сообщений – Данная кнопка отображает все сообщения между пользователями в определенной ленте. По умолчанию отображается не больше 30 сообщений в ленте

Данный раздел описывает отображение сообщений в ленте, а также дополнительный функционал для работы с ними. Визуальное отображение должно быть таким:

28 Мая 2014

Фамилия Имя 28.05.2014, 14:27

Здесь отображается текст сообщения

Поле для ввода сообщений > Прикрепить

Описание визуальных элементов

• 1.Аватар пользователя должен быть размером 100*100
• 2.Время отображается для каждого пользователя свое, согласно выставленным настройкам часовых поясов в Профиле пользователя, в разделе «Настройки аккаунта». Отображение:
• Часовой пояс:
• Ваши нынешние настройки часового пояса: 29.05.2014, 15:24:12 (GMT)
  • (GMT) Каир, Хельсинки, Калининград, Южная Африка, Варшава - выпадающий
  • Список
  • 3.На месте синего кружочка рядом с временем сообщения должна находиться иконка либо телефона, либо планшета, либо чата, при наведении на которую должно отображаться соответствующее уведомление: «Отправлено с телефона» и т.п.
  • 4.Поле для отображения текста – в данном поле действует ограничение на количество символов. Количество вводимого и выводимого текста составляет не более 4096 знаков с пробелами. При вводе текста в «Поле ввода сообщений», без прокрутки отображаться должно не более пяти строк. Если строк больше, чем пять – должна появляться полоса прокрутки. Сообщения отправляются по кнопке Enter, либо при нажатии на кнопку отправки справа от поля для ввода сообщений.
  • 5.Справа от поля для отображения текста в виде полупрозрачных кнопок отображаются сервисные кнопки:
  • Х – Удалить сообщение. При нажатии на данную кнопку любым из участников ленты сообщений, отображается уведомление «Сообщение удалено». При этом, аватарка пользователя, имя и время сообщения остаются, а сервисные кнопки пропадают.
  • ! - Пожаловаться на спам. Функционал данной кнопки аналогичен функционалу кнопки «Пожаловаться на спам и уведомить администрацию» в «Действиях», однако фраза «Помечена как спам пользователем «Фамилия Имя» отображается только вместо сообщения, а вся остальная лента не блокируется. Исключением при отображении такой заявки в админке является подсвечиваемое сообщение, которое пометили как спам(бекграунд подсвечивается бледно-красным).
• > - Переслать сообщение. Данная кнопка позволяет пересылать присланное сообщение от одного контакта(или сообщение, отправленное одному контакту) – другому контакту. При нажатии на данную кнопку, открывается модал со списком контактов, который подтягивается из вкладки «Мои контакты». В данном модале контакты отображаются в алфавитном порядке, а сверху присутствует форма поиска:
  • Поиск по контактам
  • Выбранные: Фамилия имя Х Фамилия имя Х
  • Фамилия имя(ссылкой на публичный профиль)
• Выбрать
  • Фамилия имя(ссылкой на публичный профиль)
• Выбрать

Отправить

При нажатии на кнопку «Выбрать», пользователь добавляется в поле «Выбранные». При нажатии на кнопку «Отправить», пересылаемое сообщение отправляется выбранному количеству пользователей.

Для переадресации, удаления, либо жалобы на несколько сообщений сразу, необходимо их сначала выделить. Выделить сообщения можно просто нажимая на каждое левой кнопкой мыши(можно нажимать на все поле сообщения, за исключением элементов, которые ведут ссылками в другие места, как, например, аватар пользователя, его Фамилия имя и т.п.). При выборе сообщения, оно отмечается галочкой под аватаркой, фон сообщения подсвечивается серым цветом(в стилях сайта), а полупрозрачные сервисные кнопки становятся насыщенных цветов. После того как необходимое количество сообщений выбрано, нужно нажать на одну из сервисных кнопок(в зависимости от того, хотим мы удалить сообщения, пожаловаться, либо переслать). При нажатии на сервисную кнопку – активируется аналогичный функционал, как и для одиночного сообщения для данной кнопки(3 варианта, описанные выше)

• 6.В правом нижнем углу, рядом с полем для ввода сообщений находится кнопка прикрепить. При нажатии на нее появляется выпадающий список со следующими вариантами:
• Фотографию – при нажатии на данный пункт, пользователю открывается менеджер файлов для выбора фотографии на компьютере. После заливки название файла отображается вместо кнопки «прикрепить». При отправке в ленту сообщений фотография в ленте вписывается в размеры 400*300. При клике на фотографию она отображается в модале в увеличенном размере(предлагаю резать фотографии до параметров 800*600(фотографии должны вписываться в данное поле). Можно добавлять фотографии следующих форматов: jpeg, gif, png
• Видео – при нажатии на данный пункт выскакивает модал, в котором находится поле для вставки ссылки. В модале присутствует уведомление о том, что поддерживаются ссылки из четырех видео-хостингов: youtube, rutube, vimeo и http://video.yandex.ua. Ниже отображается поле для вставки ссылки. После этого, при нажатии кнопки ОК вставленная ссылка должна обрабатываться и выполнять два условия:
• 1.Если ссылка ведет на любой другой домен, кроме заданных видео-хостингов, то должна выдаваться ошибка «Вы ввели не правильную ссылку»
• 2.Если ссылка ведет на поддерживаемый видео-хостинг, то она должна обрабатываться соответствующим образом и вставляться в iframeс заданными параметрами в ленту сообщений(вместо поля, где отображается текст сообщения. Если вставляется видео с сообщением, то сообщение отображается под видео-роликом). По умолчанию предлагаю размер видео устанавливать 640*360 и выводить его в таком размере в ленте сообщений. Видео должно обязательно иметь кнопку для развертки на весь экран, если иное не указано в параметрах самого видео-ролика.
• Файл - при нажатии на данный пункт открывается файловый менеджер для выбора файла на компьютере. В одном сообщении можно отправить не больше одного файла. Запрещено загружать файлы: exe, js(подумать, какие запретить еще)
• Загружаемые файлы имеют ограничение по размеру – 25 мегабайт.
• Прикрепленный файл отображается под текстом сообщения, с указанием его расширения. При клике на файл пользователю открывается файловый менеджер для сохранения его себе на компьютер.
• Подумать, где выводить прикрепленные файлы и индикаторы загрузки.