We’re closing in on the home stretch! The past week has seen me with a bit more time for development, and I’ve made a good dent in the tasks list. Let’s take a look at the one from last week and see how we’re doing:
The add subscriptions page (Done!)- A proper list for feeds and folders with refreshing and delete buttons (In progress)
- A proper list for articles with swipe to star and mark read/unread (Next on deck)
OAuth (although it looks like Firefox OS will support this nicely – it’s just not a cross-platform solution) (Done, and source code posted)Notifications (toast-style) (Done, source code also posted)- Various bug-fixes and cleanups (such as
figuring out why the sharing menu won’t refresh properly) (Always in progress)
And there’s one to add that I forgot about last week: The recurring notification system that will alert you of unread feeds when the app is closed. The plumbing is there for this within the app, but I need to wire it into the OS. It looks like I’ll be able to use the Alarm API and the Notification API to make this work.
So, here’s the recap:
OAuth (my old nemesis). Fortunately, this was easier on Firefox OS than I expected. I was originally expecting to use a Cordova InAppBrowser, but, in Firefox OS, those don’t offer all of the features that I need. Namely, one can’t hook any of the event handlers. Fortunately, Firefox OS offers a better native solution using iframes and the Browser API, which I was clued into thanks to Peter Rukavina’s article. And, since I’m using Enyo, I can wrap the iframe in a Kind to set up the specific parameters that it needs to function properly on Firefox OS, and catch the nonstandard mozbrowserlocationchange event that it throws.
The only real weirdness that I ran into is that due to the way that Firefox OS browser sessions handle credentials, simply calling purgeHistory() on the iframe will not clear logged on sessions to Google, Twitter, Facebook, etc. I was unable to find a way to do this inside the Browser API (bug?).
So I needed to clear the logged on session manually. I handle this by navigating to the supported provider’s logout page after the OAuth session is complete and the iframe has (hopefully) been made invisible. We don’t need the logged in session after we’ve received the OAuth code anyways. And, if we don’t log out, there is no way to log in using a different account of the same type.
I thought that this would be a useful kind for the Enyo and Firefox OS developer communities, so I open-sourced it
here.
Toast Notifications. The one type of notification missing from the
Notification API is a toast notification. You know, the type that pops up from the bottom and stays there a few seconds to let you know that something has happened. It’s odd, because I know that this is in the OS. When an app is installed, this is exactly what happens. It must just not be publicly accessible.
Fortunately, there is an
Enyo implementation of notifications by MacFJA. He doesn’t include toast notifications either, but he does provide a flexible, extendable framework, so I rolled my own, mimicking the Firefox OS style. I got a couple of requests for the theme, so I have made it available
here.
The only weirdness that I ran into with this one is that it does not like being having the notification object inside a panel. So I had to add another layer and wrap my panels and the notification object inside a new Kind. Fortunately, with Enyo, this works very nicely. It’s turtles all the way down.
The add subscriptions page. Not much to tell here. It’s a bit different than the old FeedSpider, but its simpler. I think that it will actually work a bit better. Pictures will be below.
Converting things to use lists. When I first started this project, I was afraid that I would have to roll my own list type to handle the headers and dividers that I needed. This, I knew would be quite complex, so I’ve been putting it off. The “lists” that I’ve been showing in the screenshots are very fragile and don’t properly survive a refresh.
Now, I’ve gotten to the point in the project where I can’t put it off any longer, and have to actually deal with it. Fortunately, I’ve had a pleasant surprise. New to Enyo 2.4 (I’m pretty sure) is the
AroundList, which will let you do headers and dividers like I need, as well as supporting swiping and re-ordering. This means that all the functionality that I need is available natively and I don’t have to stress about doing a custom kind anymore. I’ve done some initial work on implementing these lists, and this looks to be my project for the beginning of next week.
I’m hoping to have the app in a beta-able form by next Friday, and have it submitted to the Marketplace by the end of the following week (well inside my deadline). Then, I can start work on the versions for other platforms, including making sure that the app runs nicely on a Firefox OS tablet.
So, what’s left to do?
- A proper list for feeds and folders with refreshing and delete buttons
- A proper list for articles with swipe to star and mark read/unread
- Recurring notifications
- Various bug-fixes and cleanups (off the top of my head: mark all articles in a feed as read, proper handling of orientation lock, mark read as you scroll, auto close feeds/folders when all items are read. – all minor things).
And now, to close the post, the screenshots:
The completed OAuth screen, with border and back button. The OAuth Kind doesn’t provide any browser chrome, just the iframe. You can plug it in anywhere you want.
Functioning toaster notifications!
The completed add subscription screen.
The main page re-implemented using an Enyo.AroundList. (This works in Firefox OS too, but I use Safari for my UI testing because it is much quicker to iterate).
One thought on “FeedSpider Dev Blog: Approaching the Finish Line”