Music on stream - A web based current song / now playing overlay

[Omegadev]

Omegadev submitted a new resource:

Music on stream - A web based current song / now playing overlay - An easy to install chrome extension that provides a music overlay as a browser source.

This Chrome extension lets you display a now-playing overlay on your stream from sources such as Spotify, YouTube, YouTube music, and many more.

Installation​

The installation is straightforward and is detailed here

View attachment 103222

Why use it?​

- The...

Read more about this resource...

 

[Omegadev]

Omegadev updated Music on stream - A web based current song / now playing overlay with a new update entry:

V2.2.1.2 - Minor fixes

Fixed some issues with scanners and added better error handling

Release v2.2.1.2 · Omega-dev0/Music-On-OBS

Better error handling on scanners, and minor fixes

github.com

Read the rest of this update entry...

 

[Sparktank]

Is there a way to have the text (for the title, say from youtube) scroll instead of being cropped off with an ellipsis?
For example, a video labeled "(Soundtrack) The Craft-How Soon Is Now" gets truncated to "(Soundtrack) The Craft-How Soo..."
Changing width of the source doesn't seem to affect its appearance. And the guide for a custom CSS doesn't seem to give any information on truncation or scrolling text.

 

[Omegadev]

Is there a way to have the text (for the title, say from youtube) scroll instead of being cropped off with an ellipsis?
For example, a video labeled "(Soundtrack) The Craft-How Soon Is Now" gets truncated to "(Soundtrack) The Craft-How Soo..."
Changing width of the source doesn't seem to affect its appearance. And the guide for a custom CSS doesn't seem to give any information on truncation or scrolling text.

Hi, I havent implemented a scrolling for the title, just the subtitle thinking it would not be needed but I will add it in the next update since it seems it's needed.

Thanks for your feedback!

 

[Lady_Dxath]

Hi, is there any way to change the font? I have tried from obs, but it is not possible.

 

[Omegadev]

Hi, is there any way to change the font? I have tried from obs, but it is not possible.

Hi, you can use the custom css on the OBS browser source, here's how:

Open the browser source properties and in the custom CSS box add this to the bottom:

:root {
    --titleFontFamily: "Papyrus";
    --subtitleFontFamily: "Papyrus";
}

You can replace Papyrus with any font name you want.
The complete list of fonts is available here: https://www.cssfontstack.com/

There is no way to add custom fonts right now because they require being imported and that cant be done with css

I have custom fonts planned for the next update but I'm quite busy right now.

Have a good day

 

[lumos7]

how can i get this to work with streamelements instead of nightbot

 

[Amazerommu]

Would it be possible to add Nightbot.tv/song_requests to the list of supported platforms/websites? (it uses YouTube videos)

 

[Omegadev]

Would it be possible to add Nightbot.tv/song_requests to the list of supported platforms/websites? (it uses YouTube videos)

It looks possible to do, I will look into it

 

[Omegadev]

how can i get this to work with streamelements instead of nightbot

Hi, stream elements recently added an option to hide commands.
I will add official support in the next update

In the mean time, you can use this command in stream elements (make sure to hide the command):

${urlfetch http://129.151.87.197:6013/integration?token=YOURTOKEN}

You can find your toke at the end of your overlay link
ex: http://127.0.0.1:6013/overlay?token=5e7a25b8a43e1cb4c0f7befd109c118c

 

[lumos7]

Hi, stream elements recently added an option to hide commands.
I will add official support in the next update

In the mean time, you can use this command in stream elements (make sure to hide the command):

${urlfetch http://129.151.87.197:6013/integration?token=YOURTOKEN}

You can find your toke at the end of your overlay link
ex: http://127.0.0.1:6013/overlay?token=5e7a25b8a43e1cb4c0f7befd109c118c

so i literally make a command with this corrected code and nothing else? i just tested and it said unable to make request and nightbot is still pulling a track from the last time i streamed, the song changed 4 times and it didnt update

 

[Omegadev]

so i literally make a command with this corrected code and nothing else? i just tested and it said unable to make request and nightbot is still pulling a track from the last time i streamed, the song changed 4 times and it didnt update

Hey, after testing (and correcting the command because my knowledge on SE was outdated) it seems stream elements is not recognizing the URL as correct because it uses a port number (the :6013), this requires a bit of tinkering on the server.
I will come back to you once it's ready (and i'm adding that to the evergrowing list for the update)


However, the issue with Nightbot is rather concerning, in theory it should not be possible for the overlay and the bot response parts to fall out of sync as it's the same server that is handling both systems. I cannot reproduce the issue either.
This is likely on Nighbot's side (response caching or something else), I will continue to investigate...

Do you still have the issue with Nighbot?

Thank you for your report

 

[Omegadev]

so i literally make a command with this corrected code and nothing else? i just tested and it said unable to make request and nightbot is still pulling a track from the last time i streamed, the song changed 4 times and it didnt update

Alright, for stream elements use as a command:

$(customapi http://m.omegadev.xyz/integration?token=YOURTOKEN)

Sorry for the trouble

 

[RTX2060]

I’m having an issue where the album art for my original song, which I uploaded to YouTube Music, doesn’t show up on OBS, even though it appears fine on YouTube Music. Do you have any suggestions for how I can fix this?

I apologize if the translation is a bit off, as I used Google Translate.

 

[Omegadev]

I’m having an issue where the album art for my original song, which I uploaded to YouTube Music, doesn’t show up on OBS, even though it appears fine on YouTube Music. Do you have any suggestions for how I can fix this?

I apologize if the translation is a bit off, as I used Google Translate.

Hey, could you send me the link of your song so I can investigate the issue?
You can send it here or via private messages

 

[VaporSkull]

Love this and it works great but is there any chance you could maybe try to make it work with this website? https://shuffle-playlist.vercel.app/

 

[Omegadev]

Love this and it works great but is there any chance you could maybe try to make it work with this website? https://shuffle-playlist.vercel.app/

Hey, i'm currently working on a V3 of the extension that changes a lot of things under the hood and simplifies the process of adding supported websites.

I will check if I can add it when this new version releases.
Thanks for suggesting a source!

 

[Muranieum]

Hey. I know that this has been requested above but will there be an update soon for the title scrolling feature instead of cropping? Also for custom CSS what is the variable for the spacing between the title and the subtitle? Thanks for the great overlay.

 

[Omegadev]

Hey. I know that this has been requested above but will there be an update soon for the title scrolling feature instead of cropping? Also for custom CSS what is the variable for the spacing between the title and the subtitle? Thanks for the great overlay.

Sorry, I have a lot going on so the update progress is very slow, I might do a small update to insert the requested features before the v3 but again I am very busy.

Regarding the spacing between the title and subtitle:

#subtitle { margin-top:[SPACING]px }
With [SPACING] the additional spacing between the subtitle and the title (works for negative values)


Thanks for using the extension!

 

[kpoppapi]

Any chance of adding iTunes (not Apple Music, I mean actual iTunes) support? I still download most of my music, so it would be nice to have an option that isn't a streaming service.