diff --git a/README.md b/README.md new file mode 100644 index 0000000..25ba2b1 --- /dev/null +++ b/README.md @@ -0,0 +1,27 @@ +# WordPress A/B Audio Sync + +WordPress plugin that provides A/B audio comparison. This is a fork of the, now unmaintained, +"hm-audio-sync" project. + +## Instructions + +* Download the plugin and unzip to your wp-content/plugins directory +* Alternatively, just upload the zip file via the WordPress plugins UI +* Activate plugin via Wordpress admin +* Include the following elements on your page or post + +```html + + + + + +``` + +Replace `PATH_TO_AUDIO_A` and `PATH_TO_AUDIO_B`, of course with your own +files. File type will be dependent on browser support. +This has been tested with MP3 and WAV audio files with no issues on Google Chrome. + +The plugin will look for HTML elements with IDs of "audio-sync-a" and "audio-sync-b". +If found, it will wire the buttons to control the playback and A/B switching of the audio +files. diff --git a/ab-audio-sync.js b/ab-audio-sync.js new file mode 100755 index 0000000..dddc74b --- /dev/null +++ b/ab-audio-sync.js @@ -0,0 +1,89 @@ +var DEBUG = false; + +var audioA; +var audioB; +var btnPlay; +var btnA; +var btnB; + +// Ignore pages that do not contain the correct set of IDs +jQuery(document).ready( function(){ + audioA = document.getElementById('audio-sync-a'); + audioB = document.getElementById('audio-sync-b'); + btnPlay = jQuery('#audio-btn-sync-play'); + btnA = jQuery('#audio-btn-sync-a'); + btnB = jQuery('#audio-btn-sync-b'); + + if( audioA === null || audioB === null ) { + debug('#audio-sync-a or #audio-sync-b was not found'); + } else if( btnPlay.length != 1 ) { + debug('#audio-btn-sync-play was not found'); + } else if( btnA.length != 1 || btnB.length != 1 ) { + debug('#audio-btn-sync-a or #audio-btn-sync-b was not found'); + } else { + debug('Starting ABAudioSync()'); + btnA.attr('disabled', 'true'); + btnB.attr('disabled', 'true'); + ABAudioSync(); + } +}); + +function ABAudioSync(){ + var firstRun = true; + + audioA.volume = 1; + audioB.volume = 0; + + debug('btnPlay: ' + btnPlay); + + btnPlay.click( function(){ + debug('btnPlay clicked (firstRun=' + firstRun + ')'); + if( audioA.paused || firstRun ){ + jQuery(this).text('Pause'); + syncTime(); + audioA.play(); + audioB.play(); + btnA.removeAttr('disabled'); + btnB.removeAttr('disabled'); + if( firstRun ) + btnA.attr('disabled','true'); + firstRun = false; + } else { + audioA.pause(); + audioB.pause(); + syncTime(); + jQuery(this).html('Play'); + btnA.attr('disabled', 'true'); + btnB.attr('disabled', 'true'); + } + }); + + // Start A, Stop B + btnA.click( function(){ + // debug('btnA clicked'); + audioA.volume = 1.0; + audioB.volume = 0.0; + btnA.attr('disabled','true'); + btnB.removeAttr('disabled'); + firstRun = false; + }); + + // Start B, Stop A + btnB.click( function(){ + // debug('btnB clicked'); + audioB.volume = 1.0; + audioA.volume = 0.0; + btnA.removeAttr('disabled'); + btnB.attr('disabled','true'); + firstRun = false; + }); +} + +function debug(msg) { + if( DEBUG ) + console.log(msg); +} + +function syncTime(){ + audioA.currentTime = audioB.currentTime; +} diff --git a/ab-audio-sync.php b/ab-audio-sync.php new file mode 100755 index 0000000..6c8c677 --- /dev/null +++ b/ab-audio-sync.php @@ -0,0 +1,27 @@ +