PhoneGap

Recording + Assets from PhoneGap Presentation

2013-06-17T17:13:00Z

Thanks to those who showed up today for my PhoneGap presentation as part of ColdBox Developer Week. You may find the recording here: https://experts.adobeconnect.com/_a204547676/p6a701ksfig/ Slide deck and demos may be found on GitHub: https://github.com/cfjedimaster/Introduction-to-PhoneGap As always, comments and criticisms are welcome.

Death to setProperties

2013-06-14T18:35:51Z

One pet peeve of mine with Cordova was the fact that to do certain things, you still had to set certain properties such as splashscreen, timeouts and other minor details. These APIs traditionally only had documentation at the top of … Continue reading →

My PhoneGap Presentation to Ottawa JS

2013-06-13T20:49:00Z

So on Wednesday night I did my Introduction to PhoneGap/Apache Cordova (GitHub repo) presentation for Ottawa JS at the beautiful Shopify lounge. I've given this presentation a ton of times so I decided to give it a twist this time around.

The first thing I did was convert my old slide deck into a reveal.js presentation. Then I popped all the assets into a PhoneGap iPad project to see how it looked. Well, reveal.js looks and works great on an iPad.

At this point I started to get fancy. When I got to the part of the presentation where I would usually switch from the presentation software to Eclipse/Xcode to show the code and emulator I decided to call out to PhoneGap to take a picture instead. All I needed to do was include cordova.js in the app and make a call to Camera.getPicture and the results were:

this is my view from the stage

the view from the audience

And Darren took a picture of me taking the picture, while the picture I was taking was being put up on the big screen which is also in this picture. So I was able to do a presentation on PhoneGap in a PhoneGap app calling the PhoneGap API. It got meta pretty damn quick!

Power Your PhoneGap App with the New ShowKit SDK

2013-06-13T16:15:00+00:00

ShowKit, a powerful mobile SDK that allows developers to easily integrate audio/video conferencing, screen sharing, and remote gesture control into any mobile application, is happy to announce that our latest release now supports PhoneGap integration.

Together, PhoneGap and ShowKit make developing robust mobile applications easier. PhoneGap simplifies app creation for multiple platforms and ShowKit offers PhoneGap users the ease of adding powerful in-app communication features.

View more about ShowKit:

Check out ShowKit’s demo app to see these features at work:

Audio / Video Conferencing Showkit users benefit from smooth video conferencing, with clear VGA and 720p resolutions at 30 frames per second using minimal CPU resources. ShowKit’s best in class audio / video conferencing feature is built on the only framework that includes hardware accelerated video encoding and decoding. The decoding component is fairly tricky and unique, and enables device to device communication, which is a more complex development than device to web communication. The minimal CPU usage allows the device to run other functions in parallel, such as a game or app. ShowKit’s competitors (which shall remain nameless) use full CPU and only get 4-5fps at that resolution, which isn’t feasible for video conferencing. ShowKit reports that this feature is so easy to integrate that they watched a team of junior mobile developers at the recent ShowKit sponsored AngelHack Los Angeles add a working implementation into their hack in about 30 minutes.

Screen Share & Remote Gesture Control
(a feature ShowKit is pioneering)
The ShowKit SDK also provides users with shared gestures on UIKit controls, gesture indication graphics, and gaming-compatible screen sharing. ShowKit envisions several possible use cases for this feature set that might include (but not limited to) the facilitation of sales, customer support, or social gaming. Teja Vishwanadha won ShowKit’s prize for best implementation at AngelHack Los Angeles by creating MemoryPlay, a casual memory game with rich real time interaction between players.

PhoneGap Integration And Exclusives
ShowKit’s technology now seamlessly facilitates integration with PhoneGap, just check out our PhoneGap specific docs.

Drag ShowKit.framework into your project

Add the following line to your config.xml file:

<plugin name="ShowKitPlugin" value="ShowKitPlugin"/>

Initialize the app with your ShowKit API key in index.js:

// The scope of 'this' is the event. In order to call the 'receivedEvent'
// function, we must explicitly call 'app.receivedEvent(...);'
onDeviceReady: function() {
	app.receivedEvent('deviceready');
	var apiKey = "aa2ab742-a7B8-4acf-8af4-6694265a2a25";
	ShowKit.initializeShowKit(apiKey);
},

Include ShowKit.js in any HTML files where you plan to use ShowKit:
```
<script type="text/javascript" src="js/ShowKit.js"></script>
```
Select your project in the Project Navigator, select the Target, and then select the Build Settings tab. Search for “Other Linker Flags.” After that, you can build and run your ShowKit-enabled project!
Remove the -all_load linker flag. Then add -force_load "$(BUILT_PRODUCTS_DIR)/libCordova.a" and -lc++ to your Other Linker Flags

ShowKit recently launched a private beta and is currently available for iOS developers, with web and Android compatibility coming soon. We are offering an exclusive promotion code for PhoneGap users who would like to implement the technology. Interested mobile developers can request an invite from ShowKit’s site using the code "PhoneGap" to gain immediate access to the SDK.

For additional information and a more in-depth explanation of this technology, developers can register for a webinar that I will be hosting next week. The webinar is exclusively for PhoneGap users and will take place on Wednesday, June 19th, 2013 from 11:05 am – 12:05 pm PT.

Guest blog post by Matt Van Veenendaal, ShowKit Co-Founder, CTO
Matt is a graduate of the Swinburne University of Technology. He formerly served as a software engineer at internet security giant Telesign and as the CTO of Ringadoc. As the current CTO of Curious Minds, Matt manages the engineering department. He has a passion for software architecture, design, and various web technologies.*

Using Errorception with PhoneGap

2013-06-13T10:57:00Z

I thought I had blogged about Errorception before, but unless my search engine skills are failing me I must not have ever gotten around to it. Errorception is a service that aggregates and reports on client-side errors on your web site. By placing a simple embed in your HTML code, all errors will be sent off to their service for your perusal. When I first tested this service, I remember thinking, glibly, that I hope I'd get enough data points to make it worthwhile to demonstrate. I mean, my blog runs well, I never see any errors myself, so I just kinda assumed everything was good. Heh.I logged in to the Errorception portal after a week and discovered that there were a huge amount of errors reported. Obviously my blog "worked", and most of these bugs were not preventing people from using my site, but I really had no idea what was going on and Errorception provided a wealth of data. Here are some screen shots from those reports. (Note that the screenshots are from last year.) First - the general list of issues: Then a drill down: And yet another drill down: Errorception is not a free service, but the pricing model seems rather fair to me and as I said - I can bet you've got more issues than you think you do. So what about PhoneGap? When I tried to use the Errorception code snippet with PhoneGap, I noted that the error reporting didn't work. I got in contact with the Errorception team and Rakesh Pai was able to figure out the issue. Here is the original snippet: Rakesh noticed this:

It turns out, the problem you faced is indeed trivial, fortunately. The tracking snippet Errorception gives you is protocol-relative, so as to make it work on HTTP and HTTPS. However, on phonegap, the protocol for the 'index.html' page is file://, and so the tracking snippet fails to load (404). The fix is simple: it's to modify the snippet to load the beacon from a hard-coded http/https protocol

Here is his modified snippet: That worked! I fired up both my iOS simulator and my Android simulator and as soon as I forced my error they showed up immediately in the console. Notice that the error is reported differently in iOS versus Android.

Introducing Cordova 2.8.1 on Android

2013-06-12T23:14:55Z

A little less than two months ago, we improperly deprecated the Plugin API for Cordova Plugins. The reason for this was to move from the old architecture to the new one. However, it seems that once again that people ran … Continue reading →

My Development Workflow for PhoneGap iOS Apps

2013-06-12T20:45:45Z

I decided to blog the process I have personally found productive when developing mobile apps for PhoneGap and iOS in case it might help others. Below I cover the overall steps I take followed by a short video showing the process in use. This is only one of many possible workflows but if you’re looking [...]

What’s new in Cordova iOS 2.8.0

2013-06-11T23:38:53Z

Highlights: deprecation of the <plugin> tag in config.xml (replaced by <feature>) cordova-XXX.js is just cordova.js now (on all platforms) new InAppBrowser options EXIF metadata writing for photos New command line scripts for your project * [CB-2840] Nil checks to avoid crash when network disconnected * [CB-3416] adding empty element during deprecation window. * [CB-3006] Customize […]

PhoneGap Exploration – Realtime Hardware Communication

2013-06-11T17:45:58Z

Recently I’ve undertaken some explorations with fellow evangeslit Kevin Hoyt, trying to determine how far we can push PhoneGap applications with devices and physical computing. Turns out, you can push things really far and now I’m delighted to share one of the experiments that we’ve been pursuing. I’ve been asked on more than one occasion, can you [...]

Quick Start Guide to PhoneGap+AngularJS

2013-06-10T16:22:31Z

I’ve created a sample mobile application to help developers get started building mobile applications with PhoneGap and AngularJS quickly. The sample application includes view navigation, some standard user interface components and code to help avoid common pitfalls in mobile application development (click delays etc). Below are a few screenshots showing parts of the application. It [...]

Get Started Building Mobile Apps Fast with PhoneGap+AngularJS!

2013-06-10T16:22:31Z

PhoneGap Plugin for the Dropbox Sync API

2013-06-10T15:01:31Z

A couple of weeks ago, I started working on a PhoneGap application that required file synchronization between the users computer and their mobile device. I looked at the new Dropbox Sync API and decided to give it a try. The Dropbox Sync API is available for iOS and Android. So, I created a PhoneGap plugin [...]

PhoneGap 2.8.0 Released!

2013-06-07T18:20:03+00:00

We have just released PhoneGap 2.8.0! Thanks to everyone who worked so hard to get this release out.

We’ve squashed a lot of bugs this release to make way for some really big improvements coming soon. We’ll be unveiling some big changes at PhoneGap Day US in Portland, OR on July 19. Join us at PhoneGap Day to hear the news firsthand! Early bird tickets are only $25!

You can view the 2.8.0 commits in the changelog on GitHub. Joe Bowser has a written up a good summary about what is new for 2.8.0 on Android. Shazron Abdullah has a similar summary for iOS up on his blog.

If you find any bugs with this version, help out our community and project by reporting them on our issue tracker.

Kick Backs – WP8 back button handling.

2013-06-04T22:57:38Z

With the PhoneGap Windows Phone Porting Challenge well under way, I felt it would be a good time to take a deeper dive into the hardware back button mechanism that is implemented in Apache Cordova, and how to use it. “A frequent cause of failing app certification is due to an inappropriate implementation of the back button behavior. … Developers ...

What’s new for Cordova 2.8.0 on Android

2013-06-04T21:48:13Z

As we’re ramping up to the 3.0.0 release of Cordova, there haven’t been massive sweeping changes on Cordova, but mostly minor ones. The major change is now that cordova.js no longer has a version, which should make upgrading the js … Continue reading →

Sample Mobile / PhoneGap Application with Backbone.js and TopCoat

2013-06-04T16:22:24Z

In this post, I’m excited to share my first sample application built with TopCoat. TopCoat is a CSS library — a set of customizable styles for mobile components — that you can use to build polished, clean and fast mobile web apps. TopCoat has a desktop profile as well. Because TopCoat focuses exclusively on the [...]

Sample Mobile / PhoneGap Application with Backbone.js and Ratchet

2013-06-04T16:16:42Z

I continue my experiments with different frameworks and UI toolkits to build mobile and PhoneGap applications. In this post, I use Backbone.js as the architectural framework and Ratchet as the UI toolkit to build my Employee Directory reference application. You can experience the application below: Click here to run the app in a full browser [...]

Have a published PhoneGap app? Try the Windows Phone Porting Challenge

2013-06-03T19:33:00Z

If you have published a PhoneGap application to any of the existing app stores (and if you haven't, then you really have need to get on it!) then you should consider taking Microsoft's Windows Phone Porting Challenge. Simply port your application and test it in the Windows Phone Emulator and then publish it to the Windows Phone Store by June 30th, 2013. Prizes for winners include Surface Pros and Windows devices. To be clear, those of you with Macs (like myself) can test with VMFusion. I have and have had success seeing my content show up on my Windows Phone device. To help you get started, here's an introductory video on PhoneGap and Windows Phone. Note - even if you haven't published a PhoneGap application to an app store yet, you can do so and then submit your app to Microsoft!

Why Don't My Plugins Work in PhoneGap Android 2.7?

2013-06-03T00:16:00Z

Well it's pretty simple, the Plugin class which has been deprecated for awhile has been removed from the package and should be replaced with CordovaPlugin.

I'm going to go through the steps needed to upgrade your old style plugins to the new style. For this example I'm going to use the Google Analytics plugin.

The first thing you will notice in 2.7.0+ is that the GoogleAnalyticsTracker class now has 4 errors in Eclipse. To get rid of them you would change:

import org.apache.cordova.api.Plugin;

into:

import org.apache.cordova.api.CordovaPlugin;

and:

public class GoogleAnalyticsTracker extends Plugin {

to:

public class GoogleAnalyticsTracker extends CordovaPlugin {

and now you'll notice you only have one error left in the file and that has to do with the execute method. You'll need to change the method signature from:

public PluginResult execute(String action, JSONArray data, String callbackId) {

to:

public boolean execute(String action, JSONArray data, String callbackId) {

and we still have one error which is now the line in which we are returning the PluginResult. That's because the method now expect a boolean to be the return value. To fix this issue you would replace:

return result;

with:

callbackContext.sendPluginResult(result);

return true;

Finally our Java code is free of error messages. Whew, were done but what's with the change to the execute method? Well let's just say there have been improvements in the way the Plugins are handled internally. What you need to know is that when you want to send a result back to the JavaScript side you now have a choice of three methods:

1) callbackContext.sendPluginResult(...)

Use this if you have constructed your own PluginResult and you want to send it to the JavaScript side.

2) callbackContext.error(int | String | JSONObject)

Skip creating a PluginResult and just invoke the error callback on the JavaScript side sending back an int, a String or a JSONObject as the method payload.

3) callbackContext.success(empty | int | String | JSONObject | JSONArray)

Again, just skip creating the PluginResult and invoke the success callback on the JavaScript side sending back an int, a String, JSONObject or JSONArray as the method payload. If you don't provide any payload the method on the JS side will be executed with no payload.

So that should get you unstuck if you have a Plugin that no longer works for you as of PhoneGap 2.7.0. You should also check out my posts on the GalleryPlugin as shows how to write a Plugin using the new API for JS and Java.

Congrats to our PhoneGap Build Champions

2013-05-31T17:10:26+00:00

PhoneGap Build users looking for support head to our free forum hosted over on Get Satisfaction. If you’ve ever been on the forum, you’ve probably seen some people who go above and beyond by helping others. They’re not PhoneGap Build staff, but fellow Build users who are passionate about the service and like to help the community.

To thank these super users, we’ve decided to recognize them by awarding some perks:

Champions: On Get Satisfaction, we’ve promoted these users to ‘Champion’ status. They get a badge on their profile and are recognized by the PhoneGap Build team as highly valued contributors.
SWAG! We have some awesome PhoneGap Build swag including t-shirts, stickers and pins.

We’ve recently promoted the following users to our new Champion status: Alan_neveu, red_laser and yann_s. Thanks for your hard work!

Interested in becoming a PhoneGap Build Champion? All you need to do is be active on the forum, post frequently and regularly, and help others. We’d love to see you on there!

Improving Build One Step at a Time

2013-05-31T17:01:47+00:00

Hey friends,

We wanted to address many questions related to the PhoneGap Build service and provide a status update on our team’s progress for the last week and upcoming plans.

Service Reliability:

As you may have noticed, our service stability has slowly degraded over the last month. Why has this been happening? Why haven’t we done anything about it? Those are just some of the questions we want to address.

First of all, let’s address why this has been happening: The main reason is that the service has more than doubled in the volume of builds being compiled by our servers. This means that we’re constantly facing scaling issues, and until recently this has been quite a tedious and time consuming task.

Our ability to scale has been sub-par and we’ve already been working hard to address that over the last few weeks. We still have a ways to go, but over the next few weeks you’ll notice large improvements in build times during peak hours.

Our work so far has been focused around the following tasks:

- Improving internal tooling for recovering the system and monitoring it. - Assembling a team to ensure the service stays running around the clock.

We’ve made great strides toward our tooling and providing a great foundation to help automate tasks, restart build components, update components, and monitor our components.

We’ve also been able to find a team to help monitor and correct issues that may occur while our team is out of office and/or asleep.

Now that we’re able to keep the service online for more than twenty-four hours, we need to focus on scaling the service to meet demand during peak hours. This is what we’re focusing on now.

Customer Support

As Build has been growing we’ve been struggling to keep up with the volume of questions coming in via community.phonegap.com.

Together with our support team, we’ve started formalizing a strategy for addressing and closing issues, questions, and suggestions with a faster turn around time.

For example, you may have noticed that when we receive an issue on our community forum we open a corresponding issue on our Github tracker (https://github.com/phonegap/build/issues). This is great for the engineering team, however it doesn’t give you, our users, a sense of when we’ll resolve it.

To address this we now provide a response on the type of problem it is (bug, feature request) and the priority our development team has given it (low, medium, high).

We’ll continue to streamline our support process to provide a more transparent service.

We have also begun exploring the options of adding paid support plans for users who want more attention. Stay tuned for more on that.

Communication

It’s hard to know when Build is having issues isn’t it?.

We currently have monitors that are used by our internal team, however it’s exposing them in a meaningful way to the community that has not been addressed. We’re working on it :)

For the interim, we’ll post any service issues on the following:

Community Support Channel: http://community.phonegap.com/nitobi/updates/recent Twitter: https://twitter.com/PhoneGapBuild

We understand your frustration and we’re working hard to address these issues as quickly as we can.

Status Update

This part of the blog post is the not so regular but regular information we provide on what we’ve been working on for the last week, what we’ve got on our plate for this week, and what we plan on working on in the following weeks to come.

Last Week

Removed support for PhoneGap 1.x.x
Update GAPlugin to use GA SDK version 2+
Add build servers for Android, WebOS, Hydration, Symbian, Winphone, and BB
Internal tooling

This Week

- Various bug patches - BUG #130 Open external page in InAppBrowser android 2.3 doesn’t work - BUG #66: Android Not whitelisted link still open in webview - PhoneGap 2.1.0 - BUG #71: iOS Custom URL Scheme within CONFIG.XML - Integrating Pushwoosh with 2.7.0 before release - Updating Facebook plugin to support plugin.xml - Adding additional IOS servers - Working on a public service status panel - Working on auto-scaling our build servers to handle peak times - Working on internal tooling to help automate team processes - Merging changes contributed by the Build team from pluginstall to plugman. This will allow for us to align ourselves with the Cordova plugin architecture. - Working with the Cordova team on a plugin distribution channel architecture that will be supported by Build. - Working on integrating Medic to provide a continuous integration system to validate PhoneGap distributions and plugin distributions.

Next Week (rough estimate)

- Release Pushwoosh plugin for public consumption - Continue working on our service status panel - Continue working on auto-scaling of our build servers - Continue working on internal tooling to help automate team processes - Continue working on our plugin distribution channel architecture

That concludes our status update for this week. Please note that plans scheduled for the future may change and we may shuffle them according to necessity or demand.

We continue to welcome your feedback on Get Satisfaction.

Celebrate PhoneGap Day US 2013

2013-05-29T23:20:02+00:00

We’re excited to announce our 3rd Annual PhoneGap Day! On Friday July 19th, we’re celebrating PhoneGap Day at The LeftBank Annex in Portland, Oregon.

What’s it all about? PhoneGap Day is one part conference and one part celebration where you’ll meet and mingle with like-minded people interested in PhoneGap and mobile app development. You’ll help us celebrate the Apache Cordova community’s achievements and recognize their hard work on each monthly release.

We’ll have tons of speakers covering the latest on PhoneGap and PhoneGap Build, tools, apps, and more. You’ll get to meet the PhoneGap team and connect with other PhoneGap developers from Google, Mozilla, Microsoft, and more.

And of course, what’s a PhoneGap event without some beer? We’ll be serving a catered breakfast, lunch and snacks with plenty of beer to go around. We’ve got a few tricks up our sleeve to make this event really special, including some limited edition PhoneGap swag that’s being created especially for this event.

NEW THIS YEAR
You asked for it and you got it! We’ve got pre-conference workshops on Thursday July 18th from 10:00-4:30pm. Choose between two tracks:

PhoneGap Essentials Workshop

Beginner: Building your first PhoneGap app
Advanced: Architecting PhoneGap apps
God mode: Extending PhoneGap with Plugins and Embedding PhoneGap with CordovaView

PhoneGap Ecosystem Workshop

Learn everything about Chrome Packaged Apps with Google and Cordova
Learn about Windows Phone 8 tools and support for Cordova with Microsoft and community experts. Have a PhoneGap app? Find out how to migrate your PhoneGap app to the Windows Phone 8 store in a few hours.
(More details coming soon!)

TICKETS
For all you die-hards out there, we’ve got some awesome deals: $25 Early Bird ticket (until June 15th) or a $50 Workshop Combo ticket including PhoneGap Day and your choice of workshop. We’ve got limited seats in the workshops, so get your ticket quick!

Register for PhoneGap Day | Visit the PhoneGap Day website

Can’t make it to Portland in July? We’re also hosting PhoneGap Day EU on September 24 in Amsterdam! Save the date and stay tuned for more info.

SPECIAL THANKS
Thanks to Kendo UI for sponsoring the wifi.
Big cheers to our major sponsors BlackBerry, Google, Intel, Microsoft, and Mozilla for their generous support.

PhoneGap Day 2013

2013-05-29T02:43:00Z

Just sharing the news that another PhoneGap Day was announced - Friday, July 19th, in Portland, Oregon. Details here: http://pgday.phonegap.com/us2013/. Early bird tickets are a low, low 25 dollars. I went last year and thought it was great. I definitely recommend it.

Windows Phone + Cordova Quick Tip

2013-05-28T17:39:52Z

When javascript doesn’t seem to be working, I usually hack in a quick error handler. If you add this somewhere at the top of your html page, you should see any errors that occur listed in Visual Studio’s output window. window.onerror = function(errMsg,fileName,ln) { window.external.Notify("Error : " + errMsg + ", In file : " + fileName + ", at ...

PhoneGap Online/Offline Tip

2013-05-24T12:42:00Z

A few months ago I wrote a blog post that talked about "robust" PhoneGap applications. Basically it was a look at the types of things you should consider to make your PhoneGap application more of an app and less of a wrapped web page.One of the main topics of that blog post was about handling connection status. PhoneGap gives you access to the type of connection the device has as well as events that let you respond to online and offline states. These are important features that (most likely) every single PhoneGap app should be using. I want to point out though a small issue with the code I shared. It isn't broke, but how I did things could be done slightly different. Consider this code block: I want you to notice two things. I've got event listeners for my connection status. Then I have an immediate check. My thinking was, "I want to know when things change in the future but I also need to know what's going on right now." However, it turns out that this isn't actually necessary. If you add event listeners for the online/offline events in the main body load event (not the PhoneGap device ready), then the appropriate event will be fired automatically. If you read the docs for the events (http://docs.phonegap.com/en/2.7.0/cordova_events_events.md.html#online) closely you will see that they demonstrate using the body load event. What may not be clear from the docs though is that even though your connection may not change, the event really is fired for you. Here is an example that I've slightly modified from the docs. Using this way of handling the events, I would not need a check in onDeviceReady. Thanks go to fellow Adobian Shazron for pointing this out. So... do you have to use this way of handling it? To be honest, I prefer my way. It is a bit more coding, but I'd rather not have onload event with logic and a ondeviceready. My way just "feels" better to me, but I reserve the right to change my mind in the next five minutes. ;)