Successfully reported this slideshow.
Gap & jQu eryMobilePhone                              ookA brief introduction by Binib
Bin ibook Intro
What is Binibook?● Binibook brings the YouTube concept to  text  ○ Anyone can publish books, poems, short stories...    ea...
T he Biniboo k PlatformThe Website  ○ To publish, discover, read and share.              binibook.com
T he Biniboo k PlatformThe Mobile Applications  ○ To discover, read and    share everything.   Coming...
ok: Price by Popularity    BiniboBinibook offers to writers 3 payment methodsfor their publications:  ● Always free  ● Pay...
neGap & jQ ueryMobileP   ho
PhoneGap: Intro
neGap: Fea tured AppsPho
W hat does P honeGap?● Mobile platform abstraction● Code unification: HTML5, CSS &   JS● Mapping of  native  functionaliti...
p: Supporte d FeaturesPhoneGa
PhoneGap: ExampleTake a photo and retrieve theimage:
P honeGap: Based On...All mobile platforms has a native webviewcontrol.For example, in Android, you can load a web page in...
P honeGap: Based On... Keypoint: the webview javascript interface. The webview control offers access to native functionali...
P honeGap: Ugly Things● No server-side process (PHP, JSP...)  ○ Internationalization is difficult  ○ Database access  ○ Ga...
jQueryMo bile: Intro
ry Mobile: Fe atured AppsjQue
at does jQu eryMobile?    Wh● Make a website looks like mobile app.● Offers a set of methods to make powerful apps.
ry Mobile: Ke y Features    jQue● Built on jQuery core.● Compatible with all major mobile, tablet,  e-reader & desktop pla...
bile: Ajax N avigation   jQueryMoSee a demo    here
il e: The The me Roller    j QueryMobjQueryMobile has 4 default themes. You cancreate your own themes using:              ...
ry Mobile: Th e Methods    jQuejQueryMobile has powerful methods:● $.mobile.changePage()● $.mobile.showPageLoadingMsg()● $...
T hats all!Some geek resources:
Upcoming SlideShare
Loading in …5
×

Phone gap & jquerymobile

1,413 views

Published on

Phonegap y desarrollo en JQuery Mobile por @binibook en el primer Betabeers Mallorca

Published in: Technology
  • Be the first to comment

Phone gap & jquerymobile

  1. 1. Gap & jQu eryMobilePhone ookA brief introduction by Binib
  2. 2. Bin ibook Intro
  3. 3. What is Binibook?● Binibook brings the YouTube concept to text ○ Anyone can publish books, poems, short stories... easily! ○ Anyone can read the texts through the platform.
  4. 4. T he Biniboo k PlatformThe Website ○ To publish, discover, read and share. binibook.com
  5. 5. T he Biniboo k PlatformThe Mobile Applications ○ To discover, read and share everything. Coming...
  6. 6. ok: Price by Popularity BiniboBinibook offers to writers 3 payment methodsfor their publications: ● Always free ● Payment (from € 0.99 to € 6.99) ● Price by popularity Writers can choose it freely. The 95% of publications have "Price computed by popularity".
  7. 7. neGap & jQ ueryMobileP ho
  8. 8. PhoneGap: Intro
  9. 9. neGap: Fea tured AppsPho
  10. 10. W hat does P honeGap?● Mobile platform abstraction● Code unification: HTML5, CSS & JS● Mapping of native functionalitie s (camera, files, geolocation, etc.)
  11. 11. p: Supporte d FeaturesPhoneGa
  12. 12. PhoneGap: ExampleTake a photo and retrieve theimage:
  13. 13. P honeGap: Based On...All mobile platforms has a native webviewcontrol.For example, in Android, you can load a web page intoyour app doing:
  14. 14. P honeGap: Based On... Keypoint: the webview javascript interface. The webview control offers access to native functionalities using the javascript interface.webview.addJavascriptInterface( MyJSInterface , "MyJSInterface" );public class MyJSInterface {private WebView mAppView; Android.doEchoTest(Holaaa);public MyJSInterface (WebView appView) { this.mAppView = appView; } JAVASCRIPT public void doEchoTest( String echo) { Toast toast = Toast.makeText(mAppView.getContext(),echo, Toast.LENGTH_SHORT); toast.show(); }} JAVA
  15. 15. P honeGap: Ugly Things● No server-side process (PHP, JSP...) ○ Internationalization is difficult ○ Database access ○ Gallery access● Solved by: ○ Ajax calls to webservices. ○ HTML5 features: WebSQL, LocalStorage, SessionStorage...
  16. 16. jQueryMo bile: Intro
  17. 17. ry Mobile: Fe atured AppsjQue
  18. 18. at does jQu eryMobile? Wh● Make a website looks like mobile app.● Offers a set of methods to make powerful apps.
  19. 19. ry Mobile: Ke y Features jQue● Built on jQuery core.● Compatible with all major mobile, tablet, e-reader & desktop platforms.● HTML5 Markup-driven configuration.● Touch and mouse event support.● Powerful Ajax-powered navigation system.
  20. 20. bile: Ajax N avigation jQueryMoSee a demo here
  21. 21. il e: The The me Roller j QueryMobjQueryMobile has 4 default themes. You cancreate your own themes using: See how it works here: http://jquerymobile.com/themeroller/
  22. 22. ry Mobile: Th e Methods jQuejQueryMobile has powerful methods:● $.mobile.changePage()● $.mobile.showPageLoadingMsg()● $.mobile.silentScroll()And events● Tap, taphold, swipe● Orientationchange● Page (load, beforeload, etc.)
  23. 23. T hats all!Some geek resources:

×