i love techno - the site

Saturday, December 12, 2009

Saturday, December 12, 2009

Saturday, December 12, 2009

• Amphion - Flash development - Antwerp

• frontend, content management, client contact, design

• Krimson - Drupal specialist - Antwerp

• project management, architecture supervision, theming, server related

• Pronovix - Drupal specialist - Belgium/Hungary

• special Drupal projects, backend / service architecture, technical help

Saturday, December 12, 2009

• Peter Arato (user/428960)

• Hungary

• Pronovix

• Drupal, Flash, Tech

About us

• Jo Wouters (user/8777)

• Belgium

• Krimson | Drupal Architects

• Project management, Consultancy, Training, Development

Saturday, December 12, 2009

About ILoveTechno

• http://www.ilovetechno.be/

• 1995 .. 2009 ...

• Techno festival

• Informational site

• Aggregator site

Saturday, December 12, 2009

Saturday, December 12, 2009

Saturday, December 12, 2009

Saturday, December 12, 2009

Saturday, December 12, 2009

• Communication

• Motivation

• Well shared tasks

• Iterative development (prototyping)

Co-operation

Saturday, December 12, 2009

Requirements

Saturday, December 12, 2009

Music player

Saturday, December 12, 2009

Saturday, December 12, 2009

Flash objects

Saturday, December 12, 2009

Saturday, December 12, 2009

Lineup editor

Saturday, December 12, 2009

Saturday, December 12, 2009

Different page elements

Saturday, December 12, 2009

Saturday, December 12, 2009

Aggregation

Saturday, December 12, 2009

Saturday, December 12, 2009

... bunch of general Drupal stuff

Saturday, December 12, 2009

Features

• Druplash

• Deeplinking

• Dynamic content loading

• Graceful degradation

• XML-RPC content pulling

• ... other interesting stuff

Saturday, December 12, 2009

Druplash

• Flash (frontend)

• Drupal (backend + content + layout)

• Communication (client, server)

• Different implementations

• SWFAddress (SWFObject), Services, AMFPHP

Saturday, December 12, 2009

Deeplinking

• Persistent URL

• History

• SWFAddress

Saturday, December 12, 2009

ActionScript

Saturday, December 12, 2009

JavaScript

Saturday, December 12, 2009

• Loading original content (example.com/news)

• Redirect to $basePath (example.com/#/news)

• Loading content of the given URL (Ajax)

• Replace content with Flash

• Notify Flash about the state (news)

• Flash changes it’s state

1st page load

Saturday, December 12, 2009

• Send request for a page (about_us)

• Flash notifies SWFAddress (Flash > JS)

• SWFAddress state changed (example.com/#/about_us)

• Ajax request to the server (Ajax)

• Content elements received (JSON)

• Put content to the right place

Navigation

Saturday, December 12, 2009

Dynamic elements

• Ajax request

• Content

• CSS

• JavaScript (evaluation)

• AjaxLoad

Saturday, December 12, 2009

Saturday, December 12, 2009

PHP

Saturday, December 12, 2009

JavaScript

Saturday, December 12, 2009

Graceful degradation

• Browsers without FlashPlayer / JS

• Deprecated FlashPlayer version

• SWFAddress (SWFObject)

Saturday, December 12, 2009

Saturday, December 12, 2009

Communication

Saturday, December 12, 2009

Flash <> Client

HTML

Flashreturn

call

call

return

Saturday, December 12, 2009

ActionScript

JavaScript

Saturday, December 12, 2009

Flash <> Server

Client SERVER

AM

FPHP gatew

ay

010001000100010010101011010111010

010001000100010010101011010111010

11010100 $nid = 1; $a = [...

11010100 $node = {“title”: ...

Saturday, December 12, 2009

ActionScript

Saturday, December 12, 2009

Numbers

• Event sold out: 35.000 tickets!

• 42.000 unique visitors in 2 days

• 65.000 visits in 2 days

• > 420.000 unique visitors

• > 580.000 visits

• > 8.000.000 page views

Saturday, December 12, 2009