search

ZaBAOW / Notice_M3

A chrome browser extension that connects to Twitches chat channels and notifies users of increased rate in chat messages that are sent to the channel.
1 stars 1 forks source link

notification with image + streamer username #10

Closed ZaBAOW closed 7 years ago

ZaBAOW commented 7 years ago

I need to have the content-scripts in the background parse the twitch channel for the streamers icon, and username. These will both appear on the desktop notifications that are sent to the user. This will allow for the user to recognize which stream the notification was sent from in case there are multiple streams open.

ZaBAOW commented 7 years ago

I attempted to get an icon and personalized message onto the desktop notifications via the syntax provided by the MDN web api for Notification.icon. However, After including and calling the function that is meant to display the notification, the message always comes up as "undefined". I have researched for a reason why this may be happening, but have yet to find a solution. I realize that the functions in my code concerning notifications and notification permissions, originate from the MDN web api documentation. While the documentation does explicitly convey that the api is compatible for chrome, I have some skepticism about said compatibility. It has me thinking that maybe fully committing to using the chrome documentation for notifications may be the solution. I will create a new branch for this for testing and hope that I'm not just overthinking the issue.

ZaBAOW commented 7 years ago

While looking into some of the source code presented in one of the examples from the MDN documentation for notifications, I found that I may have been implementing the function for creating the desktop notifications incorrectly which may somewhat explain why the messages are appearing as undefined. I will hold off on fiddling with the notification api from the chrome documentation for now, but if this doesn't end up working, using it and completely reworking my background code (for notifications), will be the be the next step.

ZaBAOW commented 7 years ago

Image now shows up on notification. uploaded image to imgur.com and referred to the url of the image with http://i.imgur.com/KS6rJQU.png.

ZaBAOW commented 7 years ago

I believe that i have been able to correctly retrieve the channel's respective icon and username, however there is now a problem about the timing of the retrieval. When a stream is loaded up, the background scripts are fired first. This means that when the scripts responsible for getting the icon and username are called, they find nothing ergo return as undefined. The final piece to solving this issue is figuring out how to get the background scripts to run only after the stream page has completely loaded. I have already tried using .on() and .ready() methods to no success, I have seen that i could use a setTimeout() method, but i believe it would be inconsistent as not every user would have the exact same load time.

ZaBAOW commented 7 years ago

I've decided to set up a setInterval() method to retrieve the names and icons of the streamers the user is currently viewing every 5 seconds(for now). Also i had forgotten to reference the classes correctly by omitting the "." at the front. The function is now working as intended.