added text for audio

This commit is contained in:
Kenneth Jao 2017-10-01 07:58:01 -04:00
parent d080fed039
commit a8f10450b9
3 changed files with 17 additions and 6 deletions

View File

@ -17,6 +17,16 @@ canvas, img {
-ms-interpolation-mode: nearest-neighbor; -ms-interpolation-mode: nearest-neighbor;
} }
#DAText {
font-weight: 100;
color: white;
font-size: 500%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
#imagecode { #imagecode {
width: 35%; width: 35%;
position: absolute; position: absolute;

View File

@ -32,9 +32,7 @@
</div> </div>
</header> </header>
<div id="settings"> <h1 id="DAText"></h1>
</div>
<body> <body>
<canvas id="canvas"></canvas> <canvas id="canvas"></canvas>
</body> </body>

View File

@ -49,7 +49,7 @@ visualCtx.fillRect(0,0, canvas.width, canvas.height);
function generateFrames(frame, string, width, height, rate) { function generateFrames(frame, string, width, height, rate) {
// Rate is in bits per second // Rate is in bits per second
// 30 frames per second // 30 frames per second
var bitsPerSection = Math.ceil(canvas.width/width)+1; var bitsPerSection = Math.ceil(canvas.width/width)+2;
var shift = canvas.width-rate*width*frame/30; var shift = canvas.width-rate*width*frame/30;
var bitsToCalc = Math.ceil(rate*width*frame/(width*30)); var bitsToCalc = Math.ceil(rate*width*frame/(width*30));
var output = []; var output = [];
@ -91,7 +91,7 @@ function drawFrame2(frame ,input) {
visualCtx.beginPath(); visualCtx.beginPath();
var frame1 = generateFrames(frame, input, 100, 100, 5); var frame1 = generateFrames(frame, input, 100, 100, 5);
console.log(frame1); console.log(frame1);
frame1= rotate(frame1,30); //frame1= rotate(frame1,30);
var xStart = canvas.width/2; var xStart = canvas.width/2;
var yStart = 10*j + canvas.height/2; var yStart = 10*j + canvas.height/2;
var hMM = [xStart*Math.cos(toRad(30))-yStart*Math.sin(toRad(30)),xStart*Math.sin(toRad(30))+yStart*Math.cos(toRad(30))]; var hMM = [xStart*Math.cos(toRad(30))-yStart*Math.sin(toRad(30)),xStart*Math.sin(toRad(30))+yStart*Math.cos(toRad(30))];
@ -103,6 +103,7 @@ function drawFrame2(frame ,input) {
visualCtx.stroke(); visualCtx.stroke();
} }
} }
function toRad(theta){ function toRad(theta){
return theta*(Math.PI/180); return theta*(Math.PI/180);
} }
@ -155,6 +156,7 @@ visualCtx.fillRect(0,0, canvas.width, canvas.height);
var osc; var osc;
function sound(n, input) { function sound(n, input) {
if(!doSound) { if(!doSound) {
document.getElementById("DAText").innerHTML = "";
osc.stop(); osc.stop();
return; return;
} }
@ -168,7 +170,8 @@ function sound(n, input) {
} }
// var max = 523.25; // var max = 523.25;
// var min = 130.81; // var min = 130.81;
osc.frequency.value = freq[input[n]]; document.getElementById("DAText").innerHTML = input[n];
osc.frequency.value = freq[input[n]];
// osc.frequency.value = parseInt(input.substr(n, 10), 2); // osc.frequency.value = parseInt(input.substr(n, 10), 2);
// var rand = randInt(130, 523); // var rand = randInt(130, 523);
// var direction = 1; // var direction = 1;