<!doctype html>
<html>
<head>
<title>HTML5 Web Audio API Usage - RJM Programming - June, 2019 - Thanks to https://www.html5rocks.com/en/tutorials/webaudio/intro/</title>
<style>
button { background-color: yellow; }
input { background-color: pink; }
</style>
<script type='text/javascript'>
window.onload = init;
var prevdg=0;
var dvih='<video onclick="this.play();" id=ivideo src="../PHP/macbetha1s1.m4v"></video>';
var nostop=false;
var context;
var bufferLoader;
var gvo=null;
var source=null;
var source1 = null; //context.createBufferSource();
var source2 = null; //context.createBufferSource();
var source3 = null; //context.createBufferSource();
var source4 = null; //context.createBufferSource();
var lastcmdsuffix='';
var source1p = false; //context.createBufferSource();
var source2p = false; //context.createBufferSource();
var source3p = false; //context.createBufferSource();
var source4p = false; //context.createBufferSource();
var ioffset=0;
var lastbo=null;
var nafter=0;
var sb=[];
var ioffs=[0,0,0,0];
var whichs='';
var fors='';
var forid='';
function afterfor() {
if (fors != '' && forid != '') {
if (document.getElementById(forid).innerHTML.indexOf(fors.substring(0,eval(-1 + fors.length))) == -1) {
document.getElementById(forid).innerHTML+=fors;
}
}
fors='';
forid='';
}
function documentgetElementById(idis, ds) {
fors='';
forid='';
if (source_valid() && ('' + ds).indexOf('-') == -1 && ('' + ds).replace('0','') != '') {
forid=idis;
fors=' ... for ' + ds + ' secs';
setTimeout(afterfor,900);
document.getElementById(idis).click();
} else {
document.getElementById(idis).click();
}
}
function atThisTime() {
if (("" + nextones[eval(-1 + inextones)].buttonNum + " ").substring(0,1) == '1') {
if (("" + nextones[eval(-1 + inextones)].buttonNum + " ") == '1') {
documentgetElementById('b1',nextones[eval(-1 + inextones)].durationSecs); //.click();
} else {
documentgetElementById('xb1',nextones[eval(-1 + inextones)].durationSecs); //.click();
}
} else if (("" + nextones[eval(-1 + inextones)].buttonNum + " ").substring(0,1) == '2') {
if (("" + nextones[eval(-1 + inextones)].buttonNum + " ") == '2') {
documentgetElementById('b2',nextones[eval(-1 + inextones)].durationSecs); //.click();
} else {
documentgetElementById('xb2',nextones[eval(-1 + inextones)].durationSecs); //.click();
}
} else if (("" + nextones[eval(-1 + inextones)].buttonNum + " ").substring(0,1) == '3') {
if (("" + nextones[eval(-1 + inextones)].buttonNum + " ") == '3') {
documentgetElementById('b3',nextones[eval(-1 + inextones)].durationSecs); //.click();
} else {
documentgetElementById('xb3',nextones[eval(-1 + inextones)].durationSecs); //.click();
}
} else if (("" + nextones[eval(-1 + inextones)].buttonNum + " ").substring(0,1) == '4') {
if (("" + nextones[eval(-1 + inextones)].buttonNum + " ") == '4') {
documentgetElementById('b4',nextones[eval(-1 + inextones)].durationSecs); //.click();
} else {
documentgetElementById('xb4',nextones[eval(-1 + inextones)].durationSecs); //.click();
}
}
}
function nbit() {
document.getElementById('duration').value='';
}
function checknext() {
if (nafter > 0) { setTimeout(nbit, nafter); nafter=0; }
if (lastcmdsuffix != "") {
//if (lastcmdsuffix.indexOf(('' + prevdg + ';')) == 0) { lastcmdsuffix=lastcmdsuffix.replace(('' + prevdg + ';'),''); alert('-2:' + lastcmdsuffix); } else { alert('-5:' + prevdg + ' in ' + lastcmdsuffix); }
var huhss=lastcmdsuffix.split(';');
if (lastcmdsuffix.indexOf(huhss[0] + ';') != -1) {
lastcmdsuffix=lastcmdsuffix.replace(huhss[0] + ';', '');
} else {
lastcmdsuffix=lastcmdsuffix.replace(huhss[0], '');
}
var withins=huhss[0].split(':');
if (withins.length >= 5) {
if (("" + nextones[inextones].durationSecs).indexOf('-') == -1 && ("" + nextones[inextones].durationSecs) != '0') {
document.getElementById('startingat').value="" + nextones[inextones].startingAt;
document.getElementById('startingin').value="" + nextones[inextones].startingIn;
document.getElementById('loop1').checked=nextones[inextones].loopIt;
if (document.getElementById('duration').value.indexOf(huhss[0] + ';') != -1) {
setTimeout(atThisTime, eval(1000 * eval('' + prevdg)));
document.getElementById('duration').value=lastcmdsuffix.replace(huhss[0] + ";", nextones[inextones].durationSecs + ";");
//alert('here at ' + document.getElementById('duration').value);
} else {
setTimeout(atThisTime, eval(1000 * eval('' + prevdg)));
//alert('Here ' + inextones + ' . ' + huhss[0] + ' at ' + document.getElementById('duration').value);
//document.getElementById('duration').value=lastcmdsuffix.replace(huhss[0], nextones[eval(0 + inextones)].durationSecs);
document.getElementById('duration').value=lastcmdsuffix.replace(huhss[0], nextones[eval(0 + inextones)].durationSecs);
//alert('Here at ' + lastcmdsuffix.replace(huhss[0], nextones[eval(0 + inextones)].durationSecs));
}
inextones++;
} else {
lastcmdsuffix="";
//document.getElementById('duration').value="";
nextones=[];
inextones=0;
}
} else if (withins.length == 4) {
lastcmdsuffix="";
//document.getElementById('duration').value="";
nextones=[];
inextones=0;
} else if (withins.length == 3) {
lastcmdsuffix="";
//document.getElementById('duration').value="";
nextones=[];
inextones=0;
} else if (withins.length == 2) {
lastcmdsuffix="";
//document.getElementById('duration').value="";
nextones=[];
inextones=0;
} else if (withins.length == 1) {
lastcmdsuffix="";
//document.getElementById('duration').value="";
nextones=[];
inextones=0;
} else if (lastcmdsuffix == "") {
nextones=[];
inextones=0;
} else {
document.getElementById('duration').value=lastcmdsuffix;
inextones=0;
}
} else {
//document.getElementById('duration').value="";
nextones=[];
inextones=0;
}
}
function source_valid() {
if (typeof source !== 'undefined') {
if (source.length >= 4) { return true; }
}
return false;
}
function sourcep_valid() {
if (typeof sourcep !== 'undefined') {
if (sourcep.length >= 4) { return true; }
}
return false;
}
function predura(tv,tvo) {
var withins=[];
var total=0;
if (tv != '') {
lastcmdsuffix=tv;
document.getElementById('duration').value=tv;
if (tv.split(';')[0].split(':')[eval(-1 + tv.split(';')[0].split(':').length)].indexOf('-') == -1 && tv.split(';')[0].split(':')[eval(-1 + tv.split(';')[0].split(':').length)] != '0') {
total+=eval('0' + tv.split(';')[0].split(':')[eval(-1 + tv.split(';')[0].split(':').length)]);
}
var huhss=lastcmdsuffix.split(';');
if (huhss.length <= 1) {
lastcmdsuffix="";
nextones=[];
inextones=0;
} else {
lastcmdsuffix="";
nextones=[];
inextones=0;
for (var jji=1; jji<huhss.length; jji++) {
lastcmdsuffix+=huhss[jji];
withins=huhss[jji].split(':');
if (withins.length >= 5) {
nextones.push(new NextAudioSet(withins[0], withins[1], withins[2], withins[3], withins[4]));
if (withins[4].indexOf('-') == -1 && withins[4] != '0') {
total+=eval('0' + withins[4].split(';')[0].split(':')[eval(-1 + withins[4].split(';')[0].split(':').length)]);
}
} else if (withins.length == 4) {
nextones.push(new NextAudioSet(withins[0], withins[1], withins[2], withins[3], ""));
} else if (withins.length == 3) {
nextones.push(new NextAudioSet(withins[0], withins[1], withins[2], false, ""));
} else if (withins.length == 2) {
nextones.push(new NextAudioSet(withins[0], withins[1], "", false, ""));
} else if (withins.length == 1) {
nextones.push(new NextAudioSet(withins[0], "", "", false, ""));
}
}
//document.getElementById('duration').value=lastcmdsuffix;
//alert(lastcmdsuffix);
}
}
if (total > 0) { total++; nafter=eval(1000 * eval('' + total)); }
tvo.value='';
}
function dura(insis,lbo) {
var dg="";
if (('' + fors).indexOf('-') == -1 && ('' + fors) != '0' && fors != '') {
dg=fors.split(' for ')[1].split(' ')[0];
fors='';
forid='';
if (dg.indexOf('-') == -1 && dg != '0') {
if (lbo) { if (lbo.innerHTML.indexOf(' ... for ' + dg + ' sec') == -1) { lbo.innerHTML+=' ... for ' + dg + ' secs'; } }
if (insis.split(',').length == 3) {
prevdg=eval('' + dg);
return insis.replace(',' + insis.split(',')[2].split(')')[0] + ')', ',' + dg + ')');
} else if (insis.split(',').length == 2) {
prevdg=eval('' + dg);
return insis.replace(')', ',0,' + dg + ')');
} else {
prevdg=eval('' + dg);
return '(0,0,' + dg + ')';
}
}
} else if (document.getElementById('duration').value.split(';')[0].replace('0','').indexOf(':') != -1) {
dg=document.getElementById('duration').value.split(';')[0].split(':')[eval(-1 + document.getElementById('duration').value.split(';')[0].split(':').length)];
if (dg.indexOf('-') == -1 && dg != '0') {
if (lbo) { if (lbo.innerHTML.indexOf(' ... for ' + dg + ' sec') == -1) { lbo.innerHTML+=' ... for ' + dg + ' secs'; } }
if (insis.split(',').length == 3) {
prevdg=eval('' + dg);
return insis.replace(',' + insis.split(',')[2].split(')')[0] + ')', ',' + dg + ')');
} else if (insis.split(',').length == 2) {
prevdg=eval('' + dg);
return insis.replace(')', ',0,' + dg + ')');
} else {
prevdg=eval('' + dg);
return '(0,0,' + dg + ')';
}
}
} else if (document.getElementById('duration').value.replace('0','') != '') {
if (document.getElementById('duration').value.split(':')[0].split(';')[0].split('.')[0].split(' ')[0].indexOf('-') == -1) {
if (insis.split(',').length == 3) {
prevdg=eval('' + document.getElementById('duration').value.split(':')[0].split(';')[0].split('.')[0].split(' ')[0]);
if (lbo) { if (lbo.innerHTML.indexOf(' ... for ' + prevdg + ' sec') == -1) { lbo.innerHTML+=' ... for ' + prevdg + ' secs'; } }
return insis.replace(',' + insis.split(',')[2].split(')')[0] + ')', ',' + document.getElementById('duration').value.split(':')[0].split(';')[0].split('.')[0].split(' ')[0] + ')');
} else if (insis.split(',').length == 2) {
prevdg=eval('' + document.getElementById('duration').value.split(':')[0].split(';')[0].split('.')[0].split(' ')[0]);
if (lbo) { if (lbo.innerHTML.indexOf(' ... for ' + prevdg + ' sec') == -1) { lbo.innerHTML+=' ... for ' + prevdg + ' secs'; } }
return insis.replace(')', ',' + document.getElementById('duration').value.split(':')[0].split(';')[0].split('.')[0].split(' ')[0] + ')');
} else {
prevdg=eval('' + document.getElementById('duration').value.split(':')[0].split(';')[0].split('.')[0].split(' ')[0]);
if (lbo) { if (lbo.innerHTML.indexOf(' ... for ' + prevdg + ' sec') == -1) { lbo.innerHTML+=' ... for ' + prevdg + ' secs'; } }
return '(0,0,' + document.getElementById('duration').value.split(':')[0].split(';')[0].split('.')[0].split(' ')[0] + ')';
}
}
} else if (nextones.length > 0 && nextones.length > eval(-1 + inextones) && inextones > 0) {
dg=nextones[eval(-1 + inextones)].durationSecs;
if (lbo) { if (lbo.innerHTML.indexOf(' ... for ' + dg + ' sec') == -1) { lbo.innerHTML+=' ... for ' + dg + ' secs'; } }
prevdg=0;
//alert(insis);
if (insis.split(',').length == 3) {
//prevdg=eval('' + document.getElementById('duration').value.split(':')[0].split(';')[0].split('.')[0].split(' ')[0]);
return insis.replace(',' + insis.split(',')[2].split(')')[0] + ')', ',' + dg + ')');
} else if (insis.split(',').length == 2) {
//prevdg=eval('' + document.getElementById('duration').value.split(':')[0].split(';')[0].split('.')[0].split(' ')[0]);
//alert(insis.replace(')', ',' + dg + ')'));
return insis.replace(')', ',' + dg + ')');
} else {
//prevdg=eval('' + document.getElementById('duration').value.split(':')[0].split(';')[0].split('.')[0].split(' ')[0]);
return '(0,0,' + dg + ')';
}
}
return insis;
}
function NextAudioSet(buttonNum, startingAt, startingIn, loopIt, durationSecs) {
this.buttonNum = "" + buttonNum;
if (typeof startingAt !== 'undefined') {
this.startingAt = "" + startingAt;
} else {
this.startingAt = "";
}
if (typeof startingIn !== 'undefined') {
this.startingIn = "" + startingIn;
} else {
this.startingIn = "";
}
if (typeof loopIt !== 'undefined') {
if ((("" + loopIt).toLowerCase() + "f").substring(0,1).replace('0','f').replace('1','t') == 't') {
this.loopIt = true;
} else {
this.loopIt = false;
}
} else {
this.loopIt = false;
}
if (typeof durationSecs !== 'undefined') {
this.durationSecs = "" + durationSecs;
} else {
this.durationSecs = "";
}
}
var nextones=[];
var inextones=0;
var source=[];
var sourcep=[];
var notoka=location.search.split('notoka=')[1] ? (" " + decodeURIComponent(location.search.split('notoka=')[1]).split('&')[0]) : "";
if (notoka == "") {
for (var iii=1; iii<=4; iii++) {
source.push(null);
sourcep.push(false);
}
}
for (var ii=5; ii<500; ii++) {
if (source_valid()) { //if (typeof source !== 'undefined') {
source.push(null);
if (sourcep_valid()) { //if (typeof sourcep !== 'undefined') {
sourcep.push(false);
}
} else {
eval("var source" + ii + " = null;"); //context.createBufferSource();
}
}
function BufferLoader(context, urlList, callback) { // thanks to https://stackoverflow.com/questions/17333777/uncaught-reference-error-bufferloader-is-not-defined
this.context = context;
this.urlList = urlList;
this.onload = callback;
this.bufferList = new Array();
this.loadCount = 0;
}
BufferLoader.prototype.loadBuffer = function(url, index) {
// Load buffer asynchronously
var request = new XMLHttpRequest();
request.open("GET", url, true);
request.responseType = "arraybuffer";
var loader = this;
request.onload = function() {
// Asynchronously decode the audio file data in request.response
loader.context.decodeAudioData(
request.response,
function(buffer) {
if (!buffer) {
alert('error decoding file data: ' + url);
return;
}
loader.bufferList[index] = buffer;
if (++loader.loadCount == loader.urlList.length)
loader.onload(loader.bufferList);
},
function(error) {
console.error('decodeAudioData error', error);
}
);
}
request.onerror = function() {
alert('BufferLoader: XHR error');
}
request.send();
}
BufferLoader.prototype.load = function() {
for (var i = 0; i < this.urlList.length; ++i)
this.loadBuffer(this.urlList[i], i);
}
function init() { // thanks to https://www.html5rocks.com/en/tutorials/webaudio/intro/
// Fix up prefixing
// './past_quarterto.m4a',
window.AudioContext = window.AudioContext || window.webkitAudioContext;
context = new AudioContext();
bufferLoader = new BufferLoader(
context,
[
(location.search.split('url1=')[1] ? (decodeURIComponent(location.search.split('url1=')[1]).split('&')[0]) : '../PHP/macbetha1s1.m4a'),
(location.search.split('url2=')[1] ? (decodeURIComponent(location.search.split('url2=')[1]).split('&')[0]) : './one_to_fiftynine.m4a'),
(location.search.split('url3=')[1] ? (decodeURIComponent(location.search.split('url3=')[1]).split('&')[0]) : './am_pm.m4a'),
(location.search.split('url4=')[1] ? (decodeURIComponent(location.search.split('url4=')[1]).split('&')[0]) : './past_quarterto.m4a'),
],
finishedLoading
);
bufferLoader.load();
getideas();
}
function andthen() {
if (gvo) { gvo.play(); }
}
function andnotthen() {
document.getElementById('dvideo').innerHTML=dvih;
}
function startit() {
if (whichs != '') {
if (1 == 2) { eval("if (source" + eval(whichs % 400) + "p) { if (!source" + eval(whichs % 400) + ".start) { source" + eval(whichs % 400) + ".start = source" + eval(whichs % 400) + ".noteOn; } else if (1 == 6 && source" + whichs + "p) { var source" + whichs + " = context.createBufferSource(); source" + whichs + ".buffer = sb[" + eval(-1 + eval(whichs % 4)) + "]; source" + whichs + ".connect(context.destination); } }"); }
}
}
function stopit() {
if (whichs != '') {
//eval("if (!source" + whichs + ".stop) { source" + whichs + ".stop = source" + whichs + ".noteOff; } else if (source" + whichs + "p) { source" + whichs + ".stop(); }");
//whichs='';
if (source_valid()) { //if (typeof source !== 'undefined') {
if (sourcep_valid()) { //if (typeof sourcep !== 'undefined') {
if (sourcep[eval(-1 + eval(whichs))]) { source[eval(-1 + eval(whichs))].stop(); }
} else {
eval(" if (source" + whichs + "p) { source[" + eval(-1 + eval(whichs)) + "].stop(); }");
}
} else {
eval(" if (source" + whichs + "p) { source" + whichs + ".stop(); }");
}
if (lastbo) {
lastbo.style.border='';
lastbo.innerHTML=lastbo.innerHTML.split(' ... ')[0];
lastbo=null;
}
}
}
function other(ioth, bo) {
var prefix="";
if (!nostop) { stopit(); } else { lastbo=null; }
if (whichs == "") { whichs="" + ioth; }
whichs="" + eval(ioffs[eval(-1 + eval('' + ioth))] + ioth);
//startit();
if (sourcep_valid()) { //if (typeof sourcep !== 'undefined') {
sourcep[eval(-1 + eval(whichs))]=true;
} else {
eval("source" + whichs + "p=true;");
}
if (document.getElementById('loop1').checked || document.getElementById('loop2').checked) {
prefix="🔁";
if (source_valid()) { //if (typeof source !== 'undefined') {
source[eval(-1 + eval(whichs))].loop=true;
} else {
eval("source" + whichs + ".loop = true;");
}
}
var sendb=("(" + document.getElementById('startingin').value + "," + document.getElementById('startingat').value + ");").replace("(,)", "(0)").replace("(,", "(0,").replace(",)", ",0)");
var suffix=("(" + document.getElementById('startingin').value + "," + document.getElementById('startingat').value + ")").replace("(,)", "").replace("(0,0)", "").replace("(0,)", "").replace("(,0)", "").replace("(,", ",").replace(",)", "").trim();
if (document.getElementById('loop1').checked || document.getElementById('loop2').checked || sendb.replace(/0/g,'').replace(/\,/g,'').replace('(','').replace(')','') != '') {
//alert(suffix.replace('(', ' @ ').replace(',', ' in ').replace(')', ' secs'));
if ((prefix + ' ' + suffix.replace('(', ' @ ').replace(',', ' in ').replace(')', ' secs')).trim() == '') {
bo.innerHTML=bo.innerHTML.split(' ... ')[0];
} else {
bo.innerHTML=bo.innerHTML.split(' ... ')[0] + ' ... ' + prefix + ' ' + suffix.replace('(', ' in ').replace(',', ' @ ').replace(')', ' secs');
}
} else if (bo.innerHTML.indexOf(' ... ') != -1) {
bo.innerHTML=bo.innerHTML.split(' ... ')[0];
}
bo.style.border='1px inset red';
if (1 == 5 && (document.getElementById('loop1').checked || document.getElementById('loop2').checked)) {
lastbo=null;
} else {
lastbo=bo;
}
//alert('-7:' + prevdg);
if (source_valid()) { //if (typeof source !== 'undefined') {
//alert('-6:' + prevdg);
if (fors.replace('0','') != '' && fors.indexOf('-') == -1) {
//alert('-66:' + prevdg);
source[eval(-1 + eval(whichs))].start(eval('0' + document.getElementById('startingin').value), eval('0' + document.getElementById('startingat').value), eval('' + dura(document.getElementById('duration').value,lastbo).split(';')[0].split(':')[eval(-1 + dura(document.getElementById('duration').value,lastbo).split(';')[0].split(':').length)].split('.')[0].split(' ')[0]));
//alert('-1:' + document.getElementById('duration').value);
} else if (document.getElementById('duration').value.replace('0','') != '') {
//alert('-66:' + prevdg);
source[eval(-1 + eval(whichs))].start(eval('0' + document.getElementById('startingin').value), eval('0' + document.getElementById('startingat').value), eval('' + dura(document.getElementById('duration').value,lastbo).split(';')[0].split(':')[eval(-1 + dura(document.getElementById('duration').value,lastbo).split(';')[0].split(':').length)].split('.')[0].split(' ')[0]));
//alert('-1:' + document.getElementById('duration').value);
} else {
//alert('-89:' + prevdg);
source[eval(-1 + eval(whichs))].start(eval('0' + document.getElementById('startingin').value), eval('0' + document.getElementById('startingat').value));
}
} else {
//alert('-77:' + sendb + ' ... ' + dura(sendb));
eval("source" + whichs + ".start" + dura(sendb,lastbo));
}
nostop=false;
document.getElementById('startingat').value='';
document.getElementById('startingin').value='';
document.getElementById('loop1').checked=false;
document.getElementById('loop2').checked=false;
checknext();
ioffs[eval(-1 + ioth)]+=4;
ioffset=ioffs[eval(-1 + ioth)];
if (sourcep_valid()) { //if (typeof sourcep !== 'undefined') {
sourcep[eval(-1 + eval(ioffset + ioth))]=false;
} else {
eval("source" + eval(ioffset + ioth) + "p=false;");
}
if (source_valid()) { //if (typeof source !== 'undefined') {
source[eval(-1 + eval(ioffset + ioth))] = context.createBufferSource();
source[eval(-1 + eval(ioffset + ioth))].buffer = sb[eval(-1 + ioth)];
source[eval(-1 + eval(ioffset + ioth))].connect(context.destination);
} else {
eval("source" + eval(ioffset + ioth) + " = context.createBufferSource(); source" + eval(ioffset + ioth) + ".buffer = sb[" + eval(-1 + ioth) + "]; source" + eval(ioffset + ioth) + ".connect(context.destination); ");
}
}
function macbetha1s1(vo, bo) {
var ioth=1;
var prefix="";
if (vo) { andnotthen(); gvo=document.getElementById('ivideo'); setTimeout(andthen, 500); }
if (!nostop) { stopit(); }
if (whichs == "") { whichs="1"; }
whichs="" + eval(ioffs[0] + 1);
//startit();
if (sourcep_valid()) { //if (typeof sourcep !== 'undefined') {
sourcep[eval(-1 + eval(whichs))]=true;
} else {
eval("source" + whichs + "p=true;");
}
if (document.getElementById('loop1').checked || document.getElementById('loop2').checked) {
prefix="🔁";
if (source_valid()) { //if (typeof source !== 'undefined') {
source[eval(-1 + eval(whichs))].loop=true;
} else {
eval("source" + whichs + ".loop = true;");
}
}
var sendb=("(" + document.getElementById('startingin').value + "," + document.getElementById('startingat').value + ");").replace("(,)", "(0)").replace("(,", "(0,").replace(",)", ",0)");
var suffix=("(" + document.getElementById('startingin').value + "," + document.getElementById('startingat').value + ")").replace("(,)", "").replace("(0,0)", "").replace("(0,)", "").replace("(,0)", "").replace("(,", ",").replace(",)", "").trim();
if (document.getElementById('loop1').checked || document.getElementById('loop2').checked || sendb.replace(/0/g,'').replace(/\,/g,'').replace('(','').replace(')','') != '') {
//alert(suffix.replace('(', ' @ ').replace(',', ' in ').replace(')', ' secs'));
if ((prefix + ' ' + suffix.replace('(', ' @ ').replace(',', ' in ').replace(')', ' secs')).trim() == '') {
bo.innerHTML=bo.innerHTML.split(' ... ')[0];
} else {
bo.innerHTML=bo.innerHTML.split(' ... ')[0] + ' ... ' + prefix + ' ' + suffix.replace('(', ' in ').replace(',', ' @ ').replace(')', ' secs');
}
} else if (bo.innerHTML.indexOf(' ... ') != -1) {
bo.innerHTML=bo.innerHTML.split(' ... ')[0];
}
bo.style.border='1px inset red';
if (1 == 5 && (document.getElementById('loop1').checked || document.getElementById('loop2').checked)) {
lastbo=null;
} else {
lastbo=bo;
}
if (source_valid()) { //if (typeof source !== 'undefined') {
if (fors.replace('0','') != '' && fors.indexOf('-') == -1) {
//alert('-66:' + prevdg);
source[eval(-1 + eval(whichs))].start(eval('0' + document.getElementById('startingin').value), eval('0' + document.getElementById('startingat').value), eval('' + dura(document.getElementById('duration').value,lastbo).split(';')[0].split(':')[eval(-1 + dura(document.getElementById('duration').value,lastbo).split(';')[0].split(':').length)].split('.')[0].split(' ')[0]));
//alert('-1:' + document.getElementById('duration').value);
} else if (document.getElementById('duration').value.replace('0','') != '') {
source[eval(-1 + eval(whichs))].start(eval('0' + document.getElementById('startingin').value), eval('0' + document.getElementById('startingat').value), eval('' + dura(document.getElementById('duration').value,lastbo).split(';')[0].split(':')[eval(-1 + dura(document.getElementById('duration').value,lastbo).split(';')[0].split(':').length)].split('.')[0].split(' ')[0]));
} else {
source[eval(-1 + eval(whichs))].start(eval('0' + document.getElementById('startingin').value), eval('0' + document.getElementById('startingat').value));
}
} else {
eval("source" + whichs + ".start" + dura(sendb,lastbo));
}
nostop=false;
document.getElementById('startingat').value='';
document.getElementById('startingin').value='';
document.getElementById('loop1').checked=false;
document.getElementById('loop2').checked=false;
checknext();
ioffs[eval(-1 + eval(eval(whichs) % 4))]+=4;
ioffset=ioffs[eval(-1 + eval(eval(whichs) % 4))];
if (sourcep_valid()) { //if (typeof sourcep !== 'undefined') {
sourcep[eval(-1 + eval(ioffset + ioth))]=false;
} else {
eval("source" + eval(ioffset + 1) + "p=false;");
}
if (source_valid()) { //if (typeof source !== 'undefined') {
source[eval(-1 + eval(ioffset + ioth))] = context.createBufferSource();
source[eval(-1 + eval(ioffset + ioth))].buffer = sb[eval(-1 + ioth)];
source[eval(-1 + eval(ioffset + ioth))].connect(context.destination);
} else {
eval("source" + eval(ioffset + 1) + " = context.createBufferSource(); source" + eval(ioffset + 1) + ".buffer = sb[" + eval(-1 + eval(eval(whichs) % 4)) + "]; source" + eval(ioffset + 1) + ".connect(context.destination); ");
}
}
function finishedLoading(bufferList) {
// Create two sources and play them both together.
if (source_valid()) { //if (typeof source !== 'undefined') {
source[0] = context.createBufferSource();
source[1] = context.createBufferSource();
source[2] = context.createBufferSource();
source[3] = context.createBufferSource();
source[0].buffer = bufferList[0];
sb.push(bufferList[0]);
source[1].buffer = bufferList[1];
sb.push(bufferList[1]);
source[2].buffer = bufferList[2];
sb.push(bufferList[2]);
source[3].buffer = bufferList[3];
sb.push(bufferList[3]);
source[0].connect(context.destination);
source[1].connect(context.destination);
source[2].connect(context.destination);
source[3].connect(context.destination);
} else {
source1 = context.createBufferSource();
source2 = context.createBufferSource();
source3 = context.createBufferSource();
source4 = context.createBufferSource();
source1.buffer = bufferList[0];
sb.push(bufferList[0]);
source2.buffer = bufferList[1];
sb.push(bufferList[1]);
source3.buffer = bufferList[2];
sb.push(bufferList[2]);
source4.buffer = bufferList[3];
sb.push(bufferList[3]);
source1.connect(context.destination);
source2.connect(context.destination);
source3.connect(context.destination);
source4.connect(context.destination);
//if (vo) { gvo=vo; setTimeout(andthen, 500); }
//source1.start(0);
//source2.start(0);
//source3.start(0);
//source4.start(0);
}
}
function getideas() {
document.getElementById('b1').value=(location.search.split('url1=')[1] ? (decodeURIComponent(location.search.split('url1=')[1]).split('&')[0]) : document.getElementById('b1').value);
document.getElementById('b2').value=(location.search.split('url2=')[1] ? (decodeURIComponent(location.search.split('url2=')[1]).split('&')[0]) : document.getElementById('b2').value);
document.getElementById('b3').value=(location.search.split('url3=')[1] ? (decodeURIComponent(location.search.split('url3=')[1]).split('&')[0]) : document.getElementById('b3').value);
document.getElementById('b4').value=(location.search.split('url4=')[1] ? (decodeURIComponent(location.search.split('url4=')[1]).split('&')[0]) : document.getElementById('b4').value);
document.getElementById('xb1').value=(location.search.split('url1=')[1] ? (decodeURIComponent(location.search.split('url1=')[1]).split('&')[0]) : document.getElementById('xb1').value);
document.getElementById('xb2').value=(location.search.split('url2=')[1] ? (decodeURIComponent(location.search.split('url2=')[1]).split('&')[0]) : document.getElementById('xb2').value);
document.getElementById('xb3').value=(location.search.split('url3=')[1] ? (decodeURIComponent(location.search.split('url3=')[1]).split('&')[0]) : document.getElementById('xb3').value);
document.getElementById('xb4').value=(location.search.split('url4=')[1] ? (decodeURIComponent(location.search.split('url4=')[1]).split('&')[0]) : document.getElementById('xb4').value);
document.getElementById('ivideo').src=(location.search.split('urlv1=')[1] ? (decodeURIComponent(location.search.split('urlv1=')[1]).split('&')[0]) : document.getElementById('ivideo').src);
document.getElementById('b1').innerHTML=(location.search.split('wording1=')[1] ? (decodeURIComponent(location.search.split('wording1=')[1]).split('&')[0].replace(/\+/g,' ')) : document.getElementById('b1').innerHTML);
document.getElementById('b2').innerHTML=(location.search.split('wording2=')[1] ? (decodeURIComponent(location.search.split('wording2=')[1]).split('&')[0].replace(/\+/g,' ')) : document.getElementById('b2').innerHTML);
document.getElementById('b3').innerHTML=(location.search.split('wording3=')[1] ? (decodeURIComponent(location.search.split('wording3=')[1]).split('&')[0].replace(/\+/g,' ')) : document.getElementById('b3').innerHTML);
document.getElementById('b4').innerHTML=(location.search.split('wording4=')[1] ? (decodeURIComponent(location.search.split('wording4=')[1]).split('&')[0].replace(/\+/g,' ')) : document.getElementById('b4').innerHTML);
document.getElementById('xb1').innerHTML=(location.search.split('wording1=')[1] ? ('+' + decodeURIComponent(location.search.split('wording1=')[1]).split('&')[0].replace(/\+/g,' ')) : document.getElementById('xb1').innerHTML);
document.getElementById('xb2').innerHTML=(location.search.split('wording2=')[1] ? ('+' + decodeURIComponent(location.search.split('wording2=')[1]).split('&')[0].replace(/\+/g,' ')) : document.getElementById('xb2').innerHTML);
document.getElementById('xb3').innerHTML=(location.search.split('wording3=')[1] ? ('+' + decodeURIComponent(location.search.split('wording3=')[1]).split('&')[0].replace(/\+/g,' ')) : document.getElementById('xb3').innerHTML);
document.getElementById('xb4').innerHTML=(location.search.split('wording4=')[1] ? ('+' + decodeURIComponent(location.search.split('wording4=')[1]).split('&')[0].replace(/\+/g,' ')) : document.getElementById('xb4').innerHTML);
if ((location.search.split('notoka=')[1] ? (" " + decodeURIComponent(location.search.split('notoka=')[1]).split('&')[0]) : "").length > 0) {
document.getElementById('dih').innerHTML+="<input type=hidden name=notoka value=y></input>";
}
dvih=document.getElementById('dvideo').innerHTML;
}
</script>
</head>
<body>
<h1>HTML5 Web Audio API Usage <input id=startingat type=number value='' min=0 step=1 placeholder="Starting at [0] seconds"></input> <input id=startingin type=number value='' min=0 step=1 placeholder="Starting in [0] seconds"></input></h1>
<h3>RJM Programming - June, 2019 - Thanks to <a target=_blank href='https://www.html5rocks.com/en/tutorials/webaudio/intro/' title='Getting Started with Web Audio API'>Getting Started with Web Audio API</a></h3>
<table border=1 style='width:100%;'><tr style='background-color:#f7f0f0;'><td><button id=b1 onclick="macbetha1s1(document.getElementById('ivideo'), this);">Macbeth Act 1 Scene 1</button></td>
<td><button id=b2 onclick="if (gvo) { andnotthen(); } other(2, this); ">1 to 59</button></td>
<td><button id=b3 onclick="if (gvo) { andnotthen(); } other(3, this); ">AM PM</button></td>
<td><button id=b4 onclick="if (gvo) { andnotthen(); } other(4, this); ">Past Quarter To</button></td>
<td>Loop: <input type=checkbox id=loop1></input></td>
<td>Duration: <input onblur='predura(this.value,this);' type=text id=duration1 value='' title='Seconds ... optionally follow by ; sets of ButtonNumber1to4:StartingAt=[0]:StartingIn=[0]:Loop=[false]:Duration=[0]' placeholder='Seconds ... optionally follow by ; sets of ButtonNumber1to4:StartingAt=[0]:StartingIn=[0]:Loop=[false]:Duration=[0]'></input></td>
</tr><tr style='background-color:#f0f7f0;'><td><button id=xb1 onclick="nostop=true; macbetha1s1(document.getElementById('ivideo'), this);">+Macbeth Act 1 Scene 1</button></td>
<td><button id=xb2 onclick="nostop=true; if (gvo) { andnotthen(); } other(2, this); ">+1 to 59</button></td>
<td><button id=xb3 onclick="nostop=true; if (gvo) { andnotthen(); } other(3, this); ">+AM PM</button></td>
<td><button id=xb4 onclick="nostop=true; if (gvo) { andnotthen(); } other(4, this); ">+Past Quarter To</button></td>
<td>Loop: <input type=checkbox id=loop2></input></td>
<td>Duration: <input onblur='predura(this.value,this);' type=text id=duration2 value='' title='Seconds ... optionally follow by ; sets of ButtonNumber1to4:StartingAt=[0]:StartingIn=[0]:Loop=[false]:Duration=[0]' placeholder='Seconds ... optionally follow by ; sets of ButtonNumber1to4:StartingAt=[0]:StartingIn=[0]:Loop=[false]:Duration=[0]'></input></td>
</tr>
<tr style='background-color:#f0f0f7;'>
<td colspan=6><details style=width:100%;><summary>Audio Content ...</summary>
<form action=./web_audio.html method=GET>
<br><input style='display:inline-block;background-color:#f0f0f0;' type=text name=wording1 title='Button Wording 1' value='Macbeth Act 1 Scene 1'></input> <input style='display:inline-block;background-color:#f0f0f0;' type=text name=url1 title='Audio URL 1' value='../PHP/macbetha1s1.m4a'></input> synchronizes with <input style='display:inline-block;background-color:#f0f0f0;' type=text name=urlv1 title='Video URL 1' value='../PHP/macbetha1s1.m4v'></input><br>
<input style='display:inline-block;background-color:#f0f0f0;' type=text name=wording2 title='Button Wording 2' value='1 to 59'></input> <input style='display:inline-block;background-color:#f0f0f0;' type=text name=url2 title='Audio URL 2' value='./one_to_fiftynine.m4a'></input><br>
<input style='display:inline-block;background-color:#f0f0f0;' type=text name=wording3 title='Button Wording 3' value='AM PM'></input> <input style='display:inline-block;background-color:#f0f0f0;' type=text name=url3 title='Audio URL 3' value='./am_pm.m4a'></input><br>
<input style='display:inline-block;background-color:#f0f0f0;' type=text name=wording4 title='Button Wording 4' value='Past Quarter To'></input> <input style='display:inline-block;background-color:#f0f0f0;' type=text name=url4 title='Audio URL 4' value='./past_quarterto.m4a'></input><br>
<div id=dih></div><input type=submit value='Web Audio Run' style='background-color:orange;'></input>
</form>
</details></td>
</tr>
</table><br>
<input type=text id=duration style='position:absolute;top:-200px;left:-200px;' value=''></input>
<div id=dvideo><video id=ivideo src="../PHP/macbetha1s1.m4v"></video></div>
</body>
</html>