Api.nativeNotificationsSubscribe

Subscribes this user device to native notifications. Requires the "Enable web app notifications" setting in "Configure notifications" to be enabled.

This function is intended to make it possible to display a custom button to toggle native notifications on, for example, a start page.

Usage

Api.nativeNotificationsSubscribe();

Recommendations

It is recommended to trigger Api.nativeNotificationsSubscribe on user input, such as a button click. If this is triggered on page load it is likely the user will ignore or block the dialog the first time it is displayed. If this happens it usually requires the user to follow more advanced instructions on how to revert this choice in the operating system/browser.

Mobile / Desktop

Use the Session variable IsMobile in the InfoSQL code generating JavaScript if the notifications should only be accessible on mobile and not desktop.

Examples

Example to display a button to toggle the subscription in a HTMLView with InfoSQL.

HTMLView

<div>
	<p id="thetext"></p>
	<button id="thebutton" type="button">Subscribe</button>
</div>

InfoSQL using the JavaScript-column

$(document).ready(() => {
	let button = document.querySelector("#thebutton");
	let text = document.querySelector("#thetext");
	if (Api.nativeNotificationsDenied()){
		text.innerText = "Denied in browser";
		button.style.display = "none";
		return;
	}

	if (!Api.nativeNotificationsSupported()){
		text.innerText = "Not supported";
		button.style.display = "none";
		return;
	}

	Api.nativeNotificationsIsSubscribed()
		.then(isSubscribed => 
		{
			if (!isSubscribed){
				text.innerText = "";
				button.innerText = "Subscribe";
			}
			else {
				text.innerText = "Already subscribed!";
				button.innerText = "Unsubscribe";
			}
		});

	button.addEventListener("click", () => 
	{
		button.disabled = true;
		Api.nativeNotificationsIsSubscribed()
		.then(isSubscribed => 
		{
			if (!isSubscribed){
				Api.nativeNotificationsSubscribe();
				text.innerText = "Already subscribed!";
				button.innerText = "Unsubscribe";
			}
			else {
				Api.nativeNotificationsUnsubscribe()
				text.innerText = "";
				button.innerText = "Subscribe";
			}

			button.disabled = false;
		});
	});
});

Parameters