Desktop notification - html formatted? #8952

4 Answer(s)

• 

  0

  aaron created 4 years ago

  Support Team

  It's in angular/src/assets/abp-web-resources/abp.notify.js.

  The message parameter already accepts HTML formatted string:

  abp.notify.error('Some fields have <strong>errors.</strong><br/>Please check and try again.');
  

  Save Cancel
• 

  0

  BobIngham created 4 years ago

  Hi @aaron,

  Sorry, misunderstanding, I didn't mean that alert I meant the notification alert: I want to be able to change it to use innerHTML.

  Save Cancel
• 

  0

  aaron created 4 years ago

  Support Team

  Oh, desktop notification.

  It's in angular/src/app/shared/layout/notifications/UserNotificationHelper.ts.

  ASP .NET Zero is using Push and it's not possible to be HTML formatted as per Nickersoft/push.js#35:

  According to the official docs, it seems that the body attribute is simply a string that does not resolve any HTML tags. Unfortunately, there is nothing Push itself can do to change this, as its just a robust shim wrapper around the native API calls.

  Save Cancel
• 

  0

  BobIngham created 4 years ago

  In your debt, as always, thanks Aaron, I was able to get this working after a lot of messing around!

      show(userNotification: abp.notifications.IUserNotification): void {
          let unformattedMessage = userNotification.notification.data.properties.notificationMessage.replace(/(<([^>]+)>)/ig, "");
          let notification = userNotification.notification.data.properties.notificationHeader + '\n' + unformattedMessage
  
          //Application notification
          abp.notifications.showUiNotifyForUserNotification(userNotification, {
              'onclick': () => {
                  //Take action when user clicks to live toastr notification
                  let url = this.getUrl(userNotification);
                  if (url) {
                      location.href = url;
                  }
              }
          });
  
          //Desktop notification
          Push.default.create('Nuagecare', {
              body: notification,
              icon: abp.appPath + 'assets/common/images/app-logo-small.png',
              timeout: 6000,
              onClick: function () {
                  window.focus();
                  this.close();
              }
          });
      }
  

  Save Cancel