mikdoe
Moderator
Bisschen was zum spielen.
Das war das Maximum an Funktionen, was ich für die beiden einzigen Desktopbrowser finden konnte, die HTML5 Webnoti beherrschen (Chrome und Firefox).
Das war das Maximum an Funktionen, was ich für die beiden einzigen Desktopbrowser finden konnte, die HTML5 Webnoti beherrschen (Chrome und Firefox).
HTML:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Language" content="de">
<meta name="google" content="notranslate">
<title>Test HTML 5 Notification</title>
<style type="text/css">
body {
font-family:Arial;
font-size:12px;
}
</style>
<script>
function webnotification(title,options,click,clo,btn) {
"use strict";
var sendNotification;
var defaultaction = function(title,options,click,clo) {
var noti = new Notification(title,options);
noti.addEventListener('click',click,false);
noti.addEventListener('close',clo,false);
};
if (window.webkitNotifications) { // Chrome, muss zu oberst abgefragt werden, weil er auch die Methode Notification kennt
if (window.webkitNotifications.checkPermission() == 0) { // 0=PERMISSION_ALLOWED; 1=PERMISSION_NOT_ALLOWED; 2=PERMISSION_DENIED
sendNotification = defaultaction;
}
else {
// ACHTUNG: Chrome lässt requestPermission nur zu, wenn es durch einen Eventhandler aufgerufen wird, der durch eine Benutzeraktion angestossen wurde!
btn.onclick = function() {
window.webkitNotifications.requestPermission();
btn.style.display = 'none';
}
if (btn.style.display = 'none') { btn.style.display = ''; }
}
}
else if ("Notification" in window) { // Firefox
if (Notification.permission === "granted") {
sendNotification = defaultaction;
}
else if (Notification.permission !== 'denied') {
Notification.requestPermission(function(permission) {
if (!('permission' in Notification)) {
Notification.permission = permission;
}
});
}
}
if (sendNotification) {
sendNotification(title,options,click,clo);
return true;
}
else { return false; }
}
</script>
</head>
<body>
<script>
function sende() {
var title = 'Testnoti';
var dat = new Date();
var options = {
body: 'Testnoti Body',
icon: 'http://www.slipway.de/images/ico_bell.png',
id: dat.getMilliseconds()
};
var klick_aufruf = function() {
alert('angeklickt ID '+options['id']);
};
var klick_close = function() {
alert('geschlossen ID '+options['id']);
};
var button_zulassen = document.createElement('input');
button_zulassen.value = 'Notificationberechtigung anstossen';
button_zulassen.type = 'button';
button_zulassen.style.display = 'none';
document.getElementById('schalter').appendChild(button_zulassen);
var ret = webnotification(title,options,klick_aufruf,klick_close,button_zulassen);
document.getElementById('testergebnis').innerHTML = 'Senden war '+(ret ? 'erfolgreich' : 'nicht erfolgreich');
}
</script>
<h1>Test HTML 5 Webnotification</h1>
<div><input onclick="sende();" type="button" value="Test"></div>
<div id="testergebnis"></div>
<div id="schalter"> <br></div>
<div>
<br> <br> <br>
Links:<br>
<a href="https://developer.mozilla.org/en-US/docs/Web/API/notification#Browser_compatibility" target="_new">Browser Kompatibilität</a><br>
<a href="http://www.html5rocks.com/en/tutorials/notifications/quick/?redirect_from_locale=de" target="_new">Using the Notifications API Ernest Delgado</a><br>
</div>
</body>
</html>
Zuletzt bearbeitet:
