Back from ApacheCon North America 2016

I just get back from ApacheCon North America that was be held from 11 May to 13 May @Vancouver, Canada. The conference organization was really great and there were a lot of attendees in the conference sessions.


I had the chance to present “Advanced Apache Cordova” in 12 May, the session was interactive, contained three live demos and I was really amazed by the energy, enthusiasm, and responsiveness of the attendees during the session.

My session is uploaded below.

Finally, I would like to thank all the organizers of ApacheCon conference for making the conference looks so great.

Mobile and Cloud enablement in Nigeria

I just came back from a Mobile and Cloud enablement lectures that I conducted in Lagos, Nigeria 01-07 November 2015. The cloud event organization was good and there were about more than 25 attendees during the enablement sessions.

During these enablement sessions, I really enjoyed the passion of the attendees for creating their cloud apps powered by IBM Bluemix.

I had the chance to show the attendees how IBM Bluemix can be a good fit for creating a plenty of applications on different runtimes (Java, NodeJS, Ruby, PHP and finally ASP.NET). I also had the chance to show the attendees the power of Bluemix DevOps to plan, develop, build, and deploy apps in the Cloud.

Cool mobile apps for developers

In the past, only desktops or laptops could be used to create computer programs. However, thanks to technological advancements, today’s smartphones can now be used in the creation of software.

Mobile apps that can be used to create programs on the go were made in order to hasten the development process of apps, which is quite possibly the most lucrative business today. In a study featured on entertainment site Pocket Fruity, it was discussed that more and more people take their smartgadgets wherever they go, may it be at a train station, on a bus, or in a pub. Since the app-making industry is extremely cutthroat, developers created an edge in the form of apps in order to beat deadlines even when they’re not at their workstations.

Here are two useful mobile apps for the web devs out there.

The C Programming Language App

This is one of the best apps for the C programmers out there. It is a handy app for scribbling down codes as well as checking codes thanks to its Reference Tab. The reference tab has links to the language reference, string library, math library, and standard library.

The C Programming Language has a feature that allows developers to test whether or not a program will run smoothly on a chosen platform. It also allows users to easily send their codes via email once they’re done. The app can be used for free by iOS users.

JavaScript Anywhere

JavaScript Anywhere is a three-in-one app that acts as a Java Script, CSS, and HTML editor. It has a very simply user interface so developers can get the hang of using it quickly. Like the C Programming Language App, JavaScript Anywhere allows users to check whether or not their program will work smoothly. Users can import saved projects via the Internet and even store their work on Dropbox for backup. Jsany can also be downloaded for free by iOS users.

Running Tizen Emulator in Mac OS X Mavericks

Your MacBook may hang if you try to run Tizen emulator in Mac OS X Mavericks. The reason behind this problem is that Mavericks is currently not supported by HAXM so running the Tizen emulator will result in a crash.

In order to resolve this issue, you can do one the following two way:

1. [Not recommended] Disable CPU-VT and GPU from the emulator manager as shown below. However, you have to know that doing this will make your emulator very slow but it will run peacefully.
Tizen Emulator Manager

2. [Recommended] Install hotfix for Mavericks available to download from the HAXM website:

[jQuery Mobile] Avoiding multiple pageinit executions for separate pages

One of the common problems in jQuery mobile when navigating to a separate page in a separate HTML file is that he “pageinit” event will be triggered each time page is visited. The problem becomes severe when you find that each time you visit the separate page, your “pageinit” event handler is registered +1 more time which makes a great hassle because of the multiple event binding.

Let’s see an example to understand the problem, assume that we have a separate page called “pageA” which includes a JavaScript file that defines “pageinit” event handler as follows:

$(document).on("pageinit", "#pageA", function(e) {
    //Initialization can be done here ...

If you navigate from any page to “pageA”, you will find that in everytime you visit this page, your “pageinit” event handler will be registered and executed, which means that if you visit the page for the second time, you will find “pageinit” event handler executed twice and for the third time, you will find it executed 3 times and so on.

In order to resolve this issue, you will need to un-register the “pageinit” event as follows using $(document).off().

$(document).on("pageinit", "#subscriptionView", function(e) {
    //Initialization can be done here ...
    $(document).off("pageinit", "#subscriptionView");

Doing this workaround makes “pageinit” event handler executing only once each time the page is loaded.

P.S. This behavior does not happen in jQuery mobile when you follow the single HTML file approach which includes all the application pages.

Resolving the virtual keyboard popup issue in Android 2.x browsers

One of the alarming issues of the Android 2.x browsers is that virtual keyboard sometimes becomes open even if the cursor is not focused on an editable field.
This symptom can be extended to a degree that the virtual keyboard can be still open in views other than the one that initially shows the keyboard.

After spending hours in trying to figure out a solution to this problem, I tried the following solutions and none of them worked with me:
1. Disabling the input elements in the form temperaroly.
2. Setting the input elements in the form to read-only temporarily.
3. Blurring the current focused editable field does not also work.

The only way that works with me is to send an enter key to one of the text fields in the form (or to any hidden field) after 1000 milliseconds before performing the transition to any other views, this can be done in Dojo mobile as follows:

window.setTimeout(function() {

    registry.byId("[your dojo/mobile/textbox id]")._onInput({ charOrCode: keys.ENTER });

}, 1000);

If you have a better solution for this issue, let me know.

Resetting to top

ScrollableView is a container widget which represents an entire mobile device screen, and has a touch scrolling capability. Sometimes, you may need to reset ScrollableView to the top or to any position in the mobile screen.
In order to achieve this requirement, you need to use its scrollTo() API, for example, scrolling to top can be done by setting x and y to zero as follows:

require(["dojox/mobile/parser", "dijit/registry", ..., "dojo/domReady!"], function(parser, registry) {
	var view = registry.byId("someViewID");
	view.scrollTo({x:0 ,y: 0});

Following this approach, you can scroll ScrollableView to any position you like by specifying a suitable x and y values.

Resolving the z-index problem in Android 2.x Browser

One of the alarming issues of the Android 2.x Browser is that it does not respect the z-index of input elements, this issue is described here in details:

This issue can actually be very blocker to you if your mobile web application contains many openers that utilize the z-index CSS property in order to appear on the top of the active mobile view. This is because when the application’s opener is active and due to this bug, you can find the underlying mobile view input elements highlighted (focused) on the top of the opener as shown in the figure below.

In order to resolve this issue, I applied the following solution that works with me:
1. When a new opener is opened:
All of the *relevant* underlying input elements inside the view must be disabled. Doing this fix will disable the keyboard interaction with the underlying input elements and in the same time will not allow these input elements to be *focused*.

2. When the opener is closed:
All of the disabled input elements in the first step can be re-enabled again.

The solution looks complex, however, it can help if you have a similar situation.

Checking the Local Storage limits across the browsers

One of the issues you may face during your daily job (if you are a web developer) is how to check the limits of the Local Storage across the different browsers. This is because there is no unified fixed storage quota for local storage across all the browsers, for example, Chrome local storage quota is 2.5 MB. In Firefox, it is 5 MB and in IE, it is 10 MB.

In order to check if the local storage reaches its maximum quota, it will not be efficient to depend on the mentioned quota sizes on every browser, other than this, I prefer to do this programmatic-ally as shown in the following JavaScript function:

function saveInLocalStorage(name, value) {
    try { = value;
        return true;
    } catch (e) {
        return false;

Using saveInLocalStorage method, you can safely store your local storage entry, and if saveInLocalStorage method returns false, this is an indicator that the browser’s local storage maximum quota is reached, and you will need to show the user an error message asking him to free some of the saved entries in the local storage.

These are my thoughts regarding how to implement this requirement, if you have other thoughts, let me know.