Run custom js after track has played for 1min

General
1

Hi, when a song has played for 1min I would like to:

  • Add class “hide” to the div with class=“performance”
  • Show a custom floating button in the setlist view “Show Next Song”

The reason i would like to hide the performance view is so my vocalists on stage dont get distracted by the ipads and focus more on performing.

When im ready to show the next song info on their ipads, I click the custom “Show Next Song” button and it will:

  • Remove class “hide” from the div with class=“performance”
  • Add class “show_next_song” to the div with class=“performance”
  • Remove the “Show Next Song” button from the setlist view

As soon as the next track plays:

  • Remove class “show_next_song” from the div with class=“performance”
  • Show the “Show Next Song” button from the setlist view

Is this even possible?

2

Hey @technature, welcome to the forum!

You could use AbleSet’s Custom Styles feature to build something like this yourself. AbleSet exposes a global ableset object on the window which allows you to read internal state. This isn’t documented, but here’s some pointers to get you started:

// Subscribe to the current song time
ableset.getSocket('global').on("songTime", (time) => {
  console.log("Time in beats:", time)
});

// Get all setlist data
ableset.queryClient.getQueryData(["setlist"])

Let me know if this helps! :slight_smile:

3

Hi Leo, I tried songTime but doesn’t return how long the current song has been playing for. Is there a way for me to calculate how long the current song has been playing for?