Jump to content

Before and after audio player

Recommended Posts

Hey there!

I've been looking for ages for a way to do this in Squarespace: a before/after player. 

All audio mixing/mastering engineers, as well as post-production houses would explode out of sheer joy if this suddenly became possible.

As seen in the image I attached, the player would start both audios (before and after files) simultaneously and use volume of each to create a crossfade.
Click on "before" and hear the "before" audio clip, while the "after" clip is silently playing. 
Click on "after" and crossfade between the two audio files, with the "before" clip playing silently.

One player would work for 2 files.

There should be a visual indicator that the buffers are full before the user triggers "play". 

 

Apparently this could be done with Javascript.

 

Is this plugin possible within Squarespace?

 

Thanks a lot!

before-after player.png

Link to comment
  • 1 month later...
  • 2 weeks later...
  • 1 year later...
On 12/30/2019 at 9:14 PM, tiki2134 said:

Hey there!

I've been looking for ages for a way to do this in Squarespace: a before/after player. 

All audio mixing/mastering engineers, as well as post-production houses would explode out of sheer joy if this suddenly became possible.

As seen in the image I attached, the player would start both audios (before and after files) simultaneously and use volume of each to create a crossfade.
Click on "before" and hear the "before" audio clip, while the "after" clip is silently playing. 
Click on "after" and crossfade between the two audio files, with the "before" clip playing silently.

One player would work for 2 files.

There should be a visual indicator that the buffers are full before the user triggers "play". 

 

Apparently this could be done with Javascript.

 

Is this plugin possible within Squarespace?

 

Thanks a lot!

before-after player.png

Hi, Yes it is possible, I recently Made this one of my client. You will inbox me if you discuss with me further on it. Thanks.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.