I’m working on a new progress update for the weekend, but I wanted to get this out first. After last week’s post, I got a few followup questions from Preemptive over on the webOS Nation forums. He’s part of the group that writes PivotCE, the webOS community’s foremost source of news. In the interest of spreading the info to a more diverse audience (and keeping it all organized) he gave me the okay to post it here.

The question:

Interesting read. It seems you’re having to recreate Mojo features in Enyo. I’m not sure how far Enyo is an app framework or whether it’s the whole UI on webOS 3.0.5 / Open / LuneOS. With ‘swipe to delete’, are you having to implement this just for FirefoxOS or across all platforms?

When coding an Enyo app, when you write, ‘perform action’ (e.g. Delete item), does it:
a. Do it in the UI style of the OS? (‘delete’)
b. Do it in a way you select? (‘use slide to delete’)
c. You have to code the interaction in the app? (‘here’s how slide to delete should look’)
d. O.S. specific code so the app is consistent across platforms? (a or b for webOS, c for FFOS)
e. A mix of the above?

I’m curious as to how ‘cross-platform’ Enyo is. As you are tweaking for FFOS, do you include all the code in one app or are you versioning for the platform? It’s clearly not ‘write once’, though obviously, the same framework. From tweaks, through versioning to total rewrite, How far are you having to go to make Feedspider cross-platform?

My Answer:

Glad that you liked it I’ll do my best to answer, but please forgive me if I get too technical

Enyo is one of a couple of app frameworks natively supported by webOS. To the best of my knowledge, many of the core apps are written using Enyo, but the Luna UI is not. Mojo is also supported in 3.0.5, but not in Open or LuneOS. Other frameworks are also supported (jQuery, Enyo2, etc.), but you have to package them along with your app.

Enyo lists do not support the Swipe to delete functionality in the same way as Mojo, so I have to implement this from scratch in my own way across all platforms, using the Enyo list’s swipe functionality. But, the way that I am doing it, it is a cross platform solution. The workflow goes kind of like this when a user swipes:

1. Enable sticky swipe on list.
2. Set up the swipe container, which consists of two buttons on a dark grey background.
3. Display the container to the user over top of the list item that they are swiping.
4. If the user hits the “Cancel” button, hide the swipe container.
5. If the user hits the “Delete” button, hide the swipe container, remove the item from the array that defines the data for the list, update the number of items in the list, and refresh the list.
6. The list is redrawn sans the deleted item.

All of the visual stuff is handled by the list. I just have to define what the swipe container looks like and exactly what the buttons do. (As well as making sure that the container stays visible when you swipe it across).

To answer your other question, Enyo has excellent cross-platform support so it’s mostly just tweaks. 98%+ of the code that I write is the same across all platforms. I develop against Safari on the Mac and test against Firefox OS on the simulator and phone. So, that covers both WebKit and Gecko based browsers, which should be most of what I’m running into on the platforms that I plan to support. To help with this, Enyo exposes the enyo.platforms api, so that you know exactly what you’re running on and can deal with platform and version specific tweaks.

So far, the only Firefox OS-specific UI tweak that I’ve had to do has been the one to deal with lists and floating that I mentioned. The other times that I’m writing OS-specific code have to do with OS-specific ways of doing things. So far, I’ve only run into that in 4 other places:

1. OAuth. Since I have to handle the authentication in a separate browser window (of one form or another), this varies a bit across platforms. For Firefox OS, I was able to write a custom Enyo Kind. For webOS, I expect to be able to use the WebView kind from webOS-Ports’ webos-lib in much the same way. For the rest of the platforms, I should be able to use a Cordova in-app browser.
2. Cross-app launching. To handle the launching of URLs and sharing to other applications, the mechanisms are different across platforms. For example, webOS uses the com.palm.applicationManager service, and Firefox OS uses web activities. It just means that I have a kind that handles the launches based on platform, with the majority of the code being the same, except for the actual launch.
3. Device orientation. Slightly different calls are used here. (PalmSystem.setWindowOrientation vs screen.mozLockOrientation(“portrait”) and screen.mozUnlockOrientation())
4. Scheduled app relaunches. In order to re-launch the app to check for updated feeds, I can use the com.palm.power/timeout service on webOS to set a recurring timer for the app to launch. On Firefox OS, I can use the Alarm API to re-launch the app. Unfortunately, I need to reset the alarm each time. You can’t set a recurring one yet. I haven’t looked into it on other platforms yet though. (Note: After writing this, I dug deeper into the details since I actually had to implement the feature, and it turns out that com.palm.power/timeout doesn’t support recurring alarms either.)

That wound up being longer than I expected! Hope that clarifies a few things

Preemptive’s response:

So Luna handles cards, just type, launcher, etc. What’s in the card is via a framework (or native). You need to recreate some familiar webOS stuff in Enyo 2, but only a few tweaks are needed for particular platforms.

Thanks. Very informative & some of your work may be useful to others wanting to make webOS style apps.

My close:

In a nutshell, yes. Also, AFAIK Luna uses HTML + Javascript in some capacity to do the UI, but I have not been involved on that side at all, so I can’t give you an authoritative answer. You’d have to ask someone much more qualified than me

Fortunately, someone more qualified did chime in: Herrie, one of the top webOS homebrew developers, and one of the people working on the Open webOS port.

We actually use QML but it’s syntax is mainly consisting of Javascript. Coding style wise it looks VERY similar to Enyo!

If you have any questions about working with Enyo, Firefox or webOS, please let me know, and I’ll answer them to the best of my ability. Hope someone finds this useful!