The Current State of TYPO3 Phoenix -- T3CON11

TYPO3 PhoenixThe Current StateSebastian KurfürstChristian Müller

Sonntag, 9. Oktober 11

SebastianKurfürst

ChristianMüller

@skurfuerst @daskitsunet

Changes since last year

Content Model

Plugin System

User Interface

Content Model

typo3.org

homepage section:main

section:side

en_ENen_EN

maincontenten_EN

sidecontenten_EN

sidecontentde_DE

Lorem ipsum dolor sit amet

typo3.org

homepage section:mainen_ENen_EN

maincontenten_EN

typo3.org

maincontenten_EN

“live” workspace

“user-christian” workspace

typo3.org

maincontenten_EN

typo3.org

maincontenten_EN

Some real content text here

“live” workspace

“user-christian” workspace

Plugin System

• Every FLOW3 Package can be used as Phoenix Plugin

Plugin System

TYPO3: TYPO3CR: contentTypes: 'TYPO3.Conference:Plugin': superTypes: ['TYPO3.TYPO3:Plugin'] label: 'TYPO3 Conference Plugin' properties: package: default: 'TYPO3.Conference' controller: default: 'Conference' action: default: 'index'

Plugin System

TYPO3: TYPO3CR: contentTypes: 'TYPO3.Conference:Plugin': superTypes: ['TYPO3.TYPO3:Plugin'] label: 'TYPO3 Conference Plugin' properties: package: default: 'TYPO3.Conference' controller: default: 'Conference' action: default: 'index'

k in P

User Interface

http://www.sxc.hu/photo/1281342

Progressvery slow

Why... no progress?

• Difficult to build stable + extensible JS application

Why... no progress?

• we could not use FLOW3 strenghts for Phoenix

Why... no progress?

• styling and adjusting ExtJS very complex

Why... no progress?

• styling and adjusting ExtJS very complex

• un-agile development process

The UX Concept from Last Year

Visionary!

Which kind of web applications

do I use?

Web-StyleApplication

Desktop-StyleApplication

Try outsomethingnew...

take thebird-eyeview

ReliableEditing

PredictableBehavior

ReliableEditing

PredictableBehavior

ImmediateUser Feedback

ReliableEditing

PredictableBehavior

ImmediateUser Feedback

Built With The Web - For The Web

more pragmatic

Technical Foundations

• ExtJS where it makes sense

• good mixture of Server- and Client Side

• SproutCore 2

Wanna See It Live?

Really?

UI Architecture

Sproutcore 2

About Sproutcore

• build on top of jQuery

• strong MVC concept

• MIT license

• mobile.me and iWork

Data Binding

Data Binding truly connects your UI and data

Content (Data)

UI ComponentUI Component

onPreviewModeChange: function() {window.localStorage.previewMode = ⏎

this.get('previewMode') ? 'true' : 'false';}.observes('previewMode')

Data Binding Code Example

__publishable: function() {! return (this.get('__workspacename') !== 'live');}.property('__workspacename').cacheable(),

Computed Properties

Handlebars Templates

<div class="t3-inspect">{{view T3.Content.UI.InspectButton pressedBinding="T3.Content.Controller.Inspect.inspectMode" label="Inspect"}}

</div>

How Handlebars Templates Look Like

Content Module Architecture

Use the website for editing content

Use the website for editing content

Using FLOW3

•use Fluid templates•request pre-made elements from server•separate modules•security

Use the strengths of the foundation

Productivity!

The Future

Code Sprints bild

Next Steps

• Management / System / Reports View

• fine-tune editing and plugin API

• re-think rendering process (TypoScript vs Fluid)

Running Phoenix Yourself

• Follow http://wwwision.de/githelper/#TYPO3v5/Distributions/Base.git for checking out from Git

• Follow http://flow3.typo3.org/fileadmin/manual/nightly/Quickstart/Index.html#setting-file-permissions for setting permissions

• create database, adjust /Configuration/Settings.yaml

• ./flow3 doctrine:migrate

• ./flow3 site:import --packageKey TYPO3.PhoenixDemoTypo3Org

• Point your Firefox or Chrome browser to your local installation

TODO: Check Phoenix in a *SUB-DIRECTORY* of the web root

Wrap-Up

Thank You!

?????????????

inspiring people to share.

The Current State of TYPO3 Phoenix -- T3CON11

oktober 11typo3

plugin label

conference controller

flow3 package

plugin systemsonntag

ametlorem ipsum dolor

conference action

orghomepage section

Technology

TYPO3 CMS 7.0 - What’s New - Patrick...

TYPO3 Congres 2012 - Waarom kiezen voor TYPO3?

How to Secure TYPO3 Installations - TYPO3 Hosting mit...

Official typo3.org infrastructure &the TYPO3 Server Admin...

The road to TYPO3 5.0 Phoenix

WKE14 - TYPO3 Neos - Next Generation CMS - Patrick...

TYPO3 Security Guide - FREYLER · TYPO3 Security Guide -...

TYPO3 CMS 8.0 - What’s New · Upgrade zu TYPO3 CMS 8.x...

Typo3 alfresco

[T3CON12CA] TYPO3 Phoenix - The Current State

L'ecosistema typo3 perchè scegliere typo3 per progetti...

FLOW3 Security Framework applied to TYPO3 Phoenix

T3CON12-DE The New TYPO3 Association and the TYPO3 Universe

TYPO3 4.6 & TYPO3 4.7

TYPO3 Congres 2012 - Keynote: A day with TYPO3

Знакомтесь, TYPO3