-
Notifications
You must be signed in to change notification settings - Fork 4
/
Copy pathrendered_pair_comparison.html
145 lines (126 loc) · 6.65 KB
/
rendered_pair_comparison.html
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
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
<!doctype html>
<html>
<head>
<title>語者判別實驗表單 1</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.1/css/bootstrap.min.css"
integrity="sha384-VCmXjywReHh4PwowAiWNagnWcLhlEJLA5buUprzK8rxFgeH0kww/aWY76TfkUoSX" crossorigin="anonymous">
</head>
<body>
<div class="jumbotron jumbotron-fluid">
<div class="container">
<h1 class="display-4">語者判別實驗</h1>
<p class="lead">判斷兩份語音是否出自同一個人</p>
<hr class="my-4">
<p>
感謝您參與本次實驗！
</p>
<p>
在這個實驗中，我們使用電腦合成及轉換人類語音。每一題都有兩個音檔，請使用耳機聽完後，根據兩個音檔的語者相似度作答（僅考慮說話者的音色，不須考慮語句內容）。
</p>
<p>
評分標準為：
<ul>
<li>確定是同一個語者 (same, absolutely sure)</li>
<li>不大確定，但傾向認為是同一個語者 (same, not sure)</li>
<li>不大確定，但傾向認為是不同語者 (different, not sure)</li>
<li>確定是不同語者 (different, absolutely sure)</li>
</ul>
</p>
</div>
</div>
<div class="container" id="form_container">
<form id="theForm" action="http://localhost:8888" method="GET" onsubmit="return preventRepeatedSubmission();">
<div class="form-group">
<label for="name">姓名：</label>
<input class="form-control" type="text" inputmode="text" name="name" required>
<small class="form-text text-muted">必填*</small>
</div>
<div class="form-group">
<label for="mail">電子郵件：</label>
<input class="form-control" type="text" inputmode="email" placeholder="[email protected]" name="mail">
<small class="form-text text-muted">如果中獎，我們將以電子郵件通知您</small>
</div>
<div class="card form-group">
<div class="card-header">問題 1</div>
<div class="card-body">
<p>
<audio controls src="wavs/test1.wav">
Your browser does not support the audio element.
</audio>
</p>
<p>
<audio controls src="wavs/test2.wav">
Your browser does not support the audio element.
</audio>
</p>
<div class="form-check">
<input class="form-check-input" type="radio" name="q1" id="q1_1" value="1" required>
<label class="form-check-label" for="q1_1">確定是同一個語者 (same, absolutely sure)</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="q1" id="q1_2" value="2" required>
<label class="form-check-label" for="q1_2">不大確定，但傾向認為是同一個語者 (same, not sure)</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="q1" id="q1_3" value="3" required>
<label class="form-check-label" for="q1_3">不大確定，但傾向認為是不同語者 (different, not sure)</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="q1" id="q1_4" value="4" required>
<label class="form-check-label" for="q1_4">確定是不同語者 (different, absolutely sure)</label>
</div>
</div>
</div>
<div class="card form-group">
<div class="card-header">問題 2</div>
<div class="card-body">
<p>
<audio controls src="wavs/test3.wav">
Your browser does not support the audio element.
</audio>
</p>
<p>
<audio controls src="wavs/test4.wav">
Your browser does not support the audio element.
</audio>
</p>
<div class="form-check">
<input class="form-check-input" type="radio" name="q2" id="q2_1" value="1" required>
<label class="form-check-label" for="q2_1">確定是同一個語者 (same, absolutely sure)</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="q2" id="q2_2" value="2" required>
<label class="form-check-label" for="q2_2">不大確定，但傾向認為是同一個語者 (same, not sure)</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="q2" id="q2_3" value="3" required>
<label class="form-check-label" for="q2_3">不大確定，但傾向認為是不同語者 (different, not sure)</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="q2" id="q2_4" value="4" required>
<label class="form-check-label" for="q2_4">確定是不同語者 (different, absolutely sure)</label>
</div>
</div>
</div>
<input type="text" name="formid" value="1" hidden>
<input type="text" name="thank" value="再次謝謝您參與本次實驗！" hidden>
<input class="btn btn-info btn-lg" type="submit" value="提交結果" id="submitBtn">
<p class="text-muted">
<small>如果提交結果時發現繳不出去，請回頭檢查是否有填入姓名、是否每一題都有作答到，謝謝。</small>
</p>
</form>
</div>
<div class="container" style="padding-top: 60px;">
<p class="text-center text-muted">© 台大語音實驗室</p>
</div>
<script type="text/javascript">
function preventRepeatedSubmission() {
document.getElementById('submitBtn').disabled = true;
setTimeout("submitBtn.disabled=false;", 5000);
return true;
};
</script>
</body>
</html>