search

mccxiv / tc

A desktop chat client for Twitch
ISC License
188 stars 17 forks source link

Add live indicator to chat tabs #403

Closed Bauke closed 6 years ago

Bauke commented 6 years ago

Screenshot live-indicator

Adds a red circle for when the stream is live. There's still some issues with it that I'm not sure how to address as I'm fairly new to Angular.

I followed the functionality from thumbnail.js on how to get stream information and passed the streams to scope.m.streams. Then used ng-if="live(channel)" for the indicator. When Tc first loads this won't work properly so there's a few try/catch blocks to catch the undefined errors. Let me know if there's a better way to do it! (also the circle might be slightly too big, I fine it acceptable but others might not)

Related issue: #370

mccxiv commented 6 years ago

Great, this is how I would have done it too. Will review over the weekend.

The only thing I'll change is make the circle smaller and a bit more padding between the channel name. But that's just css

Bauke commented 6 years ago

Adjusted the size/positioning a bit and looks much better now.

Live indicator

Also addressed an issue I found when switching tabs.

Edit: added vodcasts to show a replay icon instead of the red dot:

Vodcast/Live indicator

Bauke commented 6 years ago

Alright everything should be addressed by 2c2e4a49a1d09f3206412d78ec09752af4dbceb2, if there's anything I missed let me know.

mccxiv commented 6 years ago

Awesome