#phonegap plugins

Today I made a thing. The Privacy Screen Plugin.

Some backstory: both iOS (as of iOS 7) and Android have app switchers that display a screenshot of your app. This is a lovely feature for most apps, but if your app displays sensitive information, this is a possible privacy risk.

My apps using the "Zero-knowledge" JavaScript library Crypton, as well as those for my primary day-job at SpiderOak, are privacy focussed. This means that we treat data displayed in these apps as sensitive and... well... private. Therefore, I had tried many times, quite unsuccessfully, to "black out" my apps when displayed in these "app switchers" on iOS and Android.

The problem was that I was trying to do this using variations on the pause and resume events available in Cordova / PhoneGap. These events can be very handy, and I already use them for other purposes, but for this use case they don't fire fast or early enough. The screenshots of my apps were getting taken before any DOM changes I might make in the pause event occured. I had basically given up on this thinking that a cross-platform plugin to do this would be way too big of a pain.

It came up again in conversation with SpiderOak's "security guy" Tomâs Touceda, and I decided to take the plunge and see how hard it would be. I had grand plans of covering the screen with an all black native view or something. I knew how to do that in iOS, assuming I could hook into the native applicationWillResignActive or similar. The issue was Android, of course. My native Android dev skills are way weaker than my Objective-C and iOS, particularly in the area of LayoutManagers and other view stuff.

Luckily, after about 15 minutes of ye olde Googling, I found FLAG_SECURE!

Well, between that and a recent Cordova dev email thread mentioning method swizzling (omg, that term... pfah!), I had a real idea for how to get started. I also found a great StackOverflow post that suggested just hiding the window.

I don't like having to use plugins, but I really enjoy writing them, strangely. So a couple of hours later, I had a real working plugin on two platforms.

It's been almost two months since my last post, but that's because I have been working hard on a new app. In fact, an entire new product.

I'll be able to post more soon including some of the custom plugins I wrote for the app.

It's a camera-based app at heart so I needed a custom camera overlay view as well as some changes to make the camera more responsive (there was a horrible delay after clicking the "use" button in the core PhoneGap Camera API).

I am hoping to find a way to make the camera functionality open source and abstract enough that it would be useful to someone else.

The PhoneGap installer for iOS overwrites the old version when you run it. It puts itself in over the top of your previous version.

However, when you have shipped an app with PhoneGap and it's happily in the App Store, the last thing you want to do is have to deal with changes in the PhoneGap API between versions if you need to make small maintenance tweaks down the track. 

Here's what I do in this instance.

Before upgrading PhoneGap (running the installer) I back up the previous version of the framework. I copy '/Users/Shared/PhoneGap' to '/Users/Shared/PhoneGap-<version>' (such as '/Users/Shared/PhoneGap-1.2').

Next I go into the projects that I want to keep running that version, and I delete the PhoneGap.framework from the project (remove reference only). 

Then I add the framework from the copied versioned folder I made in step #1. Select the target in Xcode, choose the "Build Phases" tab, open the "Link Binary With Libraries" section and click the + and choose "Add Other...", browse to where you backed up your old PhoneGap.framework and add it in.

Upgrade PhoneGap to latest version.

It’s that time again. Time to update the 4ZzZfm iPhone app. Actually, it’s way past due... but this is the way things go sometimes.

Early on I attempted to use some of the “write your app in HTML/Javascript/CSS and deploy to iPhone” technologies, but at the time their acceptability by Apple for App Store distribution was in doubt, and I couldn’t get them to do what I wanted anyway. This meant I had to actually learn Objetive-C. Now let me just say that I really like Objective-C. The problem is that I am primarily a PHP developer so HTML/JavaScript/CSS feels more natural to me.

This has lead me to revisit the above-mentioned web technology options for iPhone app development. PhoneGap in particular seems to be both quite mature, used a great deal in apps in the App Store and quite extendable via plugins. This last part is the bit that has tipped it for me. Not only are there some great plugins available for PhoneGap, but it is quite easy to write your own plugins.

What this all comes down to is that I am going to try and re-write the 4ZzZfm iPhone app using PhoneGap and write whatever plugins I need along the way that aren’t catered for in PhoneGap’s core or plugins written by others.

I have already started on this process and I have the Audio Streaming classes written by the amazing Matt Gallagher (cocoawithlove.com) that I used in the original Objective-C version of the app (mostly) working as a PhoneGap plugin. The remote control events don’t work yet, and I am not sure that will be possible from a plugin anyway... that might require some hacking of the PhoneGap core. We’ll see. It needs some more work update: I have had the remote control events working fine. No core hacking needed. Then between updating PhoneGap and iOS something went wrong.

Another piece of functionality I need for the 4ZzZfm iPhone app is a volume control slider. In the Objective-C iPhone SDK that is implemented using an MPVolumeView (from the MediaPlayer framework).  This turned out to be a very easy to make into a PhoneGap plugin. Now one of the best things about PhoneGap is that it and its plugins are open source. PhoneGap and its plugins are developed by the PhoneGap community and available on GitHub. So I have decided to join GitHub myself and submit any plugins I create for this project that I think others might find useful. The first of these that have been added to the main PhoneGap plugins repository is the aforementioned VolumeSlider plugin. I am pleased as punch about this as it is my first real contribution to a modern open source project. Hopefully it is just the first of many more such contributions.