1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96
|
<!DOCTYPE html>
<html>
<!--
csound.js minimal example
Copyright (C) 2017 V Lazzarini
-->
<head>
<title>WebAudio Csound</title>
<style type="text/css">
html, body {
font-family: Monospace;
color: #bf94f7;
background-color: #000055;
}
#console {
font-family: Monospace;
color: #b5b6ff;
background-color: #000000;
font-size: 16px;
}
#tit {
font-family: Monospace;
font-size: 24px;
width: 810px;
display: flex;
align-items: center;
justify-content: center;
border-style: solid;
padding: 20px 0px;
}
H1 {
font-size: 36px;
}
</style>
<script type="text/javascript" src="js/csound.js"></script>
<script type="text/javascript">
// called by csound.js
function moduleDidLoad() {
csound.Play();
csound.CompileOrc(
"maxalloc 1,10 \n" +
"massign 1,1\n" +
"instr 1 \n" +
"icps = 440+rnd(440) \n" +
"chnset icps, \"freq\" \n" +
"a2 linen 0.1,0.01,p3,0.1 \n" +
"a1 oscili a2, icps\n" +
"outs a1,a1 \n" +
"endin");
document.getElementById("tit").innerHTML = "Click here to play";
}
function attachListeners() {
document.getElementById("clickarea").
addEventListener("click", Play);
}
var count = 0;
function handleMessage(message) {
var element = document.getElementById('console');
element.value += message;
element.scrollTop = 99999; // focus on bottom
count += 1;
if (count == 1000) {
element.value = ' ';
count = 0;
}
}
var started = false;
// click handler
function Play() {
if (started == false) {
CsoundObj.CSOUND_AUDIO_CONTEXT.resume();
started = true;
}
csound.Event("i 1 0 5");
}
</script>
</head>
<body>
<div id="clickarea">
<h1>Minimal</h1>
<h3 id="tit"></h3>
<textarea class="console" cols="80" rows="24" id="console">Csound: not loaded
</textarea>
</div>
</body>
</html>
|