Как сохранять состояние сортировки элементов в Isotope JS (Masonry)?

Question

[Avt_1]

Всем привет!

Дано:
На сайте плиточная структура элементов. Плитка представляет из себя картинку со встроенной ссылкой.
«Плитки» можно отсортировать в случайном порядке после загрузки страницы.
Для сортировки используется Isotope ( isotope.metafizzy.co )

Демка: codepen.io/anon/pen/mPEzLJ

Проблема:
После перехода по ссылке на новую страницу, пользователь, если вернётся назад на главную, попадает на страницу где элементы опять пересортировались. Не сохраняется последнее состояние сортировки, а хочется это исправить.

Примерный алгоритм решения задачи я вижу так:
При каждой сортировке: получить текущие позиции -> сохранить их в Local Storage.
При загрузке страницы: проверить есть ли данные в Local Storage, если есть - отсортировать в соответствии с ними.

Вопрос:
1. Как получить и сохранить текущий порядок в котором отсортированы плитки?
2. Как применить сохранённый порядок сортировки к плиткам чтоб вернуть их в нужное состояние?

Answer 1

[Алексей Зуев]

Можно перейти к документации и найти там

How can I access filtered items in current order?

Плагин не двигает элементы в DOM, порядок меняется через position: absolute, но порядок знает объект, расположенный в $grid.data('isotope') через свойство filteredItems, которое является массивом.
Вобщем, я предлагаю сохранять объект-маппер, в котором будет сопоставление

store[индекс в DOM] - индекс в отсортированном массиве

Пример реализации.