Список drag n drop для сенсорных экранов + выдвижное меню справо и сле

Николай12 лет в сервисе
Данные заказчика будут вам доступны после подачи заявки
26.07.2015

Список из 40 элементов div c текстом . При нажатии и удержании 2 секунды на div, элемент становиться активным (обводиться рамкой) – его можно перемещать вниз или вверх. При перемещении элемент «выталкивает» соседние элементы. Когда палец отпустили – рамка исчезает, элемент встает в список. При длинном вертикальном списке, когда часть элементов скрывается за пределами экрана, перемещаемый вниз или вверх элемент должен двигать страницу заблаговременно – 20% от низа/верха экрана (чтобы было видно, куда перемещаем), расстояние (20%) регулируемое.

При кратковременном нажатии элемент становиться редактируемым (contenteditable) и растягивается во весь экран (анимировано), снизу экрана кнопки «Отмена» и «Сохранить» - сохранение изменений в тексте или отмена. При нажатии на одну из кнопок элемент сворачивается (анимировано).

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

Свайпы не должны конфликтовать с выдвижными меню. (например мы сделали свайп для активации меню, а у нас еще и удалился элемент)

Зона срабатывания выдвижного меню - 20 % от края по обе стороны (% можно менять до 100% - тогда соответственно меню будет срабатывать просто от свайпа вправо/влево в любом месте экрана). Также нужно чтобы срабатывало, если движение началось за пределами экрана.

Длину свайпа для срабатывания меню, а также для удаления элементов нужно сделать регулируемой

При свайпе элемент всегда перемещается вместе с пальцем. При медленном скроле элементы не должны становиться активными. При быстром перемещении, элемент не должен «отставать» от пальца.

Анимация перемещения элементов плавная, без рывков.

Приложение адаптивно к ширине экрана телефонов.

Весь js код (каждый оператор) должен быть прокомментирован.

Работа на android (браузер) от 4.0

Допустимо использование Jquery и др. библиотек

Оплата после теста лично, при встрече в Москве или через Яндекс деньги/ Webmoney(r-кошелек) / Сбербанк.