|
n@156
|
1 <!DOCTYPE html>
|
|
n@156
|
2 <html lang="en">
|
|
n@156
|
3 <head>
|
|
n@156
|
4 <meta charset="utf-8">
|
|
n@156
|
5
|
|
n@156
|
6 <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
|
|
n@156
|
7 Remove this if you use the .htaccess -->
|
|
n@156
|
8 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
|
n@156
|
9
|
|
n@156
|
10 <title>WAET Create Test</title>
|
|
n@156
|
11 <meta name="description" content="">
|
|
n@156
|
12 <meta name="author" content="">
|
|
n@156
|
13
|
|
n@156
|
14 <meta name="viewport" content="width=device-width; initial-scale=1.0">
|
|
n@157
|
15
|
|
n@157
|
16 <script type="text/javascript">
|
|
n@157
|
17 // To aid 'one-page set-up' all scripts and CSS must be included directly in this file!
|
|
n@157
|
18 var topLevel;
|
|
n@157
|
19 window.onload = function() {
|
|
n@157
|
20 // Initialise page
|
|
n@157
|
21 topLevel = document.getElementById('topLevelBody');
|
|
n@157
|
22 var setup = document.createElement('div');
|
|
n@157
|
23 setup.id = 'setupTagDiv';
|
|
n@157
|
24
|
|
n@157
|
25 };
|
|
n@157
|
26
|
|
n@157
|
27 function attributePair(string, type){
|
|
n@157
|
28 var id = document.createElement("span");
|
|
n@157
|
29 id.textContent = string;
|
|
n@157
|
30 var input = document.createElement("input");
|
|
n@157
|
31 input.type = type;
|
|
n@157
|
32 return [id, input];
|
|
n@157
|
33 }
|
|
n@157
|
34
|
|
n@159
|
35 function removeNode(event) {
|
|
n@159
|
36 event.srcElement.parentElement.parentElement.removeChild(event.srcElement.parentElement);
|
|
n@159
|
37 }
|
|
n@159
|
38
|
|
n@157
|
39 function questionNode() {
|
|
n@157
|
40 var node = document.createElement("div");
|
|
n@157
|
41 node.setAttribute('class','head');
|
|
n@157
|
42 node.setAttribute('name','question-node');
|
|
n@157
|
43 var nodeTitle = document.createElement("span");
|
|
n@157
|
44 nodeTitle.textContent = "Question";
|
|
n@157
|
45 var attributes = document.createElement("div");
|
|
n@157
|
46 attributes.setAttribute('class','attrib');
|
|
n@157
|
47 var id = attributePair("ID:","text");
|
|
n@157
|
48 var question = attributePair("Question:","text");
|
|
n@157
|
49 node.appendChild(nodeTitle);
|
|
n@157
|
50 id.forEach(function(item){attributes.appendChild(item);},false);
|
|
n@157
|
51 question.forEach(function(item){attributes.appendChild(item);},false);
|
|
n@157
|
52 node.appendChild(attributes);
|
|
n@159
|
53
|
|
n@159
|
54 var removeButton = document.createElement("button");
|
|
n@159
|
55 removeButton.textContent = "Remove";
|
|
n@159
|
56 removeButton.onclick = removeNode;
|
|
n@159
|
57 node.appendChild(removeButton);
|
|
n@157
|
58 return node;
|
|
n@157
|
59 }
|
|
n@157
|
60
|
|
n@157
|
61 function statementNode() {
|
|
n@157
|
62 var node = document.createElement("div");
|
|
n@157
|
63 node.setAttribute('class','head');
|
|
n@157
|
64 node.setAttribute('name','question-node');
|
|
n@157
|
65 var nodeTitle = document.createElement("span");
|
|
n@157
|
66 nodeTitle.textContent = "Statement";
|
|
n@157
|
67 var attributes = document.createElement("div");
|
|
n@157
|
68 attributes.setAttribute('class','attrib');
|
|
n@157
|
69 var statement = attributePair("Statement:","text");
|
|
n@157
|
70 node.appendChild(nodeTitle);
|
|
n@157
|
71 statement.forEach(function(item){attributes.appendChild(item);},false);
|
|
n@157
|
72 node.appendChild(attributes);
|
|
n@159
|
73
|
|
n@159
|
74 var removeButton = document.createElement("button");
|
|
n@159
|
75 removeButton.textContent = "Remove";
|
|
n@159
|
76 removeButton.onclick = removeNode;
|
|
n@159
|
77 node.appendChild(removeButton);
|
|
n@157
|
78 return node;
|
|
n@157
|
79 }
|
|
n@157
|
80
|
|
n@157
|
81 function audioHolderNode() {
|
|
n@157
|
82 var audioHolderCounts = document.getElementsByName("audio-holder").length;
|
|
n@157
|
83 var node = document.createElement("div");
|
|
n@157
|
84 node.setAttribute("class","head");
|
|
n@157
|
85 node.setAttribute("name","audio-holder");
|
|
n@159
|
86 node.setAttribute("id","audio-holder-"+audioHolderCounts);
|
|
n@157
|
87 var nodeTitle = document.createElement("span");
|
|
n@159
|
88 nodeTitle.textContent = "Audio Holder "+(audioHolderCounts+1);
|
|
n@157
|
89
|
|
n@157
|
90 var attributes = document.createElement("div");
|
|
n@157
|
91 attributes.setAttribute('class','attrib');
|
|
n@157
|
92 var id = attributePair("ID:","text");
|
|
n@159
|
93 id[1].value=audioHolderCounts;
|
|
n@159
|
94 var hostURL = attributePair("Host URL:", "text");
|
|
n@159
|
95 var sampleRate = attributePair("Sample Rate:","text");
|
|
n@159
|
96 var randomiseOrder = attributePair("Randomise Element Order:","checkbox");
|
|
n@159
|
97 var repeatCount = attributePair("Repeat Page Count:","number");
|
|
n@159
|
98 repeatCount[1].value = 0;
|
|
n@159
|
99 var loop = attributePair("Loop Element Playback","checkbox");
|
|
n@159
|
100 var elementComments = attributePair("Enable Comment Boxes","checkbox");
|
|
n@159
|
101 id.forEach(function(item){attributes.appendChild(item);},false);
|
|
n@159
|
102 hostURL.forEach(function(item){attributes.appendChild(item);},false);
|
|
n@159
|
103 sampleRate.forEach(function(item){attributes.appendChild(item);},false);
|
|
n@159
|
104 hostURL.forEach(function(item){attributes.appendChild(item);},false);
|
|
n@159
|
105 randomiseOrder.forEach(function(item){attributes.appendChild(item);},false);
|
|
n@159
|
106 repeatCount.forEach(function(item){attributes.appendChild(item);},false);
|
|
n@159
|
107 loop.forEach(function(item){attributes.appendChild(item);},false);
|
|
n@159
|
108 elementComments.forEach(function(item){attributes.appendChild(item);},false);
|
|
n@159
|
109
|
|
n@159
|
110 node.appendChild(nodeTitle);
|
|
n@159
|
111 node.appendChild(attributes);
|
|
n@159
|
112
|
|
n@159
|
113 var pretest = document.createElement("div");
|
|
n@159
|
114 pretest.setAttribute('class','head');
|
|
n@159
|
115 pretest.setAttribute('name','pre-test');
|
|
n@159
|
116 var pretestTitle = document.createElement("h4");
|
|
n@159
|
117 pretestTitle.textContent = "Pre Test";
|
|
n@159
|
118 var buttonAddQ = document.createElement("button");
|
|
n@159
|
119 buttonAddQ.textContent = "Add Pre Test Question";
|
|
n@159
|
120 buttonAddQ.onclick = function(){event.srcElement.parentElement.appendChild(questionNode());};
|
|
n@159
|
121 var buttonAddS = document.createElement("button");
|
|
n@159
|
122 buttonAddS.textContent = "Add Pre Test Statement";
|
|
n@159
|
123 buttonAddS.onclick = function(){event.srcElement.parentElement.appendChild(statementNode());};
|
|
n@159
|
124 pretest.appendChild(pretestTitle);
|
|
n@159
|
125 pretest.appendChild(buttonAddQ);
|
|
n@159
|
126 pretest.appendChild(buttonAddS);
|
|
n@159
|
127
|
|
n@159
|
128 var posttest = document.createElement("div");
|
|
n@159
|
129 posttest.setAttribute('class','head');
|
|
n@159
|
130 posttest.setAttribute('name','post-test');
|
|
n@159
|
131 var posttestTitle = document.createElement("h4");
|
|
n@159
|
132 posttestTitle.textContent = "Post Test";
|
|
n@159
|
133 var buttonAddQ = document.createElement("button");
|
|
n@159
|
134 buttonAddQ.textContent = "Add Post Test Question";
|
|
n@159
|
135 buttonAddQ.onclick = function(){event.srcElement.parentElement.appendChild(questionNode());};
|
|
n@159
|
136 var buttonAddS = document.createElement("button");
|
|
n@159
|
137 buttonAddS.textContent = "Add Post Test Statement";
|
|
n@159
|
138 buttonAddS.onclick = function(){event.srcElement.parentElement.appendChild(statementNode());};
|
|
n@159
|
139 posttest.appendChild(posttestTitle);
|
|
n@159
|
140 posttest.appendChild(buttonAddQ);
|
|
n@159
|
141 posttest.appendChild(buttonAddS);
|
|
n@159
|
142
|
|
n@159
|
143 node.appendChild(pretest);
|
|
n@159
|
144 node.appendChild(posttest);
|
|
n@159
|
145
|
|
n@159
|
146 var newAudioElementButton = document.createElement("button");
|
|
n@159
|
147 newAudioElementButton.textContent = "Add audio element";
|
|
n@159
|
148 newAudioElementButton.onclick = function(){
|
|
n@159
|
149 event.srcElement.parentElement.appendChild(audioElementNode());
|
|
n@159
|
150 };
|
|
n@159
|
151 node.appendChild(newAudioElementButton);
|
|
n@159
|
152
|
|
n@159
|
153 var newCommentButton = document.createElement("button");
|
|
n@159
|
154 newCommentButton.textContent = "Add Comment Box";
|
|
n@159
|
155 newCommentButton.onclick = function() {
|
|
n@159
|
156 event.srcElement.parentElement.appendChild(commentBox());
|
|
n@159
|
157 };
|
|
n@159
|
158 node.appendChild(newCommentButton);
|
|
n@159
|
159
|
|
n@159
|
160 var removeButton = document.createElement("button");
|
|
n@159
|
161 removeButton.textContent = "Remove Audio Holder";
|
|
n@159
|
162 removeButton.onclick = removeNode;
|
|
n@159
|
163 node.appendChild(removeButton);
|
|
n@159
|
164 return node;
|
|
n@159
|
165 }
|
|
n@159
|
166
|
|
n@159
|
167 function audioElementNode() {
|
|
n@159
|
168 var parentStructure = event.srcElement.parentElement.childNodes;
|
|
n@159
|
169 var audioElemCounts = 0;
|
|
n@159
|
170 for (var i=0; i<parentStructure.length; i++) {
|
|
n@159
|
171 if (parentStructure[i].getAttribute('name') == "audio-element")
|
|
n@159
|
172 {audioElemCounts++;}
|
|
n@159
|
173 }
|
|
n@159
|
174 var node = document.createElement('div');
|
|
n@159
|
175 node.setAttribute('class','head');
|
|
n@159
|
176 node.setAttribute('name','audio-element');
|
|
n@159
|
177 var nodeTitle = document.createElement('span');
|
|
n@159
|
178 nodeTitle.textContent = 'Audio Element '+(audioElemCounts+1);
|
|
n@159
|
179
|
|
n@159
|
180 var attributes = document.createElement("div");
|
|
n@159
|
181 attributes.setAttribute('class','attrib');
|
|
n@159
|
182 var id = attributePair("ID:","text");
|
|
n@159
|
183 id[1].value = audioElemCounts;
|
|
n@159
|
184 var url = attributePair("URL:","text");
|
|
n@159
|
185 id.forEach(function(item){attributes.appendChild(item);},false);
|
|
n@159
|
186 url.forEach(function(item){attributes.appendChild(item);},false);
|
|
n@159
|
187
|
|
n@159
|
188 node.appendChild(nodeTitle);
|
|
n@159
|
189 node.appendChild(attributes);
|
|
n@159
|
190
|
|
n@159
|
191 var removeButton = document.createElement("button");
|
|
n@159
|
192 removeButton.textContent = "Remove Audio Element";
|
|
n@159
|
193 removeButton.onclick = removeNode;
|
|
n@159
|
194 node.appendChild(removeButton);
|
|
n@159
|
195 return node;
|
|
n@159
|
196 }
|
|
n@159
|
197
|
|
n@159
|
198 function commentBox() {
|
|
n@159
|
199 var node = document.createElement('div');
|
|
n@159
|
200 node.setAttribute('class','head');
|
|
n@159
|
201 node.setAttribute('name','comment-question');
|
|
n@159
|
202 var nodeTitle = document.createElement('h4');
|
|
n@159
|
203 nodeTitle.textContent = "Comment Box";
|
|
n@159
|
204
|
|
n@159
|
205 var attributes = document.createElement('div');
|
|
n@159
|
206 attributes.setAttribute('class','attrib');
|
|
n@159
|
207 var id = attributePair("ID:",'text');
|
|
n@159
|
208 var question = attributePair("Question:",'text');
|
|
n@159
|
209 id.forEach(function(item){attributes.appendChild(item);},false);
|
|
n@159
|
210 question.forEach(function(item){attributes.appendChild(item);},false);
|
|
n@159
|
211
|
|
n@159
|
212 var removeButton = document.createElement("button");
|
|
n@159
|
213 removeButton.textContent = "Remove Comment Box";
|
|
n@159
|
214 removeButton.onclick = removeNode;
|
|
n@159
|
215
|
|
n@159
|
216 node.appendChild(nodeTitle);
|
|
n@159
|
217 node.appendChild(attributes);
|
|
n@159
|
218 node.appendChild(removeButton);
|
|
n@159
|
219 return node;
|
|
n@157
|
220 }
|
|
n@157
|
221 </script>
|
|
n@157
|
222 <style>
|
|
n@157
|
223 div {
|
|
n@157
|
224 padding: 2px;
|
|
n@157
|
225 margin-top: 2px;
|
|
n@157
|
226 margin-bottom: 2px;
|
|
n@157
|
227 }
|
|
n@157
|
228 div.head{
|
|
n@157
|
229 margin-left: 10px;
|
|
n@157
|
230 border: black;
|
|
n@157
|
231 border-width: 2px;
|
|
n@157
|
232 border-style: solid;
|
|
n@157
|
233 }
|
|
n@157
|
234 div.attrib{
|
|
n@157
|
235 margin-left:25px;
|
|
n@157
|
236 border: black;
|
|
n@157
|
237 border-width: 2px;
|
|
n@157
|
238 border-style: dashed;
|
|
n@157
|
239 margin-bottom: 10px;
|
|
n@157
|
240 }
|
|
n@157
|
241 </style>
|
|
n@157
|
242
|
|
n@156
|
243 </head>
|
|
n@156
|
244
|
|
n@156
|
245 <body>
|
|
n@157
|
246 <h1>Create Test Setup XML</h1>
|
|
n@157
|
247 <div id="topLevelBody" align="left">
|
|
n@156
|
248 <!-- Interface goes here -->
|
|
n@157
|
249 <div name='test-setup'>
|
|
n@157
|
250 <div id="setup" class="head">
|
|
n@157
|
251 <h2>Setup Tag</h2>
|
|
n@157
|
252 <div id="setup-attribs" class="attrib">
|
|
n@157
|
253 <span>Interface</span>
|
|
n@157
|
254 <select id="interface">
|
|
n@157
|
255 <option value='APE'>APE</option>
|
|
n@157
|
256 </select>
|
|
n@157
|
257 <span>Project Return</span>
|
|
n@157
|
258 <input type="text" id="projectReturn">
|
|
n@157
|
259 <span>Randomise Test Page Order</span>
|
|
n@157
|
260 <input id="randomisePageOrder" type="checkbox" value="false">
|
|
n@157
|
261 <span>Collect Session Metrics</span>
|
|
n@157
|
262 <input id="collectMetrics" type="checkbox">
|
|
n@157
|
263 </div>
|
|
n@157
|
264 <div id="globalPreTest" class="head">
|
|
n@157
|
265 <h3>Pre Test</h3>
|
|
n@157
|
266 <button id="addPreTestQ" onclick="event.srcElement.parentElement.appendChild(questionNode());">Add Pre Test Question</button>
|
|
n@157
|
267 <button id="addPreTestS" onclick="event.srcElement.parentElement.appendChild(statementNode());">Add Pre Test Statement</button>
|
|
n@157
|
268 </div>
|
|
n@157
|
269 <div id="globalPostTest" class="head">
|
|
n@157
|
270 <h3>Post Test</h3>
|
|
n@157
|
271 <button id="addPreTestQ" onclick="event.srcElement.parentElement.appendChild(questionNode());">Add Post Test Question</button>
|
|
n@157
|
272 <button id="addPreTestS" onclick="event.srcElement.parentElement.appendChild(statementNode());">Add Post Test Statement</button>
|
|
n@157
|
273 </div>
|
|
n@157
|
274 <div id="globalMetric" class="head">
|
|
n@157
|
275 <h3>Global Metrics</h3>
|
|
n@157
|
276 <div id="globalMetric-attrib" class="attrib">
|
|
n@157
|
277 <span>Test Timer</span>
|
|
n@157
|
278 <input type="checkbox" id="testTimer" />
|
|
n@157
|
279 <span>Element Playback Timer</span>
|
|
n@157
|
280 <input type="checkbox" id="elementTimer" />
|
|
n@157
|
281 <span>Element Initial Position</span>
|
|
n@157
|
282 <input type="checkbox" id="elementInitialPosition" />
|
|
n@157
|
283 <span>Element Tracker</span>
|
|
n@157
|
284 <input type="checkbox" id="elementTracker" />
|
|
n@157
|
285 <span>Element Flag Listened To</span>
|
|
n@157
|
286 <input type="checkbox" id="elementFlagListened" />
|
|
n@157
|
287 <span>Element Flag Moved</span>
|
|
n@157
|
288 <input type="checkbox" id="elementFlagMoved" />
|
|
n@157
|
289 </div>
|
|
n@157
|
290 </div>
|
|
n@159
|
291 <button id="addAudioHolder" onclick="event.srcElement.parentElement.appendChild(audioHolderNode());">Add AudioHolder / Test Page</button>
|
|
n@157
|
292 </div>
|
|
n@157
|
293 </div>
|
|
n@156
|
294 </div>
|
|
n@156
|
295 </body>
|
|
n@156
|
296 </html>
|
