51 lines
1.3 KiB
JavaScript
51 lines
1.3 KiB
JavaScript
|
function synchroniseBackgroundWithAudio(bgi, target) {
|
||
|
|
var cnt = document.getElementById(target || 'BackgroundImage') || document.getElementById('container'),
|
||
|
|
bga = document.getElementById('BackgroundAudio'),
|
||
|
|
rdy = false,
|
||
|
|
bgs = [];
|
||
|
|
|
||
|
|
if(!cnt)
|
||
|
|
return;
|
||
|
|
|
||
|
|
var computed = getComputedStyle(cnt);
|
||
|
|
|
||
|
|
if(computed.backgroundImage && target !== 'ForegroundImage')
|
||
|
|
bgs = computed.backgroundImage.split(',');
|
||
|
|
|
||
|
|
if(!bga) {
|
||
|
|
bgs.splice(0, 0, 'url(' + bgi + ')');
|
||
|
|
cnt.style.backgroundImage = bgs.join(',');
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
var onReady = function(url) {
|
||
|
|
bgs.splice(0, 0, 'url(' + url + ')');
|
||
|
|
cnt.style.backgroundImage = bgs.join(',');
|
||
|
|
bga.play();
|
||
|
|
};
|
||
|
|
|
||
|
|
bga.addEventListener('canplay', function() {
|
||
|
|
rdy = true;
|
||
|
|
});
|
||
|
|
|
||
|
|
bga.pause();
|
||
|
|
bga.currentTime = 0;
|
||
|
|
|
||
|
|
var xhr = new XMLHttpRequest;
|
||
|
|
xhr.responseType = 'blob';
|
||
|
|
xhr.onreadystatechange = function() {
|
||
|
|
if(xhr.readyState !== 4)
|
||
|
|
return;
|
||
|
|
bgi = URL.createObjectURL(xhr.response);
|
||
|
|
|
||
|
|
if(rdy)
|
||
|
|
onReady(bgi);
|
||
|
|
else
|
||
|
|
bga.addEventListener('canplay', function() {
|
||
|
|
onReady(bgi);
|
||
|
|
});
|
||
|
|
};
|
||
|
|
xhr.open('GET', bgi);
|
||
|
|
xhr.send();
|
||
|
|
}
|