Применить технологию drag drop для строк таблицы ( HTML5, JavaScript )

Алексей17 лет в сервисе
Данные заказчика будут вам доступны после подачи заявки
10.08.2017

Пусть имеется HTML таблица с одним столбцом и несколькими строками (для примера возьмите 5 строк).

Необходимо применить функционал Drag Drop на чистом HTML 5, чтобы просто была возможность перетягивать строки таблицы (элемент tr), т.е. менять их местами,  так, чтобы после drop (завершении перетаскивания) tr строки (после изменения DOM) вызывалась JS функция, в которой было бы доступно значения 3 переменных:

ID только что передвинутой строки,

ID соседней строки сверху

ID соседней строки снизу.

Значения этих 3 переменных должны выводиться в console.log после каждого drop (перетаскивания) строки таблицы.

На выходе должен быть один html файл, содержащий HTML разметку, JS код, стили (на ваше усмотрение).