zyqunix/pages
1
0
Fork 0
mirror of https://github.com/zyqunix/tools.git synced 2025-07-05 22:10:31 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

mic

Browse source
This commit is contained in:
zyqunix 2025-06-12 11:25:00 +02:00
parent eb2229631a
commit b5d4387c95
3 changed files with 9 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

2
microphone/index.html
View file

@ -9,7 +9,7 @@
</head> </head>
<body> <body>
<h1>Microphone Test</h1> <h1>Microphone Test</h1>
<div class="shadow card"> <div class="shadow cards">
<canvas id="visualizer"></canvas> <canvas id="visualizer"></canvas>
<button id="btn">Start Listening</button> <button id="btn">Start Listening</button>
</div> </div>

4
microphone/index.js
View file

@ -35,11 +35,11 @@ function draw() {
analyser.getByteTimeDomainData(dataArray); analyser.getByteTimeDomainData(dataArray);
ctx.fillStyle = '#fff'; ctx.fillStyle = '#313244';
ctx.fillRect(0, 0, canvas.width, canvas.height); ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.lineWidth = 2; ctx.lineWidth = 2;
ctx.strokeStyle = '#000'; ctx.strokeStyle = '#fff';
ctx.beginPath(); ctx.beginPath();
const sliceWidth = canvas.width / dataArray.length; const sliceWidth = canvas.width / dataArray.length;

13
microphone/style.css
View file

@ -2,24 +2,23 @@
canvas { canvas {
width: 100%; width: 100%;
background-color: #fff; background-color: var(--surface0);
border-radius: 10px; border-radius: 10px;
pointer-events: none; pointer-events: none;
} }
button { button {
cursor: pointer; cursor: pointer;
background-color: #2a2a2a; background-color: var(--surface0);
padding: 7px; padding: 7px;
color: #c0c0c0; color: var(--text);
border: #2c2c2c solid 2px; border: var(--surface2) solid 2px;
border-radius: 4px; border-radius: 4px;
margin-top: 10px; margin-top: 10px;
font-size: 16px; font-size: 16px;
} }
button:hover { button:hover {
background-color: #2c2c2c; background-color: var(--surface1);
color: #d0d0d0; border: var(--surface2) solid 2px;
border: #2e2e2e solid 2px;
} }