Your SlideShare is downloading. ×

Building A Quick Base Mobile Application - Phil Gross

3,991
views

Published on

See how easy it is to create an iPhone application for your QuickBase. In this session Phil will show you how to use the QuickBase API and jQuery to build an iPhone to enter and view QuickBase data.

See how easy it is to create an iPhone application for your QuickBase. In this session Phil will show you how to use the QuickBase API and jQuery to build an iPhone to enter and view QuickBase data.

Published in: Technology, News & Politics

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
3,991
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
43
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Building a QuickBase Mobile Application Philip Gross Senior Business Operations Manager Intuit QuickBase
  • 2. Several Approaches to Mobile Quickbase: -QuickBase Native iPhone Application – MCF Technology Solutions -Windows Mobile and VB.Net proxy – Juiced Technologies -jQuery and jQTouch – Robert McDonald Agenda
  • 3. Native iPhone Application Development MCF Technology Solutions
  • 4. • Why iPhone? – Increased speed and usability. Leverage existing iPhone UI patterns to decrease the learning curve and increase the speed at which data can be retrieved and/or entered. – Create fast and specific data entry screens for mobile users. – Allow mobile users to quickly access information while on the go. – Capture of different media types, such as images and audio recordings, with greater ease. – Anything you can do through the API (which is quite a lot) you can do in a mobile application. – Allow capture of data (and limited browsing) while disconnected from the network. Native iPhone Application
  • 5. – Intel based Mac. – Xcode and iPhone SDK. – Registered in Apple's iPhone Developer Program (if you want to run apps outside of the simulator). – iPhone or iPod Touch for testing on devices. – Familiarity with QuickBase API. Requirements
  • 6. – Objective-C (a new language for many) – Familiarity with Cocoa Frameworks – Devices have limited processing power and memory – You must do your own memory management – You must plan for limited or no connectivity Native iPhone Development Challenges
  • 7. Windows Mobile App Development
  • 8. Handheld device should be capable of the following: o Make and Receive phone calls o Scan barcodes o GPS o Work in a somewhat rugged environment Juiced developed a Windows Mobile application that utilizes the QuickBase api to interface with their existing QuickBase application. Handheld Device: Motorola MC75 running Windows Mobile 5 Technology: Microsoft VB.Net and the QuickBase API Project Requirements and Solution
  • 9. ATT Telecom Juiced Web Service Notify Involved Parties Of Delivery QuickBase Delivery is Made 1 . 2 . 3 . 4 . 5 . Process Flow
  • 10. Barcode Scanned QuickBase Updated Signature Captured Mobile Application Screen Shots
  • 11. jQuery and jQTouch Advanced Mobile devices
  • 12. jQuery/jqTouch
  • 13. • jQuery Plugin for iPhone and iPod Touch, Android, and Palm Pre • Create mobile applications with just HTML, CSS, and Javascript • Native animation • Themes What is jQTouch?
  • 14. • Add a DB Page • Include jQuery from Google • Include jQTouch (either hosted yourself, or test with our version) • Include jQTouch css Adding JQTouch to your Application
  • 15. Any descendent under the body tag (usually <divs> become their own full screen panels <ul>s are lists For example (from jQTouch wiki) <div id="demolist"> <div class="toolbar"> <h1>Demo List</h1> <a class="back" href="#">Back</a> </div> <h4>Options</h4> <ul class="rounded"> <li><a href="#item1">Item 1</a></li> <li><a href="#item2">Item 2</a></li> <li><a href="#item3">Item 3</a></li> </ul> </div> Classes and structure
  • 16. Quick Demo – Task list https://www.quickbase.com/db/beuity3da
  • 17. Quick Code Walkthrough – Head Material <!doctype html> <html> <head> <meta charset="UTF-8" /> <title>GTDBase</title> <style type="text/css" media="screen">@import "/db/berkfpbkn/gl/jqtouch/jqtouch.min.css";</style> <style type="text/css" media="screen">@import "/db/berkfpbkn/gl/themes/jqt/theme.min.css";</style> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8"></script> <script src="/db/berkfpbkn/gl/jqtouch/jqtouch.min.js" type="application/x- javascript" charset="utf-8"></script> <script type="text/javascript" charset="utf-8">
  • 18. Main Handlers $(function(){ //On document ready, refresh the counts in the main list items refreshHome(); //event handlers for main list items $('#showInbox')[0].onclick = function(event) { queryDB("Inbox", "inbox"); } $('#showToday')[0].onclick = function(event) { queryDB("Today", "today"); } $('#showNext')[0].onclick = function(event) { queryDB("Next", "next"); }
  • 19. Querying QuickBase function queryDB(type, list){ $.ajax({ type: "POST", url: "https://www.quickbase.com/db/beuity3db?act=api_doquery", data: {qid: 7, nv: 1, v0: type}, success: function(xml) { var typeList = list + "List"; $('#' + typeList).empty(); $('thought',xml).each(function(){ var thought = $(this).text(); $('#' + typeList).append('<li><a href="#">' + thought + '</a></li>'); }); } }); }
  • 20. One of the content pages <div id="today"> <div class="toolbar"> <h1>Today</h1> <a class="back" href="#home">Home</a> </div> <ul id="todayList"> </ul> </div>
  • 21. Main HTML body <ul> <li class="arrow" id="showInbox"><a href="#inbox">Inbox</a><small id=inboxCount class="counter">0</small></li> <li class="arrow" id="showToday"><a href="#today">Today</a><small id=todayCount class="counter">0</small></li> <li class="arrow" id="showNext"><a href="#next">Next</a> <small id=nextCount class="counter">0</small></li> …….
  • 22. Thank You