Hey @iamderkis , I was able to reproduce the error on my computer. It all has to do with the CSS selector.
const lyrics = document.querySelectorAll(
".lyrics-line span:not(.text-fit)"
);
The problem is that the document.querySelectorAll keeps looking down into the span child list for an element that doesn’t contain the class name: text-fit. Just replace the above code block with this:
const lyrics = document.querySelectorAll(
".lyrics-line p > span:not(.text-fit)"
);
That was it! Been running through multiple songs and appears to be working like a charm! Thank you!
I wanted to say thank you both again! It worked flawlessly on Sunday. One quick question that I am curious about. Would it be possible to have the section of the song show directly to the left of the lyrics? I actually did this with Pro Presenter 7 and just made the NDI feed from Ableset a width that allowed me to put a Stage Layout from Pro Presenter 7 that showed the groups from Pro7 beside the lyrics. Since our lyrics are automated with Ableset for our vocalists, we do not always have someone running Pro7 at rehearsals so the groups will not match up.
I’m attaching a sketch of what I am thinking. Essentially the lyrics would be pushed far enough to the right to never overlap with the sections but the sections would always show. Just an easy indicator of where we are in the song.
I am using the Browsers in OBS so I am able to manipulate the layout and I have already added a section to show my “measures-track” and then cropped out the measures before and after the current, so the band can always see the current measure we are at but that does not help the vocalists. I believe I can setup a workaround for this where I duplicate my “SECTIONS” track into a separate “LYRICS” track and then just open another browser in OBS and line it up with the lyrics so that it will show the section of the song we are currently at. Just wondering if there is a cleaner way it could be done without creation another lyric track with duplicated content in it.
There was a thread that mentioned this a long time ago and I tried merging it into my codebase but myself (nor ChatGPT) could make it work with this current layout.
Please excuse my late reply!
Unfortunately, this layout isn’t possible with the current version of AbleSet. I’ll add some more dynamic class names to sections in the next update so you can style the current and next section headers specifically.
In the meantime, if you’d like to create a track with just sections, you could create an empty lyrics track and use the section headers that AbleSet automatically displays. Those could be cropped in OBS and placed on the side of your screen.
I figured that’s the case and it’s not a major deal. I have done this in the meantime and it has worked great. Used it this past Sunday. I just created a track called “groups” for the sections and a track called “title” for the song title to show at the top. It worked great. The band has loved it and loves that it shows the current measure at the top right. Thanks for all your hard work!
want to ask if you have thought about this anymore since this post? Am also interested in a non-scroll option for lyrics
Hey @miikaii,
You can use custom CSS to modify the scroll time. To disable animations completely, you can use the following CSS:
.lyrics {
--transition-time: 0;
}
Let me know if this works for you! 
I use this option and it works perfectly as we are jumping between two lines of lyrics at a time, both divided by a border box so the transition time looked funky for us. This option works great.
Thank you! Works great!
Do you cast a browser window to the confidence monitors or the lyrics view from the floating window page? Hope that question makes sense
Currently I am using a Decklink device (single out) and OBS to send it to Pro Presenter 7 as a Video Input.
I have also done the same thing but instead used NDI as a Video Input in Pro Presenter 7.
Casting would be an option although not quite as reliable.
Both options I have tried work great. Never had dropouts. Just make sure to hardwire if possible if using NDI
Awesome, thanks for that. Not to talk your ear off, but did you ever encounter an issue where the upcoming, orange line of lyrics glitches in white for a split second before becoming the current lyric?
It’s no problem! I have not encountered that but I actually use the +CC tag so that our lyrics match the color of the track. When its a solo, we use yellow, if it’s all choir, it’s white (this was actually requested by our vocalists).
I also have quite a bit of extra JS, and CSS added in as well as an external JS library to make the text scale up to the container size. I’d be more than happy to share that as well when I’m back in the office.
That would be greatly appreciated whenever you have time, thank you so much 