n@767
|
1 <!DOCTYPE html>
|
n@767
|
2 <html lang="en">
|
n@767
|
3 <head>
|
n@767
|
4 <meta charset="utf-8">
|
n@767
|
5
|
n@767
|
6 <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
|
n@767
|
7 Remove this if you use the .htaccess -->
|
n@767
|
8 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
n@767
|
9
|
n@767
|
10 <title>WAET: Test Creator</title>
|
n@767
|
11
|
n@767
|
12 <meta name="viewport" content="width=device-width; initial-scale=1.0">
|
n@767
|
13 <script type="text/javascript">
|
n@767
|
14
|
n@767
|
15 var APEInterfaceOptions = [["playhead","page-count"],["Show the playhead/scrubber bar", "Show test page count"]];
|
n@767
|
16 var APEInterfaceChecks = [["fragmentPlayed","fragmentFullPlayback","fragmentMoved","fragmentComments"],["All Fragments Played","All Fragments Played in entirety","All sliders moved","All fragments have comments"]];
|
n@767
|
17 var APEInterfaceMetrics = [["testTimer","elementTimer","elementTracker","elementTrackerFull","elementFlagListenedTo","elementFlagMoved","elementFlagComments"],["Test Duration","Total time each fragment was listened to","Return initialised position of marker","Fragment movement tracker with timestamps","Flag if fragment listened to","Flag if fragment moved","Flag if fragment has comments"]];
|
n@767
|
18 var MUSHRAInterfaceOptions = [[],[]];
|
n@767
|
19 var MUSHRAInterfaceChecks = [["fragmentPlayed","fragmentMoved","fragmentComments"],["All Fragments Played","All sliders moved","All fragments have comments"]];
|
n@767
|
20 var MUSHRAInterfaceMetrics = [["testTimer","elementTimer","elementTracker","elementTrackerFull","elementFlagListenedTo","elementFlagMoved","elementFlagComments"],["Test Duration","Total time each fragment was listened to","Return initialised position of marker","Fragment movement tracker with timestamps","Flag if fragment listened to","Flag if fragment moved","Flag if fragment has comments"]];
|
n@767
|
21 var popupInstance;
|
n@767
|
22 var specificationNode;
|
n@767
|
23 var audioContext;
|
n@767
|
24 var audioObjects = [];
|
n@767
|
25 window.onload = function()
|
n@767
|
26 {
|
n@767
|
27 var AudioContext = window.AudioContext || window.webkitAudioContext;
|
n@767
|
28 audioContext = new AudioContext;
|
n@767
|
29 popupInstance = new popup();
|
n@767
|
30 popupInstance.advanceState();
|
n@767
|
31 specificationNode = new Specification();
|
n@767
|
32 specificationNode.projectReturn = "null";
|
n@767
|
33 };
|
n@767
|
34
|
n@767
|
35 function popup()
|
n@767
|
36 {
|
n@767
|
37 var x = window.innerWidth;
|
n@767
|
38 var y = window.innerHeight;
|
n@767
|
39 this.popupHolder = document.createElement('div');
|
n@767
|
40 this.popupHolder.style.visibility = 'hidden';
|
n@767
|
41 this.popupContent = document.createElement('div');
|
n@767
|
42 this.popupTitle = document.createElement('div');
|
n@767
|
43 this.popupBody = document.createElement('div');
|
n@767
|
44 this.popupFooter = document.createElement('div');
|
n@767
|
45 this.popupTitleText = document.createElement('span');
|
n@767
|
46 this.popupTitle.appendChild(this.popupTitleText);
|
n@767
|
47
|
n@767
|
48 this.popupHolder.className = "popup";
|
n@767
|
49 this.popupHolder.style.left = (x-500)/2 +'px';
|
n@767
|
50 this.popupHolder.style.top = (y-400)/2 + 'px';
|
n@767
|
51 this.popupContent.style.padding = "20px";
|
n@767
|
52 this.popupHolder.appendChild(this.popupContent);
|
n@767
|
53
|
n@767
|
54 this.popupTitle.style.width = "100%";
|
n@767
|
55 this.popupTitle.style.height = "50px";
|
n@767
|
56 this.popupTitle.style.fontSize = "xx-large";
|
n@767
|
57 this.popupContent.appendChild(this.popupTitle);
|
n@767
|
58
|
n@767
|
59 this.popupBody.style.width = "100%";
|
n@767
|
60 this.popupBody.style.height = "280px";
|
n@767
|
61 this.popupContent.appendChild(this.popupBody);
|
n@767
|
62
|
n@767
|
63 this.popupFooter.style.width = "100%";
|
n@767
|
64 this.popupFooter.style.height = "30px";
|
n@767
|
65 this.popupContent.appendChild(this.popupFooter);
|
n@767
|
66 var body = document.getElementsByTagName('body')[0];
|
n@767
|
67 body.appendChild(this.popupHolder);
|
n@767
|
68
|
n@767
|
69 this.pageBlank = document.createElement('div');
|
n@767
|
70 body.appendChild(this.pageBlank);
|
n@767
|
71 this.pageBlank.style.width = "100%";
|
n@767
|
72 this.pageBlank.style.height = "100%";
|
n@767
|
73 this.pageBlank.style.position = "absolute";
|
n@767
|
74 this.pageBlank.style.left = "0px";
|
n@767
|
75 this.pageBlank.style.top = "0px";
|
n@767
|
76 this.pageBlank.style.backgroundColor = "rgba(0,0,0,0.5)";
|
n@767
|
77 this.pageBlank.style.visibility = 'hidden';
|
n@767
|
78
|
n@767
|
79 this.state = 0;
|
n@767
|
80 this.dataTransfer = null;
|
n@767
|
81
|
n@767
|
82 this.showPopup = function()
|
n@767
|
83 {
|
n@767
|
84 this.popupHolder.style.visibility = 'visible';
|
n@767
|
85 this.popupHolder.style.zIndex = "3";
|
n@767
|
86 this.pageBlank.style.visibility = 'visible';
|
n@767
|
87 this.pageBlank.style.zIndex = "2";
|
n@767
|
88 };
|
n@767
|
89
|
n@767
|
90 this.hidePopup = function()
|
n@767
|
91 {
|
n@767
|
92 this.popupHolder.style.visibility = 'hidden';
|
n@767
|
93 this.popupHolder.style.zIndex = "-1";
|
n@767
|
94 this.pageBlank.style.visibility = 'hidden';
|
n@767
|
95 this.pageBlank.style.zIndex = "-2";
|
n@767
|
96 };
|
n@767
|
97
|
n@767
|
98 this.init = function()
|
n@767
|
99 {
|
n@767
|
100 this.popupTitleText.textContent = "Welcome";
|
n@767
|
101 var text = document.createElement('span');
|
n@767
|
102 text.textContent = "Thank you for downloading the Web Audio Evaluation Toolbox. This page will help guide you through creating the documents required to run a test. If you have an existing XML file you wish to edit, please drag and drop it into the box below";
|
n@767
|
103 var dnd = document.createElement('div');
|
n@767
|
104 dnd.style.width = "100%";
|
n@767
|
105 dnd.style.height = "50px";
|
n@767
|
106 dnd.className = "dragndrop";
|
n@767
|
107 dnd.ondragover = function(e) {
|
n@767
|
108 e.stopPropagation();
|
n@767
|
109 e.preventDefault();
|
n@767
|
110 };
|
n@767
|
111 dnd.ondragenter = function(e) {
|
n@767
|
112 e.stopPropagation();
|
n@767
|
113 e.preventDefault();
|
n@767
|
114 this.style.backgroundColor = '#AAFFAA';
|
n@767
|
115 };
|
n@767
|
116 dnd.ondragleave = function(e) {
|
n@767
|
117 e.stopPropagation();
|
n@767
|
118 e.preventDefault();
|
n@767
|
119 this.style.backgroundColor = "#FFFFFF";
|
n@767
|
120 };
|
n@767
|
121 dnd.ondrop = function(e) {
|
n@767
|
122 e.stopPropagation();
|
n@767
|
123 e.preventDefault();
|
n@767
|
124
|
n@767
|
125 var file = e.dataTransfer.files[0];
|
n@767
|
126
|
n@767
|
127 // Uses HTML5 FileAPI - https://w3c.github.io/FileAPI/#filereader-interface
|
n@767
|
128 var reader = new FileReader();
|
n@767
|
129 reader.onload = function() {
|
n@767
|
130 var parse = new DOMParser();
|
n@767
|
131 var xml = parse.parseFromString(reader.result,'text/xml');
|
n@767
|
132 specificationNode.decode(xml);
|
n@767
|
133 popupInstance.hidePopup();
|
n@767
|
134 SpecificationToHTML();
|
n@767
|
135 };
|
n@767
|
136 reader.readAsText(file);
|
n@767
|
137
|
n@767
|
138 };
|
n@767
|
139 this.popupBody.appendChild(text);
|
n@767
|
140 this.popupBody.appendChild(dnd);
|
n@767
|
141 this.showPopup();
|
n@767
|
142
|
n@767
|
143 var button = document.createElement('button');
|
n@767
|
144 button.className = "popupButton";
|
n@767
|
145 button.textContent = "New File";
|
n@767
|
146 button.onclick = function(event) {
|
n@767
|
147 popupInstance.advanceState();
|
n@767
|
148 };
|
n@767
|
149 this.popupFooter.appendChild(button);
|
n@767
|
150 };
|
n@767
|
151
|
n@767
|
152 this.advanceState = function()
|
n@767
|
153 {
|
n@767
|
154 this.popupBody.innerHTML = null;
|
n@767
|
155 this.popupFooter.innerHTML = null;
|
n@767
|
156 this.popupTitleText.textContent = null;
|
n@767
|
157 switch(this.state)
|
n@767
|
158 {
|
n@767
|
159 case 0:
|
n@767
|
160 this.init();
|
n@767
|
161 break;
|
n@767
|
162 case 1:
|
n@767
|
163 this.popupTitleText.textContent = "Test Type";
|
n@767
|
164 var text = document.createElement("span");
|
n@767
|
165 text.textContent = "What type of test would you like to use. Currently APE (Audio Perceptual Evaluation) and MUSHRA style interfaces are available";
|
n@767
|
166 this.popupBody.appendChild(text);
|
n@767
|
167 var select = document.createElement("select");
|
n@767
|
168 select.id="interface-select";
|
n@767
|
169 var opt1 = document.createElement("option");
|
n@767
|
170 opt1.value = "APE";
|
n@767
|
171 opt1.textContent = "APE";
|
n@767
|
172 select.appendChild(opt1);
|
n@767
|
173 var opt2 = document.createElement("option");
|
n@767
|
174 opt2.value = "MUSHRA";
|
n@767
|
175 opt2.textContent = "MUSHRA";
|
n@767
|
176 select.appendChild(opt2);
|
n@767
|
177 this.popupBody.appendChild(select);
|
n@767
|
178
|
n@767
|
179 var button = document.createElement('button');
|
n@767
|
180 button.className = "popupButton";
|
n@767
|
181 button.textContent = "Submit";
|
n@767
|
182 button.onclick = function(event) {
|
n@767
|
183 var select = document.getElementById("interface-select");
|
n@767
|
184 specificationNode.interfaceType = select.value;
|
n@767
|
185 specificationNode.collectMetrics = true;
|
n@767
|
186 popupInstance.advanceState();
|
n@767
|
187 };
|
n@767
|
188 this.popupFooter.appendChild(button);
|
n@767
|
189 break;
|
n@767
|
190 case 2:
|
n@767
|
191 this.popupTitleText.textContent = "Test Options";
|
n@767
|
192 var holder = document.createElement('div');
|
n@767
|
193 holder.style.margin = "5px";
|
n@767
|
194 var checkbox = document.createElement('input');
|
n@767
|
195 checkbox.type = 'checkbox';
|
n@767
|
196 checkbox.id = "Randomise-Page";
|
n@767
|
197 var text = document.createElement('span');
|
n@767
|
198 text.textContent = "Randomise Page Order";
|
n@767
|
199 holder.appendChild(checkbox);
|
n@767
|
200 holder.appendChild(text);
|
n@767
|
201 this.popupBody.appendChild(holder);
|
n@767
|
202 switch(specificationNode.interfaceType)
|
n@767
|
203 {
|
n@767
|
204 case "APE":
|
n@767
|
205 for (var i=0; i<APEInterfaceOptions[0].length; i++)
|
n@767
|
206 {
|
n@767
|
207 holder = document.createElement('div');
|
n@767
|
208 holder.style.margin = "5px";
|
n@767
|
209 checkbox = document.createElement('input');
|
n@767
|
210 checkbox.type = 'checkbox';
|
n@767
|
211 checkbox.setAttribute("name","option");
|
n@767
|
212 checkbox.id = APEInterfaceOptions[0][i];
|
n@767
|
213 text = document.createElement('span');
|
n@767
|
214 text.textContent = APEInterfaceOptions[1][i];
|
n@767
|
215 holder.appendChild(checkbox);
|
n@767
|
216 holder.appendChild(text);
|
n@767
|
217 this.popupBody.appendChild(holder);
|
n@767
|
218 }
|
n@767
|
219 for (var i=0; i<APEInterfaceChecks[0].length; i++)
|
n@767
|
220 {
|
n@767
|
221 holder = document.createElement('div');
|
n@767
|
222 holder.style.margin = "5px";
|
n@767
|
223 checkbox = document.createElement('input');
|
n@767
|
224 checkbox.type = 'checkbox';
|
n@767
|
225 checkbox.setAttribute("name","check");
|
n@767
|
226 checkbox.id = APEInterfaceChecks[0][i];
|
n@767
|
227 text = document.createElement('span');
|
n@767
|
228 text.textContent = APEInterfaceChecks[1][i];
|
n@767
|
229 holder.appendChild(checkbox);
|
n@767
|
230 holder.appendChild(text);
|
n@767
|
231 this.popupBody.appendChild(holder);
|
n@767
|
232 }
|
n@767
|
233 break;
|
n@767
|
234 case "MUSHRA":
|
n@767
|
235 for (var i=0; i<MUSHRAInterfaceOptions[0].length; i++)
|
n@767
|
236 {
|
n@767
|
237 holder = document.createElement('div');
|
n@767
|
238 holder.style.margin = "5px";
|
n@767
|
239 checkbox = document.createElement('input');
|
n@767
|
240 checkbox.type = 'checkbox';
|
n@767
|
241 checkbox.setAttribute("name","option");
|
n@767
|
242 checkbox.id = MUSHRAInterfaceOptions[0][i];
|
n@767
|
243 text = document.createElement('span');
|
n@767
|
244 text.textContent = MUSHRAInterfaceOptions[1][i];
|
n@767
|
245 holder.appendChild(checkbox);
|
n@767
|
246 holder.appendChild(text);
|
n@767
|
247 this.popupBody.appendChild(holder);
|
n@767
|
248 }
|
n@767
|
249 for (var i=0; i<MUSHRAInterfaceChecks[0].length; i++)
|
n@767
|
250 {
|
n@767
|
251 holder = document.createElement('div');
|
n@767
|
252 holder.style.margin = "5px";
|
n@767
|
253 checkbox = document.createElement('input');
|
n@767
|
254 checkbox.type = 'checkbox';
|
n@767
|
255 checkbox.setAttribute("name","check");
|
n@767
|
256 checkbox.id = MUSHRAInterfaceChecks[0][i];
|
n@767
|
257 text = document.createElement('span');
|
n@767
|
258 text.textContent = MUSHRAInterfaceChecks[1][i];
|
n@767
|
259 holder.appendChild(checkbox);
|
n@767
|
260 holder.appendChild(text);
|
n@767
|
261 this.popupBody.appendChild(holder);
|
n@767
|
262 }
|
n@767
|
263 }
|
n@767
|
264 var button = document.createElement('button');
|
n@767
|
265 button.className = "popupButton";
|
n@767
|
266 button.textContent = "Submit";
|
n@767
|
267 button.onclick = function(event) {
|
n@767
|
268 var optHold = popupInstance.popupBody;
|
n@767
|
269 var opt = optHold.firstChild;
|
n@767
|
270 var input = opt.getElementsByTagName('input')[0];
|
n@767
|
271 specificationNode.randomiseOrder = input.checked;
|
n@767
|
272 while(opt.nextSibling != null)
|
n@767
|
273 {
|
n@767
|
274 opt = opt.nextSibling;
|
n@767
|
275 input = opt.getElementsByTagName('input')[0];
|
n@767
|
276 if (input.checked)
|
n@767
|
277 {
|
n@767
|
278 specificationNode.commonInterface.options.push(new specificationNode.commonInterface.optionNode(input));
|
n@767
|
279 }
|
n@767
|
280
|
n@767
|
281 }
|
n@767
|
282 popupInstance.advanceState();
|
n@767
|
283 };
|
n@767
|
284 this.popupFooter.appendChild(button);
|
n@767
|
285 break;
|
n@767
|
286 case 3:
|
n@767
|
287 audioObjects = [];
|
n@767
|
288 this.popupTitleText.textContent = "Test Page";
|
n@767
|
289 var span = document.createElement('span');
|
n@767
|
290 span.textContent = "Drag and drop your audio files into the box below to add them to a test page";
|
n@767
|
291 this.popupBody.appendChild(span);
|
n@767
|
292 var dnd = document.createElement('div');
|
n@767
|
293 dnd.id = "audio-holder-drop";
|
n@767
|
294 dnd.style.width = "100%";
|
n@767
|
295 dnd.style.minHeight = "50px";
|
n@767
|
296 dnd.style.maxHeight = "220px";
|
n@767
|
297 dnd.style.overflow = 'auto';
|
n@767
|
298 dnd.className = "dragndrop";
|
n@767
|
299 dnd.ondragover = function(e) {
|
n@767
|
300 if(e.preventDefault) {e.preventDefault();}
|
n@767
|
301 return false;
|
n@767
|
302 };
|
n@767
|
303 dnd.ondragenter = function(e) {
|
n@767
|
304 if(e.preventDefault) {e.preventDefault();}
|
n@767
|
305 return false;
|
n@767
|
306 };
|
n@767
|
307 dnd.ondrop = function(e) {
|
n@767
|
308 if(e.preventDefault) {e.preventDefault();}
|
n@767
|
309 var dt = e.dataTransfer;
|
n@767
|
310 var body = document.getElementById("audio-holder-drop");
|
n@767
|
311 var files = dt.files;
|
n@767
|
312 for (var i = 0, f; f = files[i]; i++)
|
n@767
|
313 {
|
n@767
|
314 var ao = new audioObject();
|
n@767
|
315 ao.constructTrack(f);
|
n@767
|
316 audioObjects.push(ao);
|
n@767
|
317 var dndHeader = document.createElement('div');
|
n@767
|
318 dndHeader.style.width = "100%";
|
n@767
|
319 dndHeader.style.height = "20px";
|
n@767
|
320 dndHeader.style.borderBottom = "#DDD";
|
n@767
|
321 dndHeader.style.borderBottomWidth = "1px";
|
n@767
|
322 dndHeader.style.borderBottomStyle = "solid";
|
n@767
|
323 dndHeader.setAttribute('aoID',audioObjects.length-1);
|
n@767
|
324 var dndHInclude = document.createElement('div');
|
n@767
|
325 dndHInclude.style.width = "30px";
|
n@767
|
326 dndHInclude.className = "dndheaderelement";
|
n@767
|
327 var includeCheck = document.createElement('input');
|
n@767
|
328 includeCheck.type = "checkbox";
|
n@767
|
329 includeCheck.name = "include-check";
|
n@767
|
330 includeCheck.checked = true;
|
n@767
|
331 includeCheck.onchange = function()
|
n@767
|
332 {
|
n@767
|
333 var i = event.currentTarget.parentElement.parentElement.getAttribute('aoID');
|
n@767
|
334 audioObjects[i].include = event.currentTarget.checked;
|
n@767
|
335 };
|
n@767
|
336 dndHInclude.appendChild(includeCheck);
|
n@767
|
337 dndHeader.appendChild(dndHInclude);
|
n@767
|
338 var dndHTitle = document.createElement('div');
|
n@767
|
339 dndHTitle.style.width = "180px";
|
n@767
|
340 dndHTitle.className = "dndheaderelement";
|
n@767
|
341 var text = document.createElement('span');
|
n@767
|
342 text.textContent = f.name;
|
n@767
|
343 dndHTitle.appendChild(text);
|
n@767
|
344 dndHeader.appendChild(dndHTitle);
|
n@767
|
345 var dndHID = document.createElement('div');
|
n@767
|
346 dndHID.style.width = "100px";
|
n@767
|
347 dndHID.className = "dndheaderelement";
|
n@767
|
348 var IDInput = document.createElement('input');
|
n@767
|
349 IDInput.name = "audio-fragment-ID";
|
n@767
|
350 IDInput.value = f.name.split('.')[0];
|
n@767
|
351 IDInput.onchange = function()
|
n@767
|
352 {
|
n@767
|
353 var allIDInput = document.getElementsByName("audio-fragment-ID");
|
n@767
|
354 var isCopy = new Array(allIDInput.length);
|
n@767
|
355 isCopy.fill(0,0,this.length);
|
n@767
|
356 if (allIDInput.length > 1)
|
n@767
|
357 {
|
n@767
|
358 for (var j=0; j<allIDInput.length; j++)
|
n@767
|
359 {
|
n@767
|
360 var textCompare1 = allIDInput[j].value;
|
n@767
|
361 for (var k=j+1; k<allIDInput.length; k++)
|
n@767
|
362 {
|
n@767
|
363 var textCompare2 = allIDInput[k].value;
|
n@767
|
364 if (textCompare1 == textCompare2)
|
n@767
|
365 {
|
n@767
|
366 isCopy[j] = 1;
|
n@767
|
367 isCopy[k] = 1;
|
n@767
|
368 }
|
n@767
|
369 }
|
n@767
|
370 }
|
n@767
|
371 }
|
n@767
|
372 var button = document.getElementById('submit');
|
n@767
|
373 button.disabled = false;
|
n@767
|
374 for (var j=0; j<allIDInput.length; j++)
|
n@767
|
375 {
|
n@767
|
376 if (isCopy[j] == 1)
|
n@767
|
377 {
|
n@767
|
378 allIDInput[j].style.backgroundColor = '#F22';
|
n@767
|
379 button.disabled = true;
|
n@767
|
380 }
|
n@767
|
381 else
|
n@767
|
382 {
|
n@767
|
383 allIDInput[j].style.backgroundColor = '#FFF';
|
n@767
|
384 audioObjects[j].id = allIDInput[j].value;
|
n@767
|
385 }
|
n@767
|
386 }
|
n@767
|
387 };
|
n@767
|
388 IDInput.style.width = "96px";
|
n@767
|
389 dndHID.appendChild(IDInput);
|
n@767
|
390 dndHeader.appendChild(dndHID);
|
n@767
|
391 var dndHPlay = document.createElement('div');
|
n@767
|
392 dndHPlay.style.width = "100px";
|
n@767
|
393 dndHPlay.className = "dndheaderelement";
|
n@767
|
394 var audio = document.createElement('button');
|
n@767
|
395 audio.textContent = 'Play';
|
n@767
|
396 audio.className = "popupButton";
|
n@767
|
397 audio.style.height = "inherit";
|
n@767
|
398 audio.onclick = function()
|
n@767
|
399 {
|
n@767
|
400 var i = event.currentTarget.parentElement.parentElement.getAttribute('aoID');
|
n@767
|
401 audioObjects[i].play();
|
n@767
|
402 };
|
n@767
|
403 dndHPlay.appendChild(audio);
|
n@767
|
404 dndHeader.appendChild(dndHPlay);
|
n@767
|
405 dnd.appendChild(dndHeader);
|
n@767
|
406 IDInput.onchange();
|
n@767
|
407 }
|
n@767
|
408 };
|
n@767
|
409 var dndHeader = document.createElement('div');
|
n@767
|
410 dndHeader.style.width = "100%";
|
n@767
|
411 dndHeader.style.height = "15px";
|
n@767
|
412 dndHeader.style.borderBottom = "#DDD";
|
n@767
|
413 dndHeader.style.borderBottomWidth = "1px";
|
n@767
|
414 dndHeader.style.borderBottomStyle = "solid";
|
n@767
|
415 var dndHInclude = document.createElement('div');
|
n@767
|
416 dndHInclude.style.width = "30px";
|
n@767
|
417 dndHInclude.className = "dndheaderelement";
|
n@767
|
418 var text = document.createElement('span');
|
n@767
|
419 text.textContent = "Inc.";
|
n@767
|
420 dndHInclude.appendChild(text);
|
n@767
|
421 dndHeader.appendChild(dndHInclude);
|
n@767
|
422 var dndHTitle = document.createElement('div');
|
n@767
|
423 dndHTitle.style.width = "180px";
|
n@767
|
424 dndHTitle.className = "dndheaderelement";
|
n@767
|
425 text = document.createElement('span');
|
n@767
|
426 text.textContent = "File Name";
|
n@767
|
427 dndHTitle.appendChild(text);
|
n@767
|
428 dndHeader.appendChild(dndHTitle);
|
n@767
|
429 var dndHID = document.createElement('div');
|
n@767
|
430 dndHID.style.width = "100px";
|
n@767
|
431 dndHID.className = "dndheaderelement";
|
n@767
|
432 text = document.createElement('span');
|
n@767
|
433 text.textContent = "ID";
|
n@767
|
434 dndHID.appendChild(text);
|
n@767
|
435 dndHeader.appendChild(dndHID);
|
n@767
|
436 var dndHPlay = document.createElement('div');
|
n@767
|
437 dndHPlay.style.width = "100px";
|
n@767
|
438 dndHPlay.className = "dndheaderelement";
|
n@767
|
439 text = document.createElement('span');
|
n@767
|
440 text.textContent = "Sample";
|
n@767
|
441 dndHPlay.appendChild(text);
|
n@767
|
442 dndHeader.appendChild(dndHPlay);
|
n@767
|
443 dnd.appendChild(dndHeader);
|
n@767
|
444 this.popupBody.appendChild(dnd);
|
n@767
|
445 var button = document.createElement('button');
|
n@767
|
446 button.id = 'submit';
|
n@767
|
447 button.className = "popupButton";
|
n@767
|
448 button.textContent = "Submit";
|
n@767
|
449 button.onclick = function(event)
|
n@767
|
450 {
|
n@767
|
451 // Construct the audio-holder nodes;
|
n@767
|
452 for (var i=0; i<audioObjects.length; i++)
|
n@767
|
453 {
|
n@767
|
454 if (!audioObjects[i].include)
|
n@767
|
455 {
|
n@767
|
456 audioObjects.pop(audioObjects[i]);
|
n@767
|
457 }
|
n@767
|
458 }
|
n@767
|
459 if (audioObjects.length != 0)
|
n@767
|
460 {
|
n@767
|
461 popupInstance.advanceState();
|
n@767
|
462 }
|
n@767
|
463 };
|
n@767
|
464 this.popupFooter.appendChild(button);
|
n@767
|
465 break;
|
n@767
|
466 case 4:
|
n@767
|
467 this.popupTitleText.textContent = "Test Page - Options";
|
n@767
|
468 var span = document.createElement('span');
|
n@767
|
469 span.textContent = "Set your test page options here";
|
n@767
|
470 this.popupBody.appendChild(span);
|
n@767
|
471 var pair = document.createElement('div');
|
n@767
|
472 pair.style.margin = '5px';
|
n@767
|
473 var text = document.createElement('span');
|
n@767
|
474 text.textContent = "Page ID:";
|
n@767
|
475 var input = document.createElement('input');
|
n@767
|
476 input.value = specificationNode.audioHolders.length;
|
n@767
|
477 input.id = "id";
|
n@767
|
478 pair.appendChild(text);
|
n@767
|
479 pair.appendChild(input);
|
n@767
|
480 this.popupBody.appendChild(pair);
|
n@767
|
481 pair = document.createElement('div');
|
n@767
|
482 pair.style.margin = '5px';
|
n@767
|
483 text = document.createElement('span');
|
n@767
|
484 text.textContent = "Randomise Fragment Order";
|
n@767
|
485 input = document.createElement('input');
|
n@767
|
486 input.type = "checkbox";
|
n@767
|
487 input.id = "randomiseOrder";
|
n@767
|
488 pair.appendChild(input);
|
n@767
|
489 pair.appendChild(text);
|
n@767
|
490 this.popupBody.appendChild(pair);
|
n@767
|
491 pair = document.createElement('div');
|
n@767
|
492 pair.style.margin = '5px';
|
n@767
|
493 text = document.createElement('span');
|
n@767
|
494 text.textContent = "Loop Fragment Playback";
|
n@767
|
495 input = document.createElement('input');
|
n@767
|
496 input.type = "checkbox";
|
n@767
|
497 input.id = "loop";
|
n@767
|
498 pair.appendChild(input);
|
n@767
|
499 pair.appendChild(text);
|
n@767
|
500 this.popupBody.appendChild(pair);
|
n@767
|
501 pair = document.createElement('div');
|
n@767
|
502 pair.style.margin = '5px';
|
n@767
|
503 text = document.createElement('span');
|
n@767
|
504 text.textContent = "Show fragment comment boxes";
|
n@767
|
505 input = document.createElement('input');
|
n@767
|
506 input.type = "checkbox";
|
n@767
|
507 input.id = "elementComments";
|
n@767
|
508 pair.appendChild(input);
|
n@767
|
509 pair.appendChild(text);
|
n@767
|
510 this.popupBody.appendChild(pair);
|
n@767
|
511 var button = document.createElement('button');
|
n@767
|
512 button.id = 'submit';
|
n@767
|
513 button.className = "popupButton";
|
n@767
|
514 button.textContent = "Next";
|
n@767
|
515 button.onclick = function(event)
|
n@767
|
516 {
|
n@767
|
517 var ah = new specificationNode.audioHolderNode(specificationNode);
|
n@767
|
518 ah.id = document.getElementById('id').value;
|
n@767
|
519 ah.presentedId = specificationNode.audioHolders.length;
|
n@767
|
520 ah.hostURL = ah.id+'/';
|
n@767
|
521 ah.randomiseOrder = document.getElementById('randomiseOrder').checked;
|
n@767
|
522 ah.loop = document.getElementById('loop').checked;
|
n@767
|
523 ah.elementComments = document.getElementById('elementComments').checked;
|
n@767
|
524 for (var i=0; i<audioObjects.length; i++)
|
n@767
|
525 {
|
n@767
|
526 ah.audioElements.push(new ah.audioElementNode(ah,audioObjects[i]));
|
n@767
|
527 }
|
n@767
|
528 specificationNode.audioHolders.push(ah);
|
n@767
|
529 popupInstance.advanceState();
|
n@767
|
530 };
|
n@767
|
531 this.popupFooter.appendChild(button);
|
n@767
|
532 break;
|
n@767
|
533 case 5:
|
n@767
|
534 this.dataTransfer = null;
|
n@767
|
535 this.popupTitleText.textContent = "Test Page - Pre/Post Survey";
|
n@767
|
536 var span = document.createElement('span');
|
n@767
|
537 span.textContent = "Add your pre test page options here";
|
n@767
|
538 this.popupBody.appendChild(span);
|
n@767
|
539 var preHolder = document.createElement('div');
|
n@767
|
540 preHolder.id = "preHolder";
|
n@767
|
541 preHolder.style.width = "460px";
|
n@767
|
542 preHolder.style.minHeight = "100px";
|
n@767
|
543 preHolder.style.maxHeight = "220px";
|
n@767
|
544 preHolder.style.overflow = 'auto';
|
n@767
|
545 preHolder.style.border = "black";
|
n@767
|
546 preHolder.style.borderStyle = "solid";
|
n@767
|
547 preHolder.style.borderWidth = "1px";
|
n@767
|
548 this.popupBody.appendChild(preHolder);
|
n@767
|
549 var audioHolder = specificationNode.audioHolders[specificationNode.audioHolders.length-1];
|
n@767
|
550 var preHeaderHolder = document.createElement('div');
|
n@767
|
551 preHeaderHolder.style.width = "456px";
|
n@767
|
552 preHeaderHolder.style.height= "20px";
|
n@767
|
553 preHeaderHolder.style.margin= "2px";
|
n@767
|
554 preHeaderHolder.style.borderBottom = "#DDD";
|
n@767
|
555 preHeaderHolder.style.borderBottomWidth = "1px";
|
n@767
|
556 preHeaderHolder.style.borderBottomStyle = "solid";
|
n@767
|
557 var mvH = document.createElement('div');
|
n@767
|
558 mvH.className = "dndheaderelement";
|
n@767
|
559 mvH.style.width = "50px";
|
n@767
|
560 var text = document.createElement('span');
|
n@767
|
561 text.textContent = "Order";
|
n@767
|
562 mvH.appendChild(text);
|
n@767
|
563 preHeaderHolder.appendChild(mvH);
|
n@767
|
564 var idH = document.createElement('div');
|
n@767
|
565 idH.className = "dndheaderelement";
|
n@767
|
566 idH.style.width = "150px";
|
n@767
|
567 text = document.createElement('span');
|
n@767
|
568 text.textContent = "ID";
|
n@767
|
569 idH.appendChild(text);
|
n@767
|
570 preHeaderHolder.appendChild(idH);
|
n@767
|
571 var tH = document.createElement('div');
|
n@767
|
572 tH.className = "dndheaderelement";
|
n@767
|
573 tH.style.width = "150px";
|
n@767
|
574 text = document.createElement('span');
|
n@767
|
575 text.textContent = "Type";
|
n@767
|
576 tH.appendChild(text);
|
n@767
|
577 preHeaderHolder.appendChild(tH);
|
n@767
|
578 var editH = document.createElement('div');
|
n@767
|
579 editH.className = "dndheaderelement";
|
n@767
|
580 editH.style.width = "50px";
|
n@767
|
581 text = document.createElement('span');
|
n@767
|
582 text.textContent = "Edit";
|
n@767
|
583 editH.appendChild(text);
|
n@767
|
584 preHeaderHolder.appendChild(editH);
|
n@767
|
585 var deleteH = document.createElement('div');
|
n@767
|
586 deleteH.className = "dndheaderelement";
|
n@767
|
587 deleteH.style.width = "50px";
|
n@767
|
588 text = document.createElement('span');
|
n@767
|
589 text.textContent = "Delete";
|
n@767
|
590 deleteH.appendChild(text);
|
n@767
|
591 preHeaderHolder.appendChild(deleteH);
|
n@767
|
592 preHolder.appendChild(preHeaderHolder);
|
n@767
|
593
|
n@767
|
594
|
n@767
|
595 for (var i=0; i<audioHolder.preTest.options.length; i++)
|
n@767
|
596 {
|
n@767
|
597 var optionNode = audioHolder.preTest.options[i];
|
n@767
|
598 var entry = document.createElement('div');
|
n@767
|
599 entry.style.width = "456px";
|
n@767
|
600 entry.style.height= "20px";
|
n@767
|
601 entry.style.margin= "2px";
|
n@767
|
602 entry.style.borderBottom = "#DDD";
|
n@767
|
603 entry.style.borderBottomWidth = "1px";
|
n@767
|
604 entry.style.borderBottomStyle = "solid";
|
n@767
|
605 entry.setAttribute("node-id",i);
|
n@767
|
606 var node = audioHolder.preTest.options[i];
|
n@767
|
607 var mvH = document.createElement('div');
|
n@767
|
608 mvH.className = "dndheaderelement";
|
n@767
|
609 mvH.style.width = "50px";
|
n@767
|
610 var mvup = document.createElement("button");
|
n@767
|
611 mvup.textContent = "Up";
|
n@767
|
612 mvup.style.width = "25px";
|
n@767
|
613 mvup.style.padding = "1px 0px";
|
n@767
|
614 mvup.onclick = function()
|
n@767
|
615 {
|
n@767
|
616 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
|
n@767
|
617 if (i != 0)
|
n@767
|
618 {
|
n@767
|
619 var next = audioHolder.preTest.options[i-1];
|
n@767
|
620 var cur = audioHolder.preTest.options[i];
|
n@767
|
621 audioHolder.preTest.options[i-1] = cur;
|
n@767
|
622 audioHolder.preTest.options[i] = next;
|
n@767
|
623 popupInstance.state = 5;
|
n@767
|
624 popupInstance.advanceState();
|
n@767
|
625 }
|
n@767
|
626 };
|
n@767
|
627 mvH.appendChild(mvup);
|
n@767
|
628 var mvdn = document.createElement("button");
|
n@767
|
629 mvdn.textContent = "Dn";
|
n@767
|
630 mvdn.style.width = "25px";
|
n@767
|
631 mvdn.style.padding = "1px 0px";
|
n@767
|
632 mvdn.onclick = function()
|
n@767
|
633 {
|
n@767
|
634 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
|
n@767
|
635 if (i != audioHolder.preTest.options.length-1)
|
n@767
|
636 {
|
n@767
|
637 var next = audioHolder.preTest.options[i+1];
|
n@767
|
638 var cur = audioHolder.preTest.options[i];
|
n@767
|
639 audioHolder.preTest.options[i+1] = cur;
|
n@767
|
640 audioHolder.preTest.options[i] = next;
|
n@767
|
641 popupInstance.state = 5;
|
n@767
|
642 popupInstance.advanceState();
|
n@767
|
643 }
|
n@767
|
644 };
|
n@767
|
645 mvH.appendChild(mvdn);
|
n@767
|
646 entry.appendChild(mvH);
|
n@767
|
647 var idH = document.createElement('div');
|
n@767
|
648 idH.className = "dndheaderelement";
|
n@767
|
649 idH.style.width = "150px";
|
n@767
|
650 if (optionNode.type != "statement")
|
n@767
|
651 {
|
n@767
|
652 var span = document.createElement('span');
|
n@767
|
653 span.textContent = optionNode.id;
|
n@767
|
654 idH.appendChild(span);
|
n@767
|
655 }
|
n@767
|
656 entry.appendChild(idH);
|
n@767
|
657 var typeH = document.createElement('div');
|
n@767
|
658 typeH.className = "dndheaderelement";
|
n@767
|
659 typeH.style.width = "150px";
|
n@767
|
660 var span = document.createElement('span');
|
n@767
|
661 span.textContent = optionNode.type;
|
n@767
|
662 typeH.appendChild(span);
|
n@767
|
663 entry.appendChild(typeH);
|
n@767
|
664 var editH = document.createElement('div');
|
n@767
|
665 editH.className = "dndheaderelement";
|
n@767
|
666 editH.style.width = "50px";
|
n@767
|
667 var editButton = document.createElement("button");
|
n@767
|
668 editButton.textContent = "Edit";
|
n@767
|
669 editButton.style.width = "48px";
|
n@767
|
670 editButton.style.padding = "1px 0px";
|
n@767
|
671 editButton.onclick = function()
|
n@767
|
672 {
|
n@767
|
673 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
|
n@767
|
674 popupInstance.dataTransfer = new function() {
|
n@767
|
675 this.title = "Edit Test Node";
|
n@767
|
676 this.parent = specificationNode.audioHolders[specificationNode.audioHolders.length-1].preTest;
|
n@767
|
677 this.node = this.parent.options[i];
|
n@767
|
678 this.previousState = 5;
|
n@767
|
679 };
|
n@767
|
680 popupInstance.advanceState();
|
n@767
|
681 };
|
n@767
|
682 editH.appendChild(editButton);
|
n@767
|
683 entry.appendChild(editH);
|
n@767
|
684 var deleteH = document.createElement('div');
|
n@767
|
685 deleteH.className = "dndheaderelement";
|
n@767
|
686 deleteH.style.width = "50px";
|
n@767
|
687 var deleteButton = document.createElement("button");
|
n@767
|
688 deleteButton.textContent = "Del";
|
n@767
|
689 deleteButton.style.width = "48px";
|
n@767
|
690 deleteButton.style.padding = "1px 0px";
|
n@767
|
691 deleteButton.onclick = function()
|
n@767
|
692 {
|
n@767
|
693 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
|
n@767
|
694 var j = i+1;
|
n@767
|
695 while(j < audioHolder.preTest.options.length)
|
n@767
|
696 {
|
n@767
|
697 audioHolder.preTest.options[i] = audioHolder.preTest.options[j];
|
n@767
|
698 j++;
|
n@767
|
699 i++;
|
n@767
|
700 }
|
n@767
|
701 audioHolder.preTest.options.pop();
|
n@767
|
702 popupInstance.state = 5;
|
n@767
|
703 popupInstance.advanceState();
|
n@767
|
704 };
|
n@767
|
705 deleteH.appendChild(deleteButton);
|
n@767
|
706 entry.appendChild(deleteH);
|
n@767
|
707 preHolder.appendChild(entry);
|
n@767
|
708 }
|
n@767
|
709 var entry = document.createElement('div');
|
n@767
|
710 entry.style.width = "456px";
|
n@767
|
711 entry.style.height= "20px";
|
n@767
|
712 entry.style.margin= "2px";
|
n@767
|
713 entry.style.borderBottom = "#DDD";
|
n@767
|
714 entry.style.borderBottomWidth = "1px";
|
n@767
|
715 entry.style.borderBottomStyle = "solid";
|
n@767
|
716 entry.align = "center";
|
n@767
|
717 var addPre = document.createElement('button');
|
n@767
|
718 addPre.className = "popupButton";
|
n@767
|
719 addPre.textContent = "Add New Entry";
|
n@767
|
720 addPre.style.height = "20px";
|
n@767
|
721 addPre.onclick = function()
|
n@767
|
722 {
|
n@767
|
723 popupInstance.dataTransfer = new function() {
|
n@767
|
724 this.title = "New Pre Test Node";
|
n@767
|
725 this.parent = specificationNode.audioHolders[specificationNode.audioHolders.length-1].preTest;
|
n@767
|
726 this.node = null;
|
n@767
|
727 this.previousState = 5;
|
n@767
|
728 };
|
n@767
|
729 popupInstance.advanceState();
|
n@767
|
730 };
|
n@767
|
731 entry.appendChild(addPre);
|
n@767
|
732 preHolder.appendChild(entry);
|
n@767
|
733
|
n@767
|
734 var span = document.createElement('span');
|
n@767
|
735 span.textContent = "Add your post test page options here";
|
n@767
|
736 this.popupBody.appendChild(span);
|
n@767
|
737 var postHolder = document.createElement('div');
|
n@767
|
738 postHolder.id = "preHolder";
|
n@767
|
739 postHolder.style.width = "100%";
|
n@767
|
740 postHolder.style.minHeight = "100px";
|
n@767
|
741 postHolder.style.maxHeight = "220px";
|
n@767
|
742 postHolder.style.overflow = 'auto';
|
n@767
|
743 postHolder.style.border = "black";
|
n@767
|
744 postHolder.style.borderStyle = "solid";
|
n@767
|
745 postHolder.style.borderWidth = "1px";
|
n@767
|
746 this.popupBody.appendChild(postHolder);
|
n@767
|
747 var postHeaderHolder = document.createElement('div');
|
n@767
|
748 postHeaderHolder.style.width = "456px";
|
n@767
|
749 postHeaderHolder.style.height= "20px";
|
n@767
|
750 postHeaderHolder.style.margin= "2px";
|
n@767
|
751 postHeaderHolder.style.borderBottom = "#DDD";
|
n@767
|
752 postHeaderHolder.style.borderBottomWidth = "1px";
|
n@767
|
753 postHeaderHolder.style.borderBottomStyle = "solid";
|
n@767
|
754 var mvH = document.createElement('div');
|
n@767
|
755 mvH.className = "dndheaderelement";
|
n@767
|
756 mvH.style.width = "50px";
|
n@767
|
757 var text = document.createElement('span');
|
n@767
|
758 text.textContent = "Order";
|
n@767
|
759 mvH.appendChild(text);
|
n@767
|
760 postHeaderHolder.appendChild(mvH);
|
n@767
|
761 var idH = document.createElement('div');
|
n@767
|
762 idH.className = "dndheaderelement";
|
n@767
|
763 idH.style.width = "150px";
|
n@767
|
764 text = document.createElement('span');
|
n@767
|
765 text.textContent = "ID";
|
n@767
|
766 idH.appendChild(text);
|
n@767
|
767 postHeaderHolder.appendChild(idH);
|
n@767
|
768 var tH = document.createElement('div');
|
n@767
|
769 tH.className = "dndheaderelement";
|
n@767
|
770 tH.style.width = "150px";
|
n@767
|
771 text = document.createElement('span');
|
n@767
|
772 text.textContent = "Type";
|
n@767
|
773 tH.appendChild(text);
|
n@767
|
774 postHeaderHolder.appendChild(tH);
|
n@767
|
775 var editH = document.createElement('div');
|
n@767
|
776 editH.className = "dndheaderelement";
|
n@767
|
777 editH.style.width = "50px";
|
n@767
|
778 text = document.createElement('span');
|
n@767
|
779 text.textContent = "Edit";
|
n@767
|
780 editH.appendChild(text);
|
n@767
|
781 postHeaderHolder.appendChild(editH);
|
n@767
|
782 var deleteH = document.createElement('div');
|
n@767
|
783 deleteH.className = "dndheaderelement";
|
n@767
|
784 deleteH.style.width = "50px";
|
n@767
|
785 text = document.createElement('span');
|
n@767
|
786 text.textContent = "Delete";
|
n@767
|
787 deleteH.appendChild(text);
|
n@767
|
788 postHeaderHolder.appendChild(deleteH);
|
n@767
|
789 postHolder.appendChild(postHeaderHolder);
|
n@767
|
790
|
n@767
|
791 for (var i=0; i<audioHolder.postTest.options.length; i++)
|
n@767
|
792 {
|
n@767
|
793 var optionNode = audioHolder.postTest.options[i];
|
n@767
|
794 var entry = document.createElement('div');
|
n@767
|
795 entry.style.width = "456px";
|
n@767
|
796 entry.style.height= "20px";
|
n@767
|
797 entry.style.margin= "2px";
|
n@767
|
798 entry.style.borderBottom = "#DDD";
|
n@767
|
799 entry.style.borderBottomWidth = "1px";
|
n@767
|
800 entry.style.borderBottomStyle = "solid";
|
n@767
|
801 entry.setAttribute("node-id",i);
|
n@767
|
802 var node = audioHolder.postTest.options[i];
|
n@767
|
803 var mvH = document.createElement('div');
|
n@767
|
804 mvH.className = "dndheaderelement";
|
n@767
|
805 mvH.style.width = "50px";
|
n@767
|
806 var mvup = document.createElement("button");
|
n@767
|
807 mvup.textContent = "Up";
|
n@767
|
808 mvup.style.width = "25px";
|
n@767
|
809 mvup.style.padding = "1px 0px";
|
n@767
|
810 mvup.onclick = function()
|
n@767
|
811 {
|
n@767
|
812 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
|
n@767
|
813 if (i != 0)
|
n@767
|
814 {
|
n@767
|
815 var next = audioHolder.postTest.options[i-1];
|
n@767
|
816 var cur = audioHolder.postTest.options[i];
|
n@767
|
817 audioHolder.postTest.options[i-1] = cur;
|
n@767
|
818 audioHolder.postTest.options[i] = next;
|
n@767
|
819 popupInstance.state = 5;
|
n@767
|
820 popupInstance.advanceState();
|
n@767
|
821 }
|
n@767
|
822 };
|
n@767
|
823 mvH.appendChild(mvup);
|
n@767
|
824 var mvdn = document.createElement("button");
|
n@767
|
825 mvdn.textContent = "Dn";
|
n@767
|
826 mvdn.style.width = "25px";
|
n@767
|
827 mvdn.style.padding = "1px 0px";
|
n@767
|
828 mvdn.onclick = function()
|
n@767
|
829 {
|
n@767
|
830 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
|
n@767
|
831 if (i != audioHolder.postTest.options.length-1)
|
n@767
|
832 {
|
n@767
|
833 var next = audioHolder.postTest.options[i+1];
|
n@767
|
834 var cur = audioHolder.postTest.options[i];
|
n@767
|
835 audioHolder.postTest.options[i+1] = cur;
|
n@767
|
836 audioHolder.postTest.options[i] = next;
|
n@767
|
837 popupInstance.state = 5;
|
n@767
|
838 popupInstance.advanceState();
|
n@767
|
839 }
|
n@767
|
840 };
|
n@767
|
841 mvH.appendChild(mvdn);
|
n@767
|
842 entry.appendChild(mvH);
|
n@767
|
843 var idH = document.createElement('div');
|
n@767
|
844 idH.className = "dndheaderelement";
|
n@767
|
845 idH.style.width = "150px";
|
n@767
|
846 if (optionNode.type != "statement")
|
n@767
|
847 {
|
n@767
|
848 var span = document.createElement('span');
|
n@767
|
849 span.textContent = optionNode.id;
|
n@767
|
850 idH.appendChild(span);
|
n@767
|
851 }
|
n@767
|
852 entry.appendChild(idH);
|
n@767
|
853 var typeH = document.createElement('div');
|
n@767
|
854 typeH.className = "dndheaderelement";
|
n@767
|
855 typeH.style.width = "150px";
|
n@767
|
856 var span = document.createElement('span');
|
n@767
|
857 span.textContent = optionNode.type;
|
n@767
|
858 typeH.appendChild(span);
|
n@767
|
859 entry.appendChild(typeH);
|
n@767
|
860 var editH = document.createElement('div');
|
n@767
|
861 editH.className = "dndheaderelement";
|
n@767
|
862 editH.style.width = "50px";
|
n@767
|
863 var editButton = document.createElement("button");
|
n@767
|
864 editButton.textContent = "Edit";
|
n@767
|
865 editButton.style.width = "48px";
|
n@767
|
866 editButton.style.padding = "1px 0px";
|
n@767
|
867 editButton.onclick = function()
|
n@767
|
868 {
|
n@767
|
869 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
|
n@767
|
870 popupInstance.dataTransfer = new function() {
|
n@767
|
871 this.title = "Edit Test Node";
|
n@767
|
872 this.parent = specificationNode.audioHolders[specificationNode.audioHolders.length-1].postTest;
|
n@767
|
873 this.node = this.parent.options[i];
|
n@767
|
874 this.previousState = 5;
|
n@767
|
875 };
|
n@767
|
876 popupInstance.advanceState();
|
n@767
|
877 };
|
n@767
|
878 editH.appendChild(editButton);
|
n@767
|
879 entry.appendChild(editH);
|
n@767
|
880 var deleteH = document.createElement('div');
|
n@767
|
881 deleteH.className = "dndheaderelement";
|
n@767
|
882 deleteH.style.width = "50px";
|
n@767
|
883 var deleteButton = document.createElement("button");
|
n@767
|
884 deleteButton.textContent = "Del";
|
n@767
|
885 deleteButton.style.width = "48px";
|
n@767
|
886 deleteButton.style.padding = "1px 0px";
|
n@767
|
887 deleteButton.onclick = function()
|
n@767
|
888 {
|
n@767
|
889 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
|
n@767
|
890 var j = i+1;
|
n@767
|
891 while(j < audioHolder.postTest.options.length)
|
n@767
|
892 {
|
n@767
|
893 audioHolder.postTest.options[i] = audioHolder.postTest.options[j];
|
n@767
|
894 j++;
|
n@767
|
895 i++;
|
n@767
|
896 }
|
n@767
|
897 audioHolder.postTest.options.pop();
|
n@767
|
898 popupInstance.state = 5;
|
n@767
|
899 popupInstance.advanceState();
|
n@767
|
900 };
|
n@767
|
901 deleteH.appendChild(deleteButton);
|
n@767
|
902 entry.appendChild(deleteH);
|
n@767
|
903 postHolder.appendChild(entry);
|
n@767
|
904 }
|
n@767
|
905
|
n@767
|
906 var entry = document.createElement('div');
|
n@767
|
907 entry.style.width = "456px";
|
n@767
|
908 entry.style.height= "20px";
|
n@767
|
909 entry.style.margin= "2px";
|
n@767
|
910 entry.style.borderBottom = "#DDD";
|
n@767
|
911 entry.style.borderBottomWidth = "1px";
|
n@767
|
912 entry.style.borderBottomStyle = "solid";
|
n@767
|
913 entry.align = "center";
|
n@767
|
914 var addPost = document.createElement('button');
|
n@767
|
915 addPost.className = "popupButton";
|
n@767
|
916 addPost.textContent = "Add New Entry";
|
n@767
|
917 addPost.style.height = "20px";
|
n@767
|
918 addPost.onclick = function()
|
n@767
|
919 {
|
n@767
|
920 popupInstance.dataTransfer = new function() {
|
n@767
|
921 this.title = "New Pre Test Node";
|
n@767
|
922 this.parent = specificationNode.audioHolders[specificationNode.audioHolders.length-1].postTest;
|
n@767
|
923 this.node = null;
|
n@767
|
924 this.previousState = 5;
|
n@767
|
925 };
|
n@767
|
926 popupInstance.advanceState();
|
n@767
|
927 };
|
n@767
|
928 entry.appendChild(addPost);
|
n@767
|
929 postHolder.appendChild(entry);
|
n@767
|
930
|
n@767
|
931 var button = document.createElement('button');
|
n@767
|
932 button.id = 'submit';
|
n@767
|
933 button.className = "popupButton";
|
n@767
|
934 button.textContent = "Finish";
|
n@767
|
935 button.onclick = function(event)
|
n@767
|
936 {
|
n@767
|
937 popupInstance.state = 7;
|
n@767
|
938 popupInstance.advanceState();
|
n@767
|
939 };
|
n@767
|
940 this.popupFooter.appendChild(button);
|
n@767
|
941 button = document.createElement('button');
|
n@767
|
942 button.id = 'submit';
|
n@767
|
943 button.className = "popupButton";
|
n@767
|
944 button.textContent = "Add Another Page";
|
n@767
|
945 button.onclick = function(event)
|
n@767
|
946 {
|
n@767
|
947 popupInstance.state = 3;
|
n@767
|
948 popupInstance.advanceState();
|
n@767
|
949 };
|
n@767
|
950 this.popupFooter.appendChild(button);
|
n@767
|
951 break;
|
n@767
|
952 case 6:
|
n@767
|
953 this.popupTitleText.textContent = this.dataTransfer.title;
|
n@767
|
954 var span = document.createElement('span');
|
n@767
|
955 span.textContent = "Select survey settings here";
|
n@767
|
956 this.popupBody.appendChild(span);
|
n@767
|
957 var div = document.createElement('div');
|
n@767
|
958 span = document.createElement("span");
|
n@767
|
959 span.textContent = "Survey Type";
|
n@767
|
960 var select = document.createElement("select");
|
n@767
|
961 select.id="survey-select";
|
n@767
|
962 var option = document.createElement('option');
|
n@767
|
963 option.textContent = "Statement";
|
n@767
|
964 option.value = "statement";
|
n@767
|
965 select.appendChild(option);
|
n@767
|
966 option = document.createElement('option');
|
n@767
|
967 option.textContent = "Question";
|
n@767
|
968 option.value = "question";
|
n@767
|
969 select.appendChild(option);
|
n@767
|
970 option = document.createElement('option');
|
n@767
|
971 option.textContent = "Number";
|
n@767
|
972 option.value = "number";
|
n@767
|
973 select.appendChild(option);
|
n@767
|
974 option = document.createElement('option');
|
n@767
|
975 option.textContent = "Radio";
|
n@767
|
976 option.value = "radio";
|
n@767
|
977 select.appendChild(option);
|
n@767
|
978 option = document.createElement('option');
|
n@767
|
979 option.textContent = "Checkbox";
|
n@767
|
980 option.value = "checkbox";
|
n@767
|
981 select.appendChild(option);
|
n@767
|
982 this.popupBody.appendChild(select);
|
n@767
|
983 var options = document.createElement('div');
|
n@767
|
984 options.id = "survey-options";
|
n@767
|
985 this.popupBody.appendChild(options);
|
n@767
|
986 var button = document.createElement('button');
|
n@767
|
987 button.id = 'submit';
|
n@767
|
988 button.className = "popupButton";
|
n@767
|
989 button.textContent = "Add";
|
n@767
|
990 button.onclick = function(event)
|
n@767
|
991 {
|
n@767
|
992 var parent = popupInstance.dataTransfer.parent;
|
n@767
|
993 if (popupInstance.dataTransfer.node == null)
|
n@767
|
994 {
|
n@767
|
995 var node = new parent.OptionNode();
|
n@767
|
996 } else
|
n@767
|
997 {
|
n@767
|
998 var node = popupInstance.dataTransfer.node;
|
n@767
|
999 }
|
n@767
|
1000 node.type = document.getElementById("survey-select").value;
|
n@767
|
1001 switch(node.type)
|
n@767
|
1002 {
|
n@767
|
1003 case "statement":
|
n@767
|
1004 node.statement = document.getElementById("statement").value;
|
n@767
|
1005 break;
|
n@767
|
1006 case "question":
|
n@767
|
1007 node.question = document.getElementById("question").value;
|
n@767
|
1008 node.id = document.getElementById("ID").value;
|
n@767
|
1009 node.mandatory = document.getElementById("mandatory").checked;
|
n@767
|
1010 node.boxsize = document.getElementById("boxsize").value;
|
n@767
|
1011 break;
|
n@767
|
1012 }
|
n@767
|
1013 if (popupInstance.dataTransfer.node == null)
|
n@767
|
1014 {parent.options.push(node);}
|
n@767
|
1015 popupInstance.state = popupInstance.dataTransfer.previousState;
|
n@767
|
1016 popupInstance.advanceState();
|
n@767
|
1017 };
|
n@767
|
1018 this.popupFooter.appendChild(button);
|
n@767
|
1019 select.onchange = function()
|
n@767
|
1020 {
|
n@767
|
1021 var options = document.getElementById("survey-options");
|
n@767
|
1022 options.innerHTML = null;
|
n@767
|
1023 switch(this.value)
|
n@767
|
1024 {
|
n@767
|
1025 case "statement":
|
n@767
|
1026 var span = document.createElement('span');
|
n@767
|
1027 span.textContent = "Enter Statement";
|
n@767
|
1028 var tA = document.createElement('textarea');
|
n@767
|
1029 tA.id = "statement";
|
n@767
|
1030 tA.style.width = "460px";
|
n@767
|
1031 tA.style.height = "96px";
|
n@767
|
1032 if (popupInstance.dataTransfer.node != null)
|
n@767
|
1033 {tA.value = this.dataTransfer.node.statement;}
|
n@767
|
1034 options.appendChild(span);
|
n@767
|
1035 options.appendChild(tA);
|
n@767
|
1036 break;
|
n@767
|
1037 case "question":
|
n@767
|
1038 var span = document.createElement('span');
|
n@767
|
1039 span.textContent = "Enter Question";
|
n@767
|
1040 var tA = document.createElement('textarea');
|
n@767
|
1041 tA.style.width = "460px";
|
n@767
|
1042 tA.style.height = "54px";
|
n@767
|
1043 tA.id = "question";
|
n@767
|
1044 options.appendChild(span);
|
n@767
|
1045 options.appendChild(tA);
|
n@767
|
1046 var div = document.createElement('div');
|
n@767
|
1047 var input = document.createElement('input');
|
n@767
|
1048 input.id = "ID";
|
n@767
|
1049 span = document.createElement('span');
|
n@767
|
1050 span.textContent = "ID:";
|
n@767
|
1051 div.appendChild(span);
|
n@767
|
1052 div.appendChild(input);
|
n@767
|
1053 options.appendChild(div);
|
n@767
|
1054 div = document.createElement('div');
|
n@767
|
1055 input = document.createElement('input');
|
n@767
|
1056 input.type = "checkbox";
|
n@767
|
1057 input.id = "mandatory";
|
n@767
|
1058 span = document.createElement('span');
|
n@767
|
1059 span.textContent = "Mandatory";
|
n@767
|
1060 div.appendChild(span);
|
n@767
|
1061 div.appendChild(input);
|
n@767
|
1062 options.appendChild(div);
|
n@767
|
1063 div = document.createElement('div');
|
n@767
|
1064 var boxsize = document.createElement("select");
|
n@767
|
1065 boxsize.id = "boxsize";
|
n@767
|
1066 var selOpt = document.createElement("option");
|
n@767
|
1067 selOpt.value = "normal";
|
n@767
|
1068 selOpt.textContent = "Normal";
|
n@767
|
1069 boxsize.appendChild(selOpt);
|
n@767
|
1070 selOpt = document.createElement("option");
|
n@767
|
1071 selOpt.value = "small";
|
n@767
|
1072 selOpt.textContent = "Small";
|
n@767
|
1073 boxsize.appendChild(selOpt);
|
n@767
|
1074 selOpt = document.createElement("option");
|
n@767
|
1075 selOpt.value = "large";
|
n@767
|
1076 selOpt.textContent = "Large";
|
n@767
|
1077 boxsize.appendChild(selOpt);
|
n@767
|
1078 selOpt = document.createElement("option");
|
n@767
|
1079 selOpt.value = "huge";
|
n@767
|
1080 selOpt.textContent = "Huge";
|
n@767
|
1081 boxsize.appendChild(selOpt);
|
n@767
|
1082 span = document.createElement('span');
|
n@767
|
1083 span.textContent = "Response Text Area";
|
n@767
|
1084 div.appendChild(span);
|
n@767
|
1085 div.appendChild(boxsize);
|
n@767
|
1086 options.appendChild(div);
|
n@767
|
1087 if (popupInstance.dataTransfer.node != null)
|
n@767
|
1088 {
|
n@767
|
1089 tA.value = popupInstance.dataTransfer.node.question;
|
n@767
|
1090 document.getElementById("ID").value = popupInstance.dataTransfer.node.id;
|
n@767
|
1091 document.getElementById("mandatory").value = popupInstance.dataTransfer.node.mandatory;
|
n@767
|
1092 document.getElementById("boxsize").value = popupInstance.dataTransfer.node.boxsize;
|
n@767
|
1093 }
|
n@767
|
1094 break;
|
n@767
|
1095 case "number":
|
n@767
|
1096 var span = document.createElement('span');
|
n@767
|
1097 span.textContent = "Enter Question";
|
n@767
|
1098 var tA = document.createElement('textarea');
|
n@767
|
1099 tA.style.width = "460px";
|
n@767
|
1100 tA.style.height = "54px";
|
n@767
|
1101 tA.id = "question";
|
n@767
|
1102 options.appendChild(span);
|
n@767
|
1103 options.appendChild(tA);
|
n@767
|
1104 var div = document.createElement('div');
|
n@767
|
1105 var input = document.createElement('input');
|
n@767
|
1106 input.id = "ID";
|
n@767
|
1107 span = document.createElement('span');
|
n@767
|
1108 span.textContent = "ID:";
|
n@767
|
1109 div.appendChild(span);
|
n@767
|
1110 div.appendChild(input);
|
n@767
|
1111 options.appendChild(div);
|
n@767
|
1112 div = document.createElement('div');
|
n@767
|
1113 input = document.createElement('input');
|
n@767
|
1114 input.type = "checkbox";
|
n@767
|
1115 input.id = "mandatory";
|
n@767
|
1116 span = document.createElement('span');
|
n@767
|
1117 span.textContent = "Mandatory";
|
n@767
|
1118 div.appendChild(span);
|
n@767
|
1119 div.appendChild(input);
|
n@767
|
1120 options.appendChild(div);
|
n@767
|
1121 div = document.createElement('div');
|
n@767
|
1122 break;
|
n@767
|
1123 }
|
n@767
|
1124 };
|
n@767
|
1125 if (this.dataTransfer.node != null)
|
n@767
|
1126 {
|
n@767
|
1127 select.value = this.dataTransfer.node.type;
|
n@767
|
1128 }
|
n@767
|
1129 select.onchange();
|
n@767
|
1130 break;
|
n@767
|
1131 case 7:
|
n@767
|
1132 this.dataTransfer = null;
|
n@767
|
1133 this.popupTitleText.textContent = "Test Session - Pre/Post Survey";
|
n@767
|
1134 var span = document.createElement('span');
|
n@767
|
1135 span.textContent = "Add your pre test session and post test session survey options here";
|
n@767
|
1136 this.popupBody.appendChild(span);
|
n@767
|
1137 var preHolder = document.createElement('div');
|
n@767
|
1138 preHolder.id = "preHolder";
|
n@767
|
1139 preHolder.style.width = "460px";
|
n@767
|
1140 preHolder.style.minHeight = "100px";
|
n@767
|
1141 preHolder.style.maxHeight = "220px";
|
n@767
|
1142 preHolder.style.overflow = 'auto';
|
n@767
|
1143 preHolder.style.border = "black";
|
n@767
|
1144 preHolder.style.borderStyle = "solid";
|
n@767
|
1145 preHolder.style.borderWidth = "1px";
|
n@767
|
1146 this.popupBody.appendChild(preHolder);
|
n@767
|
1147 var preHeaderHolder = document.createElement('div');
|
n@767
|
1148 preHeaderHolder.style.width = "456px";
|
n@767
|
1149 preHeaderHolder.style.height= "20px";
|
n@767
|
1150 preHeaderHolder.style.margin= "2px";
|
n@767
|
1151 preHeaderHolder.style.borderBottom = "#DDD";
|
n@767
|
1152 preHeaderHolder.style.borderBottomWidth = "1px";
|
n@767
|
1153 preHeaderHolder.style.borderBottomStyle = "solid";
|
n@767
|
1154 var mvH = document.createElement('div');
|
n@767
|
1155 mvH.className = "dndheaderelement";
|
n@767
|
1156 mvH.style.width = "50px";
|
n@767
|
1157 var text = document.createElement('span');
|
n@767
|
1158 text.textContent = "Order";
|
n@767
|
1159 mvH.appendChild(text);
|
n@767
|
1160 preHeaderHolder.appendChild(mvH);
|
n@767
|
1161 var idH = document.createElement('div');
|
n@767
|
1162 idH.className = "dndheaderelement";
|
n@767
|
1163 idH.style.width = "150px";
|
n@767
|
1164 text = document.createElement('span');
|
n@767
|
1165 text.textContent = "ID";
|
n@767
|
1166 idH.appendChild(text);
|
n@767
|
1167 preHeaderHolder.appendChild(idH);
|
n@767
|
1168 var tH = document.createElement('div');
|
n@767
|
1169 tH.className = "dndheaderelement";
|
n@767
|
1170 tH.style.width = "150px";
|
n@767
|
1171 text = document.createElement('span');
|
n@767
|
1172 text.textContent = "Type";
|
n@767
|
1173 tH.appendChild(text);
|
n@767
|
1174 preHeaderHolder.appendChild(tH);
|
n@767
|
1175 var editH = document.createElement('div');
|
n@767
|
1176 editH.className = "dndheaderelement";
|
n@767
|
1177 editH.style.width = "50px";
|
n@767
|
1178 text = document.createElement('span');
|
n@767
|
1179 text.textContent = "Edit";
|
n@767
|
1180 editH.appendChild(text);
|
n@767
|
1181 preHeaderHolder.appendChild(editH);
|
n@767
|
1182 var deleteH = document.createElement('div');
|
n@767
|
1183 deleteH.className = "dndheaderelement";
|
n@767
|
1184 deleteH.style.width = "50px";
|
n@767
|
1185 text = document.createElement('span');
|
n@767
|
1186 text.textContent = "Delete";
|
n@767
|
1187 deleteH.appendChild(text);
|
n@767
|
1188 preHeaderHolder.appendChild(deleteH);
|
n@767
|
1189 preHolder.appendChild(preHeaderHolder);
|
n@767
|
1190
|
n@767
|
1191
|
n@767
|
1192 for (var i=0; i<specificationNode.preTest.options.length; i++)
|
n@767
|
1193 {
|
n@767
|
1194 var optionNode = specificationNode.preTest.options[i];
|
n@767
|
1195 var entry = document.createElement('div');
|
n@767
|
1196 entry.style.width = "456px";
|
n@767
|
1197 entry.style.height= "20px";
|
n@767
|
1198 entry.style.margin= "2px";
|
n@767
|
1199 entry.style.borderBottom = "#DDD";
|
n@767
|
1200 entry.style.borderBottomWidth = "1px";
|
n@767
|
1201 entry.style.borderBottomStyle = "solid";
|
n@767
|
1202 entry.setAttribute("node-id",i);
|
n@767
|
1203 var node = specificationNode.preTest.options[i];
|
n@767
|
1204 var mvH = document.createElement('div');
|
n@767
|
1205 mvH.className = "dndheaderelement";
|
n@767
|
1206 mvH.style.width = "50px";
|
n@767
|
1207 var mvup = document.createElement("button");
|
n@767
|
1208 mvup.textContent = "Up";
|
n@767
|
1209 mvup.style.width = "25px";
|
n@767
|
1210 mvup.style.padding = "1px 0px";
|
n@767
|
1211 mvup.onclick = function()
|
n@767
|
1212 {
|
n@767
|
1213 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
|
n@767
|
1214 if (i != 0)
|
n@767
|
1215 {
|
n@767
|
1216 var next = specificationNode.preTest.options[i-1];
|
n@767
|
1217 var cur = specificationNode.preTest.options[i];
|
n@767
|
1218 specificationNode.preTest.options[i-1] = cur;
|
n@767
|
1219 specificationNode.preTest.options[i] = next;
|
n@767
|
1220 popupInstance.state = 7;
|
n@767
|
1221 popupInstance.advanceState();
|
n@767
|
1222 }
|
n@767
|
1223 };
|
n@767
|
1224 mvH.appendChild(mvup);
|
n@767
|
1225 var mvdn = document.createElement("button");
|
n@767
|
1226 mvdn.textContent = "Dn";
|
n@767
|
1227 mvdn.style.width = "25px";
|
n@767
|
1228 mvdn.style.padding = "1px 0px";
|
n@767
|
1229 mvdn.onclick = function()
|
n@767
|
1230 {
|
n@767
|
1231 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
|
n@767
|
1232 if (i != specificationNode.preTest.options.length-1)
|
n@767
|
1233 {
|
n@767
|
1234 var next = specificationNode.preTest.options[i+1];
|
n@767
|
1235 var cur = specificationNode.preTest.options[i];
|
n@767
|
1236 specificationNode.preTest.options[i+1] = cur;
|
n@767
|
1237 specificationNode.preTest.options[i] = next;
|
n@767
|
1238 popupInstance.state = 7;
|
n@767
|
1239 popupInstance.advanceState();
|
n@767
|
1240 }
|
n@767
|
1241 };
|
n@767
|
1242 mvH.appendChild(mvdn);
|
n@767
|
1243 entry.appendChild(mvH);
|
n@767
|
1244 var idH = document.createElement('div');
|
n@767
|
1245 idH.className = "dndheaderelement";
|
n@767
|
1246 idH.style.width = "150px";
|
n@767
|
1247 if (optionNode.type != "statement")
|
n@767
|
1248 {
|
n@767
|
1249 var span = document.createElement('span');
|
n@767
|
1250 span.textContent = optionNode.id;
|
n@767
|
1251 idH.appendChild(span);
|
n@767
|
1252 }
|
n@767
|
1253 entry.appendChild(idH);
|
n@767
|
1254 var typeH = document.createElement('div');
|
n@767
|
1255 typeH.className = "dndheaderelement";
|
n@767
|
1256 typeH.style.width = "150px";
|
n@767
|
1257 var span = document.createElement('span');
|
n@767
|
1258 span.textContent = optionNode.type;
|
n@767
|
1259 typeH.appendChild(span);
|
n@767
|
1260 entry.appendChild(typeH);
|
n@767
|
1261 var editH = document.createElement('div');
|
n@767
|
1262 editH.className = "dndheaderelement";
|
n@767
|
1263 editH.style.width = "50px";
|
n@767
|
1264 var editButton = document.createElement("button");
|
n@767
|
1265 editButton.textContent = "Edit";
|
n@767
|
1266 editButton.style.width = "48px";
|
n@767
|
1267 editButton.style.padding = "1px 0px";
|
n@767
|
1268 editButton.onclick = function()
|
n@767
|
1269 {
|
n@767
|
1270 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
|
n@767
|
1271 popupInstance.dataTransfer = new function() {
|
n@767
|
1272 this.title = "Edit Test Node";
|
n@767
|
1273 this.parent = specificationNode.preTest;
|
n@767
|
1274 this.node = this.parent.options[i];
|
n@767
|
1275 this.previousState = 7;
|
n@767
|
1276 };
|
n@767
|
1277 popupInstace.state = 6;
|
n@767
|
1278 popupInstance.advanceState();
|
n@767
|
1279 };
|
n@767
|
1280 editH.appendChild(editButton);
|
n@767
|
1281 entry.appendChild(editH);
|
n@767
|
1282 var deleteH = document.createElement('div');
|
n@767
|
1283 deleteH.className = "dndheaderelement";
|
n@767
|
1284 deleteH.style.width = "50px";
|
n@767
|
1285 var deleteButton = document.createElement("button");
|
n@767
|
1286 deleteButton.textContent = "Del";
|
n@767
|
1287 deleteButton.style.width = "48px";
|
n@767
|
1288 deleteButton.style.padding = "1px 0px";
|
n@767
|
1289 deleteButton.onclick = function()
|
n@767
|
1290 {
|
n@767
|
1291 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
|
n@767
|
1292 var j = i+1;
|
n@767
|
1293 while(j < specificationNode.preTest.options.length)
|
n@767
|
1294 {
|
n@767
|
1295 specificationNode.preTest.options[i] = specificationNode.preTest.options[j];
|
n@767
|
1296 j++;
|
n@767
|
1297 i++;
|
n@767
|
1298 }
|
n@767
|
1299 specificationNode.preTest.options.pop();
|
n@767
|
1300 popupInstance.state = 7;
|
n@767
|
1301 popupInstance.advanceState();
|
n@767
|
1302 };
|
n@767
|
1303 deleteH.appendChild(deleteButton);
|
n@767
|
1304 entry.appendChild(deleteH);
|
n@767
|
1305 preHolder.appendChild(entry);
|
n@767
|
1306 }
|
n@767
|
1307 var entry = document.createElement('div');
|
n@767
|
1308 entry.style.width = "456px";
|
n@767
|
1309 entry.style.height= "20px";
|
n@767
|
1310 entry.style.margin= "2px";
|
n@767
|
1311 entry.style.borderBottom = "#DDD";
|
n@767
|
1312 entry.style.borderBottomWidth = "1px";
|
n@767
|
1313 entry.style.borderBottomStyle = "solid";
|
n@767
|
1314 entry.align = "center";
|
n@767
|
1315 var addPre = document.createElement('button');
|
n@767
|
1316 addPre.className = "popupButton";
|
n@767
|
1317 addPre.textContent = "Add New Entry";
|
n@767
|
1318 addPre.style.height = "20px";
|
n@767
|
1319 addPre.onclick = function()
|
n@767
|
1320 {
|
n@767
|
1321 popupInstance.dataTransfer = new function() {
|
n@767
|
1322 this.title = "New Pre Test Node";
|
n@767
|
1323 this.parent = specificationNode.preTest;
|
n@767
|
1324 this.node = null;
|
n@767
|
1325 this.previousState = 7;
|
n@767
|
1326 };
|
n@767
|
1327 popupInstance.state = 6;
|
n@767
|
1328 popupInstance.advanceState();
|
n@767
|
1329 };
|
n@767
|
1330 entry.appendChild(addPre);
|
n@767
|
1331 preHolder.appendChild(entry);
|
n@767
|
1332
|
n@767
|
1333 var span = document.createElement('span');
|
n@767
|
1334 span.textContent = "Add your post test page options here";
|
n@767
|
1335 this.popupBody.appendChild(span);
|
n@767
|
1336 var postHolder = document.createElement('div');
|
n@767
|
1337 postHolder.id = "preHolder";
|
n@767
|
1338 postHolder.style.width = "100%";
|
n@767
|
1339 postHolder.style.minHeight = "100px";
|
n@767
|
1340 postHolder.style.maxHeight = "220px";
|
n@767
|
1341 postHolder.style.overflow = 'auto';
|
n@767
|
1342 postHolder.style.border = "black";
|
n@767
|
1343 postHolder.style.borderStyle = "solid";
|
n@767
|
1344 postHolder.style.borderWidth = "1px";
|
n@767
|
1345 this.popupBody.appendChild(postHolder);
|
n@767
|
1346 var postHeaderHolder = document.createElement('div');
|
n@767
|
1347 postHeaderHolder.style.width = "456px";
|
n@767
|
1348 postHeaderHolder.style.height= "20px";
|
n@767
|
1349 postHeaderHolder.style.margin= "2px";
|
n@767
|
1350 postHeaderHolder.style.borderBottom = "#DDD";
|
n@767
|
1351 postHeaderHolder.style.borderBottomWidth = "1px";
|
n@767
|
1352 postHeaderHolder.style.borderBottomStyle = "solid";
|
n@767
|
1353 var mvH = document.createElement('div');
|
n@767
|
1354 mvH.className = "dndheaderelement";
|
n@767
|
1355 mvH.style.width = "50px";
|
n@767
|
1356 var text = document.createElement('span');
|
n@767
|
1357 text.textContent = "Order";
|
n@767
|
1358 mvH.appendChild(text);
|
n@767
|
1359 postHeaderHolder.appendChild(mvH);
|
n@767
|
1360 var idH = document.createElement('div');
|
n@767
|
1361 idH.className = "dndheaderelement";
|
n@767
|
1362 idH.style.width = "150px";
|
n@767
|
1363 text = document.createElement('span');
|
n@767
|
1364 text.textContent = "ID";
|
n@767
|
1365 idH.appendChild(text);
|
n@767
|
1366 postHeaderHolder.appendChild(idH);
|
n@767
|
1367 var tH = document.createElement('div');
|
n@767
|
1368 tH.className = "dndheaderelement";
|
n@767
|
1369 tH.style.width = "150px";
|
n@767
|
1370 text = document.createElement('span');
|
n@767
|
1371 text.textContent = "Type";
|
n@767
|
1372 tH.appendChild(text);
|
n@767
|
1373 postHeaderHolder.appendChild(tH);
|
n@767
|
1374 var editH = document.createElement('div');
|
n@767
|
1375 editH.className = "dndheaderelement";
|
n@767
|
1376 editH.style.width = "50px";
|
n@767
|
1377 text = document.createElement('span');
|
n@767
|
1378 text.textContent = "Edit";
|
n@767
|
1379 editH.appendChild(text);
|
n@767
|
1380 postHeaderHolder.appendChild(editH);
|
n@767
|
1381 var deleteH = document.createElement('div');
|
n@767
|
1382 deleteH.className = "dndheaderelement";
|
n@767
|
1383 deleteH.style.width = "50px";
|
n@767
|
1384 text = document.createElement('span');
|
n@767
|
1385 text.textContent = "Delete";
|
n@767
|
1386 deleteH.appendChild(text);
|
n@767
|
1387 postHeaderHolder.appendChild(deleteH);
|
n@767
|
1388 postHolder.appendChild(postHeaderHolder);
|
n@767
|
1389
|
n@767
|
1390 for (var i=0; i<specificationNode.postTest.options.length; i++)
|
n@767
|
1391 {
|
n@767
|
1392 var optionNode = specificationNode.postTest.options[i];
|
n@767
|
1393 var entry = document.createElement('div');
|
n@767
|
1394 entry.style.width = "456px";
|
n@767
|
1395 entry.style.height= "20px";
|
n@767
|
1396 entry.style.margin= "2px";
|
n@767
|
1397 entry.style.borderBottom = "#DDD";
|
n@767
|
1398 entry.style.borderBottomWidth = "1px";
|
n@767
|
1399 entry.style.borderBottomStyle = "solid";
|
n@767
|
1400 entry.setAttribute("node-id",i);
|
n@767
|
1401 var node = specificationNode.postTest.options[i];
|
n@767
|
1402 var mvH = document.createElement('div');
|
n@767
|
1403 mvH.className = "dndheaderelement";
|
n@767
|
1404 mvH.style.width = "50px";
|
n@767
|
1405 var mvup = document.createElement("button");
|
n@767
|
1406 mvup.textContent = "Up";
|
n@767
|
1407 mvup.style.width = "25px";
|
n@767
|
1408 mvup.style.padding = "1px 0px";
|
n@767
|
1409 mvup.onclick = function()
|
n@767
|
1410 {
|
n@767
|
1411 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
|
n@767
|
1412 if (i != 0)
|
n@767
|
1413 {
|
n@767
|
1414 var next = specificationNode.postTest.options[i-1];
|
n@767
|
1415 var cur = specificationNode.postTest.options[i];
|
n@767
|
1416 specificationNode.postTest.options[i-1] = cur;
|
n@767
|
1417 specificationNode.postTest.options[i] = next;
|
n@767
|
1418 popupInstance.state = 7;
|
n@767
|
1419 popupInstance.advanceState();
|
n@767
|
1420 }
|
n@767
|
1421 };
|
n@767
|
1422 mvH.appendChild(mvup);
|
n@767
|
1423 var mvdn = document.createElement("button");
|
n@767
|
1424 mvdn.textContent = "Dn";
|
n@767
|
1425 mvdn.style.width = "25px";
|
n@767
|
1426 mvdn.style.padding = "1px 0px";
|
n@767
|
1427 mvdn.onclick = function()
|
n@767
|
1428 {
|
n@767
|
1429 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
|
n@767
|
1430 if (i != specificationNode.postTest.options.length-1)
|
n@767
|
1431 {
|
n@767
|
1432 var next = specificationNode.postTest.options[i+1];
|
n@767
|
1433 var cur = specificationNode.postTest.options[i];
|
n@767
|
1434 specificationNode.postTest.options[i+1] = cur;
|
n@767
|
1435 specificationNode.postTest.options[i] = next;
|
n@767
|
1436 popupInstance.state = 7;
|
n@767
|
1437 popupInstance.advanceState();
|
n@767
|
1438 }
|
n@767
|
1439 };
|
n@767
|
1440 mvH.appendChild(mvdn);
|
n@767
|
1441 entry.appendChild(mvH);
|
n@767
|
1442 var idH = document.createElement('div');
|
n@767
|
1443 idH.className = "dndheaderelement";
|
n@767
|
1444 idH.style.width = "150px";
|
n@767
|
1445 if (optionNode.type != "statement")
|
n@767
|
1446 {
|
n@767
|
1447 var span = document.createElement('span');
|
n@767
|
1448 span.textContent = optionNode.id;
|
n@767
|
1449 idH.appendChild(span);
|
n@767
|
1450 }
|
n@767
|
1451 entry.appendChild(idH);
|
n@767
|
1452 var typeH = document.createElement('div');
|
n@767
|
1453 typeH.className = "dndheaderelement";
|
n@767
|
1454 typeH.style.width = "150px";
|
n@767
|
1455 var span = document.createElement('span');
|
n@767
|
1456 span.textContent = optionNode.type;
|
n@767
|
1457 typeH.appendChild(span);
|
n@767
|
1458 entry.appendChild(typeH);
|
n@767
|
1459 var editH = document.createElement('div');
|
n@767
|
1460 editH.className = "dndheaderelement";
|
n@767
|
1461 editH.style.width = "50px";
|
n@767
|
1462 var editButton = document.createElement("button");
|
n@767
|
1463 editButton.textContent = "Edit";
|
n@767
|
1464 editButton.style.width = "48px";
|
n@767
|
1465 editButton.style.padding = "1px 0px";
|
n@767
|
1466 editButton.onclick = function()
|
n@767
|
1467 {
|
n@767
|
1468 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
|
n@767
|
1469 popupInstance.dataTransfer = new function() {
|
n@767
|
1470 this.title = "Edit Test Node";
|
n@767
|
1471 this.parent = specificationNode.postTest;
|
n@767
|
1472 this.node = this.parent.options[i];
|
n@767
|
1473 this.previousState = 7;
|
n@767
|
1474 };
|
n@767
|
1475 popupInstance.state = 6;
|
n@767
|
1476 popupInstance.advanceState();
|
n@767
|
1477 };
|
n@767
|
1478 editH.appendChild(editButton);
|
n@767
|
1479 entry.appendChild(editH);
|
n@767
|
1480 var deleteH = document.createElement('div');
|
n@767
|
1481 deleteH.className = "dndheaderelement";
|
n@767
|
1482 deleteH.style.width = "50px";
|
n@767
|
1483 var deleteButton = document.createElement("button");
|
n@767
|
1484 deleteButton.textContent = "Del";
|
n@767
|
1485 deleteButton.style.width = "48px";
|
n@767
|
1486 deleteButton.style.padding = "1px 0px";
|
n@767
|
1487 deleteButton.onclick = function()
|
n@767
|
1488 {
|
n@767
|
1489 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
|
n@767
|
1490 var j = i+1;
|
n@767
|
1491 while(j < specificationNode.postTest.options.length)
|
n@767
|
1492 {
|
n@767
|
1493 specificationNode.postTest.options[i] = specificationNode.postTest.options[j];
|
n@767
|
1494 j++;
|
n@767
|
1495 i++;
|
n@767
|
1496 }
|
n@767
|
1497 audioHolder.postTest.options.pop();
|
n@767
|
1498 popupInstance.state = 7;
|
n@767
|
1499 popupInstance.advanceState();
|
n@767
|
1500 };
|
n@767
|
1501 deleteH.appendChild(deleteButton);
|
n@767
|
1502 entry.appendChild(deleteH);
|
n@767
|
1503 postHolder.appendChild(entry);
|
n@767
|
1504 }
|
n@767
|
1505
|
n@767
|
1506 var entry = document.createElement('div');
|
n@767
|
1507 entry.style.width = "456px";
|
n@767
|
1508 entry.style.height= "20px";
|
n@767
|
1509 entry.style.margin= "2px";
|
n@767
|
1510 entry.style.borderBottom = "#DDD";
|
n@767
|
1511 entry.style.borderBottomWidth = "1px";
|
n@767
|
1512 entry.style.borderBottomStyle = "solid";
|
n@767
|
1513 entry.align = "center";
|
n@767
|
1514 var addPost = document.createElement('button');
|
n@767
|
1515 addPost.className = "popupButton";
|
n@767
|
1516 addPost.textContent = "Add New Entry";
|
n@767
|
1517 addPost.style.height = "20px";
|
n@767
|
1518 addPost.onclick = function()
|
n@767
|
1519 {
|
n@767
|
1520 popupInstance.dataTransfer = new function() {
|
n@767
|
1521 this.title = "New Pre Test Node";
|
n@767
|
1522 this.parent = specificationNode.postTest;
|
n@767
|
1523 this.node = null;
|
n@767
|
1524 this.previousState = 7;
|
n@767
|
1525 };
|
n@767
|
1526 popupInstance.state = 6;
|
n@767
|
1527 popupInstance.advanceState();
|
n@767
|
1528 };
|
n@767
|
1529 entry.appendChild(addPost);
|
n@767
|
1530 postHolder.appendChild(entry);
|
n@767
|
1531
|
n@767
|
1532 var button = document.createElement('button');
|
n@767
|
1533 button.id = 'submit';
|
n@767
|
1534 button.className = "popupButton";
|
n@767
|
1535 button.textContent = "Finish";
|
n@767
|
1536 button.onclick = function(event)
|
n@767
|
1537 {
|
n@767
|
1538 popupInstance.state = 8;
|
n@767
|
1539 popupInstance.advanceState();
|
n@767
|
1540 };
|
n@767
|
1541 this.popupFooter.appendChild(button);
|
n@767
|
1542 break;
|
n@767
|
1543 case 8:
|
n@767
|
1544 this.hidePopup();
|
n@767
|
1545 this.state = 0;
|
n@767
|
1546 SpecificationToHTML ();
|
n@767
|
1547 }
|
n@767
|
1548 this.state++;
|
n@767
|
1549 };
|
n@767
|
1550 };
|
n@767
|
1551
|
n@767
|
1552 function audioObject()
|
n@767
|
1553 {
|
n@767
|
1554 // Used to hold audio information in buffers for quick playback
|
n@767
|
1555 this.bufferObject;
|
n@767
|
1556 this.bufferNode = undefined;
|
n@767
|
1557 this.state = 0;
|
n@767
|
1558 this.gain = audioContext.createGain();
|
n@767
|
1559 this.gain.connect(audioContext.destination);
|
n@767
|
1560 this.include = true;
|
n@767
|
1561 this.id = undefined;
|
n@767
|
1562 this.file = undefined;
|
n@767
|
1563
|
n@767
|
1564 this.play = function()
|
n@767
|
1565 {
|
n@767
|
1566 if (this.bufferNode != undefined)
|
n@767
|
1567 {
|
n@767
|
1568 this.bufferNode.stop(0);
|
n@767
|
1569 this.bufferNode = undefined;
|
n@767
|
1570 }
|
n@767
|
1571 if(this.state == 1)
|
n@767
|
1572 {
|
n@767
|
1573 this.bufferNode = audioContext.createBufferSource();
|
n@767
|
1574 this.bufferNode.connect(this.gain);
|
n@767
|
1575 this.bufferNode.buffer = this.bufferObject;
|
n@767
|
1576 this.bufferNode.onended = function(event) {
|
n@767
|
1577 // Safari does not like using 'this' to reference the calling object!
|
n@767
|
1578 event.currentTarget = undefined;
|
n@767
|
1579 };
|
n@767
|
1580 this.bufferNode.start(audioContext.currentTime);
|
n@767
|
1581 this.bufferNode.stop(audioContext.currentTime+3);
|
n@767
|
1582 }
|
n@767
|
1583 };
|
n@767
|
1584
|
n@767
|
1585 this.constructTrack = function(file) {
|
n@767
|
1586 var reader = new FileReader();
|
n@767
|
1587 this.file = file;
|
n@767
|
1588 var audioObj = this;
|
n@767
|
1589 // Create callback to decode the data asynchronously
|
n@767
|
1590 reader.onloadend = function() {
|
n@767
|
1591 audioContext.decodeAudioData(reader.result, function(decodedData) {
|
n@767
|
1592 audioObj.bufferObject = decodedData;
|
n@767
|
1593 audioObj.state = 1;
|
n@767
|
1594 }, function(){});
|
n@767
|
1595 };
|
n@767
|
1596 reader.readAsArrayBuffer(file);
|
n@767
|
1597 };
|
n@767
|
1598 };
|
n@767
|
1599
|
n@767
|
1600 function Specification() {
|
n@767
|
1601 // Handles the decoding of the project specification XML into a simple JavaScript Object.
|
n@767
|
1602
|
n@767
|
1603 this.interfaceType = null;
|
n@767
|
1604 this.commonInterface = new function()
|
n@767
|
1605 {
|
n@767
|
1606 this.options = [];
|
n@767
|
1607 this.optionNode = function(input)
|
n@767
|
1608 {
|
n@767
|
1609 var name = input.getAttribute('name');
|
n@767
|
1610 this.type = name;
|
n@767
|
1611 if(this.type == "option")
|
n@767
|
1612 {
|
n@767
|
1613 this.name = input.id;
|
n@767
|
1614 } else if (this.type == "check")
|
n@767
|
1615 {
|
n@767
|
1616 this.check = input.id;
|
n@767
|
1617 }
|
n@767
|
1618 };
|
n@767
|
1619 };
|
n@767
|
1620 this.projectReturn = null;
|
n@767
|
1621 this.randomiseOrder = null;
|
n@767
|
1622 this.collectMetrics = null;
|
n@767
|
1623 this.testPages = null;
|
n@767
|
1624 this.audioHolders = [];
|
n@767
|
1625 this.metrics = [];
|
n@767
|
1626
|
n@767
|
1627 this.decode = function(projectXML) {
|
n@767
|
1628 // projectXML - DOM Parsed document
|
n@767
|
1629 this.projectXML = projectXML.childNodes[0];
|
n@767
|
1630 var setupNode = projectXML.getElementsByTagName('setup')[0];
|
n@767
|
1631 this.interfaceType = setupNode.getAttribute('interface');
|
n@767
|
1632 this.projectReturn = setupNode.getAttribute('projectReturn');
|
n@767
|
1633 this.testPages = setupNode.getAttribute('testPages');
|
n@767
|
1634 if (setupNode.getAttribute('randomiseOrder') == "true") {
|
n@767
|
1635 this.randomiseOrder = true;
|
n@767
|
1636 } else {this.randomiseOrder = false;}
|
n@767
|
1637 if (setupNode.getAttribute('collectMetrics') == "true") {
|
n@767
|
1638 this.collectMetrics = true;
|
n@767
|
1639 } else {this.collectMetrics = false;}
|
n@767
|
1640 if (isNaN(Number(this.testPages)) || this.testPages == undefined)
|
n@767
|
1641 {
|
n@767
|
1642 this.testPages = null;
|
n@767
|
1643 } else {
|
n@767
|
1644 this.testPages = Number(this.testPages);
|
n@767
|
1645 if (this.testPages == 0) {this.testPages = null;}
|
n@767
|
1646 }
|
n@767
|
1647 var metricCollection = setupNode.getElementsByTagName('Metric');
|
n@767
|
1648
|
n@767
|
1649 var setupPreTestNode = setupNode.getElementsByTagName('PreTest');
|
n@767
|
1650 if (setupPreTestNode.length != 0)
|
n@767
|
1651 {
|
n@767
|
1652 setupPreTestNode = setupPreTestNode[0];
|
n@767
|
1653 this.preTest.construct(setupPreTestNode);
|
n@767
|
1654 }
|
n@767
|
1655
|
n@767
|
1656 var setupPostTestNode = setupNode.getElementsByTagName('PostTest');
|
n@767
|
1657 if (setupPostTestNode.length != 0)
|
n@767
|
1658 {
|
n@767
|
1659 setupPostTestNode = setupPostTestNode[0];
|
n@767
|
1660 this.postTest.construct(setupPostTestNode);
|
n@767
|
1661 }
|
n@767
|
1662
|
n@767
|
1663 if (metricCollection.length > 0) {
|
n@767
|
1664 metricCollection = metricCollection[0].getElementsByTagName('metricEnable');
|
n@767
|
1665 for (var i=0; i<metricCollection.length; i++) {
|
n@767
|
1666 this.metrics.push(new this.metricNode(metricCollection[i].textContent));
|
n@767
|
1667 }
|
n@767
|
1668 }
|
n@767
|
1669
|
n@767
|
1670 var commonInterfaceNode = setupNode.getElementsByTagName('interface');
|
n@767
|
1671 if (commonInterfaceNode.length > 0) {
|
n@767
|
1672 commonInterfaceNode = commonInterfaceNode[0];
|
n@767
|
1673 } else {
|
n@767
|
1674 commonInterfaceNode = undefined;
|
n@767
|
1675 }
|
n@767
|
1676
|
n@767
|
1677 this.commonInterface = new function() {
|
n@767
|
1678 this.OptionNode = function(child) {
|
n@767
|
1679 this.type = child.nodeName;
|
n@767
|
1680 if (this.type == 'option')
|
n@767
|
1681 {
|
n@767
|
1682 this.name = child.getAttribute('name');
|
n@767
|
1683 }
|
n@767
|
1684 else if (this.type == 'check') {
|
n@767
|
1685 this.check = child.getAttribute('name');
|
n@767
|
1686 if (this.check == 'scalerange') {
|
n@767
|
1687 this.min = child.getAttribute('min');
|
n@767
|
1688 this.max = child.getAttribute('max');
|
n@767
|
1689 if (this.min == null) {this.min = 1;}
|
n@767
|
1690 else if (Number(this.min) > 1 && this.min != null) {
|
n@767
|
1691 this.min = Number(this.min)/100;
|
n@767
|
1692 } else {
|
n@767
|
1693 this.min = Number(this.min);
|
n@767
|
1694 }
|
n@767
|
1695 if (this.max == null) {this.max = 0;}
|
n@767
|
1696 else if (Number(this.max) > 1 && this.max != null) {
|
n@767
|
1697 this.max = Number(this.max)/100;
|
n@767
|
1698 } else {
|
n@767
|
1699 this.max = Number(this.max);
|
n@767
|
1700 }
|
n@767
|
1701 }
|
n@767
|
1702 } else if (this.type == 'anchor' || this.type == 'reference') {
|
n@767
|
1703 this.value = Number(child.textContent);
|
n@767
|
1704 this.enforce = child.getAttribute('enforce');
|
n@767
|
1705 if (this.enforce == 'true') {this.enforce = true;}
|
n@767
|
1706 else {this.enforce = false;}
|
n@767
|
1707 }
|
n@767
|
1708 };
|
n@767
|
1709 this.options = [];
|
n@767
|
1710 if (commonInterfaceNode != undefined) {
|
n@767
|
1711 var child = commonInterfaceNode.firstElementChild;
|
n@767
|
1712 while (child != undefined) {
|
n@767
|
1713 this.options.push(new this.OptionNode(child));
|
n@767
|
1714 child = child.nextElementSibling;
|
n@767
|
1715 }
|
n@767
|
1716 }
|
n@767
|
1717 };
|
n@767
|
1718
|
n@767
|
1719 var audioHolders = projectXML.getElementsByTagName('audioHolder');
|
n@767
|
1720 for (var i=0; i<audioHolders.length; i++) {
|
n@767
|
1721 var node = new this.audioHolderNode(this);
|
n@767
|
1722 node.decode(this,audioHolders[i]);
|
n@767
|
1723 this.audioHolders.push(node);
|
n@767
|
1724 }
|
n@767
|
1725
|
n@767
|
1726 // New check if we need to randomise the test order
|
n@767
|
1727 if (this.randomiseOrder)
|
n@767
|
1728 {
|
n@767
|
1729 this.audioHolders = randomiseOrder(this.audioHolders);
|
n@767
|
1730 for (var i=0; i<this.audioHolders.length; i++)
|
n@767
|
1731 {
|
n@767
|
1732 this.audioHolders[i].presentedId = i;
|
n@767
|
1733 }
|
n@767
|
1734 }
|
n@767
|
1735
|
n@767
|
1736 if (this.testPages != null || this.testPages != undefined)
|
n@767
|
1737 {
|
n@767
|
1738 if (this.testPages > audioHolders.length)
|
n@767
|
1739 {
|
n@767
|
1740 console.log('Warning: You have specified '+audioHolders.length+' tests but requested '+this.testPages+' be completed!');
|
n@767
|
1741 this.testPages = audioHolders.length;
|
n@767
|
1742 }
|
n@767
|
1743 var aH = this.audioHolders;
|
n@767
|
1744 this.audioHolders = [];
|
n@767
|
1745 for (var i=0; i<this.testPages; i++)
|
n@767
|
1746 {
|
n@767
|
1747 this.audioHolders.push(aH[i]);
|
n@767
|
1748 }
|
n@767
|
1749 }
|
n@767
|
1750 };
|
n@767
|
1751
|
n@767
|
1752 this.encode = function()
|
n@767
|
1753 {
|
n@767
|
1754 var root = document.implementation.createDocument(null,"BrowserEvalProjectDocument");
|
n@767
|
1755 // First get all the <setup> tag compiled
|
n@767
|
1756 var setupNode = root.createElement("setup");
|
n@767
|
1757 setupNode.setAttribute('interface',this.interfaceType);
|
n@767
|
1758 setupNode.setAttribute('projectReturn',this.projectReturn);
|
n@767
|
1759 setupNode.setAttribute('randomiseOrder',this.randomiseOrder);
|
n@767
|
1760 setupNode.setAttribute('collectMetrics',this.collectMetrics);
|
n@767
|
1761 setupNode.setAttribute('testPages',this.testPages);
|
n@767
|
1762
|
n@767
|
1763 var setupPreTest = root.createElement("PreTest");
|
n@767
|
1764 for (var i=0; i<this.preTest.options.length; i++)
|
n@767
|
1765 {
|
n@767
|
1766 setupPreTest.appendChild(this.preTest.options[i].exportXML(root));
|
n@767
|
1767 }
|
n@767
|
1768
|
n@767
|
1769 var setupPostTest = root.createElement("PostTest");
|
n@767
|
1770 for (var i=0; i<this.postTest.options.length; i++)
|
n@767
|
1771 {
|
n@767
|
1772 setupPostTest.appendChild(this.postTest.options[i].exportXML(root));
|
n@767
|
1773 }
|
n@767
|
1774
|
n@767
|
1775 setupNode.appendChild(setupPreTest);
|
n@767
|
1776 setupNode.appendChild(setupPostTest);
|
n@767
|
1777
|
n@767
|
1778 // <Metric> tag
|
n@767
|
1779 var Metric = root.createElement("Metric");
|
n@767
|
1780 for (var i=0; i<this.metrics.length; i++)
|
n@767
|
1781 {
|
n@767
|
1782 var metricEnable = root.createElement("metricEnable");
|
n@767
|
1783 metricEnable.textContent = this.metrics[i].enabled;
|
n@767
|
1784 Metric.appendChild(metricEnable);
|
n@767
|
1785 }
|
n@767
|
1786 setupNode.appendChild(Metric);
|
n@767
|
1787
|
n@767
|
1788 // <interface> tag
|
n@767
|
1789 var CommonInterface = root.createElement("interface");
|
n@767
|
1790 for (var i=0; i<this.commonInterface.options.length; i++)
|
n@767
|
1791 {
|
n@767
|
1792 var CIObj = this.commonInterface.options[i];
|
n@767
|
1793 var CINode = root.createElement(CIObj.type);
|
n@767
|
1794 if (CIObj.type == "check") {CINode.setAttribute("name",CIObj.check);}
|
n@767
|
1795 else {CINode.setAttribute("name",CIObj.name);}
|
n@767
|
1796 CommonInterface.appendChild(CINode);
|
n@767
|
1797 }
|
n@767
|
1798 setupNode.appendChild(CommonInterface);
|
n@767
|
1799
|
n@767
|
1800 root.getElementsByTagName("BrowserEvalProjectDocument")[0].appendChild(setupNode);
|
n@767
|
1801 // Time for the <audioHolder> tags
|
n@767
|
1802 for (var ahIndex = 0; ahIndex < this.audioHolders.length; ahIndex++)
|
n@767
|
1803 {
|
n@767
|
1804 var node = this.audioHolders[ahIndex].encode(root);
|
n@767
|
1805 root.getElementsByTagName("BrowserEvalProjectDocument")[0].appendChild(node);
|
n@767
|
1806 }
|
n@767
|
1807 return root;
|
n@767
|
1808 };
|
n@767
|
1809
|
n@767
|
1810 this.prepostNode = function(type) {
|
n@767
|
1811 this.type = type;
|
n@767
|
1812 this.options = [];
|
n@767
|
1813
|
n@767
|
1814 this.OptionNode = function() {
|
n@767
|
1815
|
n@767
|
1816 this.childOption = function() {
|
n@767
|
1817 this.type = 'option';
|
n@767
|
1818 this.id = null;
|
n@767
|
1819 this.name = undefined;
|
n@767
|
1820 this.text = null;
|
n@767
|
1821 };
|
n@767
|
1822
|
n@767
|
1823 this.type = undefined;
|
n@767
|
1824 this.id = undefined;
|
n@767
|
1825 this.mandatory = undefined;
|
n@767
|
1826 this.question = undefined;
|
n@767
|
1827 this.statement = undefined;
|
n@767
|
1828 this.boxsize = undefined;
|
n@767
|
1829 this.options = [];
|
n@767
|
1830 this.min = undefined;
|
n@767
|
1831 this.max = undefined;
|
n@767
|
1832 this.step = undefined;
|
n@767
|
1833
|
n@767
|
1834 this.decode = function(child)
|
n@767
|
1835 {
|
n@767
|
1836 this.type = child.nodeName;
|
n@767
|
1837 if (child.nodeName == "question") {
|
n@767
|
1838 this.id = child.id;
|
n@767
|
1839 this.mandatory;
|
n@767
|
1840 if (child.getAttribute('mandatory') == "true") {this.mandatory = true;}
|
n@767
|
1841 else {this.mandatory = false;}
|
n@767
|
1842 this.question = child.textContent;
|
n@767
|
1843 if (child.getAttribute('boxsize') == null) {
|
n@767
|
1844 this.boxsize = 'normal';
|
n@767
|
1845 } else {
|
n@767
|
1846 this.boxsize = child.getAttribute('boxsize');
|
n@767
|
1847 }
|
n@767
|
1848 } else if (child.nodeName == "statement") {
|
n@767
|
1849 this.statement = child.textContent;
|
n@767
|
1850 } else if (child.nodeName == "checkbox" || child.nodeName == "radio") {
|
n@767
|
1851 var element = child.firstElementChild;
|
n@767
|
1852 this.id = child.id;
|
n@767
|
1853 if (element == null) {
|
n@767
|
1854 console.log('Malformed' +child.nodeName+ 'entry');
|
n@767
|
1855 this.statement = 'Malformed' +child.nodeName+ 'entry';
|
n@767
|
1856 this.type = 'statement';
|
n@767
|
1857 } else {
|
n@767
|
1858 this.options = [];
|
n@767
|
1859 while (element != null) {
|
n@767
|
1860 if (element.nodeName == 'statement' && this.statement == undefined){
|
n@767
|
1861 this.statement = element.textContent;
|
n@767
|
1862 } else if (element.nodeName == 'option') {
|
n@767
|
1863 var node = new this.childOption();
|
n@767
|
1864 node.id = element.id;
|
n@767
|
1865 node.name = element.getAttribute('name');
|
n@767
|
1866 node.text = element.textContent;
|
n@767
|
1867 this.options.push(node);
|
n@767
|
1868 }
|
n@767
|
1869 element = element.nextElementSibling;
|
n@767
|
1870 }
|
n@767
|
1871 }
|
n@767
|
1872 } else if (child.nodeName == "number") {
|
n@767
|
1873 this.statement = child.textContent;
|
n@767
|
1874 this.id = child.id;
|
n@767
|
1875 this.min = child.getAttribute('min');
|
n@767
|
1876 this.max = child.getAttribute('max');
|
n@767
|
1877 this.step = child.getAttribute('step');
|
n@767
|
1878 }
|
n@767
|
1879 };
|
n@767
|
1880
|
n@767
|
1881 this.exportXML = function(root)
|
n@767
|
1882 {
|
n@767
|
1883 var node = root.createElement(this.type);
|
n@767
|
1884 switch(this.type)
|
n@767
|
1885 {
|
n@767
|
1886 case "statement":
|
n@767
|
1887 node.textContent = this.statement;
|
n@767
|
1888 break;
|
n@767
|
1889 case "question":
|
n@767
|
1890 node.id = this.id;
|
n@767
|
1891 node.setAttribute("mandatory",this.mandatory);
|
n@767
|
1892 node.setAttribute("boxsize",this.boxsize);
|
n@767
|
1893 node.textContent = this.question;
|
n@767
|
1894 break;
|
n@767
|
1895 case "number":
|
n@767
|
1896 node.id = this.id;
|
n@767
|
1897 node.setAttribute("mandatory",this.mandatory);
|
n@767
|
1898 node.setAttribute("min", this.min);
|
n@767
|
1899 node.setAttribute("max", this.max);
|
n@767
|
1900 node.setAttribute("step", this.step);
|
n@768
|
1901 node.textContent = this.statement;
|
n@767
|
1902 break;
|
n@767
|
1903 case "checkbox":
|
n@767
|
1904 node.id = this.id;
|
n@767
|
1905 var statement = root.createElement("statement");
|
n@767
|
1906 statement.textContent = this.statement;
|
n@767
|
1907 node.appendChild(statement);
|
n@767
|
1908 for (var i=0; i<this.options.length; i++)
|
n@767
|
1909 {
|
n@767
|
1910 var option = this.options[i];
|
n@767
|
1911 var optionNode = root.createElement("option");
|
n@767
|
1912 optionNode.id = option.id;
|
n@767
|
1913 optionNode.textContent = option.text;
|
n@767
|
1914 node.appendChild(optionNode);
|
n@767
|
1915 }
|
n@767
|
1916 break;
|
n@767
|
1917 case "radio":
|
n@767
|
1918 node.id = this.id;
|
n@767
|
1919 var statement = root.createElement("statement");
|
n@767
|
1920 statement.textContent = this.statement;
|
n@767
|
1921 node.appendChild(statement);
|
n@767
|
1922 for (var i=0; i<this.options.length; i++)
|
n@767
|
1923 {
|
n@767
|
1924 var option = this.options[i];
|
n@767
|
1925 var optionNode = root.createElement("option");
|
n@767
|
1926 optionNode.setAttribute("name",option.name);
|
n@767
|
1927 optionNode.textContent = option.text;
|
n@767
|
1928 node.appendChild(optionNode);
|
n@767
|
1929 }
|
n@767
|
1930 break;
|
n@767
|
1931 }
|
n@767
|
1932 return node;
|
n@767
|
1933 };
|
n@767
|
1934 };
|
n@767
|
1935 this.construct = function(Collection)
|
n@767
|
1936 {
|
n@767
|
1937 if (Collection.childElementCount != 0) {
|
n@767
|
1938 var child = Collection.firstElementChild;
|
n@767
|
1939 var node = new this.OptionNode();
|
n@767
|
1940 node.decode(child);
|
n@767
|
1941 this.options.push(node);
|
n@767
|
1942 while (child.nextElementSibling != null) {
|
n@767
|
1943 child = child.nextElementSibling;
|
n@767
|
1944 node = new this.OptionNode();
|
n@767
|
1945 node.decode(child);
|
n@767
|
1946 this.options.push(node);
|
n@767
|
1947 }
|
n@767
|
1948 }
|
n@767
|
1949 };
|
n@767
|
1950 };
|
n@767
|
1951 this.preTest = new this.prepostNode("pretest");
|
n@767
|
1952 this.postTest = new this.prepostNode("posttest");
|
n@767
|
1953
|
n@767
|
1954 this.metricNode = function(name) {
|
n@767
|
1955 this.enabled = name;
|
n@767
|
1956 };
|
n@767
|
1957
|
n@767
|
1958 this.audioHolderNode = function(parent) {
|
n@767
|
1959 this.type = 'audioHolder';
|
n@767
|
1960 this.presentedId = undefined;
|
n@767
|
1961 this.id = undefined;
|
n@767
|
1962 this.hostURL = undefined;
|
n@767
|
1963 this.sampleRate = undefined;
|
n@767
|
1964 this.randomiseOrder = undefined;
|
n@767
|
1965 this.loop = undefined;
|
n@767
|
1966 this.elementComments = undefined;
|
n@767
|
1967 this.outsideReference = null;
|
n@767
|
1968 this.preTest = new parent.prepostNode("pretest");
|
n@767
|
1969 this.postTest = new parent.prepostNode("pretest");
|
n@767
|
1970 this.interfaces = [];
|
n@767
|
1971 this.commentBoxPrefix = "Comment on track";
|
n@767
|
1972 this.audioElements = [];
|
n@767
|
1973 this.commentQuestions = [];
|
n@767
|
1974
|
n@767
|
1975 this.decode = function(parent,xml)
|
n@767
|
1976 {
|
n@767
|
1977 this.presentedId = parent.audioHolders.length;
|
n@767
|
1978 this.id = xml.id;
|
n@767
|
1979 this.hostURL = xml.getAttribute('hostURL');
|
n@767
|
1980 this.sampleRate = xml.getAttribute('sampleRate');
|
n@767
|
1981 if (xml.getAttribute('randomiseOrder') == "true") {this.randomiseOrder = true;}
|
n@767
|
1982 else {this.randomiseOrder = false;}
|
n@767
|
1983 this.repeatCount = xml.getAttribute('repeatCount');
|
n@767
|
1984 if (xml.getAttribute('loop') == 'true') {this.loop = true;}
|
n@767
|
1985 else {this.loop == false;}
|
n@767
|
1986 if (xml.getAttribute('elementComments') == "true") {this.elementComments = true;}
|
n@767
|
1987 else {this.elementComments = false;}
|
n@767
|
1988
|
n@767
|
1989 var setupPreTestNode = xml.getElementsByTagName('PreTest');
|
n@767
|
1990 if (setupPreTestNode.length != 0)
|
n@767
|
1991 {
|
n@767
|
1992 setupPreTestNode = setupPreTestNode[0];
|
n@767
|
1993 this.preTest.construct(setupPreTestNode);
|
n@767
|
1994 }
|
n@767
|
1995
|
n@767
|
1996 var setupPostTestNode = xml.getElementsByTagName('PostTest');
|
n@767
|
1997 if (setupPostTestNode.length != 0)
|
n@767
|
1998 {
|
n@767
|
1999 setupPostTestNode = setupPostTestNode[0];
|
n@767
|
2000 this.postTest.construct(setupPostTestNode);
|
n@767
|
2001 }
|
n@767
|
2002
|
n@767
|
2003 var interfaceDOM = xml.getElementsByTagName('interface');
|
n@767
|
2004 for (var i=0; i<interfaceDOM.length; i++) {
|
n@767
|
2005 var node = new this.interfaceNode();
|
n@767
|
2006 node.decode(interfaceDOM[i]);
|
n@767
|
2007 this.interfaces.push(node);
|
n@767
|
2008 }
|
n@767
|
2009 this.commentBoxPrefix = xml.getElementsByTagName('commentBoxPrefix');
|
n@767
|
2010 if (this.commentBoxPrefix.length != 0) {
|
n@767
|
2011 this.commentBoxPrefix = this.commentBoxPrefix[0].textContent;
|
n@767
|
2012 } else {
|
n@767
|
2013 this.commentBoxPrefix = "Comment on track";
|
n@767
|
2014 }
|
n@767
|
2015 var audioElementsDOM = xml.getElementsByTagName('audioElements');
|
n@767
|
2016 for (var i=0; i<audioElementsDOM.length; i++) {
|
n@767
|
2017 var node = new this.audioElementNode();
|
n@769
|
2018 node.decode(this,audioElementsDOM[i]);
|
n@767
|
2019 if (audioElementsDOM[i].getAttribute('type') == 'outsidereference') {
|
n@767
|
2020 if (this.outsideReference == null) {
|
n@769
|
2021 this.outsideReference = node;
|
n@767
|
2022 } else {
|
n@767
|
2023 console.log('Error only one audioelement can be of type outsidereference per audioholder');
|
n@767
|
2024 this.audioElements.push(node);
|
n@767
|
2025 console.log('Element id '+audioElementsDOM[i].id+' made into normal node');
|
n@767
|
2026 }
|
n@767
|
2027 } else {
|
n@767
|
2028 this.audioElements.push(node);
|
n@767
|
2029 }
|
n@767
|
2030 }
|
n@767
|
2031
|
n@767
|
2032 var commentQuestionsDOM = xml.getElementsByTagName('CommentQuestion');
|
n@767
|
2033 for (var i=0; i<commentQuestionsDOM.length; i++) {
|
n@767
|
2034 var node = new this.commentQuestionNode();
|
n@767
|
2035 node.decode(commentQuestionsDOM[i]);
|
n@767
|
2036 this.commentQuestions.push(node);
|
n@767
|
2037 }
|
n@767
|
2038 };
|
n@767
|
2039
|
n@767
|
2040 this.encode = function(root)
|
n@767
|
2041 {
|
n@767
|
2042 var AHNode = root.createElement("audioHolder");
|
n@767
|
2043 AHNode.id = this.id;
|
n@767
|
2044 AHNode.setAttribute("hostURL",this.hostURL);
|
n@767
|
2045 AHNode.setAttribute("sampleRate",this.sampleRate);
|
n@767
|
2046 AHNode.setAttribute("randomiseOrder",this.randomiseOrder);
|
n@767
|
2047 AHNode.setAttribute("repeatCount",this.repeatCount);
|
n@767
|
2048 AHNode.setAttribute("loop",this.loop);
|
n@767
|
2049 AHNode.setAttribute("elementComments",this.elementComments);
|
n@767
|
2050
|
n@767
|
2051 for (var i=0; i<this.interfaces.length; i++)
|
n@767
|
2052 {
|
n@767
|
2053 AHNode.appendChild(this.interfaces[i].encode(root));
|
n@767
|
2054 }
|
n@767
|
2055
|
n@767
|
2056 for (var i=0; i<this.audioElements.length; i++) {
|
n@767
|
2057 AHNode.appendChild(this.audioElements[i].encode(root));
|
n@767
|
2058 }
|
n@767
|
2059 // Create <CommentQuestion>
|
n@767
|
2060 for (var i=0; i<this.commentQuestions.length; i++)
|
n@767
|
2061 {
|
n@767
|
2062 AHNode.appendChild(this.commentQuestions[i].exportXML(root));
|
n@767
|
2063 }
|
n@767
|
2064
|
n@767
|
2065 // Create <PreTest>
|
n@767
|
2066 var AHPreTest = root.createElement("PreTest");
|
n@767
|
2067 for (var i=0; i<this.preTest.options.length; i++)
|
n@767
|
2068 {
|
n@767
|
2069 AHPreTest.appendChild(this.preTest.options[i].exportXML(root));
|
n@767
|
2070 }
|
n@767
|
2071
|
n@767
|
2072 var AHPostTest = root.createElement("PostTest");
|
n@767
|
2073 for (var i=0; i<this.postTest.options.length; i++)
|
n@767
|
2074 {
|
n@767
|
2075 AHPostTest.appendChild(this.postTest.options[i].exportXML(root));
|
n@767
|
2076 }
|
n@767
|
2077 AHNode.appendChild(AHPreTest);
|
n@767
|
2078 AHNode.appendChild(AHPostTest);
|
n@767
|
2079 return AHNode;
|
n@767
|
2080 };
|
n@767
|
2081
|
n@767
|
2082 this.interfaceNode = function() {
|
n@767
|
2083 this.title = undefined;
|
n@767
|
2084 this.options = [];
|
n@767
|
2085 this.scale = [];
|
n@767
|
2086 this.decode = function(DOM)
|
n@767
|
2087 {
|
n@767
|
2088 var title = DOM.getElementsByTagName('title');
|
n@767
|
2089 if (title.length == 0) {this.title = null;}
|
n@767
|
2090 else {this.title = title[0].textContent;}
|
n@767
|
2091 this.options = parent.commonInterface.options;
|
n@767
|
2092 var scale = DOM.getElementsByTagName('scale');
|
n@767
|
2093 this.scale = [];
|
n@767
|
2094 for (var i=0; i<scale.length; i++) {
|
n@767
|
2095 var arr = [null, null];
|
n@767
|
2096 arr[0] = scale[i].getAttribute('position');
|
n@767
|
2097 arr[1] = scale[i].textContent;
|
n@767
|
2098 this.scale.push(arr);
|
n@767
|
2099 }
|
n@767
|
2100 };
|
n@767
|
2101 this.encode = function(root)
|
n@767
|
2102 {
|
n@767
|
2103 var node = root.createElement("interface");
|
n@767
|
2104 if (this.title != undefined)
|
n@767
|
2105 {
|
n@767
|
2106 var title = root.createElement("title");
|
n@767
|
2107 title.textContent = this.title;
|
n@767
|
2108 node.appendChild(title);
|
n@767
|
2109 }
|
n@767
|
2110 for (var i=0; i<this.options.length; i++)
|
n@767
|
2111 {
|
n@767
|
2112 var optionNode = root.createElement(this.options[i].type);
|
n@767
|
2113 if (this.options[i].type == "option")
|
n@767
|
2114 {
|
n@767
|
2115 optionNode.setAttribute("name",this.options[i].name);
|
n@767
|
2116 } else if (this.options[i].type == "check") {
|
n@767
|
2117 optionNode.setAttribute("check",this.options[i].check);
|
n@767
|
2118 } else if (this.options[i].type == "scalerange") {
|
n@767
|
2119 optionNode.setAttribute("min",this.options[i].min*100);
|
n@767
|
2120 optionNode.setAttribute("max",this.options[i].max*100);
|
n@767
|
2121 }
|
n@767
|
2122 node.appendChild(optionNode);
|
n@767
|
2123 }
|
n@767
|
2124 for (var i=0; i<this.scale.length; i++) {
|
n@767
|
2125 var scale = root.createElement("scale");
|
n@767
|
2126 scale.setAttribute("position",this.scale[i][0]);
|
n@767
|
2127 scale.textContent = this.scale[i][1];
|
n@767
|
2128 node.appendChild(scale);
|
n@767
|
2129 }
|
n@767
|
2130 return node;
|
n@767
|
2131 };
|
n@767
|
2132 };
|
n@767
|
2133
|
n@767
|
2134 this.audioElementNode = function() {
|
n@767
|
2135 this.url = null;
|
n@767
|
2136 this.id = null;
|
n@767
|
2137 this.parent = null;
|
n@767
|
2138 this.type = "normal";
|
n@767
|
2139 this.marker = false;
|
n@767
|
2140 this.enforce = false;
|
n@767
|
2141 this.decode = function(parent,xml)
|
n@767
|
2142 {
|
n@767
|
2143 this.url = xml.getAttribute('url');
|
n@767
|
2144 this.id = xml.id;
|
n@767
|
2145 this.parent = parent;
|
n@767
|
2146 this.type = xml.getAttribute('type');
|
n@767
|
2147 if (this.type == null) {this.type = "normal";}
|
n@767
|
2148 if (this.type == 'anchor') {this.anchor = true;}
|
n@767
|
2149 else {this.anchor = false;}
|
n@767
|
2150 if (this.type == 'reference') {this.reference = true;}
|
n@767
|
2151 else {this.reference = false;}
|
n@767
|
2152
|
n@767
|
2153 if (this.anchor == true || this.reference == true)
|
n@767
|
2154 {
|
n@767
|
2155 this.marker = xml.getAttribute('marker');
|
n@767
|
2156 if (this.marker != undefined)
|
n@767
|
2157 {
|
n@767
|
2158 this.marker = Number(this.marker);
|
n@767
|
2159 if (isNaN(this.marker) == false)
|
n@767
|
2160 {
|
n@767
|
2161 if (this.marker > 1)
|
n@767
|
2162 { this.marker /= 100.0;}
|
n@767
|
2163 if (this.marker >= 0 && this.marker <= 1)
|
n@767
|
2164 {
|
n@767
|
2165 this.enforce = true;
|
n@767
|
2166 return;
|
n@767
|
2167 } else {
|
n@767
|
2168 console.log("ERROR - Marker of audioElement "+this.id+" is not between 0 and 1 (float) or 0 and 100 (integer)!");
|
n@767
|
2169 console.log("ERROR - Marker not enforced!");
|
n@767
|
2170 }
|
n@767
|
2171 } else {
|
n@767
|
2172 console.log("ERROR - Marker of audioElement "+this.id+" is not a number!");
|
n@767
|
2173 console.log("ERROR - Marker not enforced!");
|
n@767
|
2174 }
|
n@767
|
2175 }
|
n@767
|
2176 }
|
n@767
|
2177 };
|
n@767
|
2178 this.encode = function(root)
|
n@767
|
2179 {
|
n@767
|
2180 var AENode = root.createElement("audioElements");
|
n@767
|
2181 AENode.id = this.id;
|
n@767
|
2182 AENode.setAttribute("url",this.url);
|
n@767
|
2183 AENode.setAttribute("type",this.type);
|
n@767
|
2184 if (this.marker != false)
|
n@767
|
2185 {
|
n@767
|
2186 AENode.setAttribute("marker",this.marker*100);
|
n@767
|
2187 }
|
n@767
|
2188 return AENode;
|
n@767
|
2189 };
|
n@767
|
2190 };
|
n@767
|
2191
|
n@767
|
2192 this.commentQuestionNode = function(xml) {
|
n@767
|
2193 this.id = null;
|
n@767
|
2194 this.type = undefined;
|
n@767
|
2195 this.question = undefined;
|
n@767
|
2196 this.options = [];
|
n@767
|
2197 this.statement = undefined;
|
n@767
|
2198
|
n@767
|
2199 this.childOption = function() {
|
n@767
|
2200 this.type = 'option';
|
n@767
|
2201 this.name = null;
|
n@767
|
2202 this.text = null;
|
n@767
|
2203 };
|
n@767
|
2204 this.exportXML = function(root)
|
n@767
|
2205 {
|
n@767
|
2206 var CQNode = root.createElement("CommentQuestion");
|
n@767
|
2207 CQNode.id = this.id;
|
n@767
|
2208 CQNode.setAttribute("type",this.type);
|
n@767
|
2209 switch(this.type)
|
n@767
|
2210 {
|
n@767
|
2211 case "text":
|
n@767
|
2212 CQNode.textContent = this.question;
|
n@767
|
2213 break;
|
n@768
|
2214 case "radio":
|
n@768
|
2215 var statement = root.createElement("statement");
|
n@768
|
2216 statement.textContent = this.statement;
|
n@768
|
2217 CQNode.appendChild(statement);
|
n@768
|
2218 for (var i=0; i<this.options.length; i++)
|
n@768
|
2219 {
|
n@768
|
2220 var optionNode = root.createElement("option");
|
n@768
|
2221 optionNode.setAttribute("name",this.options[i].name);
|
n@768
|
2222 optionNode.textContent = this.options[i].text;
|
n@768
|
2223 CQNode.appendChild(optionNode);
|
n@768
|
2224 }
|
n@768
|
2225 break;
|
n@768
|
2226 case "checkbox":
|
n@767
|
2227 var statement = root.createElement("statement");
|
n@767
|
2228 statement.textContent = this.statement;
|
n@767
|
2229 CQNode.appendChild(statement);
|
n@767
|
2230 for (var i=0; i<this.options.length; i++)
|
n@767
|
2231 {
|
n@767
|
2232 var optionNode = root.createElement("option");
|
n@767
|
2233 optionNode.setAttribute("name",this.options[i].name);
|
n@767
|
2234 optionNode.textContent = this.options[i].text;
|
n@767
|
2235 CQNode.appendChild(optionNode);
|
n@767
|
2236 }
|
n@767
|
2237 break;
|
n@767
|
2238 }
|
n@767
|
2239 return CQNode;
|
n@767
|
2240 };
|
n@767
|
2241 this.decode = function(xml) {
|
n@767
|
2242 this.id = xml.id;
|
n@767
|
2243 if (xml.getAttribute('mandatory') == 'true') {this.mandatory = true;}
|
n@767
|
2244 else {this.mandatory = false;}
|
n@767
|
2245 this.type = xml.getAttribute('type');
|
n@767
|
2246 if (this.type == undefined) {this.type = 'text';}
|
n@767
|
2247 switch (this.type) {
|
n@767
|
2248 case 'text':
|
n@767
|
2249 this.question = xml.textContent;
|
n@767
|
2250 break;
|
n@767
|
2251 case 'radio':
|
n@767
|
2252 var child = xml.firstElementChild;
|
n@767
|
2253 this.options = [];
|
n@767
|
2254 while (child != undefined) {
|
n@767
|
2255 if (child.nodeName == 'statement' && this.statement == undefined) {
|
n@767
|
2256 this.statement = child.textContent;
|
n@767
|
2257 } else if (child.nodeName == 'option') {
|
n@767
|
2258 var node = new this.childOption();
|
n@767
|
2259 node.name = child.getAttribute('name');
|
n@767
|
2260 node.text = child.textContent;
|
n@767
|
2261 this.options.push(node);
|
n@767
|
2262 }
|
n@767
|
2263 child = child.nextElementSibling;
|
n@767
|
2264 }
|
n@767
|
2265 break;
|
n@767
|
2266 case 'checkbox':
|
n@767
|
2267 var child = xml.firstElementChild;
|
n@767
|
2268 this.options = [];
|
n@767
|
2269 while (child != undefined) {
|
n@767
|
2270 if (child.nodeName == 'statement' && this.statement == undefined) {
|
n@767
|
2271 this.statement = child.textContent;
|
n@767
|
2272 } else if (child.nodeName == 'option') {
|
n@767
|
2273 var node = new this.childOption();
|
n@767
|
2274 node.name = child.getAttribute('name');
|
n@767
|
2275 node.text = child.textContent;
|
n@767
|
2276 this.options.push(node);
|
n@767
|
2277 }
|
n@767
|
2278 child = child.nextElementSibling;
|
n@767
|
2279 }
|
n@767
|
2280 break;
|
n@767
|
2281 }
|
n@767
|
2282 };
|
n@767
|
2283 };
|
n@767
|
2284 };
|
n@767
|
2285 }
|
n@767
|
2286
|
n@767
|
2287 function createDeleteNodeButton(node)
|
n@767
|
2288 {
|
n@767
|
2289 var button = document.createElement("button");
|
n@767
|
2290 button.textContent = "Delete";
|
n@767
|
2291 button.onclick = function(event)
|
n@767
|
2292 {
|
n@767
|
2293 var node = event.target.parentElement;
|
n@767
|
2294 node.parentElement.removeChild(node);
|
n@767
|
2295 };
|
n@767
|
2296 return button;
|
n@767
|
2297 }
|
n@767
|
2298
|
n@767
|
2299 function SpecificationToHTML()
|
n@767
|
2300 {
|
n@767
|
2301 // Take information from Specification Node and format it into an HTML layout
|
n@767
|
2302 var destination = document.getElementById("content");
|
n@767
|
2303 // Setup Header Node
|
n@767
|
2304 var setupNode = document.createElement("div");
|
n@767
|
2305 setupNode.className = "topLevel";
|
n@767
|
2306 setupNode.name = "setup";
|
n@767
|
2307 var title = document.createElement("h2");
|
n@767
|
2308 title.textContent = "Setup";
|
n@767
|
2309 setupNode.appendChild(title);
|
n@767
|
2310 // Interface Type
|
n@767
|
2311 var div = document.createElement("div");
|
n@767
|
2312 div.name = "attributes";
|
n@767
|
2313 div.style.margin = "5px";
|
n@767
|
2314 var select = document.createElement("select");
|
n@767
|
2315 select.id = "interfaceSelect";
|
n@767
|
2316 select.style.margin = "5px";
|
n@767
|
2317 var option = document.createElement("option");
|
n@767
|
2318 option.value = "APE";
|
n@767
|
2319 option.textContent = "APE";
|
n@767
|
2320 select.appendChild(option);
|
n@767
|
2321 option = document.createElement("option");
|
n@767
|
2322 option.value = "MUSHRA";
|
n@767
|
2323 option.textContent = "MUSHRA";
|
n@767
|
2324 select.appendChild(option);
|
n@767
|
2325 select.value = specificationNode.interfaceType;
|
n@767
|
2326 select.onchange = function(event)
|
n@767
|
2327 {
|
n@767
|
2328 specificationNode.interfaceType = event.currentTarget.value;
|
n@767
|
2329 };
|
n@767
|
2330 var span = document.createElement("span");
|
n@767
|
2331 span.textContent = "Interface Type";
|
n@767
|
2332 div.appendChild(span);
|
n@767
|
2333 div.appendChild(select);
|
n@767
|
2334 // Project Return Attribute
|
n@767
|
2335 span = document.createElement("span");
|
n@767
|
2336 span.style.margin = "5px";
|
n@767
|
2337 span.textContent = "Project Return";
|
n@767
|
2338 var input = document.createElement("input");
|
n@767
|
2339 input.value = specificationNode.projectReturn;
|
n@767
|
2340 input.id = "projectReturn";
|
n@767
|
2341 input.style.margin = "5px";
|
n@767
|
2342 input.onchange = function(event) {
|
n@767
|
2343 specificationNode.projectReturn = event.currentTarget.value;
|
n@767
|
2344 };
|
n@767
|
2345 div.appendChild(span);
|
n@767
|
2346 div.appendChild(input);
|
n@767
|
2347 // Randomise Order
|
n@767
|
2348 span = document.createElement("span");
|
n@767
|
2349 span.textContent = "Randomise Order";
|
n@767
|
2350 input = document.createElement("input");
|
n@767
|
2351 input.id = "randomiseOrder";
|
n@767
|
2352 input.style.margin = "5px";
|
n@767
|
2353 input.type = "checkbox";
|
n@767
|
2354 input.checked = specificationNode.randomiseOrder;
|
n@767
|
2355 input.onchange = function(event) {
|
n@767
|
2356 specificationNode.randomiseOrder = event.currentTarget.checked;
|
n@767
|
2357 };
|
n@767
|
2358 div.appendChild(span);
|
n@767
|
2359 div.appendChild(input);
|
n@767
|
2360 setupNode.appendChild(div);
|
n@767
|
2361
|
n@767
|
2362 // Now create the common Interface Node
|
n@767
|
2363 var commonInterface = document.createElement("div");
|
n@767
|
2364 commonInterface.id = "interface";
|
n@767
|
2365 commonInterface.className = "SecondLevel";
|
n@767
|
2366 var title = document.createElement("h3");
|
n@767
|
2367 title.textContent = "Common Interface";
|
n@767
|
2368 commonInterface.appendChild(title);
|
n@767
|
2369 var div = document.createElement("div");
|
n@767
|
2370 div.name = "attributes";
|
n@767
|
2371 var interfaceOptions;
|
n@767
|
2372 var interfaceChecks;
|
n@767
|
2373 switch(select.value)
|
n@767
|
2374 {
|
n@767
|
2375 case "APE":
|
n@767
|
2376 interfaceOptions = APEInterfaceOptions;
|
n@767
|
2377 interfaceChecks = APEInterfaceChecks;
|
n@767
|
2378 break;
|
n@767
|
2379 case "MUSHRA":
|
n@767
|
2380 interfaceOptions = MUSHRAInterfaceOptions;
|
n@767
|
2381 interfaceChecks = MUSHRAInterfaceChecks;
|
n@767
|
2382 break;
|
n@767
|
2383 }
|
n@767
|
2384 for (var i=0; i<interfaceOptions[0].length; i++)
|
n@767
|
2385 {
|
n@767
|
2386 var span = document.createElement("span");
|
n@767
|
2387 span.textContent = interfaceOptions[1][i];
|
n@767
|
2388 var input = document.createElement("input");
|
n@767
|
2389 input.type = "checkbox";
|
n@767
|
2390 input.id = interfaceOptions[0][i];
|
n@767
|
2391 input.setAttribute("name", "option");
|
n@767
|
2392 div.appendChild(input);
|
n@767
|
2393 div.appendChild(span);
|
n@767
|
2394 commonInterface.appendChild(div);
|
n@767
|
2395 for (var j=0; j<specificationNode.commonInterface.options.length; j++)
|
n@767
|
2396 {
|
n@767
|
2397 if (specificationNode.commonInterface.options[j].name == interfaceOptions[0][i])
|
n@767
|
2398 {
|
n@767
|
2399 input.checked = true;
|
n@767
|
2400 break;
|
n@767
|
2401 }
|
n@767
|
2402 }
|
n@767
|
2403 input.onchange = function(event) {
|
n@767
|
2404 var id = event.currentTarget.id;
|
n@767
|
2405 if (event.currentTarget.checked) {
|
n@767
|
2406 specificationNode.commonInterface.options.push(new specificationNode.commonInterface.optionNode(event.currentTarget));
|
n@767
|
2407 } else {
|
n@767
|
2408 for (var j=0; j<specificationNode.commonInterface.options.length; j++)
|
n@767
|
2409 {
|
n@767
|
2410 if (specificationNode.commonInterface.options[j].name == event.currentTarget.id)
|
n@767
|
2411 {
|
n@767
|
2412 specificationNode.commonInterface.options.splice(j,1);
|
n@767
|
2413 break;
|
n@767
|
2414 }
|
n@767
|
2415 }
|
n@767
|
2416 }
|
n@767
|
2417 };
|
n@767
|
2418 }
|
n@767
|
2419 for (var i=0; i<interfaceChecks[0].length; i++)
|
n@767
|
2420 {
|
n@767
|
2421 var span = document.createElement("span");
|
n@767
|
2422 span.textContent = interfaceChecks[1][i];
|
n@767
|
2423 var input = document.createElement("input");
|
n@767
|
2424 input.type = "checkbox";
|
n@767
|
2425 input.id = interfaceChecks[0][i];
|
n@767
|
2426 input.setAttribute("name", "check");
|
n@767
|
2427 div.appendChild(input);
|
n@767
|
2428 div.appendChild(span);
|
n@767
|
2429 commonInterface.appendChild(div);
|
n@767
|
2430 for (var j=0; j<specificationNode.commonInterface.options.length; j++)
|
n@767
|
2431 {
|
n@767
|
2432 if (specificationNode.commonInterface.options[j].check == interfaceChecks[0][i])
|
n@767
|
2433 {
|
n@767
|
2434 input.checked = true;
|
n@767
|
2435 break;
|
n@767
|
2436 }
|
n@767
|
2437 }
|
n@767
|
2438 input.onchange = function(event) {
|
n@767
|
2439 var id = event.currentTarget.id;
|
n@767
|
2440 if (event.currentTarget.checked) {
|
n@767
|
2441 specificationNode.commonInterface.options.push(new specificationNode.commonInterface.optionNode(event.currentTarget));
|
n@767
|
2442 } else {
|
n@767
|
2443 for (var j=0; j<specificationNode.commonInterface.options.length; j++)
|
n@767
|
2444 {
|
n@767
|
2445 if (specificationNode.commonInterface.options[j].name == event.currentTarget.id)
|
n@767
|
2446 {
|
n@767
|
2447 specificationNode.commonInterface.options.splice(j,1);
|
n@767
|
2448 break;
|
n@767
|
2449 }
|
n@767
|
2450 }
|
n@767
|
2451 }
|
n@767
|
2452 };
|
n@767
|
2453 }
|
n@767
|
2454 setupNode.appendChild(commonInterface);
|
n@767
|
2455 // Now the Metric Node
|
n@767
|
2456 var metrics = document.createElement("div");
|
n@767
|
2457 metrics.id = "metrics";
|
n@767
|
2458 metrics.className = "SecondLevel";
|
n@767
|
2459 var title = document.createElement("h3");
|
n@767
|
2460 title.textContent = "Metric Collections";
|
n@767
|
2461 metrics.appendChild(title);
|
n@767
|
2462 var div = document.createElement("div");
|
n@767
|
2463 div.name = "attributes";
|
n@767
|
2464 metrics.appendChild(div);
|
n@767
|
2465 var supportedMetrics;
|
n@767
|
2466 switch(select.value)
|
n@767
|
2467 {
|
n@767
|
2468 case "APE":
|
n@767
|
2469 supportedMetrics = APEInterfaceMetrics;
|
n@767
|
2470 break;
|
n@767
|
2471 case "MUSHRA":
|
n@767
|
2472 supportedMetrics = MUSHRAInterfaceMetrics;
|
n@767
|
2473 break;
|
n@767
|
2474 }
|
n@767
|
2475
|
n@767
|
2476 for (var i=0; i<supportedMetrics[0].length; i++)
|
n@767
|
2477 {
|
n@767
|
2478 var span = document.createElement("span");
|
n@767
|
2479 span.textContent = supportedMetrics[1][i];
|
n@767
|
2480 var input = document.createElement("input");
|
n@767
|
2481 input.type = "checkbox";
|
n@767
|
2482 input.id = supportedMetrics[0][i];
|
n@767
|
2483 div.appendChild(input);
|
n@767
|
2484 div.appendChild(span);
|
n@767
|
2485 for (var j=0; j<specificationNode.metrics.length; j++)
|
n@767
|
2486 {
|
n@767
|
2487 if (specificationNode.metrics[j].enabled == supportedMetrics[0][i])
|
n@767
|
2488 {
|
n@767
|
2489 input.checked = true;
|
n@767
|
2490 }
|
n@767
|
2491 }
|
n@767
|
2492 input.onchange = function(event)
|
n@767
|
2493 {
|
n@767
|
2494 if (event.currentTarget.checked) {
|
n@767
|
2495 specificationNode.metrics.push(new specificationNode.metricNode(event.currentTarget.id));
|
n@767
|
2496 } else {
|
n@767
|
2497 for (var j=0; j<specificationNode.metrics.length; j++)
|
n@767
|
2498 {
|
n@767
|
2499 if (specificationNode.metrics[j].enabled == event.currentTarget.id)
|
n@767
|
2500 {
|
n@767
|
2501 specificationNode.metrics.splice(j,1);
|
n@767
|
2502 break;
|
n@767
|
2503 }
|
n@767
|
2504 }
|
n@767
|
2505 }
|
n@767
|
2506 };
|
n@767
|
2507 }
|
n@767
|
2508
|
n@767
|
2509 setupNode.appendChild(metrics);
|
n@767
|
2510
|
n@767
|
2511 // Test Session Pre Test
|
n@767
|
2512 var preTest = document.createElement("div");
|
n@767
|
2513 preTest.id = "preTest";
|
n@767
|
2514 preTest.className = "SecondLevel";
|
n@767
|
2515 var title = document.createElement("h3");
|
n@767
|
2516 title.textContent = "Pre test Survey";
|
n@767
|
2517 preTest.appendChild(title);
|
n@767
|
2518 var div = document.createElement("div");
|
n@767
|
2519 div.name = "attributes";
|
n@767
|
2520 for (var j=0; j<specificationNode.preTest.options.length; j++)
|
n@767
|
2521 {
|
n@767
|
2522 var node = PPSurveyToHTML(specificationNode.preTest.options[j]);
|
n@767
|
2523 node.className = "SecondLevel";
|
n@767
|
2524 node.id = preTest.id+"-"+j;
|
n@767
|
2525 var del_button = document.createElement("button");
|
n@767
|
2526 del_button.textContent = "Delete";
|
n@767
|
2527 del_button.onclick = function(event) {
|
n@767
|
2528 var node = event.currentTarget.parentElement;
|
n@767
|
2529 var id = node.id.split("-")[1];
|
n@767
|
2530 specificationNode.preTest.options.splice(id,1);
|
n@767
|
2531 node.parentElement.removeChild(node);
|
n@767
|
2532 };
|
n@767
|
2533 node.appendChild(del_button);
|
n@767
|
2534 preTest.appendChild(node);
|
n@767
|
2535 }
|
n@767
|
2536 setupNode.appendChild(preTest);
|
n@767
|
2537
|
n@767
|
2538 // Test Session Post Test
|
n@767
|
2539 var postTest = document.createElement("div");
|
n@767
|
2540 postTest.id = "postTest";
|
n@767
|
2541 postTest.className = "SecondLevel";
|
n@767
|
2542 var title = document.createElement("h3");
|
n@767
|
2543 title.textContent = "Post test Survey";
|
n@767
|
2544 postTest.appendChild(title);
|
n@767
|
2545 var div = document.createElement("div");
|
n@767
|
2546 div.name = "attributes";
|
n@767
|
2547
|
n@767
|
2548 for (var j=0; j<specificationNode.postTest.options.length; j++)
|
n@767
|
2549 {
|
n@767
|
2550 var node = PPSurveyToHTML(specificationNode.postTest.options[j]);
|
n@767
|
2551 node.className = "SecondLevel";
|
n@767
|
2552 node.id = postTest.id+"-"+j;
|
n@767
|
2553 var del_button = document.createElement("button");
|
n@767
|
2554 del_button.textContent = "Delete";
|
n@767
|
2555 del_button.onclick = function(event) {
|
n@767
|
2556 var node = event.currentTarget.parentElement;
|
n@767
|
2557 var id = node.id.split("-")[1];
|
n@767
|
2558 specificationNode.postTest.options.splice(id,1);
|
n@767
|
2559 node.parentElement.removeChild(node);
|
n@767
|
2560 };
|
n@767
|
2561 node.appendChild(del_button);
|
n@767
|
2562 postTest.appendChild(node);
|
n@767
|
2563 }
|
n@767
|
2564
|
n@767
|
2565 setupNode.appendChild(postTest);
|
n@767
|
2566
|
n@767
|
2567 destination.appendChild(setupNode);
|
n@767
|
2568
|
n@767
|
2569 // Now we step through the AudioHolders
|
n@767
|
2570 for (var i=0; i<specificationNode.audioHolders.length; i++)
|
n@767
|
2571 {
|
n@767
|
2572 var aH = specificationNode.audioHolders[i];
|
n@767
|
2573 var aHTML = document.createElement("div");
|
n@767
|
2574 aHTML.name = "audioHolder";
|
n@767
|
2575 aHTML.id = "audioHolder-"+i;
|
n@767
|
2576 aHTML.className = "topLevel";
|
n@767
|
2577 aHTML.appendChild(createDeleteNodeButton());
|
n@767
|
2578 destination.appendChild(aHTML);
|
n@767
|
2579 var title = document.createElement("h2");
|
n@767
|
2580 title.textContent = "Audio Holder "+aH.id;
|
n@767
|
2581 aHTML.appendChild(title);
|
n@767
|
2582 var attributes = document.createElement("div");
|
n@767
|
2583 attributes.name = "attributes";
|
n@767
|
2584 aHTML.appendChild(attributes);
|
n@767
|
2585 var text = document.createElement("span");
|
n@767
|
2586 text.textContent = "ID: ";
|
n@767
|
2587 var input = document.createElement("input");
|
n@767
|
2588 input.id = aHTML.id+"-id";
|
n@767
|
2589 input.value = aH.id;
|
n@767
|
2590 input.onchange = function()
|
n@767
|
2591 {
|
n@767
|
2592 var IDSplit = event.currentTarget.id.split('-');
|
n@767
|
2593 var aholderID = IDSplit[0]+"-"+IDSplit[1];
|
n@767
|
2594 var aholder = document.getElementById(aholderID);
|
n@767
|
2595 title = aholder.getElementsByTagName("h2")[0];
|
n@767
|
2596 title.textContent = "Audio Holder "+event.currentTarget.value;
|
n@767
|
2597 specificationNode.audioHolders[IDSplit[1]].id = event.currentTarget.value;
|
n@767
|
2598 };
|
n@767
|
2599 text.style.margin = "5px";
|
n@767
|
2600 input.style.margin = "5px";
|
n@767
|
2601 attributes.appendChild(text);
|
n@767
|
2602 attributes.appendChild(input);
|
n@767
|
2603 text = document.createElement("span");
|
n@767
|
2604 text.textContent = "Host URL: ";
|
n@767
|
2605 input = document.createElement("input");
|
n@767
|
2606 input.id = aHTML.id+"-hostURL";
|
n@767
|
2607 input.value = aH.hostURL;
|
n@767
|
2608 input.onchange = function()
|
n@767
|
2609 {
|
n@767
|
2610 var IDSplit = event.currentTarget.id.split('-');
|
n@767
|
2611 specificationNode.audioHolders[IDSplit[1]].hostURL = event.currentTarget.value;
|
n@767
|
2612 };
|
n@767
|
2613 text.style.margin = "5px";
|
n@767
|
2614 input.style.margin = "5px";
|
n@767
|
2615 attributes.appendChild(text);
|
n@767
|
2616 attributes.appendChild(input);
|
n@767
|
2617 text = document.createElement("span");
|
n@767
|
2618 text.textContent = "Loop Fragments: ";
|
n@767
|
2619 input = document.createElement("input");
|
n@767
|
2620 input.id = aHTML.id+"-loop";
|
n@767
|
2621 input.type = "checkbox";
|
n@767
|
2622 input.checked = aH.loop;
|
n@767
|
2623 input.onchange = function()
|
n@767
|
2624 {
|
n@767
|
2625 var IDSplit = event.currentTarget.id.split('-');
|
n@767
|
2626 specificationNode.audioHolders[IDSplit[1]].loop = event.currentTarget.checked;
|
n@767
|
2627 };
|
n@767
|
2628 text.style.margin = "5px";
|
n@767
|
2629 input.style.margin = "5px";
|
n@767
|
2630 attributes.appendChild(text);
|
n@767
|
2631 attributes.appendChild(input);
|
n@767
|
2632 text = document.createElement("span");
|
n@767
|
2633 text.textContent = "Randomise Order: ";
|
n@767
|
2634 input = document.createElement("input");
|
n@767
|
2635 input.id = aHTML.id+"-randomiseOrder";
|
n@767
|
2636 input.type = "checkbox";
|
n@767
|
2637 input.checked = aH.randomiseOrder;
|
n@767
|
2638 input.onchange = function()
|
n@767
|
2639 {
|
n@767
|
2640 var IDSplit = event.currentTarget.id.split('-');
|
n@767
|
2641 specificationNode.audioHolders[IDSplit[1]].randomiseOrder = event.currentTarget.checked;
|
n@767
|
2642 };
|
n@767
|
2643 text.style.margin = "5px";
|
n@767
|
2644 input.style.margin = "5px";
|
n@767
|
2645 attributes.appendChild(text);
|
n@767
|
2646 attributes.appendChild(input);
|
n@767
|
2647 text = document.createElement("span");
|
n@767
|
2648 text.textContent = "Show Fragment Comments";
|
n@767
|
2649 input = document.createElement("input");
|
n@767
|
2650 input.id = aHTML.id+"-elementComments";
|
n@767
|
2651 input.type = "checkbox";
|
n@767
|
2652 input.checked = aH.elementComments;
|
n@767
|
2653 input.onchange = function()
|
n@767
|
2654 {
|
n@767
|
2655 var IDSplit = event.currentTarget.id.split('-');
|
n@767
|
2656 specificationNode.audioHolders[IDSplit[1]].elementComments = event.currentTarget.checked;
|
n@767
|
2657 };
|
n@767
|
2658 text.style.margin = "5px";
|
n@767
|
2659 input.style.margin = "5px";
|
n@767
|
2660 attributes.appendChild(text);
|
n@767
|
2661 attributes.appendChild(input);
|
n@767
|
2662
|
n@767
|
2663 // Test Session Pre Test
|
n@767
|
2664 var preTest = document.createElement("div");
|
n@767
|
2665 preTest.id = aHTML.id+"-pretest";
|
n@767
|
2666 preTest.className = "SecondLevel";
|
n@767
|
2667 var title = document.createElement("h3");
|
n@767
|
2668 title.textContent = "Pre test Survey";
|
n@767
|
2669 preTest.appendChild(title);
|
n@767
|
2670 var div = document.createElement("div");
|
n@767
|
2671 div.name = "attributes";
|
n@767
|
2672
|
n@767
|
2673 for (var j=0; j<aH.preTest.options.length; j++)
|
n@767
|
2674 {
|
n@767
|
2675 var node = PPSurveyToHTML(aH.preTest.options[j]);
|
n@767
|
2676 node.className = "SecondLevel";
|
n@767
|
2677 node.id = preTest.id+"-"+j;
|
n@767
|
2678 var button_delete = document.createElement("button");
|
n@767
|
2679 button_delete.textContent = "Delete";
|
n@767
|
2680 button_delete.onclick = function(event)
|
n@767
|
2681 {
|
n@767
|
2682 var node = event.currentTarget.parentElement;
|
n@767
|
2683 var IDSplit = node.id.split("-");
|
n@767
|
2684 var preTest = specificationNode.audioHolders[IDSplit[1]].preTest;
|
n@767
|
2685 preTest.options.splice(IDSplit[3],1);
|
n@767
|
2686 node.parentElement.removeChild(node);
|
n@767
|
2687 };
|
n@767
|
2688 node.appendChild(button_delete);
|
n@767
|
2689 preTest.appendChild(node);
|
n@767
|
2690 }
|
n@767
|
2691
|
n@767
|
2692 aHTML.appendChild(preTest);
|
n@767
|
2693
|
n@767
|
2694 // Test Session Post Test
|
n@767
|
2695 var postTest = document.createElement("div");
|
n@767
|
2696 postTest.id = aHTML.id+"-postTest";
|
n@767
|
2697 postTest.className = "SecondLevel";
|
n@767
|
2698 var title = document.createElement("h3");
|
n@767
|
2699 title.textContent = "Post test Survey";
|
n@767
|
2700 postTest.appendChild(title);
|
n@767
|
2701 var div = document.createElement("div");
|
n@767
|
2702 div.name = "attributes";
|
n@767
|
2703
|
n@767
|
2704 for (var j=0; j<aH.postTest.options.length; j++)
|
n@767
|
2705 {
|
n@767
|
2706 var node = PPSurveyToHTML(aH.postTest.options[j]);
|
n@767
|
2707 node.className = "SecondLevel";
|
n@767
|
2708 node.id = postTest.id+"-"+j;
|
n@767
|
2709 var button_delete = document.createElement("button");
|
n@767
|
2710 button_delete.textContent = "Delete";
|
n@767
|
2711 button_delete.onclick = function(event)
|
n@767
|
2712 {
|
n@767
|
2713 var node = event.currentTarget.parentElement;
|
n@767
|
2714 var IDSplit = node.id.split("-");
|
n@767
|
2715 var postTest = specificationNode.audioHolders[IDSplit[1]].postTest;
|
n@767
|
2716 postTest.options.splice(IDSplit[3],1);
|
n@767
|
2717 node.parentElement.removeChild(node);
|
n@767
|
2718 };
|
n@767
|
2719 node.appendChild(button_delete);
|
n@767
|
2720 postTest.appendChild(node);
|
n@767
|
2721 }
|
n@767
|
2722
|
n@767
|
2723 aHTML.appendChild(postTest);
|
n@767
|
2724
|
n@767
|
2725 //Audio Elements
|
n@767
|
2726 var audioElems = document.createElement("div");
|
n@767
|
2727 audioElems.id = aHTML.id+"-audioElements";
|
n@767
|
2728 audioElems.className = "SecondLevel";
|
n@767
|
2729 var title = document.createElement("h3");
|
n@767
|
2730 title.textContent = "Audio Elements";
|
n@767
|
2731 audioElems.appendChild(title);
|
n@767
|
2732 for (var i=0; i<aH.audioElements.length; i++)
|
n@767
|
2733 {
|
n@767
|
2734 var entry = document.createElement("div");
|
n@767
|
2735 entry.className = "SecondLevel";
|
n@767
|
2736 entry.id = audioElems.id+"-"+aH.audioElements[i].id;
|
n@767
|
2737 var text = document.createElement("span");
|
n@767
|
2738 text.textContent = "ID:";
|
n@767
|
2739 var input = document.createElement("input");
|
n@767
|
2740 input.id = entry.id+"-id";
|
n@767
|
2741 input.value = aH.audioElements[i].id;
|
n@767
|
2742 input.onchange = function() {
|
n@767
|
2743 var IDSplit = event.currentTarget.id.split("-");
|
n@767
|
2744 var ahNode = specificationNode.audioHolders[IDSplit[1]];
|
n@767
|
2745 ahNode.audioElements[IDSplit[3]].id = event.currentTarget.value;
|
n@767
|
2746 };
|
n@767
|
2747 text.style.margin = "5px";
|
n@767
|
2748 input.style.margin = "5px";
|
n@767
|
2749 entry.appendChild(text);
|
n@767
|
2750 entry.appendChild(input);
|
n@767
|
2751 text = document.createElement("span");
|
n@767
|
2752 text.textContent = "URL:";
|
n@767
|
2753 input = document.createElement("input");
|
n@767
|
2754 input.id = entry.id+"-URL";
|
n@767
|
2755 input.value = aH.audioElements[i].url;
|
n@767
|
2756 input.onchange = function() {
|
n@767
|
2757 var IDSplit = event.currentTarget.id.split("-");
|
n@767
|
2758 var ahNode = specificationNode.audioHolders[IDSplit[1]];
|
n@767
|
2759 ahNode.audioElements[IDSplit[3]].url = event.currentTarget.value;
|
n@767
|
2760 };
|
n@767
|
2761 text.style.margin = "5px";
|
n@767
|
2762 input.style.margin = "5px";
|
n@767
|
2763 entry.appendChild(text);
|
n@767
|
2764 entry.appendChild(input);
|
n@767
|
2765 var button_delete = document.createElement("button");
|
n@767
|
2766 button_delete.textContent = "Delete";
|
n@767
|
2767 button_delete.onclick = function() {
|
n@767
|
2768 var node = event.currentTarget.parentElement;
|
n@767
|
2769 var IDSplit = node.id.split("-");
|
n@767
|
2770 var ahNode = specificationNode.audioHolders[IDSplit[1]];
|
n@767
|
2771 ahNode.audioElements.splice(IDSplit[3],1);
|
n@767
|
2772 node.parentElement.removeChild(node);
|
n@767
|
2773 };
|
n@767
|
2774 entry.appendChild(button_delete);
|
n@767
|
2775 audioElems.appendChild(entry);
|
n@767
|
2776 }
|
n@767
|
2777 aHTML.appendChild(audioElems);
|
n@767
|
2778 }
|
n@767
|
2779
|
n@767
|
2780 function PPSurveyToHTML(node)
|
n@767
|
2781 {
|
n@767
|
2782 var holder = document.createElement("div");
|
n@767
|
2783 var title = document.createElement("h4");
|
n@767
|
2784 holder.appendChild(title);
|
n@767
|
2785 var attributes = document.createElement("div");
|
n@767
|
2786 holder.appendChild(attributes);
|
n@767
|
2787 switch(node.type)
|
n@767
|
2788 {
|
n@767
|
2789 case "statement":
|
n@767
|
2790 title.textContent = "Statement";
|
n@767
|
2791 var tA = document.createElement("textarea");
|
n@767
|
2792 attributes.style.height = "150px";
|
n@767
|
2793 tA.style.width = "500px";
|
n@767
|
2794 tA.style.height = "100px";
|
n@767
|
2795 tA.value = node.statement;
|
n@767
|
2796 attributes.appendChild(tA);
|
n@767
|
2797 break;
|
n@767
|
2798 case "question":
|
n@767
|
2799 title.textContent = "Question";
|
n@767
|
2800 var text = document.createElement("span");
|
n@767
|
2801 text.textContent = "ID :";
|
n@767
|
2802 var input = document.createElement("input");
|
n@767
|
2803 input.name = "id";
|
n@767
|
2804 input.value = node.id;
|
n@767
|
2805 text.style.margin = "5px";
|
n@767
|
2806 input.style.margin = "5px";
|
n@767
|
2807 attributes.appendChild(text);
|
n@767
|
2808 attributes.appendChild(input);
|
n@767
|
2809 text = document.createElement("span");
|
n@767
|
2810 text.textContent = "Question";
|
n@767
|
2811 input = document.createElement("input");
|
n@767
|
2812 input.name = "question";
|
n@767
|
2813 input.style.width = "400px";
|
n@767
|
2814 input.value = node.question;
|
n@767
|
2815 text.style.margin = "5px";
|
n@767
|
2816 input.style.margin = "5px";
|
n@767
|
2817 attributes.appendChild(text);
|
n@767
|
2818 attributes.appendChild(input);
|
n@767
|
2819 text = document.createElement("span");
|
n@767
|
2820 text.textContent = "Mandatory";
|
n@767
|
2821 input = document.createElement("input");
|
n@767
|
2822 input.name = "mandatory";
|
n@767
|
2823 input.type = "checkbox";
|
n@767
|
2824 input.checked = node.mandatory;
|
n@767
|
2825 text.style.margin = "5px";
|
n@767
|
2826 input.style.margin = "5px";
|
n@767
|
2827 attributes.appendChild(text);
|
n@767
|
2828 attributes.appendChild(input);
|
n@767
|
2829 text = document.createElement("span");
|
n@767
|
2830 text.textContent = "Reply box size";
|
n@767
|
2831 input = document.createElement("select");
|
n@767
|
2832 input.name = "boxsize";
|
n@767
|
2833 var option = document.createElement("option");
|
n@767
|
2834 option.textContent = "Normal";
|
n@767
|
2835 option.value = "normal";
|
n@767
|
2836 input.appendChild(option);
|
n@767
|
2837 option = document.createElement("option");
|
n@767
|
2838 option.textContent = "Large";
|
n@767
|
2839 option.value = "large";
|
n@767
|
2840 input.appendChild(option);
|
n@767
|
2841 option = document.createElement("option");
|
n@767
|
2842 option.textContent = "Small";
|
n@767
|
2843 option.value = "small";
|
n@767
|
2844 input.appendChild(option);
|
n@767
|
2845 option = document.createElement("option");
|
n@767
|
2846 option.textContent = "Huge";
|
n@767
|
2847 option.value = "huge";
|
n@767
|
2848 input.appendChild(option);
|
n@767
|
2849 text.style.margin = "5px";
|
n@767
|
2850 input.style.margin = "5px";
|
n@767
|
2851 attributes.appendChild(text);
|
n@767
|
2852 attributes.appendChild(input);
|
n@767
|
2853 input.value = node.boxsize;
|
n@767
|
2854 break;
|
n@767
|
2855 }
|
n@767
|
2856 return holder;
|
n@767
|
2857 }
|
n@767
|
2858 }
|
n@767
|
2859 function exportToXML()
|
n@767
|
2860 {
|
n@767
|
2861 var xmlDoc = specificationNode.encode();
|
n@767
|
2862 var oSerializer = new XMLSerializer();
|
n@767
|
2863 xmlDoc = oSerializer.serializeToString(xmlDoc);
|
n@767
|
2864 var parent = document.createElement("div");
|
n@767
|
2865 var file = [xmlDoc];
|
n@767
|
2866 var bb = new Blob(file,{type : 'application/xml'});
|
n@767
|
2867 var dnlk = window.URL.createObjectURL(bb);
|
n@767
|
2868 var a = document.createElement("a");
|
n@767
|
2869 a.hidden = '';
|
n@767
|
2870 a.href = dnlk;
|
n@767
|
2871 a.download = "save.xml";
|
n@767
|
2872 a.textContent = "Save File";
|
n@767
|
2873
|
n@767
|
2874 popupInstance.showPopup();
|
n@767
|
2875 popupInstance.popupBody.innerHTML = null;
|
n@767
|
2876 var body = document.createElement("span");
|
n@767
|
2877 body.textContent = "Right click and save the file using the link below. Place this file in your WAET directory as 'project.xml' in the example_eval/ directory. Place your media files in the location specified by the Host URL entries. If you wish to review this XML or edit it, refresh this tool and drag your XML document into the page on the welcome screen.";
|
n@767
|
2878 popupInstance.popupBody.appendChild(body);
|
n@767
|
2879 popupInstance.popupBody.appendChild(a);
|
n@767
|
2880 popupInstance.popupTitle.innerHTML = "<span>Thank You</span>";
|
n@767
|
2881 }
|
n@767
|
2882 </script>
|
n@767
|
2883 <style>
|
n@767
|
2884 div.popup {
|
n@767
|
2885 width: 500px;
|
n@767
|
2886 position: absolute;
|
n@767
|
2887 height: 400px;
|
n@767
|
2888 background-color: #fff;
|
n@767
|
2889 border-radius: 10px;
|
n@767
|
2890 box-shadow: 0px 0px 50px #000;
|
n@767
|
2891 z-index: 2;
|
n@767
|
2892 }
|
n@767
|
2893
|
n@767
|
2894 button.popupButton {
|
n@767
|
2895 /* Button for popup window
|
n@767
|
2896 */
|
n@767
|
2897 min-width: 50px;
|
n@767
|
2898 height: 25px;
|
n@767
|
2899 position: relative;
|
n@767
|
2900 border-radius: 5px;
|
n@767
|
2901 border: #444;
|
n@767
|
2902 border-width: 1px;
|
n@767
|
2903 border-style: solid;
|
n@767
|
2904 background-color: #fff;
|
n@767
|
2905 }
|
n@767
|
2906
|
n@767
|
2907 div.dragndrop {
|
n@767
|
2908 margin-top: 10px;
|
n@767
|
2909 border:#000000;
|
n@767
|
2910 border-style: dashed;
|
n@767
|
2911 border-width: 2px;
|
n@767
|
2912 }
|
n@767
|
2913 div.dndheaderelement {
|
n@767
|
2914 float: left;
|
n@767
|
2915 height: 100%;
|
n@767
|
2916 border-right: #DDDDDD;
|
n@767
|
2917 border-right-width: 1px;
|
n@767
|
2918 border-right-style: solid;
|
n@767
|
2919 }
|
n@767
|
2920 div.dndheaderelement span{
|
n@767
|
2921 padding-left: 5px;
|
n@767
|
2922 }
|
n@767
|
2923
|
n@767
|
2924 div.topLevel {
|
n@767
|
2925 border: #000;
|
n@767
|
2926 border-style: solid;
|
n@767
|
2927 border-width: 5px;
|
n@767
|
2928 padding: 10px;
|
n@767
|
2929 margin: 10px;
|
n@767
|
2930 }
|
n@767
|
2931
|
n@767
|
2932 div.SecondLevel {
|
n@767
|
2933 border: #000;
|
n@767
|
2934 border-style: solid;
|
n@767
|
2935 border-width: 1px;
|
n@767
|
2936 padding: 10px;
|
n@767
|
2937 margin: 10px;
|
n@767
|
2938 }
|
n@767
|
2939 </style>
|
n@767
|
2940 </head>
|
n@767
|
2941
|
n@767
|
2942 <body>
|
n@767
|
2943 <div id="export">
|
n@767
|
2944 <button id="exportToXML" onclick="exportToXML();">Export XML</button>
|
n@767
|
2945 </div>
|
n@767
|
2946 <div id="content"></div>
|
n@767
|
2947 </body>
|
n@767
|
2948 </html>
|