Firefox плагин для сортировки комментариев на DOU
Привет, ребята!
Так, как я очень люблю DOU, как и многие другие, я решила написать плагин под Firefox 29+ (и новее) для сортировки комментариев на DOU и поделится им с сообществом. Плагин может быть особенно полезен в длинных топиках, когда хочется сразу полистать последние комментарии, не делая обход всего дерева. Установить его можно по ссылке: addons.mozilla.org/.../addon/dou-sort-comments. Исходный код плагина доступен здесь: github.com/...irinkav/dou-sort-comments. Во время разработки плагина пользовалась отличным руководством на официальном сайте Mozilla Firefox: developer.mozilla.org/...-US/Add-ons/SDK/Tutorials.
Функции
- Сортировка комментариев включить/выключить
Техническая комплектация решения
- Платформа: Firefox 29+
- API: Firefox Add-on SDK
- Язык: JavaScript
- Дополнительные библиотеки: jQuery v1.11.1
Описание решения
- dou-sort-comments/lib/main.js — основной скрипт, с которого начинается запуск плагина Firefox’ом. В этом скрипте описано следующее:
- следим за загрузками страниц (pageMod.PageMod)
- интересуемся любыми страницами, размещенными на доменах *.dou.ua и *.developers.org.ua (include: [«*.dou.ua», «*.developers.org.ua»])
- ждем окончания загрузки страницы со всеми CSS/JS/images перед отправкой сообщения типа loaded (contentScriptWhen: «end»)
- подключаем внешние библиотеки к плагину
contentScriptFile: [self.data.url("jquery-min.js"), self.data.url("my-script.js")]
где,
jquery-min.js (dou-sort-comments/data/jquery-min.js) — многими известная библиотека для работы с HTML страничками. Её я использую для сортировки комментариев на странице
my-script.js (dou-sort-comments/data/my-script.js) — мой скрипт, в котором находится обработчик сообщений о том, что страница выгружена пользователю - чтоб послать сообщение о том, что страница полностью загружена типа loaded (из main.js) в слушателсь из my-script.js, я использую следующий код:
worker.port.emit("loaded");
- dou-sort-comments/data/my-script.js — простенький обработчик сообщений типа loaded, так что проблем с его пониманием не должно быть.
- Сортировку комментариев на страничке реализовала с использованием jQuery sort API. Код находится в dou-sort-comments/data/my-script.js в функции с названием sort
- Для того, чтоб отслеживать изменения динамического контента использовала подход, основанный на MutationObserver’е
- На случай, если будут приходить какие-либо AJAX ответы, которые могут изменить DOM страницы, решила использовать подход на основе debounce’а, который заключается в том, что сколько бы не было запросов на протяжении (в моем случае 300 мс), функция будет выполнена лишь один раз за установленное время (в моем случае 300 мс), в результате чего выиграем в производительности, потому как сортировку по DOM’у нужно будет делать всего 1 раз за 300 мс. Об этом подходе (debounce) можно прочитать здесь: Function Debouncing, откуда я стянула код для debounce’инга обращений за вызовом функции сортировки и в исходном коде не забыла сделать на это ссылку
P.S.: Если у кого будет время и желание мне помочь, то посмотрите пожалуйста мой код (можно по ссылке github.com/...ter/data/my-script.js#L28), и объясните мне в комментариях пожалуйста, почему не отрабатывает в моем случае вызов $("a.expand-thread").trigger(’click’); в плагине, который используется для разворачивания всех комментариев топика перед сортировкой, если свёрнутые (находим их по селектору a.expand-thread) имеются. Интересен в этой проблеме тот факт, что код $("a.expand-thread").trigger(’click’); работает на ура из под firebug debug консоли, из-за чего я в некотором замешательстве... Буду очень благодарна за помощь.
Мой workaround описанной выше проблемы, который работает:
var elements = document.getElementsByClassName("expand-thread"); for (var idx in elements) { var element = elements[idx]; if (/a/i.test(element.nodeName)) { element.click(); } }
Спасибо за внимание!
14 коментарів
Додати коментар Підписатись на коментаріВідписатись від коментарів