<!doctype html>
<html>
<head>
<link href='//www.rjmprogramming.com.au/PHP/emboss_h1.css' rel='stylesheet' type='text/css'>
<meta charset="UTF-8" />
<title>Audio Numbers - RJM Programming - September, 2016</title>
<script type='text/javascript'>
var oaudio=null;
var audiomedia=["one_to_fiftynine.m4a","past_quarterto.m4a","am_pm.m4a"];
var midmedia=["midnight_midday.m4a"];
var astart=0;
var delay=0;
var zero=-1;
function checkget() {
var j=eval(1 + zero);
if (oaudio != null) {
oaudio.pause();
oaudio=null;
}
hearthis(j);
}
function hearthis(which) {
var houris=document.getElementById('hour').value;
var minuteis=document.getElementById('minute').value;
var contextis=document.getElementById('context').value;
var thingis=' ';
astart=0;
oaudio=null;
if (which == 0) thingis=houris;
if (which == 1) thingis=minuteis;
if (which == 2) thingis=contextis;
// alert(houris);
if (thingis.trim() == '') {
zero++;
which++;
if (zero >= audiomedia.length) {
return;
}
} else {
for (var i=which; i<audiomedia.length; i++) {
if (i == which) {
zero=i;
delay=2;
oaudio=new Audio(); // thanks to http://stackoverflow.com/questions/10868249/html5-audio-player-duration-showing-nan
oaudio.autoplay=true;
if (thingis.indexOf('mid') == 0) {
if (thingis.indexOf('day') != -1) astart=delay;
oaudio.src=midmedia[i];
} else if (i == 0) {
if (eval(thingis) <= 30) {
oaudio.src=audiomedia[i].replace('.m4a','.wav');
} else {
oaudio.src=audiomedia[i];
}
astart=eval(eval(-1 + eval(thingis)) + ".4");
//alert(astart);
delay=1.5;
} else if (thingis.toLowerCase().indexOf('clock') != -1) {
oaudio.src=audiomedia[i];
astart=eval("3.1");
delay=1.8;
} else if (i == 1) {
if (eval(thingis) <= 30) {
oaudio.src=audiomedia[0].replace('.m4a','.wav');
} else {
oaudio.src=audiomedia[0];
}
astart=eval(eval(-1 + eval(thingis)) + ".4");
//alert(astart);
delay=1.5;
} else {
oaudio.src=audiomedia[i];
delay=2.7;
if (thingis.toLowerCase().indexOf('am') == -1) astart=delay;
}
//alert(oaudio.src);
oaudio.addEventListener('loadedmetadata', function() {
if (zero < audiomedia.length) {
setTimeout(checkget, eval(1000 * delay));
}
oaudio.play();
if (astart != 0) oaudio.currentTime = eval(astart);
});
}
}
}
}
</script>
</head>
<body>
<h1 style='width:100%;text-align:center;' id='myh1'>Audio Numbers - RJM Programming - September, 2016</h1>
<h4 style='width:100%;text-align:center;' id='myh4'>Hear this ...</h4>
<table style='width:100%;text-align:center;' id='mytable' border=200>
<tr><th>Hour</th><th>Minute</th><th>Context</th></tr>
<tr><td><select id='hour' name='hour'><option value="midnight">midnight</option>
<option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option>
<option value="11">11</option><option value="midday">midday</option>
</select></td><td><select id='minute' name='minute'>
<option value=""></option><option value="o'clock">o'clock</option>
<option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option>
<option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option>
<option value="21">21</option><option value="22">22</option><option value="23">23</option><option value="24">24</option><option value="25">25</option><option value="26">26</option><option value="27">27</option><option value="28">28</option><option value="29">29</option><option value="30">30</option>
<option value="31">31</option><option value="32">32</option><option value="33">33</option><option value="34">34</option><option value="35">35</option><option value="36">36</option><option value="37">37</option><option value="38">38</option><option value="39">39</option><option value="40">40</option>
<option value="41">41</option><option value="42">42</option><option value="43">43</option><option value="44">44</option><option value="45">45</option><option value="46">46</option><option value="47">47</option><option value="48">48</option><option value="49">49</option><option value="50">50</option>
<option value="51">51</option><option value="52">52</option><option value="53">53</option><option value="54">54</option><option value="55">55</option><option value="56">56</option><option value="57">57</option><option value="58">58</option><option value="59">59</option>
</select></td><td><select id='context'>
<option value=''>Optionally choose a context ...</option>
<option value='am'>in the morning</option>
<option value='pm'>in the afternoon</option>
</select></td></tr>
<tr><td colspan=3><input title='Click to hear what you proposed above' value="Hear ..." id='hear' name='hear' type='button' onclick="hearthis(0);" style='background-color:yellow;'></input></td></tr>
</table>
</body>
</html>