Skip to content
Snippets Groups Projects
NotificationsDemo.res 1.98 KiB
Newer Older
open RescriptCore;
open Notifications;
open Webapi.Dom;

Webapi.Dom.window -> Window.addEventListener("load", _ => {
  let spanPermissions: option<Dom.element> = 
    Document.querySelector(Webapi.Dom.document, "#span-permission"); 

  let setSpanText = (span: option<Dom.element>, text: string): unit => {
    let _ = span -> Belt.Option.map(span => Element.setInnerText(span, text));
Eleanor, OFS's avatar
Eleanor, OFS committed
    Console.log("Permission text: " -> String.concat(text));
  };

  let _ = spanPermissions -> setSpanText(Notification.permission);

eleanorofs's avatar
eleanorofs committed
  let onBtnRequestClick = (_: Dom.event): unit => {
Eleanor, OFS's avatar
Eleanor, OFS committed
    Console.log("button-request clicked.");
    let _ = Notification.requestPermission()
    -> Promise.then(str => {
        spanPermissions -> setSpanText(str) -> Promise.resolve
Eleanor, OFS's avatar
Eleanor, OFS committed
      });      
  let _ = Document.querySelector(Webapi.Dom.document, "#button-request")
    -> Belt.Option.map(btn => { 
    btn -> Element.addEventListener("click", onBtnRequestClick);
Eleanor, OFS's avatar
Eleanor, OFS committed
    Console.log("button-request event added.");
eleanorofs's avatar
eleanorofs committed

  let onBtnNotifyClick = (_: Dom.event): unit => {
Eleanor, OFS's avatar
Eleanor, OFS committed
    Console.log("button-notify clicked.");
eleanorofs's avatar
eleanorofs committed
    let _ = Notification.makeWithoutOptions("You have been notified.");
  };

  let onBtnWithOptionsClick = (_: Dom.event): unit => {
Eleanor, OFS's avatar
Eleanor, OFS committed
    Console.log("button-with-options clicked.");
eleanorofs's avatar
eleanorofs committed
    let options: NotificationOptions.t<string> = {
      ...NotificationOptions.init(Js.Nullable.return("unused data."))
Eleanor, OFS's avatar
Eleanor, OFS committed
        , icon: "https://webbureaucrat.dev/img/icons/192.png"
eleanorofs's avatar
eleanorofs committed
        , body: "with an icon and additional text."
        };
el's avatar
el committed
    let _ = Notification.makeWithOptions("You have been thoroughly notified",
                                         options);
eleanorofs's avatar
eleanorofs committed
  };
  
  let _ = Document.querySelector(Webapi.Dom.document, "#button-notify")
eleanorofs's avatar
eleanorofs committed
    -> Belt.Option.map(btn => {
    btn -> Element.addEventListener("click", onBtnNotifyClick);
eleanorofs's avatar
eleanorofs committed
  });

  let _ = Document.querySelector(Webapi.Dom.document, "#button-with-options")
eleanorofs's avatar
eleanorofs committed
    -> Belt.Option.map(btn => {
    btn -> Element.addEventListener("click", onBtnWithOptionsClick);
eleanorofs's avatar
eleanorofs committed
  });