Картинка в пазл

Реализуйте библиотеку для превращения картинок в пазлы.

Основные возможности проекта

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

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

Библиотека должна предоставлять следующие возможности:

Загрузка изображения и его отображение на canvas.
Разбиение изображения на фрагменты по сетке (rows × cols).
Перемешивание фрагментов (с возможностью сохранения одного фрагмента на месте).
Перетаскивание фрагментов мышью (drag-and-drop).
Подсчет времени сборки (секундомер).
Подсчет количества ходов.

Параметры настройки

При создании пазла можно задавать параметры:

image - ссылка на изображение или HTML-элемент.
rows - количество строк фрагментов.
cols - количество столбцов фрагментов.
shuffle - процент перемешивания (0-100).
onComplete - callback при завершении сборки.

Структура пазла

Пазл должен отображаться на canvas. При разбиении на фрагменты каждый фрагмент помещается в отдельную ячейку сетки. Фрагменты можно перетаскивать, меняя их местами. При правильной сборке все фрагменты становятся на свои места и отображается картинка целиком.

Интерактивность

Взаимодействие с пазлом через мышь:

Клик по фрагменту - выделение.
Клик по пустой ячейке - перемещение выделенного фрагмента.
Drag-and-drop - перетаскивание фрагмента на другую ячейку.

Использование библиотеки

Пример использования библиотеки:

Подключить CSS-файл со стилями пазла.
Подключить JS-файл с библиотекой.
Создать контейнер для пазла.
Инициализировать пазл с настройками.

События

Библиотека должна генерировать события:

onShuffle - после перемешивания фрагментов.
onMove - при каждом перемещении фрагмента.
onComplete - при завершении сборки пазла.

Публикация на GitHub

Библиотека должна быть выложена на GitHub с:

README.md с описанием и инструкцией по установке.
Демо-страницей с примерами использования.
Исходным кодом библиотеки.

Тестирование

Библиотека должна быть протестирована на:

Разных браузерах (Chrome, Firefox, Safari, Edge).
Разных размерах изображений.
Разной сложности (3x3, 4x4, 5x5).

Дополнительные возможности

Автоматическая сборка пазла (кнопка "Собрать").
Анимация перемещения фрагментов.
Запись и воспроизведение ходов сборки.