dev141 gord tanner (@ gordtanner ) michael brooks (@ mwbrooks ) may 1, 2012
DESCRIPTION
Porting to BlackBerry using Apache Cordova. DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012. What is …. What is …. You may know it as …. Wikipedia Port Demo. iOS. Android. BlackBerry. Be Agnostic …. It will look right at first, but - PowerPoint PPT PresentationTRANSCRIPT
![Page 1: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/1.jpg)
1
DEV141Gord Tanner (@gordtanner) Michael Brooks (@mwbrooks)May 1, 2012
Porting to BlackBerry using Apache Cordova
![Page 2: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/2.jpg)
What is …
2
![Page 3: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/3.jpg)
What is …
3
![Page 4: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/4.jpg)
You may know it as …
4
![Page 5: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/5.jpg)
Wikipedia Port Demo
5
![Page 6: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/6.jpg)
iOS
6
![Page 7: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/7.jpg)
Android
7
![Page 8: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/8.jpg)
BlackBerry
8
![Page 9: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/9.jpg)
Be Agnostic …
9
It will look right at first, butWhen people look deeperThe will only see what is wrong
![Page 10: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/10.jpg)
Looks Weird on BlackBerry …
10
![Page 11: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/11.jpg)
We’ve Solved this Already …
11
![Page 12: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/12.jpg)
HTML 5 Makes it Easier …
12
![Page 13: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/13.jpg)
Platform UI Guidelines …
13
![Page 14: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/14.jpg)
OS7
14
![Page 15: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/15.jpg)
Menus
15
![Page 16: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/16.jpg)
Menus
16
![Page 17: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/17.jpg)
PlayBook
17
![Page 18: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/18.jpg)
18
![Page 19: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/19.jpg)
bbUI.js
19
https://github.com/blackberry/bbUI.js
![Page 20: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/20.jpg)
Responsive Web Design …
20
http://www.anderssonwise.com/
![Page 21: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/21.jpg)
Quick Preview …
21
http://responsive.is/
![Page 22: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/22.jpg)
CSS Media Queries - No Magic …
22
#button { width: 25%; }
@media screen and (max-width: 480px) { #button { width: 100%; }}
![Page 23: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/23.jpg)
Many Samples …
23
http://mediaqueri.es/
![Page 24: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/24.jpg)
Cross-Platform Gotchas …
24
• Interaction• Mouse Events• Touch Events (thumbs.js)
• CSS Performance
• JavaScript Performance
![Page 25: DEV141 Gord Tanner (@ gordtanner ) Michael Brooks (@ mwbrooks ) May 1, 2012](https://reader036.vdocuments.net/reader036/viewer/2022062811/5681623c550346895dd26fc6/html5/thumbnails/25.jpg)
THANK YOU
DEV141Gord Tanner (@gordtanner) Michael Brooks (@mwbrooks)May 1, 2012