Как открывать картинки на отдельных страницах

При разработке галерии фотографий, в качестве ссылок на большие фотографии, обычно создают ряд небольших изображений (миниатюр). Открыть картинку в отдельном окне можно по такой ссылке: href='photo.jpg', или лучше href='dataFiles/$data[1]', записав в дескрипторе шаблона $types[1]=file.

А что делать, если мы хотим чтобы картинка, в открываемом в окне, допустим, имела рамку, размещалась посередине окна, и вокруг нее был какой-то фон? Другими словами, как открывать изображение именно на отдельной странице, а не как файл? Ответ казалось бы прост - пойти по ссылке от миниатюры и создать новую страницу по шаблону. Но для галереи с большим количеством картинок создавать каждый раз заново новую страницу слишком трудоемко. Рассмотим другие варианты решение этой задачи.

1. Отдельная страница для каждой фотографии.

photos.tpl (шаблон для миниатюры)

<?php
foreach ($tab as $dat)
echo "
    {$dat['edit']}
    <a href='?page=$dat[3]&file=$dat[2]'>
        <img src='dataFiles/$dat[1]'>
    </a>
";
?>

photos.tdd (дескриптор шаблона для миниатюры)

<?php

$titles[1]='Миниатюра';
$titles[2]='Большое фото';
$titles[3]='Шаблон страницы для фольшого фото';

$types[1]='file';
$types[2]='file';
$types[3]="page template('photo')"; // Шаблон по умолчанию 

$params['isMultiRec'] = true;

?>

photo.tpl (шаблон большого фото)

...
<img src='dataFiles/{$_GET['file']}'>
...

Закачка миниатюры и большой фотографии происходит в одном окне редактирования. У этого варианта имеется небольшой недостаток - для каждой миниатюры-ссылки, хоть и автоматически, но будет создаваться страница, что проявится в доп.записях в таблицах БД: pages и blocks. Хотя, справедливости ради нужно сказать, что таблиц для самих блоков создано не будет, так как в шаблоне photo данных нет (имя файла передается через URL).

2. Единая страница для всех фотографий.

Сначала стандартным способом необходимо создать страницу с шаблоном photo.tpl (шаблон см. в предыдущем примере). Для этого, где-то должна существовать ссылка, код для которой можно записать, например, в главном меню. При этом ссылку, естественно, нужно сделать невидимой для посетителей с помощью конструкции {if $isUser} или закомментировать ее после создания страницы.

mainMenu.tpl

...
<a href='?page=$dat[12]'>Выбрать шаблон для большого фото</a>

mainMenu.tdd

<?php
...
$types[12]='page';

?>

photos.tpl

<?php
foreach ($tab as $dat)
echo "
    {$dat['edit']}
    <a href='?page=999&file=$dat[2]'>
    	<img src='dataFiles/$dat[1]'>			
    </a>
";
?>

photos.tdd

<?php

$titles[1]='Миниатюра';
$titles[2]='Большое фото';

$types[1]=file;
$types[2]=file;

$params['isMultiRec'] = true;

?>

Примечания

1. В обоих примерах большое фото будет отображаться в том же окне браузера, закрывая страничку с миниатюрой. Чтобы оно открывалось в новом окне, в миниатюру-ссылку нужно добавть атрибут <a target=_blank ... >
   
2. Фотография будет выглядеть более презентабельно, если окно будет иметь определенные размеры, без главного меню. Чтобы управлять видом окна воспользуемся методом window.open из арсенала JavaScript. Шаблон миниатюры для второго примера в этом случае будет выглядеть так:

   photos.tpl

   <?php
   foreach ($tab as $dat)
   echo "
   {$dat['edit']}
   <a 
       href='?page={$page}'
       onclick='window.open(\"?page=999&file=$dat[2]\",\"\",\"width=800,height=600\"); 
                return false;'
   >
   <img src='dataFiles/$dat[1]'>			
   </a>
   ";
   ?>