Custom HTML notifications

[ghost]

I would like to start a discussion on providing the opportunity to create notifications with custom HTML. Has this been discussed yet, or is it on the roadmap?

[mansona]

No this hasn't been discussed as of yet, did you have something in particular in mind?

[ghost]

I already use your addon in my app and it works quite well. The only request is that sometimes I want to provide more context to the notification, which requires custom HTML.

Either custom HTML, or:

• the ability to replace the icon with a custom image
• give the notification a custom class
• provide hooks on 'willAppear' and 'willDestroy'.

I haven't looked at the internals of the plugin or the best way moving forward yet.

[mansona]

Hmm... yea I think there are some customisations available but I don't think we have everything you need, and I don't know if we can actually provide everything you need directly.

It might be a good idea to experiment with extending the actual plugin exactly like this: https://github.com/Blooie/ember-cli-notifications/blob/master/app/components/notification-message.js

If you wanted I could put together a quick example if you haven't done something like this before?

[ghost]

That would be great if you could put something together.

[nightsh]

Is there any chance that by implementing this we would be able to insert custom HTML links in the messages? I tried with the latest release and HTML snippets are ignored for now (i.e. markup is displayed as it is).

[mansona]

I am planning to look into this over the weekend and I will keep this in mind @nightsh and let you know where my investigations bring me 👍

[ghost]

@mansona Did you happen to look at this last weekend at all? My goal is to have it customizable to look something like Pinterests notifications:

Which at a minimum would mean:

• ability to replace icon with a custom image
• ability to add a custom css class on the individual notification containers
• ability to add html into the notification (bold, links, new lines)

[nightsh]

@mansona any progress on this? Anything you need help with? I am willing to give it a try, but I'm also not a big fan of duplicating effort.
Kudos for your work so far! 🍻

[mansona]

Hey @nightsh I didn't get a chance to look at it over the weekend, and probably won't for the next couple of weeks if I'm honest.

Have a crack at it yourself and we'll collaborate, maybe @ynnoj might get involved 😂

[spinlock99]

Is anyone working on this issue? I'm just starting to integrate ember-cli-notifications into my application and I will be taking on this task (and a few others).

[ynnoj]

@spinlock99 That that I'm aware of. Would be great to see a PR for this! @mansona

[spinlock99]

@ynnoj cool. I should have something in a few weeks (our schedule is crazy right now but this is on the list of things the eventually get done).

One other piece of the API I'd like to change is how the Notifications Service is configured. It feels weird to configure it in the ApplicationRoute. I'd like to export the service from app/services in the addon so that people can extend it in the consuming app and override defaultClearDuration and defaultAutoClear. We also have a policy of not auto-clearing warnings and errors so I'll probably wind up creating defaults for each notification type.

Thoughts? Let me know if I'm heading in the right direction.

Thanks!

[rinoldsimon]

Anyone working on this issue ? I need to replace the icon with a custom image

[ynnoj]

@rinoldsimon Not as far as I'm aware ¯_(ツ)_/¯

[schickm]

I don't know if this will just be further noise, or helpful to someone - but I went the route of allowing a component option to be specified when adding a notification. This doesn't let you do whole-hog customization of the notification, but does allow you to take advantage of templating logic when rendering your message. Here's a diff of my branch vs. master to give you an idea:

https://github.com/stonecircle/ember-cli-notifications/compare/master...schickm:custom-notification-component?expand=1

[rinoldsimon]

is there any workaround for this?