Hacking Titanium
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Hacking Titanium

on

  • 1,862 views

Presented at Codestrong 2012 ...

Presented at Codestrong 2012

A quick look at three open source projects and the key hacks behind them:
* TiShadow - Rapid, on-device, app development and testing tool.
* TiHighlight - App dev on the go.
* Cornwall - A WebView-Titanium Bridge.

Statistics

Views

Total Views
1,862
Views on SlideShare
1,642
Embed Views
220

Actions

Likes
3
Downloads
15
Comments
4

3 Embeds 220

http://www.yydigital.com 204
https://twitter.com 9
http://localhost 7

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Hacking Titanium Presentation Transcript

  • 1. Hacking Titanium! ! ! ! David Bankier! Director! YY Digital! @davidbankier! ! david@yydigital.com!
  • 2. Code is (mostly)evaluated at runtime!
  • 3. 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); } }  
  • 4. TiShadow! websockets   (socket.io)   tishadow app tishadow TiSDK  (par7al)   server node.js   express   socket.io   Ace  
  • 5. 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      
  • 6. Code in Transit!
  • 7. Cornwall! $(#native).click(function() { Cornwall.execute(function() { Titanium.Contacts.showContacts({}); }); });  
  • 8. 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"}); }); });  
  • 9. 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); } }  
  • 10. Cornwall! var start = new Date(); $(#variables).click(function() { var text = Hello World; Cornwall.execute(function(start, text) { alert("Started: " + start + "nText: " + text); },start, text); });  
  • 11. 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); } };  
  • 12. 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"}); }); });  
  • 13. Cornwall! (function() { alert("Hello From Native"); Cornwall.callback(web_popup)({a: "A"}); })()  
  • 14. 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); } };  
  • 15. Cornwall! (function() { alert("Hello From Native"); Cornwall.callback(web_popup)({a: "A"}); })()  
  • 16. Cornwall! (function() { alert("Hello From Native"); (function(o) { __web.evalJS(web_popup(+ JSON.stringify(o) + );); })({a: "A"}); })()  
  • 17. Apps in Transit!
  • 18. TiShadow! •  Bundles source and assets! •  Send bundle to device/s! •  Unpack! •  Execute!
  • 19. Tweaking TiSDK! •  Allow require from the applicationDataDirectory •  Do not cache CommonJS modules loaded from applicationDataDirectory For  More:     Commit:  Allows  CommonJS  from   applica7onDataDirectory  
  • 20. TiShadow! websockets   (socket.io)   tishadow app TiSDK  (par7al)   tishadow cli Built  with  Custom   rewrites,  bundles   Titanium  SDK   and  sends  off  your   code.  
  • 21. TiShadow! ! 16 + fs.readFileSync(src).toString()! 17 .replace(/Ti(tanium)?.Filesystem.(resourcesDirectory|getResourcesDirectory())/g,"Ti.Filesystem.applicationDataDirectory +"+app_name.replace(/ /g,"_")+"/")! ! Redirect Resources!
  • 22. TiShadow! ! 18 .replace(/require(/g, "__p.require(")!   Redirect Require Function!
  • 23. TiShadow!! 20 .replace(/([ :=(])(["])/(.*?)(["])/g,"$1__p.file($2$3$4)")! ! Redirect Assets!
  • 24. TiShadow! ! 21 .replace(/Ti(tanium)?.API/g, "__log");!   Redirect Logs!
  • 25. There’s more…!
  • 26. 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!
  • 27. TiShadow! ! 19 .replace(/Ti.Locale.getString/g, "L”)!! Dynamic Localisation!
  • 28. 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!
  • 29. TiShadow !!22 .replace(/(.*?).addEventListener(/g,"__events.addEventListener($1,");!! Synchronising Events ! See  the  “click_sync”  branch  of  TiShadow  
  • 30. #TiLondon! websockets   (socket.io)   tishadow app TiSDK  (par7al)   tishadow cli Built  with  Custom   rewrites,  bundles   Titanium  SDK   and  sends  off  your   code.  
  • 31. @TiLondon!
  • 32. @Codestrong! Coding on ANY device!
  • 33. David Bankier! @davidbankier!https://github.com/dbankier! ! david@yydigital.com!