Гиркало Вадим - программист фрилансер и разработчик (freelancer, developer) сайтов на TYPO3

Ох, как давно я не писал сюда. Уже некоторые даже звонят и спрашивают - занимаюсь ли я TYPO3 ещё? На всякий случай всем хочу сказать, что TYPO3 - это любовь на всю жизнь! В блог я могу и не писать по разным причинам, но TYPO3 занимался, занимаюсь и заниматься буду.
Теперь по теме. По различным причинам, но назрел у меня вопрос развертывания TYPO3 на моей локальном компьютере, а конкретнее - на Windows 8. В принципе ничего военного, но, как обычно, есть свои нюансы.

Выбираем инсталлер (Installer)

Почему-то, для себя я выбрал первый вариант - Bitnami и потом не пожалел. Очень обрадовался когда увидел там почти свеженькие сборки 7.3.0 и 6.2.13

Установка и настройка инсталлера

Процесс установки не вызвал никаких проблем. По ходу дела я выбрал также установку phpmyadmin, что позже стало даже полезным.

Итак, после установки в директорию C:\Bitnami\typo3\ увидим такую структуру:

23.07.2015  10:31    <DIR>          apache2
23.07.2015  14:56    <DIR>          apps
23.07.2015  10:27    <DIR>          common
23.07.2015  18:08    <DIR>          imagemagick
23.07.2015  10:27    <DIR>          img
23.07.2015  10:30    <DIR>          licenses
23.07.2015  10:26    <DIR>          mysql
23.07.2015  10:31    <DIR>          php
23.07.2015  10:30    <DIR>          scripts
23.07.2015  10:27    <DIR>          sqlite
26.06.2015  12:58    manager-windows.exe <= это запускалка мускула и апача!

Самое интересное происходит в папке apps. Там есть еще 2 папки - phpmyadmin и typo3. Вот тут-то я и понял, что каждый сайт в данном инсталлере играет роль приложения (application). Чтобы каждый сайт имел приятный url, я полез C:\Bitnami\typo3\apache2\conf\bitnami\bitnami-apps-vhosts.conf  и добавил следующие строки:

Include "C:/Bitnami/typo3/apps/typo3/conf/httpd-vhosts.conf"
Include "C:/Bitnami/typo3/apps/phpmyadmin/conf/httpd-vhosts.conf"

а в файлах httpd-vhosts.conf описал виртуальные хосты, например для phpmyadmin:

<VirtualHost *:80>
    ServerName phpmyadmin.example.com
    ServerAlias www.phpmyadmin.example.com
    DocumentRoot "C:\Bitnami\typo3/apps/phpmyadmin/htdocs"
    Include "C:\Bitnami\typo3/apps/phpmyadmin/conf/httpd-app.conf"
</VirtualHost>

Впервые столкнулся с необычным явлением - картинки на TYPO3-сайте выглядят несколько темнее, чем те оригиналы, которые я загружал. Поспешу сказать, что сама TYPO3 тут абсолютно ни при чём. Она "виновата" лишь в том, что для всех манипуляций с картинками использует графические библиотеки IM (ImageMagick) или GM (GraphicsMagick). В моём случае это был ImageMagick. Вначале я решил исследовать на эту тему все настройки TYPO3 в разделе Install/All Configuration. Там меня заинтересовал параметр - colorspace, значение которого было - RGB, а коментарий к параметру:

1. String: Specifiy the colorspace to use. Some ImageMagick versions (like 6.7.0 and above) use the sRGB colorspace, so all images are darker then the original. 

1. Possible Values: CMY, CMYK, Grey, HCL, HSB, HSL, HWB, Lab, LCH, LMS, Log, Luv, OHTA, Rec601Luma, Rec601YCbCr, Rec709Luma, Rec709YCbCr, RGB, sRGB, Transparent, XYZ, YCbCr, YCC, YIQ, YCbCr, YUV

...In the above example, the result is darker than the original, because the channels were separate as linear gray and subsequently combined as linear color. In order to return the channels back to sRGB, one must change the colorspace from RGB back to sRGB after the -combine step.

Т.е. все пути вели к значению sRGB. После того, как я поменял RGB на sRGB в файле конфигурации (typo3conf/LocalConfiguration.php)  появилась такая строка:

'GFX' => array(
'colorspace' => 'sRGB', 'gdlib_png' => 1,
'im_combine_filename' => 'composite',
'jpg_quality' => '80',
),

 И о чудо! Картинки стали светлее!

p.s. После смены значения параметра colorspace, TYPO3 может какое-то время заниматься переконвертацией всех картинок в соответствии с новыми графическими настройками, поэтому сайт может вести себя не совсем адекватно. В моем случае это был абсолютно белый экран, который пропал минут через 5.

При формировании меню с помощью FLUID, а точнее вьюхелпером - page.menu из пакета VHS, столкнулся с задачей передачи значения константы TYPO3 в качестве одного из параметров вьюхелпера.

Вот как выглядел viewhelper изначально:

<v:page.menu showHidden="1" doktypes="3" classCurrent="" classActive="" classFirst="" classLast="last" pageUid="26">
<ul class="socicons-container">
<f:for each="{menu}" as="menuLink" iteration="menuIterator">
<li {f:if(condition: menuIterator.isLast, then: 'class="last"')}>
<a href="{menuLink.link}" title="{menuLink.title}" target="{menuLink.target}">
<img src="fileadmin/tmpl/florian/Resources/Public/images/icons/{menuLink.subtitle}" width="30" height="30" alt="{menuLink.title}" />
</a>
</li>
</f:for>
</ul>
</v:page.menu>

тут меню формируется на основании страниц, которые содержатся в системной папке с id=26.

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

Итак, создаем TYPO3-константу:

socialIcons = 26

Как же ее значение использовать вьюхелпером? Для этого нужен промежуточный этап. Сначала значение данной константы помещаем в объект lib:

lib.constants.socialIcons.id = {$socialIcons}

А вот значение параметра lib внутри вьюхелпера можно получить с помощью другого вьюхелпера - var.typoscript. В итоге получаем следующую конструкцию:

<v:page.menu showHidden="1" doktypes="3" classCurrent="" classActive="" classFirst="" classLast="last" pageUid="{v:var.typoscript(path: 'lib.constants.socialIcons.id')}">
<ul class="socicons-container">
<f:for each="{menu}" as="menuLink" iteration="menuIterator">
<li {f:if(condition: menuIterator.isLast, then: 'class="last"')}>
<a href="{menuLink.link}" title="{menuLink.title}" target="{menuLink.target}">
<img src="fileadmin/tmpl/florian/Resources/Public/images/icons/{menuLink.subtitle}" width="30" height="30" alt="{menuLink.title}" />
</a>
</li>
</f:for>
</ul>
</v:page.menu>

P.S. Т.к. в примере используется пакет VHS, то не забывайте подключать его с помощью - {namespace v=Tx_Vhs_ViewHelpers} в начале html-шаблона.