Creating Applications with Titanium and PHP

Matthew Turland

Senior Engineer - Synacor, Inc.

Before We Begin

"Before we start the meeting, I'd like to know who wrote 'Proactionability isn't a word' on my synergized actioncalendar"

Mobile is a Hot Space

A row of mobile phones from various vendors

Especially with the Dawn of Tablets

Multiple tablet devices from various vendors

Larger Devices Aren't Disappearing

A computer desk containing a 3-by-8 grid of monitors

Cross-Platform Compatibility is Important

A Tux penguin in the shape of Apple's Logo with a Windows logo on its stomach

So is Staying DRY

Agent Smith and his clone from The Matrix: Reloaded

The Titanium Platform

A diagram showing the various components of the Titanium platform

PHP 5.3 support was added by Ben Ramsey after initial release

Titanium Desktop

Titanium logo

Getting Titanium

Titanium Developer

A screenshot of Titanium Developer

Creating a New Project

New Project screen of Titanium Developer

Editing a Project

Edit Project screen of Titanium Developer

Project Directory

Directory listing for a new Titanium project

Default Project Index File

Modified Project Index File

Launching a Project

Test & Package screen of Titanium Developer

Hello World!

Launched Hello World! application

Using PHP

<!-- HelloWorld\Resources\index.html -->
<html>
<head>
<title>Array Sum Demo</title>
</head>
<body style="background-color:#1c1c1c;margin:0;">
<div style="border-top:1px solid #404040;">
<div style="color:#fff;padding:10px;">
<script type="text/php">
$numbers = range(1, 5);
$document->write(array_sum($numbers));
</script>
</div>
</div>
</body>
</html>

Array Sum Demo

Demo of PHP in Titanium outputting the sum of an array of integers

There is No Server

The potential child from The Matrix who said, 'There is no spoon.'

Kroll Bridge

Kroll Type Handling

JS to PHP PHP to JS
Number (floating point) to double double/float/int to Number (floating point)
Boolean to boolean boolean to Boolean
null / undefined to null null to null
String to string string to String
Object to object object to Object
Array to (SPL) ArrayObject-like object enumerated array to Array, associated array to Object

Using jQuery from PHP

<!-- HelloWorld\Resources\index.html -->
<html>
<head>
<title>jQuery Demo</title>
<style type="text/css">
body {background-color:#1c1c1c;margin:0;}
#foo_button {margin:10px;}
#foo {display:none;color:white;background-color:black;padding:10px;}
</style>
</head>
<body>
<input id="foo_button" type="button" value="Click Me" />
<div id="foo">PHP using jQuery</div>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/php">
$jQuery()->ready(function() use (&$jQuery) {
  $jQuery("#foo_button")->live("click", function() use (&$jQuery) {
    $jQuery("#foo")->fadeIn(2000);
  });
});
</script>
</body>
</html>
Credit: Ed Finkler

jQuery Demo

PHP attaches a handler to have a button click fade another layer in

Pre-Processed PHP

Pre-Processed PHP Demo

Output of phpinfo() from a pre-processed PHP script

Including PHP - Method 1

<!-- HelloWorld\Resources\index.html -->
<html>
<head>
<title>Including PHP Demo</title>
</head>
<body>
<script type="text/php" src="phpinfo.php" />
<!-- The above is equivalent to this -->
<script type="text/php">
phpinfo();
</script>
</body>
</html>

Including PHP - Method 2

<!-- HelloWorld\Resources\index.html -->
<html>
<head>
<title>Including PHP Demo</title>
</head>
<body>
<script type="text/php">
include("phpinfo.php");
</script>
</body>
</html>

Caveats

CODE Y U NO WORK

A Better phpinfo()

A Titanium-specific alternative to phpinfo()

Available from this GitHub repo

Titanium UI API

<!-- HelloWorld\Resources\index.html -->
<html>
<head>
<title>Titanium UI API Demo</title>
</head>
<body>
<script type="text/php">
$file = $Titanium->UI->createMenuItem("File");
$file->addItem("Quit", function() use ($Titanium) {
    $Titanium->App->exit();
});
$menu = $Titanium->UI->createMenu();
$menu->appendItem($file);
$Titanium->UI->setMenu($menu);
</script>
</body>
</html>

Titanium UI API Demo

File menu created using the Titanium UI API

Kitchen Sink

Desktop Kitchen Sink demo

Needs a patch to run on Titanium 1.1.0+

Accessing Inspector

Context-menu to access WebKit's Inspector tool

Inspector

WebKit's Inspector tool

Updating Your Version

Edit Project screen of Titanium Developer

Packaging

Package screen of Titanium Developer

Package Links

Package Links screen of Titanium Developer

Automatic Updates

Open Titanium application with a dialog over it prompting the user to upgrade to the latest version

Titanium Resources

Who I Work For

Synacor Logo

Synacor Headquarters - Buffalo, NY

That's All, Folks