In-Site Messenger
=================

(тестовое задание на позицию JavaScript / Frontend девелопера)

Нужно сверстать прототип мессенджера, который встраивается в в веб-страницу,
наподобие того, как сделан мессенджер в Facebook.

Функциональность
================

- Изначально, при загрузке страницы, мессенджер находится в минимизированном виде,
  в виде маленького прямоугольника или иконки в правом нижнем углу страницы.

- Пользователь может открыть мессенджер, кликнув на этот прямоугольник

- Мессенджер открывается в небольшое окно, которое привязано к правому нижнему углу страницы,
  и содержит хедер (image), область для показа сообщений, область ввода/редактирования нового сообщения,
  и кнопку "Send"

- Поскольку это только прототип, никакой реальной отсылки сообщений на сервер не производится,
  а отправленные сообщения должны сразу появляться в области отображения сообщений.
  Но нужно предусмотреть в коде место, куда можно будет встроить отсылку сообщения на сервер.

- На окне мессенджера есть кнопка, позволяющая "отстегнуть" окно от веб-страницы
  в новое popup-окно (или таб) браузера

- Желательно предусмотреть промежуточный режим, когда мессенджер "отстегивается" от угла страницы,
  но остается в пределах страницы, и его можно двигать, как небольшое окно в пределах страницы.
  Т.е. он перестает быть закрепленным в правом нижнем углу, и становится resizable.

- В качестве расширения, можно реализовать сохранение и извлечение состояния мессенджера
  (позиция, размер, режим отображения - пристегнут / отсегнут в пределах окна / отстегнут в отдельное окно),
  и сообщений, которые были отправлены, в/из Local Storage браузера, чтобы при переходе на другую страницу сайта,
  мессенджер открывался в том же состоянии, в котором он был в момент ухода с предыдущей страницы.

- Верстка должна быть адавптивной. Например, если размер окна браузера недостаточно велик,
  то хедер нужно скрывать, или загружать уменьшенный хедер, кнопки делать меньше, и т.п.

- Большим плюсом будет, если библиотека будет работать нормально на мобильных девайсах.

Компоненты
==========

Результатом выполнения тестового задания должно быть два артефакта:

- библиотека, пригодная для повторного использования, оформленная в виде AMD (или другого) модуля,
  которую можно легко встроить в любой веб-сайт

- тестовоый вебсайт из одной или нескольких страниц, который демонстрирует подключение и работу библиотеки


Детали реализации
=================

Исходный код должен быть промышленного уровня качества.

Библиотека должна быть написана максимально объектно -
состоять из модулей, а модули из классов, с четко определенными интерфейсами,
и отделенными от интерфейсов реализациями.
Доступ к классам и функциям должнен быть максимально приватным.

Предпочтительный язык реализации - TypeScript

Используйте любой JavaScript/TypeScript стек технологий, с которыми Вы знакомы,
и которые считаете подходящими для этих задач

Библиотека должна быть оформлена в виде AMD-модуля (или каким-то подобным образом),
для легкого включения в web-страницу, где она будет использоваться

Код должен работать во всех популярных браузерах, критерии выбора браузеров определите вы.

Желательно показать использование CSS препроцессора.

Желательно выполнить запуск JavaScript валидатора, например lint, в процессе билда.


Оформление результатов
======================

Этот пункт очень важен, обратите, пожалуйста, внимание.

Когда Вы сообщите, что приложение готово, мы предоставим вам доступ к веб-серверу с FTP,
куда Вы сможете устновить готовое собранное тестовое приложение, чтобы оно было доступно по URL-у
для быстрой проверки работоспособности.

Исходный код приложения пришлите нам в одном полном пакете, который должен включать:

1. Текстовый README файл, описывающий кратко следующее:

    * какие части функциональности Вы реализовали

    * URL-ы на тестовом web-сервере, где можно быстро посмотреть результат

    * краткое описание того, как работает библиотека, тестовое приложение, какие есть особенности, и т.п.

    * какие использовались JavaScript технологии для различных частей системы

    * на какой операционной системе велась разработка, в каком IDE

    * инструкции для пользователей библиотеки мессенджера по встраиванию мессенджера в вебсайт

    * инструкции по сборке библиотека и тестового приложения, рассчитанные на человека,
      не знакомого с вашим JavaScript стеком, то есть полную последовательность консольных команд
      для установки нужного окружения и для сборки.
      Сборка должна включть версию для девелопмента и минимизированную версию для релиза.

2. Полный исходный код приложения. Не нужно заливать его на публичные репозитории кода,
   такие как github, bitbucket, и т.п.

Соберите, пожалуйста, все это в один zip-архив, и пришлите одним письмом все сразу.


Коммуникация в процессе работы над заданием
============================================

Дайте нам знать, пожалуйста, когда Вы беретесь за выполнение задания, и в дальнейшем,
сообщайте раз в несколько дней, как продвигаются дела. Если по каким-то причинам
Вы прекратите работу над заданием, сообщите об этом тоже.

Мы постарались включить в текст задания все необходимые детали,
но если что-то не совсем ясно, можно созвониться с техническим специалистом нашей
компании, и все уточнить.

--

Спасибо за Ваш интерес к этой вакансии.