Codestrong 2012 breakout session hacking titanium

Hacking Titanium

David BankierDirector

YY Digital@davidbankier

david@yydigital.com

Code is (mostly) evaluated at runtime

TiHighlight

tabGroup.setActiveTab(1); try { if(current && current.close !== undefined) { current.close(); } current = eval(message.code); if(current && current.open !== undefined) {

tabGroup.activeTab.open(current); } } catch (e) { if(Ti.Platform.osname === 'android') { alert(e.toString()); } else { //iOS Error alert("Line: " + e.line + "\n" + e.message); } }

TiShadow

tishadow servernode.jsexpress

socket.ioAce

tishadow appTiSDK (partial)

websockets (socket.io)

TiShadow

try { if(current && current.close !== undefined) { current.close(); } current = eval(message.code); if(current && current.open !== undefined) { current.open(); } log.info("Deployed"); } catch (e) { log.error(utils.extractExceptionData(e)); }

For More: Forging Titanium - Episode 23

Code in Transit

Cornwall

$('#native').click(function() { Cornwall.execute(function() { Titanium.Contacts.showContacts({}); }); });

var start = new Date(); $('#variables').click(function() { var text = 'Hello World'; Cornwall.execute(function(start, text) { alert("Started: " + start +

"\nText: " + text); },start, text); });

Cornwall

var web_popup = function(a) { alert("Returned 'a' from Native: " + a.a);};

$('#bounce').click(function() { Cornwall.execute(function() { alert("Hello From Native"); Cornwall.callback(web_popup)({a: "A"}); });});

Cornwall

Cornwall.execute = function (fn, arg) { try { var args = []; for (var i = 1, length = arguments.length; i< length; i++) { args.push(arguments[i]); } Ti.App.fireEvent("cornwall:" + Cornwall.id, {

fn: fn.toString(), args: args

}); } catch (e) { alert(e); } }

Cornwall

function evalFn(o) { try{ eval("(" + o.fn.replace(/Cornwall.callback\(([^\)]*)\)/g, "(function(o) { __web.evalJS('$1(' + JSON.stringify(o) + ');');})") + ")("+ JSON.stringify(o.args).substring(1).replace("]","") +")"); } catch (e) { alert(e); }};

Cornwall

var web_popup = function(a) { alert("Returned 'a' from Native: " + a.a);};

$('#bounce').click(function() { Cornwall.execute(function() { alert("Hello From Native"); Cornwall.callback(web_popup)({a: "A"}); });});

Cornwall

(function() { alert("Hello From Native"); Cornwall.callback(web_popup)({a: "A"}); })()

Cornwall

function evalFn(o) { try{ eval("(" + o.fn.replace(/Cornwall.callback\(([^\)]*)\)/g, "(function(o) { __web.evalJS('$1(' + JSON.stringify(o) + ');');})") + ")("+ JSON.stringify(o.args).substring(1).replace("]","") +")"); } catch (e) { alert(e); }};

Cornwall

(function() { alert("Hello From Native"); Cornwall.callback(web_popup)({a: "A"}); })()

Cornwall

(function() { alert("Hello From Native"); (function(o) { __web.evalJS('web_popup('+ JSON.stringify(o) + ');'); })({a: "A"}); })()

Apps in Transit

• Bundles source and assets

• Send bundle to device/s

• Unpack

• Execute

TiShadow

• Allow require from the applicationDataDirectory

• Do not cache CommonJS modules loaded from applicationDataDirectory

Tweaking TiSDK

For More: Commit: Allows CommonJS from applicationDataDirectory

TiShadow

tishadow appTiSDK (partial)

Built with Custom Titanium SDK

websockets (socket.io)

tishadow clirewrites, bundles

and sends off your code.

TiShadow

16 + fs.readFileSync(src).toString() 17 .replace(/Ti(tanium)?.Filesystem.(resourcesDirectory|getResourcesDirectory\(\))/g, "Ti.Filesystem.applicationDataDirectory + '"+app_name.replace(/ /g,"_")+"/'")

Redirect Resources

TiShadow

18 .replace(/require\(/g, "__p.require(")

Redirect Require Function

TiShadow

20 .replace(/([ :=\(])(['"])\/(.*?)(['"])/g, "$1__p.file($2$3$4)")

Redirect Assets

TiShadow

21 .replace(/Ti(tanium)?.API/g, "__log");

Redirect Logs

TiShadow

15 var src_text = "try { var __p = require('/api/PlatformRequire'), __log = require('/api/Log'), assert = require('/api/Assert'), L = require('/api/Localisation').fetchString;\n"

//...

26 src_text += '} catch(e) { e.file="' + src + '"; __log.error(require("/api/Utils").extractExceptionData(e)); }';

Better Error Handling

TiShadow

19 .replace(/Ti.Locale.getString/g, "L”)

Dynamic Localisation

TiShadow

22 if (src.match("_spec.js$")) { 23 src_text = "var jasmine = require('/lib/jasmine-1.2.0');var methods = ['spyOn','it','xit','expect','runs','waits','waitsFor','beforeEach','afterEach','describe','xdescribe'];methods.forEach(function(method) {this[method] = jasmine[method];});" 24 +src_text; 25 }

Fast(er) Testing Iterations

#TiLondon

tishadow appTiSDK (partial)

Built with Custom Titanium SDK

websockets (socket.io)

tishadow clirewrites, bundles

and sends off your code.

@TiLondon

@Codestrong

Coding on ANY device

David Bankier@davidbankier

david@yydigital.com

Section Title SlidePrelude to next section

• Item 1

• Item 2

• Item 3

• Item 4

• Item 5

Lorem Ipsum

Lorem ipsum dolor sit amet,

consectetur adipiscing elit. Morbi

pretium scelerisque nisl, sit amet

viverra mauris mollis nec. Aliquam

sem sem, rutrum non pellentesque

id, tempus sit amet nibh. Morbi nisi

ante, elementum vel facilisis a,

gravida eu libero. In eget porttitor.

• Item 1

• Item 2

• Item 3

• Item 4

• Item 5

Lorem Ipsum

• Item 1

• Item 2

• Item 3

• Item 4

• Highlight Item

Lorem Ipsum

• Item 1

• Item 2

• Item 3

• Item 4

• Item 5

Lorem Ipsum

• Item 1

• Item 2

• Item 3

• Item 4

• Item 5

Lorem Ipsum

“Appcelerator Titanium is the

first mobile platform to

combine the flexibility of open

source development

technologies with the power of

cloud services.”

Lorem Ipsum

Jeff HaynieCEO & Co-founder

Appcelerator