added sound

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "sengi",
-  "version": "0.18.1",
+  "version": "0.18.2",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -5914,6 +5914,11 @@
       "integrity": "sha512-7T/BxH19zbcCTa8XkMlbK5lTo1WtgkFi3GvdWEyNuc4Vex7/9Dqbnpsf4JMydcfj9HCg4zUWFTL3Za6lapg5/w==",
       "dev": true
     },
+    "howler": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/howler/-/howler-2.1.2.tgz",
+      "integrity": "sha512-oKrTFaVXsDRoB/jik7cEpWKTj7VieoiuzMYJ7E/EU5ayvmpRhumCv3YQ3823zi9VTJkSWAhbryHnlZAionGAJg=="
+    },
     "hpack.js": {
       "version": "2.1.6",
       "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz",

package.json

@@ -49,6 +49,7 @@
         "bootstrap": "^4.1.3",
         "core-js": "^2.5.4",
         "emojione": "~4.5.0",
+        "howler": "^2.1.2",
         "ng-pick-datetime": "^7.0.0",
         "ngx-contextmenu": "^5.2.0",
         "rxjs": "^6.4.0",

src/app/services/user-notification.service.ts

@@ -1,6 +1,7 @@
 import { Injectable } from '@angular/core';
 import { BehaviorSubject, Subject, Observable, Subscription } from 'rxjs';
 import { Store } from '@ngxs/store';
+import { Howl } from 'howler';
 
 import { Status, Notification } from './models/mastodon.interfaces';
 import { MastodonWrapperService } from './mastodon-wrapper.service';
@@ -11,6 +12,7 @@ import { StreamingService, StatusUpdate, EventEnum } from './streaming.service';
 import { NotificationsComponent } from '../components/floating-column/manage-account/notifications/notifications.component';
 import { StreamElement, StreamTypeEnum } from '../states/streams.state';
 
+
 @Injectable({
     providedIn: 'root'
 })
@@ -28,6 +30,8 @@ export class UserNotificationService {
         private readonly store: Store) {
 
         this.fetchNotifications();
+
+        this.playSoundNotification();
     }
 
     private fetchNotifications() {
@@ -71,7 +75,7 @@ export class UserNotificationService {
                         }
                     });
                 })
-                .catch(err => {});           
+                .catch(err => { });
 
 
 
@@ -94,7 +98,26 @@ export class UserNotificationService {
         //     });
     }
 
+    private playSoundNotification() {
+        console.warn('play audio');
+
+        // let audio = new Audio();
+        // audio.src = "assets/audio/exquisite.mp3";
+        // audio.load();
+        // audio.play();
+
+        var sound = new Howl({
+            // src: ['assets/audio/exquisite.mp3']
+            src: ['assets/audio/all-eyes-on-me.mp3']
+            //src: ['assets/audio/appointed.mp3']
+        });
+
+        sound.play();
+    }
+
     private processNewUpdate(account: AccountInfo, notification: StatusUpdate) {
+        this.playSoundNotification();
+
         if (notification.notification.type === 'mention') {
             this.processMentionsAndNotifications(account, [notification.notification], NotificationTypeEnum.UserMention);
         } else {