April Unplugged Mobile Controls User Group

UNPLUGGED MOBILE CONTROLS
USER GROUP
April 2014

Agenda
 Deep Dive
 UnpNavigatorComputed Control
 Case Study
 SMC – Barbara Houchin
 Next Month
 UnpDialog
 CapExApprovals app
 Q & A

Deep Dive - UnpNavigatorComputed
 Control for displaying nav categories
 Features include:
 Icon
 Sub-Menus
 Auto-highlight
 Auto-size/display

UnpNavigatorComputed Config
 Uses JSON objects to populate categories

UnpNavigatorComputed Properties
 label
 string - label on tile
 hasSubMenu
 boolean – expands to subsection
 page
 string - XPage to load when tapped
 icon (optional)
 string - Icon displayed on left of tile – uses FontAwesome*
 ajaxloadid
 string -Target div of content to load from ‘page’
 ajaxtargetid
 string -Target div to load content into current xpage
 disabled
 boolean -Tile is tappable or section header

UnpNavigatorComputed Properties
 If hasSubMenu: true
subMenu: [
{ …properties from last slide… }
]
 Sub-menus can be 2 levels deep

Other considerations
 UnpHeader:
 viewsButton=“true”
 UnpFlatView, UnpAccordionView,
UnpFormEditor, UnpFormViewer:
 Position=“menu-aligned” (default)

UnpNavigatorComputed - Demo
 Lets build one….

Case Study
 Over to Barbara at SMC

Next Month
 Meeting onThurs 8th May
 Deep Dive
 UnpDialog
 Case Study
 CapEx ApprovalsApp
 WirelessWednesday – Matt White and Myself
 Wednesday 7th May
 JQuery Mobile

Q & A
 @Unp_UG
 @MobileAppsRule
 @mattwhite
 www.Teamstudio.com/Unplugged
 https://github.com/unplugged/unplugged-
controls

 SMC Corporation of America
– Pneumatics industry Leader
– Forbes list of World’s Most Innovative Companies
MOBILE ENERGY ASSESSMENTS
Barbara Houchin – Application Developer
@BarbHouchin
bhouchin@smcusa.com

 Mobile Energy Assessments (MEA)
– Domino 9 XPages app
– Designed for iPad
– Using
– Unplugged Mobile Controls
 Eliminated transcription task
 Automated report generation
 Integrated photos
 Improved data for Sales Mgmt
bhouchin@smcusa.com

Assessment
Machine(s)
Component(s)
bhouchin@smcusa.com

 Unplugged Mobile Controls (v1.5)
UnpHeader
UnpFooter
UnpScrollableArea
UnpFlatView
bhouchin@smcusa.com

 Up to 4 different document types available via a “portal-like” XPage.
– Machines for this Assessment listed in white section
– Click on binoculars (xp:button wi/icon) to reveal Machine’s Components in blue section.
– Click on Machine or Component line to open that document.
bhouchin@smcusa.com

 Each page shows multiple layers of data.
– Navigate backward by clicking in a color-coded section for that
“parent” or “grandparent’.
– The last “child” of a document type will be highlighted
– Collapsible sections for Photos (separate documents) and Notes
– Multiple independently scrollable areas
bhouchin@smcusa.com

 Machine and Component pages have fields grouped into Collaplisble
“title-pane” style sections
– Using jQuery plugin
– Modified plugin to allow nesting
– Added Collapse All function
bhouchin@smcusa.com

 Photos are taken using Unplugged photo capture integration with iOS.eice.
– Uses File Upload control with parameters set to tell Unplugged to perform photo
capture
bhouchin@smcusa.com

 Photo Gallery allows for ease in scrolling through all photos on one page.
– Tap on photo to open Photo document.
bhouchin@smcusa.com

 Mobile app using
– Unplugged Mobile Controls from OpenNTF for Native look & feel
– Rapid Development + Ability to work offline
– Photo Capture integration
 Portal-like UI
– Multi-level data on a page
– Independent scrolling areas
– Touch a panel to open another page
– Highlight most recent visited documents
– Collapsible panel within scrollable area
– Scrollable Photo Gallery
 JQuery calendar (coming soon)
bhouchin@smcusa.com

April Unplugged Mobile Controls User Group

More Related Content

Viewers also liked (16)

Similar to April Unplugged Mobile Controls User Group (20)

More from Teamstudio (20)

Recently uploaded (20)

April Unplugged Mobile Controls User Group