Расширенная система навигации

1. Введение

Нередко разработчики web-приложений сталкиваются с задачей постраничного разбиения данных, будь то большой массив записей или объемный текст. В процессе реализации программного решения задачи возникает вопрос – как же организовать перемещение пользователя по страницам так, чтобы это, с одной стороны, было удобно, то есть чтобы панель навигации выполняла свое прямое назначение, и, с другой стороны, имело бы приемлемый внешний вид.

2. О рассматриваемых в статье вопросах

Существует много вариантов реализации навигационной панели. Остановимся на нескольких, наиболее распространенных.

Пример 1. Простейшая навигационная система c выводом всех страниц для 20 страниц выглядит так

<< < 1 2 3 4 5 6 7 8 9 10 [12] 13 14 15 16 17 18 19 20 > >>

Пример 2. Навигационная система с выводом ограниченного ряда страниц для 20 страниц выглядит так
<< < … 8 9 10 11 [12] 13 14 15 … > >>

Навигация этого типа, например, применяется на таких известных поисковых системах, как Яndex и Google.

Пример 3. Навигационная система с реперными точками для 20 страниц выглядит так
1 … 5 … 10 11 [12] 13 14 15 … 20

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

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

Пример 4. Навигационная система с принципом дистанцирования для 350 страниц выглядит так
<< < 100 ... 110 120 ... 122 123 124 [125] 126 127 128 ... 130 140 150 160 170 180 190 ... 200 300 > >>

Второй вопрос, которого мы коснемся в статье, будет касаться ссылок. Априори полагаем, что переменные от страницы к странице будут передаваться методом GET. Встает вопрос – каким образом эффективно менять значение текущей страницы в QUERY_STRING и формировать ссылку? Решение дает функция, которая позволяет изменять значение параметров, передаваемых в QUERY_STRING, не изменяя общий вид самой строки.

3. Детали реализации

Навигационная система реализована в виде класса. Это упрощает интеграцию в различные приложения.
Общий подход в формировании массива ссылок такой. Сначала формируется текстовая строка, содержащая панель навигации в заданном формате. Затем эта строка при помощи регулярных выражений преобразуется в массив ссылок, готовый к отображению.

Навигационная панель формируется из трех частей – середины, левой и правой. Середина представляет собой текущую страницу, окруженную сателлитами (страницами, удаленными от данной не более чем на задаваемое число, меньшее десяти). Правая и левая части формируются согласно принципу дистанцирования, сначала перечисляются страницы, удаленные на 10*k, 1<=k<=9 от текущей, затем на 100*m, 1<=m<=9, и так далее. В реализации функций, выводящих левую и правую части, применена рекурсия (вызов функции самой себя со специально подобранными параметрами, применяется, например, при обработке деревьев).

Перейдем к рассмотрению того, как формируются ссылки. Классу задается формат ссылки, например, в таком виде

<a href=”[href]”>[page]</a>

где строка может иметь любой вид, за исключением двух тэгов [href] и [page], которые будут заменены соответственно на URL и номер страницы. URL формируются, исходя из системных переменных, дающих значение имени скрипта и строки QUERY_STRING. Строка QUERY_STRING обрабатывается отдельной функцией, которая меняет значение параметра page на заданный, не изменяя значений других параметров и, тем самым, сохраняя общий вид строки. Если в строке не было этого параметра, функция добавит его, внеся требуемые изменения.

4. Пример работы с классом

<?php

// Пример работы

include_once(“advanced_nav.class.php”)

// Определяем класс
$nav_class=new advanced_nav();

// Инициализация. Задаем начальные условия
$nav_class->init("<a href='[href]'>[page]</a>",125,350,3);

/*
Здесь:
<a href='[href]'>[page]</a>" – формат ссылки
125 – номер текущей страницы
350 – общее число страниц
3 – число сателлитов
*/

// Строим панель навигации
$nav_class->build_nav();

// Выводим панель навигации пользователю
$nav_class->print_nav();
?>

5. Скачать
Скачать ( http://webscript.ru///webscript.ru/script/Source.rar )