Mobile Controls for IBM Lotus Domino XPages on OpenNTF
Upcoming SlideShare
Loading in...5
×
 

Mobile Controls for IBM Lotus Domino XPages on OpenNTF

on

  • 5,491 views

Description of the OpenNTF project XPages Mobile Controls: http://www.openntf.org/mobile

Description of the OpenNTF project XPages Mobile Controls: http://www.openntf.org/mobile

Statistics

Views

Total Views
5,491
Views on SlideShare
4,474
Embed Views
1,017

Actions

Likes
0
Downloads
117
Comments
1

13 Embeds 1,017

http://www.openntf.org 806
http://mobilecontrols.openntf.org 61
http://openntf.org 48
http://www.slideshare.net 39
http://www.dominopoint.it 32
http://m.dominopoint.it 19
http://paper.li 5
http://portal.openntf.org 2
http://heidloff.net 1
http://ww.openntf.org 1
http://blog.openntf.org 1
http://webcache.googleusercontent.com 1
http://www.slashdocs.com 1
More...

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…
  • thank you
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Mobile Controls for IBM Lotus Domino XPages on OpenNTF Mobile Controls for IBM Lotus Domino XPages on OpenNTF Presentation Transcript

  • OpenNTF Project: XPages Mobile Controls Niklas Heidloff, IBM 05/14/10 1
  • Try it ! http://www.openntf.org/mobile or http://www.openntf.org/Projects/pmt.nsf/ProjectLookup/XPages%20Mobile%20Controls or 2
  • Agenda ● Overview ● Mobile apps with native look and feel ● Mobile apps accessing native services ● Mobile apps caching data and supporting offline 3
  • Goals of the Project ● Identify which out of the box app dev functionality for mobile apps IBM® Lotus® Domino® could support in future releases ● Demonstrate how to use the Lotus Domino XPages app dev platform today to build mobile apps with standard web development skills without having to write native/ device specific code ● Demonstrate how to build mobile apps for Android™, iPhone® and Blackberry® using XPages 4
  • Technical Goals ● Enable developers to develop mobile apps via XPages (rapid application development, access to Lotus Domino services, etc.) ● Enable developers to build mobile apps that look & feel like native apps to achieve the best user experience ● Enable developers to build sophisticated mobiles apps accessing native services and supporting offline ● Enable developers to build mobile apps via XPages easily, e.g. via reusable controls 5
  • Project Overview ● Reusable XPages Controls using Dojo Mobile 1.5 ● XPages Sample App using Lotus Domino 8.5.1 only ● XCamera using PhoneGap ● Simple HTML5 Offline Samples using Lotus Domino 8.5.2 ● Reusable XPages Controls leveraging Dojo Mobile 1.5 including Offline ● Login Control using IBM Lotus iNotes® Ultralite 6
  • Scenarios ● Hide the browser ● Provide native look & feel ● Access to native services ● Offline and cached data 7
  • Scenario: Hide the Browser ● Sub scenarios ■ Address bars should be hidden ■ App specific actions should be shown ■ Bookmarks on home screens should look like bookmarks to native apps ● Android and Blackberry show that an app is 'just' a web app. iPhone is a little better 8
  • In the web browser the address bar keeps coming up and the menu button shows generic browser actions Android (similar on Blackberry – see appendix) 9
  • Instead app specific actions should be shown and the browser bar should be hidden Android 10
  • The browser's actions are displayed at the bottom The address bar can be toggeled on/off iPhone 11
  • When launched from home page bookmark the generic actions don't show up The address bar is toggeled off initially iPhone 12
  • Scenario: Hide the Browser ● Hide address bar ■ iPhone: Works out of the box ■ Android: Dojo 1.5 (dojox/mobile) hides the address bar automatically ● Hide app specific actions (Android and Blackberry) ■ Possible solutions require native apps/shells with embedded browsers at this point ■ Neither PhoneGap, nor other frameworks support this functionality at this point but hopefully in the future 13
  • Scenario: Native Look ● Many iPhone apps use the typical iPhone style ● Android has it's own style but few apps use it ● Blackberry doesn't have it's own style ● Not all apps use these styles, but many of the most popular apps, esp. for iPhone 14
  • Scenario: Native Feel ● Most Android and iPhone apps use nice page transitions ● This is not only nice to have, but required to get the necessary user acceptance. Mobile users have high expectations since they know it from other apps ● Technically this means one HTML/XSP page with lot's of hide/show and Ajax 15
  • iPhone Style 16
  • Android Style 17
  • Dojo 1.5 ● Dojo 1.5 (dojox/mobile) provides a framework to build web apps that look and feel like native apps ■ Page transitions ■ Loading indications ■ Typical styles for iPhone and Android ● Dojo 1.5 has not been released yet but the code is available in the dojotoolkit SVN trunk 18
  • Reusable XPages Controls using Dojo 1.5 ● The project leverages Dojo 1.5 ● Custom styles can be used ● This part of the project works on Lotus Domino 8.5.1 and iPhone and Android ● 10 reusable controls are provided to assemble custom apps ● A live version of this app is available under http://i.openntf.org 19
  • Loading of new Content ● View control loads new entries auto- matically when scrolling down ● Progress indicators for view and document loading 20
  • Creation of new Documents ● Project shows how to create new documents (via Ajax) 21
  • Bookmarks ● Pages including pages with documents can be bookmarked ■ e.g. http://i.openntf.org/niklas/ MobileControls1.0.0.nsf/ m.xsp#document&unid=E58 F1FE324BBC2418625771A00 1C5263 22
  • Navigation ● Browser and device navigation buttons are supported 23
  • Sticky Scrollbars ● When navigating back to the view the scrollbars are sticky 24
  • Custom Styles ● Custom styles can be used 25
  • Reusable Controls ● 8 reusable XPages Controls are provided to assemble custom apps 26
  • Controls: mConfiguration and mHeader 27
  • Controls: mRectangle, Header and Entry 28
  • Controls: mPage and mView 29
  • Controls: mPage and mDocumentContainer 30
  • Control myDocument is app specific 31
  • New Documents can be created via custom Code 32
  • Setup ● The Dojo mobile code has to be imported into the NSF (see ReadMe.pdf for more details) ● Copy MobileControls1.0.0.nsf to your data directory and launch the XPages m.xsp or o.xsp 33
  • XPages Sample App using Lotus Domino 8.5.1 only ● Another part of the project shows how to build similar apps via Lotus Domino 8.5.1 only without Dojo 1.5 ● This approach also works on some Blackberry devices. Note that this approach is not as robust on Android and iPhone when compared to Dojo 1.5 ● A live version of this app is available under http://m.openntf.org 34
  • 35
  • Setup ● Copy MobileControls040.nsf to your data directory and launch m.xsp 36
  • Scenario: Access Native Services ● Sub scenarios ■ Local contacts ■ Camera ■ GPS/geolocation ■ Accelerometer ■ Gestures (e.g. shake, orientation change) ■ Local filesystem ■ Media (e.g. pick photo) 37
  • Sample Scenario: Take Picture and upload to Domino 38
  • Scenario: Access Native Services ● Most of this functionality is not in webkit and not in HTML5 or any other standard or proposal yet ● PhoneGap provides JavaScript APIs to use this functionality ● PhoneGap is a native app and as such needs to be deployed to mobile devices ● The XPages Mobile Controls project provides a sample how to use PhoneGap ● PhoneGap works on Android, iPhone and Blackberry 39
  • PhoneGap Demo App 40
  • JavaScript to use Camera 41
  • Setup: PhoneGap ● PhoneGap needs to be configured and then recompiled for the specific platforms -> requires native SDKs ● Config ■ Name ■ URL ■ Icon 42
  • Setup: Domino Designer ● The PhoneGap JavaScript files (in 0.9 only one file for Android) need to be imported into NSF (see ReadMe.pdf for details) 43
  • Scenario: Offline and cached Data ● HTML5 will support caching of resources and provide local storage capabilities ● Some webkit based browsers support today also SQL storage of data 44
  • Local Storage Mini Samples 45
  • sessionStorage and localStorage 46
  • SQL Storage 47
  • Cache Resources Samples ● Sample shows how to cache Dojo JavaScript files, images and stylesheets ● A reusable control is provided to refresh the cache and to see the cache status and events 48
  • Reusable XPages Controls leveraging Dojo Mobile 1.5 including Offline ● Same blog application as previously taken offline 49
  • Reusable XPages Controls leveraging Dojo Mobile 1.5 including Offline ● This part of the project demonstrates how to take a Notes view and Notes documents offline ● Works on iPhone and Android [and Firefox] ● A live version is available under http://208.85.188.19/niklas/MobileControls200.nsf/m.xsp 50
  • Reusable XPages Controls leveraging Dojo Mobile 1.5 including Offline ● The synchronization and offline mechanism is limited at this point: ■ The synchronization is hardcoded to the last 10 view entries and documents ■ The data is updated automatically when online ■ The content of documents is stored locally but without pictures and other embedded objects ■ Comments can be read but no new comments can be created offline 51
  • Manifest File 52
  • Offline Detection 53
  • Setup ● Register the MIME type in Domino Adminstrator 54
  • Setup ● Disable the default Dojo 55
  • Setup ● Generate a custom Dojo build 56
  • Setup ● Import the two generated js files into MobileControls200.nsf ● Import dojox/mobile ● See ReadMe.pdf for more details ● Copy MobileControls200.nsf to your Domino data directory and launch m.xsp 57
  • Login Control ● Another part of the project is the login control for mobile devices ● This is not an XPages control but leverages Lotus iNotes code 58
  • Resources – Open Source Projects ● XPages Mobile Controls Project: http://www.openntf.org/mobile ● PhoneGap: http://www.phonegap.com ● Dojo: http://www.dojotoolkit.org 59
  • Resources – Demos ● Dojo sample: http://i.openntf.org ● Dojo sample including offline: http://208.85.188.19/niklas/MobileControls200.nsf/ m.xsp ● Non Dojo sample: http://m.openntf.org 60
  • Resources – Videos ● Dojo sample: http://www.youtube.com/watch?v=atu7c0wApwY ● Dojo sample including offline: http://www.youtube.com/watch?v=xNht4vviamw ● Non Dojo sample: http://www.youtube.com/watch?v=-efgOkbIK9U ● XCamera: http://www.youtube.com/watch?v=M2DsAuAojnE ● Simple offline samples: http://www.youtube.com/watch?v=XkFWYHO-1ek 61
  • Resources – HTML5 ● Resources: http://www.w3.org/TR/html5/offline.html ● Local storage: http://dev.w3.org/html5/webstorage ● SQL storage: http://www.w3.org/TR/offline-webapps 62
  • Project License OpenNTF Alliance Mobile XPage Controls © Copyright IBM Corp. 2010 This product includes software contributed to OpenNTF Alliance – (http://www.OpenNTF.org/) Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License 63
  • Project License The dojo/hash.js file is part of Dojo 1.4. Copyright (c) 2004-2009, The Dojo Foundation All Rights Reserved. Available via Academic Free License >= 2.1 OR the modified BSD license. see http://dojotoolkit.org/license for details Dojo Mobile 1.5 is required but not part of this project Copyright (c) 2004-2009, The Dojo Foundation All Rights Reserved. Available via Academic Free License >= 2.1 OR the modified BSD license. see http://dojotoolkit.org/license for details PhoneGap 0.9.0 is required but not part of this project http://www.phonegap.com/ Available via MIT see http://www.phonegap.com/license for details 64
  • Appendix - Scenario: Hide the Browser 65
  • In the web browser the address bar keeps coming up and the menu button shows generic browser actions Android 66
  • Bookmarks can be added to home page but they look different to native apps Android 67
  • Only links to native apps look native Android 68
  • This native app uses an embedded web browser The actions show the app's actions defined in a custom XPage control Android 69
  • Android actions can be defined in custom control Android & Blackberry 70
  • In the web browser the menu button shows generic browser actions Blackberry 71
  • This native app uses an embedded web browser The actions show the app's actions defined in a custom XPage control Blackberry 72
  • The browser's actions are displayed at the bottom The address bar can be toggeled on/off iPhone 73
  • Bookmarks can be added to home page and they look native iPhone 74
  • When launched from home page bookmark the generic actions don't show up The address bar is toggeled off initially iPhone 75
  • Legal Disclaimer ● © IBM Corporation 2010. All Rights Reserved. ● The information contained in this publication is provided for informational purposes only. While efforts were made to verify the completeness and accuracy of the information contained in this publication, it is provided AS IS without warranty of any kind, express or implied. In addition, this information is based on IBM’s current product plans and strategy, which are subject to change by IBM without notice. IBM shall not be responsible for any damages arising out of the use of, or otherwise related to, this publication or any other materials. Nothing contained in this publication is intended to, nor shall have the effect of, creating any warranties or representations from IBM or its suppliers or licensors, or altering the terms and conditions of the applicable license agreement governing the use of IBM software. ● References in this presentation to IBM products, programs, or services do not imply that they will be available in all countries in which IBM operates. Product release dates and/or capabilities referenced in this presentation may change at any time at IBM’s sole discretion based on market opportunities or other factors, and are not intended to be a commitment to future product or feature availability in any way. Nothing contained in these materials is intended to, nor shall have the effect of, stating or implying that any activities undertaken by you will result in any specific sales, revenue growth or other results. ● IBM, Lotus Notes, Domino, Lotus iNotes ● Android is a trademark of Google Inc. ● iPhone is a trademark of Apple Inc. ● The Trademark Blackberry is owned by Research In Motion Limited 76