delusionworld blog

2.1 Requirements

• PHP 5.3.3 or newer (but not PHP 6)
  • Modules: mbstring, pdo_sqlite
  • Configuration: magic_quotes_gpc = off
• Apache
  • Apache modules: mod_rewrite
  • Apache configuration: AllowOverride FileInfo

# If you don’t have running setup for this I would recommend xampp => http://www.apachefriends.org/en/xampp-windows.html

# I’m for example just had to update to the latest version which comes with PHP 5.3.5

2.2 Getting TYPO3 Phoenix Files

2.2.1 Git

# you need an installed git for this – I would recommend cygwin (http://www.cygwin.com/)

# an alternative is msysgit (http://code.google.com/p/msysgit/)

Go to your htdocs directory (in my case D:/www) and execute the following commands:

git clone --recursive git://git.typo3.org/TYPO3v5/Distributions/Base.git TYPO3v5
cd TYPO3v5
git submodule foreach 'git checkout master; git pull'

2.2.2 Bash Files (Windows only)

Furthermore you need the two bat files for Windows – you get them here
http://forge.typo3.org/issues/show/4426
or as direct link as
http://forge.typo3.org/attachments/17838/flow3.bat
http://forge.typo3.org/attachments/17839/flow3_dev.bat

you need to place these two bat files into the TYPO3v5 folder and modify the “php” line… in my case it was
- SET PHP=php.exe
+ SET PHP=D:/Applications/xampp/php/php.exe -c D:/Applications/xampp/php/php.ini

2.2.3 Symlinks (Windows only)

# in order to use Symlinks with Windows you need the Link Shell Extension (http://schinagl.priv.at/nt/hardlinkshellext/hardlinkshellext.html)

You need to replace the two textfile flow3 and flow3_dev with real symlinks

flow3 => Packages/Framework/FLOW3/Scripts/flow3
flow3_dev => Packages/Framework/FLOW3/Scripts/flow3_dev

# I just deleted the two files and created the symbolic links like in the screenshot

2.3. Installation of TYPO3 Phoenix

Finally as you got all the needed files in the right places you can actually install TYPO3 Phoenix.

# If at any point you changed some settings but it won’t take them try clearing the cache with the following command inside the TYPO3v5 folder
flow3_dev flow3:cache:flush

# for me it looks like this
# D:\www\TYPO3v5>flow3_dev flow3:cache:flush
# Flushed all caches.

1) rename Configuration/Settings.yaml.example to Settings.yaml
# you can adjust your mysql settings here, but we just leave it to the default as we have those settings

2) uncomment the following two lines and adopt the path for the php Binary inside Settings.yaml
# core:
# phpBinaryPathAndFilename: 'D:/Applications/xampp/php/php.exe'

3) create Database “phoenix” for user root
# I used phpmyadmin for this; Doctrine will automatically create the tables for you

4) Exceute the following command inside the TYPO3v5 folder to import the demo page
flow3_dev typo3:site:import < Packages/Sites/PhoenixDemoTypo3Org/Resources/Private/Content/Sites.xml

5) Exceute the following command inside the TYPO3v5 folder to create an admin user with the password “password”
echo admin#password | flow3_dev typo3:setup:createAdministrator

# you can just skip this, as on the demo page you can simple create a demo use with one click

6) hit your Browser with http://localhost/TYPO3v5/Web/

As a Note: It is highly recommended to change the document root of the webserver to the Web subfolder of the distribution!
(we just skipped this step as it would need to modify the hosts file create a vhost etc… for a “real” page you should definitely do this)

Another Note: TYPO3v5 currently seems to have some problems with the backend if you install it in a subdirectory AND open it from the root page… so just open the BE from a subpage then it works just fine

2.3.1 keep in synch with git changes

Exceute the following commands inside the TYPO3v5 folder
git pull
git submodule foreach 'git checkout master; git pull'

If you want to translate some text with Fluid it’s easy. Just use the translate view Helper. Sometimes it even better to have some “markers” inside the translation so you won’t loose the context.
The following example shows how you can insert a translated link inside a translation (quite sick – I know…)

<f:translate key="text" htmlEscape="false" arguments="{0: '{f:translate(key: \'here\') -> f:link.action(action: \'show\')}'}" />
//locallang.xml
<label index="here">this link</label>
<label index="text">You can use %1$s to register.</label>
//output will be: You can use <a href="...">this link</a> to register.

The following code would also work but it’s much harder for the translators to understand what each label means.

<f:translate key="text_pre" />
<f:link.action action="show" /><f:translate key="here" /></f:link>
<f:translate key="text_post" />
//locallang.xml
<label index="here">this link</label>
<label index="text_pre">You can use </label>
<label index="text_post"> to register.</label>
//output will be: You can use <a href="...">this link</a> to register.

Finally I can present you the combination of my two favorite Open Source Worlds. Meaning MooTools and TYPO3.

MPM comes with a nice TYPO3 Mod where you can look through all the currently installed MooTools Packages with Demos, Doku, Search… all you need to get it working quite fast

So let’s talk about the reason… I mean I’m a pretty lazy guy. I don’t like to do stuff manually if there is any possibility to do it with some sort of automatism. And working on a big TYPO3 site with multiple MooTools Plugins can be quite a pain in the ass. Every Plugins has it’s own MooTools version and tries to include it. They (usually) don’t share a common library or don’t want to require other extensions. I can understand that but it makes my life sometimes harder… and that’s something I don’t like.

So here we come MPR as an TYPO3 extension. Using MooTools whenever you want to – no need to think about dependencies or graphics and that stuff.

Let’s see a simple example. Maybe you know the extension rgsmoothscroll it gives you the smooth scrolling experience for anchor links within one page. It uses the Plugin SmoothScroll (now Fx.SmoothScroll) from MooTools More. You can seen an example of it at the MPR demo page or in your TYPO3 BE Mod (see Screenshot above). Now let’s take a small look at some of the files in this extension
ext_localconf.php [1 KB] – register plugin
ext_tables.php [1 KB] – register statics
res/mootools-1.11.js [21 KB] – compressed MooTools 1.11
static/constants.txt [1 KB] – statics for transition, mode, duration, fps
static/setup.txt [1 KB] – set options from constants and insert plugin on page.91
pi1/class.tx_rgsmoothscroll_pi1.php [4 KB]

// [...] could use EXT:t3mootools to build a costum core
// include necessary js
$header .=  '<script type="text/javascript" src="'.$this->getPath($this->conf['pathToMootools']).'"></script>';

$header .= '<script type="text/javascript">
	var Page = {
		initialize: function() {
			new SmoothScroll({
				transition: Fx.Transitions.'.$transition.',
				fps: '.intval($conf['fps']).',
				duration: '.intval($conf['duration']).'
			});
		}
	}
	window.addEvent("domready", Page.initialize);</script>';

// include the js in the header
$GLOBALS['TSFE']->additionalHeaderData['rgsmoothscroll'] = $header;

So let’s explain this a little. First we need to get all the need JS this is a MooTools 1.11 so if I want to use the MooTools 1.2 features then I have a little problem as I would need to build my own MooTools version and I would need to check out what’s needed… it’s not real a problem but it’s rather cumbersome. I believe the extension itself should not need to care about the core or MooTools plugin. It should just say I need Smoothscroll and then use it. If the code get’s included on page render or loaded dynamically shouldn’t be it conserns. OK let’s go on – then we have the script block where it starts the SmoothScroll with all options. Again it work but it’s probably not the best way. I mean why give all options – they are already well set in the class itself and if there is another option added in the class you have to mirror it in your extension. Or let’s say an default value get’s changed because the funtion of the class is a little modified you would have to update the extension default also… doubling data isn’t good because you will always have to update at two places… So I believe options should only be set if you want it expliciply. By default it should use the class defaults and not it own default.

So now let’s give the “same” functionality but with the use of MPR.
ext_localconf.php [1 KB]

t3lib_extMgm::addTypoScript($_EXTKEY,'setup','
page.headerData.989 = TEXT
page.headerData.989.value (
	<script type="text/javascript">
		$require(\'Core/Utilities/DomReady.js\');
		$require(\'More/Fx/Fx.SmoothScroll.js\');

		window.addEvent(\'domready\', function() {
			new Fx.SmoothScroll();
		});
	</script>
)
',43);

now what’s that just one file? yeah it’s all you need and in fact I wouldn’t create an extension for that but just for the sake of explaination. All we do is to add a script block somewhere on the page. In this block we say that we want to use the DomReady stuff and the SmoothScroll stuff. The we just start SmoothScroll with the default options. No need to care about any other js stuff. No need to include any core or any other css all the info is inside the “MooTools Packages” itself.
One problem we have with this solution is that if you want to change some options for SmoothScroll you will have to rewrite the whole block… so I guess we need a different solution to the “map MooTools option into TS” problem… but more on this will follow….

So now we see that with MPR it’s pretty simple to use plugins without even using any extension. Just write the script block prepare some html (if needed) and you are done.