Multiple Phonegap Push Notifications in the Android’s status bar


Last month I worked within an Android project using Phonegap, jQuery Mobile and Push Notifications. I also wrote one post explaining how to use PHP to send the server side’s part of the push notifications. Today I want to show one small hack, that I’ve done to change the default behaviour of push notifications. Let me explain it a little bit:

When you use the Push Plugin “out of the box” you will see one message in your Android’s status bar everytime we send one push notification (and you application isn’t running at this moment). If you click on the notification you application will start and you can handle this notification. But if you send more than one notifications to the device, only the last one will be shown on the status bar. This behaviour can be suitable for most situations, but within my application I wanted to see all the notifications in the status bar until I click on one (then all must disappear). If we want to do that we need to hack a little bit our Phonegap application. Let me show you what I’ve done.

Basically we need to change com.plugin.gcm.GCMIntentService file. If we open this Java file we can see that there’s one constant called: NOTIFICATION_ID and a public function called createNotification with something like that:

public static final int NOTIFICATION_ID = 237;
...

public void createNotification(Context context, Bundle extras)
{
    ...
    mNotificationManager.notify((String) appName, NOTIFICATION_ID, mBuilder.build());

}

I’m not a Java expert, but I notice that if I change this function to:

public static final int NOTIFICATION_ID = 237;
public static int MY_NOTIFICATION_ID = 237;
...

public void createNotification(Context context, Bundle extras)
{
    ...
    MY_NOTIFICATION_ID++;
    mNotificationManager.notify((String) appName, MY_NOTIFICATION_ID, mBuilder.build());

}

Now my android device will show multiple notifications, exactly as I need.

If we need to handle properly the way that our notifications are cancelled we also need to modify the public function cancelNotification

public static void cancelNotification(Context context)
{
    NotificationManager mNotificationManager = (NotificationManager) context.getSystemService(Context.NOTIFICATION_SERVICE);
    //mNotificationManager.cancel((String)getAppName(context), MY_NOTIFICATION_ID);
    mNotificationManager.cancelAll();
    MY_NOTIFICATION_ID = NOTIFICATION_ID;
}

And that’s all. Multiple notifications as I needed.

9 thoughts on “Multiple Phonegap Push Notifications in the Android’s status bar

  1. Thanks for this, definitely what I was looking for. Out of curiosity, any thoughts on how I can have 2 different notifications (instead of them just stacking), i.e. a notification for messages and a notification for alerts? I see with the script you have you use MY_NOTIFICATION_ID++; but when I’m wondering is whether there’s a way to read the message content or info and create the notification ID depending on the contents of the message? Thanks for any guidance.

  2. hiiii

    Ur tutorials helped me a lot.. great job..

    im using phonegap notification for android.
    wanna open perticular url passing from GCM php server on clicking the notification instead of home page or u ca say main page..
    plz help me.. as soon as possibel..

    thanx in adance

    1. Using https://github.com/thenewmr/PushPlugin combined with the changes in https://github.com/thenewmr/PushPlugin —- you could have it so when you open up the notification, you can use javascript to change to a specific webpage in your app.

      You can start with the example here: https://github.com/thenewmr/PushPlugin/blob/master/Example/www/index.html

      And then you can edit:

      1) function onNotificationAPN(e) for IOS
      2) function onNotificationGCM(e) for ANDROID (inside the case ‘message’ block)

      And in those functions, you could add:

      window.location.href=’page.html’;

      Or if you wanted to pass the page url as a parameter in your GCM notification:

      window.location.href=e.passedURL

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.