Показать сообщение отдельно
Старый 06.04.2009, 01:20 Вверх   #4
Коварный тип
 
Аватар для Serberg
Serberg вне форума
Доп. информация
Хорошо Paginator 3000 - продвинутая навигация

Paginator 3000

В хаках и модах уже дважды упоминался мод "постраничной навигации будущего", как на Dirty.ru и оба раза в комментариях были отзывы, что не все могли поставить эту навигацию на 7-ю версию DLE. Ларчик открывался просто - было слишком много лишних телодвижений (особенно в последней реализации, не в обиду автору). А чтобы поставить навигацию, надо было всего лишь взять оригинал скрипта от karaboz'a.
Перед тем, как ставить, пожалуйста, прочитайте руководство полностью - в комментариях и в послесловии я освещаю несколько хитрых моментов, которые могут вызвать недопонимание, если поторопиться с установкой. В частности - аспект кроссбраузерности при табличной вёрстке.
Итак...

Автор гайда: Darkmind
Версия DLE: 7.2 (если уловить идею, я уверен, можно прикрутить к любой версии)
Идея: ecto
Реализация: karaboz

0. Перед любыми изменениями "на живую" не забывайте делать резервные копии изменяемых файлов.

1. Скачиваем архив paginator3000.zip из вложения к сообщению.

2. Распаковываем и раскладываем файлы из архива:
- slider_knob.gif кладём в папку /templates/ВАШ_ШАБЛОН/images/
- paginator3000.css - в папку /templates/ВАШ_ШАБЛОН/css/
- paginator3000.js - в папку /templates/ВАШ_ШАБЛОН/js/ (по умолчанию такой папки нет - надо создать).
- [!] Не забываем создать в папке js файл .htaccess с содержанием:

PHP код:
Order Deny,Allow
Allow from all 
3. Теперь прописываем навигацию в код:
3.1. Открываем main.tpl.
Находим:

Код:
</head>
Перед этим тэгом дописывам:

PHP код:
<style type="text/css" media="all">
@
import url(/templates/Simple/css/paginator3000.css);
</
style>
<
script type="text/javascript" src="/templates/Simple/js/paginator3000.js"></script> 
N.B. Здесь фигурировало url({ THEME })/css/ *без пробелов*, но движок в предпросмотре меняет переменную на ее значение, поэтому обратите на это внимание при добавлении кода - вместо http://адрес-сайта/templates/Simple/ должно быть { THEME }/ *без пробелов*.

3.2. Открываем navigation.tpl и меняем его полностью на:

PHP код:
<div align="center">
<
div class="paginator" id="paginator_example">
<
div class="navigation" align="center">[prev-link]Назад[/prev-link] {pages} [next-link]Далее[/next-link]</div>
</
div>
<
script type="text/javascript">
window.onload = function(){
    
paginator_example = new Paginator(
        
"paginator_example"// id контейнера, куда ляжет пагинатор
        
{totalpages}, // общее число страниц
        
10// число страниц, видимых одновременно
        
{currentpage}, // номер текущей страницы
        
"{sitelink}" // url страниц
    
);
}
</script>
</div> 
Такая реализация предусматривает то, что если по какой-то причине не грузит JS, то будет видна стандартная навигация по страницам.

3.3. Теперь надо рассказать движку про новые шаблонные переменные. Для этого открываем файлы /engine/modules/show.short.php и /engine/modules/c_navigation.php - изменения в них будут идентичными. То есть, проще говоря, в каждом модуле, где будет требоваться постраничная навигация надо определить шаблонные переменные {totalpages}, {currentpage} и {sitelink}.
Итак в обоих вышеупомянутых файлах, находим:

Код:
      $tpl->set('{pages}', $pages);
После дописываем:

Код:
      $tpl->set('{currentpage}', $cstart);
      $tpl->set('{totalpages}', $enpages_count);
      if ($config['allow_alt_url'] == "yes") {
          $tpl->set('{sitelink}', $config['http_home_url'].'page/');
      }
      else {
          if(empty($user_query)) {
             $tpl->set('{sitelink}', "$PHP_SELF?cstart=");
          }
          else {
             $tpl->set('{sitelink}', "$PHP_SELF?$user_query&cstart=");
          }
      }
Всё.

P.S. В заключение еще раз сделаю акцент на самой идее. Перво-наперво надо подключить js и css файлы:

Код:
<link rel="stylesheet" type="text/css" href="paginator3000.css" />
<script type="text/javascript" src="paginator3000.js"></script>
Затем можно вызывать навигацию:

Код:
<div class="paginator" id="paginator_example"></div>
<script type="text/javascript">
window.onload = function(){
    paginator_example = new Paginator(
        "paginator_example", // id контейнера, куда ляжет пагинатор
        50, // общее число страниц
        10, // число страниц, видимых одновременно
        15, // номер текущей страницы
        "http://www.yourwebsite.com/pages/" // url страниц
    );
}
</script>
Ну и напоследок пару общих фраз. Как видно из комментариев, чтобы навигация успешно заработала в движке - надо ей передать хотя бы два параметра - общее число страниц и номер текущей страницы. URL и число страниц, видимых одновременно можно прописать и в этом кусочке кода. Передавать эти параметры надо через соответствующие модули в /engine/modules. Я не стал искать другие версии движка, чтобы создать единое решение - для меня главным было объяснить и донести идею.

Своё решение я попытался сделать чуть более универсальным и добавил переменную {sitelink}, которая автоматически вписывает адрес сайта и подстраивается под включённость или выключенность ЧПУ.

P.P.S. И еще одно немаловажное "но". Из-за того, что пагинатор завязан на ширине таблицы, в Internet Explorer при использовании табличной вёрстки вместо номеров страниц может появляться NaN. Это вызвано тем, что IE не знает ширину таблицы до её полной загрузки. Решение - заключить вызов пагинатора в window.onload = function(){ .... }.
Побочный эффект такого решения - на долю секунды успевает проскочить стандартная навигация по страницам. Такова жертва универсальности и кроссбраузерности. Избавиться от этого можно лишь частично - поставив проверку на используемый браузер и не передёргивать window.onload() в случае, если это не IE.
Изображения
Тип файла: png paginator3000.png (4.8 Кб, 71 просмотров)
Вложения
Тип файла: zip paginator3000.zip (8.9 Кб, 9 просмотров)
  Ответить с цитированием
Cказали cпасибо:
 
Время генерации страницы 0.07821 секунды с 11 запросами