Pull to refresh

Firefox Addon: Постраничная навигация в стиле Google Reader для любого сайта.

Reading time 2 min
Views 1.5K
Все наверное знают как сделана постраничная навигация в Google Reader. Изначально подгружается примерно столько непрочитанных новостей, сколько влазит на экран, а далее, по ходу того как страница скроллится вниз, асинхронно подгружаются остальные новости.

Чем хороша такая система? Пожалуй тем, что она прозрачна и незаметна: пользователь перемещается по страницам ничего для этого не делая, просто читая новости в своём rss ридере. Есть, конечно у такого подхода и недостатки, но заметка не об этом.

Итак, сегодня вечером я совершенно случайно наткнулся а плагин к firefox, который позволяет сделать аналогичную постраничную навигацию практически для любого сайта, более того, он изначально содержит настройки для множества известных сайтов: Digg, Google, Wikipedia и т.д.



Называется это чудо AutoPager, и поставить его можно здесь.
Принцип действия его очень прост. Когда страница проскролливается вниз, AutoPager находит ссылку на следующую страницу, скачивает её, выкидывает всё ненужное (или оставляет всё нужное), а результат вставляет в текущую страницу. Витоге получается эффект как в Google Reader.

У пользователя есть возможность отключить такую навигацию в любой момент, просто кликнув по иконке в статус-баре броузера, но самое главное — есть возможность настроить плагин так, что он будет работать с любым сайтом.
Для этого в настройках надо задать:
  • Url сайта (можно regexp'ом)
  • xpath для ссылки на следующую страницу
  • xpath для элементов которые динамически добавятся на текущую страницу
  • xpath для контейнера в который вставятся элементы из предыдущего пункта


Это самый простой вариант настройки, есть и дополнительные опции. А ещё есть визард, который позволяет задать настройки просто кликая по элементам страницы.
Опять же есть база настроек для разных сайтов добавленных другими пользователями, и она, судя по всему регулярно обновляется.

И на закуску настройка, которую я сделал для хабра (я её уже засабмитил в репозиторий, но она ещё не прошла ревью):

<autopager>
<site><urlPattern>http://.*\.?habrahabr\.ru/.*</urlPattern>
<guid>C7CFB529-8F24-D4F8-F42F-894E-FDB0-D91B</guid>
<owner>destel</owner>
<urlIsRegex>true</urlIsRegex>
<published>true</published>
<contentXPath>//div[@id="main-content"]/div[@class="hentry" or @class="page-nav"]</contentXPath>
<testLink>http://habrahabr.ru/</testLink>
<linkXPath>//a[@class='next']</linkXPath>
<desc>http://habrahabr.ru/</desc>
</site>
</autopager>


Добавить можно так: копируем код в буфер обмена, кликаем правой кнопкой по иконке в статус-баре, выбираем «manage setting», жмём на кнопку «Import» и в появившемся меню выбираем «Import from Clipboard»

Upd: Настройки для хабра уже добавлены в общедоступную онлайн базу. Теперь чтобы они подхватились нужно кликнуть по иконке в статус-баре, выбрать в контекстном меню «Import from URL» и нажать OK.

Tags:
Hubs:
+36
Comments 23
Comments Comments 23

Articles