Создание галереи постраничных изображений - PullRequest
Новая
       9

Создание галереи постраничных изображений

0 голосов
/ 11 января 2012

Я пытаюсь создать здание галереи постраничных изображений поверх сценария галереи изображений "Galleria" (galleria.io)

У меня запущена тема "Фолио", и я пытаюсь понять их API, так как я не так хорошо понимаю query / js. В общем, вот с чем я работаю:

Их API (http://galleria.io/docs/1.2/api/methods/#manipulation)

И их звонок на мою страницу: 

<script> 

// Load the classic theme
Galleria.loadTheme('galleria/themes/folio/galleria.folio.min.js');

// Initialize Galleria
$('#galleria').galleria({

dummy: '/images/noimage.jpg',
showInfo: false,
transition: 'pulse',
thumbCrop: 'width',
imageCrop: false,
carousel: false,
show: false,
easing: 'galleriaOut',
fullscreenDoubleTap: false,
_webkitCursor: true,
_animate: true
});

</script>

Я написал следующее, чтобы вытащить мои изображения из каталога и перечислить их в соответствующем элементе div, который показан здесь: 

   <div id="galleria">
       <?php
     $a = array();
       $dir = '../public/uploads/2012/01';
       if ($handle = opendir($dir)) {
       while (false !== ($file = readdir($handle))) {
         if (preg_match("/\.png$/", $file)) $a[] = $file;
        elseif (preg_match("/\.jpg$/", $file)) $a[] = $file;
       elseif (preg_match("/\.jpeg$/", $file)) $a[] = $file;
      }
     closedir($handle);
      }
      foreach ($a as $i) {
       echo "<img src='" . $dir . '/' . $i . "' />";
      }
?>
    </div>

Браузеру требуется год для загрузки всех 400 тыс. Изображений, и мне нужно создать систему с разбивкой по страницам, используя приведенное выше. Справочник по API гласит: 

3. DON’T ADD TOO MANY IMAGES AT ONCE

There are no limits to how many images you can add, but after 30 it can clog the pipes on load, especially in IE. Use a reasonable amount of images at first, then try the .load(), .splice() and .push() methods to add/remove image data on the fly.

Как показано на http://galleria.io/docs/1.2/references/optimize/

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

Спасибо!

1 Ответ

0 голосов
/ 11 января 2012

У вас есть две опции:

  1. AJAX и PHP:

    Выполните AJAX-вызов скрипта PHP, который возвращает диапазон изображений из вашего каталога с заданнымномер страницы.Затем используйте функцию .splice() для очистки текущей галереи и .push() для ее повторного заполнения.

  2. Только PHP

    Возьмите текущий код PHP и посчитайте количество изображений в массиве.Затем отправьте диапазон этого массива в галерею для отображения.

    (псевдо-код) 

    $number_of_images = count($a);
for($i = $number_of_images_per_page * $page_number; $i < $number_of_images_per_page; $i++){
    if($i == $number_of_images)
        break;
    echo "<img src='" . $dir . '/' . $a[$i] . "' />";
}
...