VIDEO: http://bit.ly/P1UlGr starts at 1:13 Overview of creating modules with Appcelerator Titanium. We integrate SkyhookWireless location SDK and Card.io mobile card sdk Source: Source code for ios cardio module presented at @codestrong http://bit.ly/PQlsW9 Source code for android skyhookwireless module presented at @codestrong http://bit.ly/z4zfdl

1. Introduction to Module
Development
Aaron K. Saunders
Founder/CTO
Clearly Innovative Inc
@aaronksaunders
aaron@clearlyinnovative.com

2. About Me
• Founder & CTO Clearly Innovative Inc.
• Full stack development for mobile and
web integrations w/javascript & nodejs
• Appcelerator Platform Evangelist; Titan
• IOS and Android Module Development
• 2yrs of Appcelerator blogging
• Working on book with ACS and Alloy
Integration

3. What this
presentation is about

4. Android Topics
• Introduction to module
development, not advanced
• Basic integration of third party library
and intent based library
• Understand the Titanium Studio Menu
commands for scripts
• Understanding Ant build script on
Android

5. IOS Topics
• Introduction to module
development, not advanced
• Basic integration of third party library
• Understand the Titanium Studio Menu
commands for scripts
• Understanding command line scripts

6. What this
presentation is not
about

7. Out of Scope
• Advanced view integration in modules
• Additional information on NDK
integration on Android
• Addressing complex third party library
conflicts on IOS

8. Android first because
it needs some love

9. Your Environment
• Instructions on the wiki are your best
starting point
• Use the commands provided in
Titanium Studio
• Be sure you have followed instructions
for setting up Titanium Studio
• Installing Java Development Tools

10. Android Module
Quickly

11. Create Android
Module • Select “New Titanium
Mobile Module Project”
from Menu
• Fill out all of the fields
presented
• Save the project
• Edit the build.properties
to point to the
ANDROID_NDK path
• Run project

12. Run through script on
device

13. Add some
functionality

14. Skyhook SDK

15. Integration Steps
• Import 3rd party library
• Pass authentication credentials into
module
• Setup callbacks in module
• Pass results back from module
• Render results

16. Edit app.js
• Instantiate the module object
• Create a proxy object
• Provide credentials to module
• Setup success and error callback
• Execute API method on proxy object

17. Edit app.js

18. Edit module file
• Remove the template method calls
generated by script
• Create property for the username
• Create property for realm

19. Edit module file

20. Edit proxy file
• Get properties for username and
realm; framework does most of the
heavy lifting for you
• Get the callback functions from the
passed in parameters

21. Edit proxy file

22. Edit proxy file

23. Edit proxy file
• So now we have all the data in… We
need to get the data out
• Create hashMap, add the objects and
call our callback

25. Code for completed
module

26. IOS module

27. Your Environment
• Instructions on the wiki are your best
starting point
• Use the commands provided in
Titanium Studio
• Be sure you have followed instructions
for setting up Titanium Studio
• Installing IOS & Xcode
Development Tools

28. Card.io SDK

29. Integration Steps
• Import 3rd party library
• Pass application key into module
• Setup callbacks in module
• Pass results back from module
• Render results

30. Libraries &
Headers

31. Edit app.js
• Instantiate the module object
• Provide application key to module
• Setup success and error callback
• Execute API method on module

32. Edit app.js

33. Edit header file
• Set the interface for the card.io
delegate
• Set up private variable for the function
callback with success or error
information

34. Edit header file

35. Edit module file
• Remove the template method calls
generated by script
• Make sure we de-allocate any
memory that we have allocated
• Get the parameters from the
javascript passed into objective-c
• Make card.io API call to display card
capture information

36. Edit module file

37. Edit module file
• Handle the response from the UI after
it is rendered
• Handle the two delegates from API for
user cancel or data entered
• Pass a new hashmap containing
results back to the javascript app

38. Edit module file

39. Edit module file

40. OVERLOAD!!
• Blog posting next two weeks
• All code provided on github
• Additional Intent based module
included

42. Aaron K. Saunders
@aaronksaunders
aaron@clearlyinnovative.com
blog.clearlyinnovative.com