Sending browser notification to specific users (web) - javascript

I would want to send out notifications to the list of users from database.
I found a solution to send push notifications:
// request permission on page load
document.addEventListener('DOMContentLoaded', function () {
if (!Notification) {
alert('Desktop notifications not available in your browser. Try Chromium.');
return;
}
if (Notification.permission !== "granted")
Notification.requestPermission();
});
function notifyMe() {
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification title', {
icon: 'http://cdn.sstatic.net/stackexchange/img/logos/so/so-icon.png',
body: "Hey there! You've been notified!",
});
notification.onclick = function () {
window.open("https://stackoverflow.com/a/13328397/1269037");
};
}
}
(Source: Chrome desktop notification example ) How can i configure it to send specific notifications to specific users ?
Let us assume that I want to send notifications to all users of the table user_notification.
I tried using
<?php
$sqx = "SELECT * FROM `user_js` ";
?>
in the code but it does not help either

step 1 : try adding the following into your HTML response :
<button onclick="notifyMe()">Notify me!</button>
step 2 : if you can see the button and you get a notification when you click on it, try to move on and trigger it as soon as the page loads.
see if this link will help you : http://www.w3schools.com/jsref/event_onload.asp
principally, this should work :
<body onload="notifyMe()">
step 3 : if all works well, you'll have to add a PHP condition that will add this "onload=..." only to the users you want.

Related

Is there a way to stop my website pushing notification "allow/block" requests to chrome users?

My website currently sends push notifications to users when accessing the site for the first time, is there a way to remove this push notification request?
TIA
Use this in your .js file
Notification.requestPermission();
Create a button for "Enable Notification" in .html file
<button id="enable">Enable notifications</button>
When pressing this button app requests notification for the app (.js file)
function askNotificationPermission() {
// Asking for permissions
function handlePermission(permission) {
// button set for shown or hidden, depending on the user's selection
if(Notification.permission === 'denied' || Notification.permission === 'default') {
notificationBtn.style.display = 'block';
} else {
notificationBtn.style.display = 'none';
}
}
// Check if the browser actually supports notifications
if (!('Notification' in window)) {
console.log("This browser does not support notifications.");
} else {
if(checkNotificationPromise()) {
Notification.requestPermission()
.then((permission) => {
handlePermission(permission);
})
} else {
Notification.requestPermission(function(permission) {
handlePermission(permission);
});
}
}
}

Desktop push notification?

I want to send the desktop notification to my customer dynamical from the server side. For example I have one website based on the e-commerce platform. I want to send the desktop notification to my customer what are the new offers are available. I created the notification with following code.. But I want to call the notification without any user activity.
$(window).load(function(){
if(!window.Notification){
console.log('sorry Notification not supported');
}
else {
Notification.requestPermission(function(p){
if(p === 'denied') {
} else if(p === 'granted') {
} else {
}
console.log(p);
});
}
var notify;
if(Notification.permission === 'default') {
console.log('Please allow Notification');
} else {
notify = new Notification('Cashback Notification..',{
body : 'Get assured cashback on purchases made via Getex.com',
icon : 'images/notification_getex.png'
});
}
});
Here i trigger notification only for the window load, but i want to notify from the server side like execute or call any API link.
Please help me Thanks!

Notifications API, showing multiple times

I'm using the chrome(Mozilla, etc) notifications API:
Notification.requestPermission(function (permission) {
// Whatever the user answers, we make sure we store the information
if (!('permission' in Notification)) {
Notification.permission = permission;
}
// If the user is okay, let's create a notification
if (permission === "granted") {
var options = {
body: data.nome + ': ' + data.corpo,
icon: data.img,
dir : "ltr"
};
var notification = new Notification("Weeazy",options);
}
});
When i'm with 2 or more windows opened, the notification shows multiple times (1 per window).
Someone knows how i can prevent this? I just want to show 1 notification, even with 2, or 999 windows opened, like Facebook does. I hope my code example can help! Thanks!

Display an alert visible if the user is using the web or not

i'm new at programming and im looking for a way to display an alert whenever the user is in the web or not. i've tried with alert() (the one in http://www.w3schools.com/jsref/met_win_alert.asp) using a timer to test it, but the alert only displays in the tab and not over every application running in the desktop.
<!DOCTYPE html>
<html>
<body>
<p>Click the button to display an alert box.</p>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction() {
alert("Hello! I am an alert box!");
}
</script>
</body>
</html>
If there's a solution in other languages i'm open to try them.
thanks.
Based on the link you've shared, if you want a popup over any desktop application through the browser, use the W3C Notification API. For example
window.onload = function () {
if (Notification.permission !== "granted")
Notification.requestPermission();
};
function notifyMe() {
if (!Notification) {
alert('Desktop notifications not available in your browser. Try Chromium.');
return;
}
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification title', {
icon: 'Notification icon',
body: "Notification body",
});
notification.onclick = function () {};
}
}
and call the notifyMe() using the navigator online variable. For example
setInterval(function () {
if (navigator.onLine)
notifyMe();
}, 1000);
This will check whether user is connected to internet every 1 second and display a popup if true.
See https://developer.mozilla.org/en/docs/Online_and_offline_events

How can i add simple link in html5 desktop notification

How can i add simple link (a href) in html5 desktop notification on body section? I try onclick function, but it work's only few seconds. If i try press later the notification just disappear and nothing do. So the best way would be with link. I try that write, but then just print me as text.
var notification = new Notification('title', {
icon: '...',
body: 'aaa'
});
Unfortunately there is no support for links and other markup in HTML notifications. The only method to get a clickable link with a notification is to use onclick:
function makeNotification() {
var notification = new Notification('This is a clickable notification', {body: 'Click Me'});
notification.onclick = function () {
window.open("http://stackoverflow.com/");
};
}
function notifyMe() {
// Let's check if the browser supports notifications
if (!("Notification" in window)) {
alert("This browser does not support desktop notification");
}
// Let's check if the user is okay to get some notification
else if (Notification.permission === "granted") {
// If it's okay let's create a notification
makeNotification();
}
// Otherwise, we need to ask the user for permission
// Note, Chrome does not implement the permission static property
// So we have to check for NOT 'denied' instead of 'default'
else if (Notification.permission !== 'denied') {
Notification.requestPermission(function (permission) {
// If the user is okay, let's create a notification
if (permission === "granted") {
makeNotification();
}
});
}
}
Mozilla has further documentation at https://developer.mozilla.org/en-US/docs/Web/API/notification
Firefox has a short duration for notifications compared to Chrome. There is no way to control how long a notification is visible in Firefox.
add dir : "ltr" in Options
options = {
dir : "ltr",
icon: "images/images.jpg",
body : "hello WOrld"
}
new Notification("Current Notify",options);

Categories