JSFiddle - React, Tailwind, and code Playground

by justi

HTML

<div ng-app="myApp">
    <div ng-controller="myCtrl">
        <button ng-click="notify()">Click</button>
    </div>
</div>

JavaScript

var app = angular.module("myApp", [])
app.controller("myCtrl", function($scope){
    $scope.notify = window.notifyMe;
})

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
    var notification = new Notification("Hi there!", {tag: 'notification'});
    notification.onshow = function () { 
      setTimeout(notification.close.bind(notification), 1000); 
    }
  }

  // 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) {
      // 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 notification = new Notification("Hi there!", {tag: 'notification'});
        notification.onshow = function () { 
          setTimeout(notification.close.bind(notification), 1000); 
        }
      }
    });
  }

  // At last, if the user already denied any notification, and you 
  // want to be respectful there is no need to bother them any more.
}

(function doStuff() {
  notifyMe();
   //setTimeout(doStuff, 5000);
}());