Skip to content

11. Samples

Sebastián Katzer edited this page Mar 5, 2015 · 2 revisions

The essential purpose of local notifications is to enable an application to inform its users that it has something for them — for example, a message or an upcoming appointment — when the application isn’t running in the foreground.

Kitchen Sink

Please visit our Example App to see the plugin in action. The index.html file contains a working sample for each function provided by the plugin.

Download or clone the example branch and run the following command:

cordova run [ios|android]

These will lunch the simulator or any plugged in device and start the example application as seen below in the screenshots.
Its also possible to open and debug the project with Xcode, Android Studio or Eclipse.

Sample App

Samples

Please also take a look into the other wiki pages to get an overview about all local notification properties and plugin interfaces.

The plugin and its methods are not available before the deviceready event has been fired.

document.addEventListener('deviceready', function () {
    // cordova.plugins.notification.local is now available
}, false);

Big Picture

The following example demonstrates how to schedule a local notification in the future. Furthermore you can see how to listen for events like trigger and click. And finally it shows the possibility to update the local notification's content depend on time and need.

document.addEventListener('deviceready', function () {
    // Schedule notification for tomorrow to remember about the meeting
    cordova.plugins.notification.local.schedule({
        id: 10,
        title: "Meeting in 15 minutes!",
        text: "Jour fixe Produktionsbesprechung",
        at: tomorrow_at_8_45_am,
        data: { meetingId:"#123FG8" }
    });

    // Join BBM Meeting when user has clicked on the notification 
    cordova.plugins.notification.local.on("click", function (notification) {
        if (notification.id == 10) {
            joinMeeting(notification.data.meetingId);
        }
    });

    // Notification has reached its trigger time (Tomorrow at 8:45 AM)
    cordova.plugins.notification.local.on("trigger", function (notification) {
        if (notification.id != 10)
            return;

        // After 10 minutes update notification's title 
        setTimeout(function () {
            cordova.plugins.notification.local.update({
                id: 10,
                title: "Meeting in 5 minutes!"
            });
        }, 600000);
    });
}, false);

Determine permission to show local notifications

cordova.plugins.notification.local.hasPermission(function (granted) {
    // console.log('Permission has been granted: ' + granted);
});

Register permission to show local notifications

Of course you can call the method yourself, but the plugin will do that for you when trying to schedule local notifications.

cordova.plugins.notification.local.registerPermission(function (granted) {
    // console.log('Permission has been granted: ' + granted);
});

Schedule notifications

cordova.plugins.notification.local.schedule({
    title: "New Message",
    message: "Hi, are you ready? We are waiting.",
    sound: "file://sounds/message.mp3",
    icon: "http://my.domain.de/avatar/user#id=123"
});

It's also possible to schedule multiple local notifications at once by assigning an array of hashes.

cordova.plugins.notification.local.schedule([{..},{..}], callback, scope);

Schedule repeating notifications

cordova.plugins.notification.local.schedule({
    id: 1,
    text: "Good morning!",
    firstAt: tomorrow_at_8_am,
    every: "day" // "minute", "hour", "week", "month", "year"
});

Repeating local notifications with a custom interval in minutes are supported as well (Android).

cordova.plugins.notification.local.schedule({
    text: "Wake up!",
    sound: "file://sounds/alert.caf",
    every: 30 // every 30 minutes
});

Cancel notifications

cordova.plugins.notification.local.cancel(1, function () {
    // Notification was cancelled
}, scope);

Or cancel multiple notifications at once:

cordova.plugins.notification.local.cancel([1, 2], function () {
    // Notifications were cancelled
}, scope);

Get notified when the user has been clicked on a notification

cordova.plugins.notification.local.on("click", function (notification) {
    alert(notification.text);
}, scope);

Query all triggered notifications

cordova.plugins.notification.local.getTriggered(function (notifications) {
    alert(notifications.length);
});