• Save
Web works presso
Upcoming SlideShare
Loading in...5
×
 

Web works presso

on

  • 2,591 views

 

Statistics

Views

Total Views
2,591
Views on SlideShare
2,509
Embed Views
82

Actions

Likes
4
Downloads
0
Comments
0

4 Embeds 82

http://www.mobilemonday.net 44
http://www.momo-ahmedabad.in 36
http://static.slidesharecdn.com 1
http://webcache.googleusercontent.com 1

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…
Post Comment
Edit your comment

Web works presso Web works presso Presentation Transcript

  • The BlackBerry WebWorks Platform Alan Wong alawong@rim.com February 26, 2011
  • WEBWHAT?What is the BlackBerry WebWorks platform?
  • What Is BlackBerry WebWorks? BlackBerry WebWorks is an application platform that enables developers to create standalone applications using modern and standardized web technologies. WebWorks applications can be fully-featured “Super Apps” through their ability to integrate with native BlackBerry and PlayBook features. View slide
  • Examples: What Do They Look Like? View slide
  • Architecture: How Does It Work?• User interface – Powered by Web – HTML5 and CSS 3 Your app WebKit Engine• Application logic WebWorks Platform – JavaScript® BlackBerry Platform – BlackBerry WebWorks APIs – Access to BlackBerry OS BBM Security Push Monetization PIM Background Media Storage Multi-Tasking Hardware Compression …
  • What Can They Do? Services & Content BROWSER WEB ENGINE SERVICES APPLICATION INTEGRATION PUSH SYSTEM EVENTS File MENUS GPS STORAGE System SQLite
  • WHY CONSIDER WEBWORKS? It matters because …
  • BlackBerry Programming Models Sweet spot?!?Application power Simplicity of development and maintenance • Hitting the sweet spot means – The richness of device access and reuse of Java assets – The simplicity of the browser programming model
  • Developer Spectrum Native-based UI Browser-based UI Functionality provided by BlackBerry OS Functionality provided by Browser EngineNative Application WebWorks Platform BlackBerry Browser • Where in the spectrum do developers gravitate to? – Do they create a Native application (Highly functional)? – Do they create Web content for the Browser (Flexible UI and low cost)? – Or a mix of the two? 9
  • How Is This Different Than DevelopingBlackberry Applications Today? • The BlackBerry WebWorks Platform gives you more solutions to choose from – Developers now have another way to create BlackBerry applications – Choose to develop applications in the way that is most comfortable and suitable to your needs JAVA WEBWORKS WEB • Like writing a native application…but without having to learn the native language
  • Market for WebWorks Applications• BlackBerry WebWorks applications are supported on – BlackBerry Device Software version 5.0 – BlackBerry 6 – BlackBerry PlayBook http://us.blackberry.com/developers/choosingtargetos.jsp
  • Web = Platform plurality iOS Android BlackBerry & PlayBook • It’s a diverse world out there for developers • Strong Web standards offer support across multiple platforms – Reuse Web assets and developer skills to create BlackBerry apps • Each platform seeing growth in access to native functionality – Access the richness and differentiators of BlackBerry platform – Overcome weaknesses of “Write-once-run-everywhere” approach
  • CREATING APPS USING WEBWORKS How to get started today
  • How Do You Create a BlackBerryWebWorks Application?• Using Command Line Utility: – BlackBerry WebWorks Packager • Input: WebWorks archive (*.ZIP) • Output: Packaged BlackBerry WebWorks App (*.COD)• Using Popular Development Environments: – BlackBerry® WebWorks Plug-In for Eclipse – BlackBerry® WebWorks Plug-In for Visual Studio 2008 – Debugging support available http://www.blackberry.com/developers/widget
  • Agnostic Developer Experience Developer Tools… Middleware… Frameworks… Test/Runtime…
  • Index.html• First we will create the content for your BlackBerry WebWorks application by creating a directory that has an index.html: – C:MyDirectoryindex.html<html> <head> <meta name="viewport" content="width=device-width,user-scalable=no"/> </head> <body> <h1>Hello World</h1> </body></html>
  • Some UI Examples Total time to create all the screens seen above: 4 days!
  • WebWorks Configuration Document (config.xml)• Descriptor file for a BlackBerry WebWorks application – XML file (config.xml), based on the W3C specification for widgets• Define application characteristics and properties – Bindings to platform services – Security Policies
  • JavaScript Extensions • Objects that connect JavaScript engine with underlying Java code – BlackBerry WebWorks apps can be more than just web content – Enable powerful “Super App” functionality http://www.blackberry.com/developers/docs/widgetapi/
  • Sample Code: File Access <script type="text/javascript"> //Offline storage: function saveToFile(fileContents) { var data = blackberry.utils.stringToBlob(fileContents); var filePath = "file:///store/home/user/webworks.txt"; blackberry.io.file.saveFile(filePath, data); } </script>
  • Sample Code: Creating a calendar entry<script type="text/javascript">function newCalendarEntry(summary, date){ var appt = new blackberry.pim.Appointment(); appt.summary = summary; appt.date = date; var args = new blackberry.invoke.CalendarArguments(appt); args.view = 0; //0 = Create, 1 = View blackberry.invoke.invoke(blackberry.invoke.APP_CALENDAR, args);}</script>
  • WebWorks API Examples• Application and system events – onBackground, onCoverageChange, etc.• Push services – Both Corporate and Consumer push using existing techniques• Identity information – Phone numbers, PIN, email addresses• Personal information management – Search and edit email, calendar, tasks, notepad, contacts, phone logs, etc.• Application launcher – Invoke native apps with data, invoke third-party Java® apps with data
  • WebWorks API Examples• File IO – Read, write files on eMMC and SDCard• System properties – Change home screen icon, background, etc.• User interface – System Dialogs, Dynamic Menu items• Geolocation – Retrieve live GPS information• Audio – Play and Pause local or remote audio
  • How Do I Sell My BlackBerryWebWorks Applications? • Same distribution model as existing BlackBerry applications! • BlackBerry WebWorks Development tools produce all necessary deployment files • Users can install your application using: – BlackBerry App World™ storefront – The BlackBerry® Browser – Pushed automatically by the BlackBerry® Enterprise Server
  • BlackBerry App World
  • WAIT, THERE’S MORE?Look at what else you can do with WebWorks!
  • What’s new? WebKit!• WebKit rendering engine added to BlackBerry® 6 – BlackBerry WebWorks applications receive the benefits of WebKit – Combine the power of HTML5 and CSS3 with JavaScript APIs http://www.benjoffe.com/code/
  • WebKit on BlackBerry 28
  • HTML5 Support • HTML 5 Audio: Easy integration of audio without the need for plugins Canvas: Use JavaScript to draw graphs & animations Application Cache: Store web resources for use when offline Web Workers: Asynchronous script processing Geolocation: Retrieve GPS or cell site coordinates Web Database: Store local data in SQLite database Forms: Use new interactive form elements.
  • CSS 3 and SVG • CSS 3 allows the creation of stunning transition images and graphic effects (e.g., scale, rotate using CSS styles) • Create graphics/fonts/animations that scale accurately to zoom level (Eliminates pixelization) http://www.subcide.com/experiments/fail-whale/
  • WebKit offers Better Performance Performance • BlackBerry 6 Loads Pages >50% Faster than 5.0! • BlackBerry 6 Has Significant Improvement in JavaScript and HTML Performance
  • What’s new? PlayBook!• Use WebWorks to create PlayBook applications – Command line packager turns Web assets into AIR applications• Powered by enhanced WebKit browser engine – Better support of HTML5 and CSS3 standards• Full support of Flash 10.1 – Package existing Flash content into a PlayBook application
  • Developing for PlayBook with WebWorks PlayBook WebWorks BlackBerry PlayBook SDK Application (.bar) http://www.gettyicons.com
  • COMMUNITYWorking together to make WebWorks great
  • Open Source Community OSS Community BlackBerry WebWorks Platform http://www.github.com/blackberry Github RIM developer •Contribute •Participate OSS Code •Consume (source) App developer •Review •Participate • Create Contributor agreement Apache 2.0 License OS developer Must register WebWorks Application
  • Open Source Community
  • Community Learning Resources• BlackBerry Developer Zone: – http://www.blackberry.com/developers – Resources: Online Forums – Resources: Developer Resource Center• BlackBerry Developers Blog – http://devblog.blackberry.com• Twitter – http://twitter.com/BlackBerryDev
  • NEXT STEPSMy Challenge For You
  • Developer Challenge: Build an app. • Step 1: Build your first PlayBook application (THIS WEEK) – Download and install the WebWorks SDK for PlayBook – Create a ‘Hello World’ app and load it on the PlayBook simulator • Step 2: Improve your application (NEXT 2 WEEKS) – What is your great idea for a mobile Web application? – Use HTML5 and CSS3 to add functionality and UI to your app • Step 3: Submit your application(s) to App World – http://www.blackberry.com/developers/appworld/ – Free PlayBook offer deadline is March 15, 2011
  • LIVE CODING DEMO Lights! Camera! Action!
  • Development Example1 • Initial prototype with nothing but file resources, notepad and Firefox.2 • Adding basic Apache on Localhost to test real HTTP-based resources (Vs. file resources)3 • Eclipse as the development environment, running with Apache Tomcat, and a BB device as the browser on Wi-Fi hitting the dev machine (e.g., 192.168.1.101)
  • Index.html• First we will create the content for your PlayBook WebWorks application by creating a directory that has an index.html: – C:MyDirectoryindex.html<html> <head> <meta name="viewport" content="width=device-width,user-scalable=no"/> </head> <body> <h1>Hello World</h1> </body></html>
  • Config.xml• Then, create the configuration file: – C:MyDirectoryconfig.xml• This file configures properties for your app, such as the icon to use for the home screen, bindings to platform services, and security policies<?xml version="1.0" encoding="utf-8"?><widget xmlns="http://www.w3.org/ns/widgets" xmlns:rim=http://www.blackberry.com/ns/widgets version="1.0.0"> <name>My App</name> <content src="index.html" /></widget>
  • Packaging• Use the SDK to package your app – cd "C:Program FilesResearch In MotionBlackBerry WebWorks Packager“• Run the command line toolsbbwp "C:myapp.zip" /o "C:OutputDirectory">>[INFO] Parsing command line options>>[INFO] Parsing bbwp.properties>>[INFO] Validating WebWorks archive>>[INFO] Parsing config.xml>>[INFO] Populating application source>>[INFO] Compiling WebWorks application>>[INFO] Generating output files>>[INFO] WebWorks application packaging complete
  • The Simulator• Launch one of the BlackBerry Device Simulators: – cd "C:Program FilesResearch In MotionBlackBerry WebWorks Packagersimpack6.0.0.190” – 9800.bat
  • Your App• Load your app in the simulator – From the device simulator file menu select "File -> Load BlackBerry Application or Theme...“ – Browse to the "C:OutputDirectory" that you had supplied to the command line tooling – Go to the “StandardInstall” subfolder – Select the "myapp.cod" file – click "Open" on the simulators browse dialog.• Run your app – Scroll to the "Downloads" section on the device simulator – Launch your application "My App"
  • Summary• BlackBerry and PlayBook WebWorks Application Platform• Create standalone applications using Web technologies• Integration with device functionality and data• Powered by WebKit engine• Open Source
  • Thank You Alan Wongalawong@rim.comFebruary 26, 2011