We make bad decisions once in a while and this is what our development team experienced working on an Ember project to be converted to a mobile application through Cordova. “What happened?” you would ask. We made a bad decision of independently coding the version to be converted to a mobile app with that version to be used for web and be converted to a tablet app. And now we are trying to avoid releasing a smartphone-only and tablet-only versions of the application because, let us admit it, it’s not very elegant.
It shouldn’t be a big problem if one design is perfectly responsive to all platforms of course. But that is not the case. And going for that approach while reasonable will already make the project bleed as it will entail some rework. We needed a quick fix and that’s what we tried to work out one lazy afternoon.
We got two independent distributions, one for mobile and one for tablet. We could freely dump their JS and CSS files into the Cordova project’s www folder without worrying about anything. The tricky part is keeping one index.html that will load the right script depending on the device where the application will be installed.
Locking the Screen Orientation
We needed to lock the screen orientation. As what is arguably always ideal, smartphone UI should be in portrait mode while the tablet version in landscape. After some searching, we found this plugin at http://plugins.cordova.io/#/package/net.yoik.cordova.plugins.screenorientation. It’s the only one out of the three we tried that gave us what we wanted. A short tutorial can be found here.
Dynamically Loading Scripts
The head contains the reference to the compiled CSS and the body contains the reference to compiled components, templates, and main JS files. Obviously we cannot keep it this way. There has to be a way to replace the references on the fly or completely remove all mentioned link an script tags and create them along the way. We did the latter.
We started with a bare index.html.
We only worked on this for a short time and this can most probably be improved. Feel free to insert your suggestions. -aB