srcset для Gallery 3.0.2 (Coollanta) и экранов повышенного разрешения

[mihas]

На современных мониторах и смартфонах с высоким разрешением ретина куда лучше выглядят картинки с удвоенным разрешением. Тег srcset позволяет указать браузеру, что в случае повышенного разрешения экрана можно использовать дополнительное увеличенное изображение, 2x, 4x. При этом на старых дисплеях обычного разрешения лишние увеличенные картинки не подгружаются.
Сделал для Gallery 3 свой srcset из папки resizes для превьюшек галереи. Для этого находим файл галереи \themes\wind\views\album.html.php и делаем себе его копию для правки. В нашей копии находим:

Код: Выделить всё

      <? if ($child->has_thumb()): ?>
      <?= $child->thumb_img(array("class" => "g-thumbnail")) ?>
      <? endif ?>

и заменяем на:

Код: Выделить всё

      <? if ($child->has_thumb() && $child->is_album()): ?>
		<?= $child->thumb_img(array("class" => "g-thumbnail")) ?> 
		<? endif ?>
		<? if ($child->has_thumb() && $child->is_album()==false): ?>
		<? $newIMG = $child->thumb_img(array("class" => "g-thumbnail")) ?>
		<? $newIMG = substr($newIMG,0,-2) ?>
		<?= $newIMG ?> srcset="<?= $child->resize_url() ?> 2x"/> 
      <? endif ?>

Почему сделаны отдельные условия для родительских каталогов и собственно альбомов. Я просто пока не нашел где брать большое изображение для обложки альбома. В галерее есть только фотка .album.jpg в каталоге thumbs и ее нет в каталоге resizes, ибо штатно этого не нужно было изначально. Поэтому srcset включается лишь для превью фоток в альбоме, но не для превью обложек альбомов. Пока так. Если есть идеи поинтереснее, с обложками альбомов высокого разрешения - напишите пожалуйста, будет полезно.

Теперь сделаем srcset повышенного разрешения для страницы photo - собственно страницы просмотра отдельной картинки. Тут все еще проще. Находим файл \themes\wind\views\photo.html.php, в нем следующую строку:

Код: Выделить всё

	<?= $item->resize_img(array("id" => "g-item-id-{$item->id}", "class" => "g-resize")) ?>

и заменяем на:

Код: Выделить всё

	<? $NewBigImg = $item->resize_img(array("id" => "g-item-id-{$item->id}", "class" => "g-resize")) ?>
	<? $NewBigImg = substr($NewBigImg,0,-2) ?>
	<?=$NewBigImg ?> srcset="<?= $item->file_url() ?> 2x"/>

Таким образом и на странице фотографии появляется ее увеличенный вариант (собственно оригинал фото) для современных экранов повышенного разрешения при корректных геометрических размерах фотки на странице, определенных в настройках галереи.