You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
185 lines
6.6 KiB
185 lines
6.6 KiB
<!-- Copyright (c) 2014 The Chromium OS Authors. All rights reserved. -->
|
|
<!-- Use of this source code is governed by a BSD-style license that can be -->
|
|
<!-- found in the LICENSE file. -->
|
|
|
|
<html>
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
|
<title>Audio Quality Test</title>
|
|
<script type="text/javascript" src="audio.js"></script>
|
|
<script type="text/javascript" src="source.js"></script>
|
|
<script type="text/javascript" src="recorder.js"></script>
|
|
<script type="text/javascript" src="analysis.js"></script>
|
|
<link rel="stylesheet" type="text/css" href="audio.css">
|
|
</head>
|
|
<body>
|
|
<ul class="tab-page">
|
|
<li id="play_tab" onclick="switchTab('play_tab')" class="selected"><a>Play</a></li>
|
|
<li id="record_tab" onclick="switchTab('record_tab')"><a>Record</a></li>
|
|
</ul>
|
|
<div id="play_div">
|
|
<h1>Audio Source</h1>
|
|
<input type="radio" name="audio_source" value="sine"
|
|
onclick="setupSourceLayer('sine')"> Sine Tone
|
|
<input type="radio" name="audio_source" value="sweep"
|
|
onclick="setupSourceLayer('sweep')" checked> Sweep Tone
|
|
<input type="radio" name="audio_source" value="file"
|
|
onclick="setupSourceLayer('file')"> Load from file
|
|
<br>
|
|
<br>
|
|
<div id="source_layer" align="center">
|
|
<div id="source_tone">
|
|
<table style="width: 50%;">
|
|
<tr>
|
|
<td class="tonegen-main-cell">
|
|
<table style="width: 100%;">
|
|
<tr>
|
|
<td width="50%">Frequency: (20 Hz ~ SampleRate / 2)</td>
|
|
<td width="30%">Duration</td>
|
|
<td class="sweep_tone">Log</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<input type="text" id="freq_start" size=5 maxlength=5 value=1000> Hz
|
|
<div class="sweep_tone">
|
|
<input type="text" id="freq_end" size=5 maxlength=5 value=1000> Hz
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<input type="text" id="tone_sec" size=5 maxlength=5 value=3> Seconds
|
|
</td>
|
|
<td class="sweep_tone">
|
|
<input type="checkbox" id="sweep_log">
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
<td class="tonegen-vol-cell">
|
|
<input type="range" min="0" max="20" value="20" id="left_gain"
|
|
onchange="gainChanged();"/>
|
|
<input type="range" min="0" max="20" value="20" id="right_gain"
|
|
onchange="gainChanged();"/>
|
|
<br>
|
|
<div id="gain_label">
|
|
L(20) / R(20)
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<div id="source_file">
|
|
<input type="button" value="Local Audio File" onclick="loadAudioFile()"
|
|
style="font-size: large;">
|
|
<br><br>
|
|
<div style="display:none">
|
|
<input type=file id=audio_file onchange="changeAudioFile()">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
<input type="checkbox" id="append_tone" checked> Append 1K Hz start tone and end tone
|
|
<br><br>
|
|
<button id="play_audio" class="btn-off" onclick="playAudioFile()">
|
|
<div>
|
|
<span class="btn-off-text">Play</span>
|
|
<span class="btn-on-text">Stop Play</span>
|
|
</div>
|
|
</button>
|
|
</div>
|
|
<div id="record_div" style="display: none;">
|
|
<h1> Record Samples </h1>
|
|
<input type="radio" name="record_source" value="audio_source"
|
|
onclick="setupRecordSource('audio')">
|
|
Play Audio Source
|
|
<input type="radio" name="record_source" value="microphone" checked
|
|
onclick="setupRecordSource('microphone')">
|
|
Microphone
|
|
<br><br>
|
|
<input type="checkbox" id="detect_tone" checked> Detect 1K Hz start tone and end tone
|
|
<input type="checkbox" id="auto_stop" checked> Auto stop when detected 1K Hz end tone
|
|
<br><br>
|
|
<button id="record_btn" class="btn-off" onclick="recordButtonClicked()">
|
|
<div>
|
|
<span class="btn-off-text">Start Record</span>
|
|
<span class="btn-on-text">Stop Record</span>
|
|
</div>
|
|
</button>
|
|
<br><hr>
|
|
<table align="center">
|
|
<tr>
|
|
<td>
|
|
<div style="overflow:auto; max-height: 250px;">
|
|
<table id="record_list" align="center">
|
|
</table>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
|
|
</div>
|
|
|
|
<h1> Frequency Response </h1>
|
|
<table align="center">
|
|
<tr>
|
|
<td width=800>
|
|
<div id="curve_section">
|
|
<canvas id='fr_canvas' width=800 height=300>
|
|
</div>
|
|
</td>
|
|
<td width=400 height=300 class="canvas_detail">
|
|
<div id="curve_list" style="overflow:auto; max-height:300px;">
|
|
<table id="curve_table" width=100% height=100%>
|
|
<tr>
|
|
<td colspan=1>
|
|
<input type="button" value="Load File" onClick="loadButtonClicked();">
|
|
<div style="display:none">
|
|
<input type=file id=sample_file onchange="loadSampleFile()">
|
|
</div>
|
|
</td>
|
|
<td colspan=4>
|
|
<select id="noctaves">
|
|
<option value="3">1/3</option>
|
|
<option value="4">1/4</option>
|
|
<option value="5" selected>1/5</option>
|
|
<option value="6">1/6</option>
|
|
<option value="7">1/7</option>
|
|
<option value="8">1/8</option>
|
|
<option value="9">1/9</option>
|
|
<option value="10">1/10</option>
|
|
</select> Octaves
|
|
<a id='export_csv'>
|
|
<input type="button" value="Export CSV" onClick="exportCSV();">
|
|
</a>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Show</td>
|
|
<td>File name</td>
|
|
<td width=50>Left</td>
|
|
<td width=50>Right</td>
|
|
<td>Remove</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
|
|
<div id="debug" style="display:none;">
|
|
<h1>Debug</h1>
|
|
<a id='export_freq'>
|
|
<input type="button" value="Export Freq" onClick="exportFreq();">
|
|
</a>
|
|
<a id='export_buffer'>
|
|
<input type="button" value="Export Buffer">
|
|
</a>
|
|
</div>
|
|
|
|
<div id="log" style="display:none;">
|
|
<h1>Log</h1>
|
|
<pre id="log"></pre>
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|