comparison interfaces/AB.js @ 2538:464c6c6692d6

Beautified entire project.
author Nicholas Jillings <nicholas.jillings@mail.bcu.ac.uk>
date Mon, 14 Nov 2016 14:17:03 +0000
parents 42abe6eddfb5
children e352d52f9237 1c8aac0ee5e9
comparison
equal deleted inserted replaced
2536:527020a63203 2538:464c6c6692d6
1 // Once this is loaded and parsed, begin execution 1 // Once this is loaded and parsed, begin execution
2 loadInterface(); 2 loadInterface();
3 3
4 function loadInterface() { 4 function loadInterface() {
5 // Get the dimensions of the screen available to the page 5 // Get the dimensions of the screen available to the page
6 var width = window.innerWidth; 6 var width = window.innerWidth;
7 var height = window.innerHeight; 7 var height = window.innerHeight;
8 interfaceContext.insertPoint.innerHTML = ""; // Clear the current schema 8 interfaceContext.insertPoint.innerHTML = ""; // Clear the current schema
9 9
10 // Custom comparator Object 10 // Custom comparator Object
11 Interface.prototype.comparator = null; 11 Interface.prototype.comparator = null;
12 12
13 Interface.prototype.checkScaleRange = function(min, max) { 13 Interface.prototype.checkScaleRange = function (min, max) {
14 var page = testState.getCurrentTestPage(); 14 var page = testState.getCurrentTestPage();
15 var audioObjects = audioEngineContext.audioObjects; 15 var audioObjects = audioEngineContext.audioObjects;
16 var state = true; 16 var state = true;
17 var str = "Please keep listening. "; 17 var str = "Please keep listening. ";
18 var minRanking = Infinity; 18 var minRanking = Infinity;
19 var maxRanking = -Infinity; 19 var maxRanking = -Infinity;
20 for (var ao of audioObjects) { 20 for (var ao of audioObjects) {
21 var rank = ao.interfaceDOM.getValue(); 21 var rank = ao.interfaceDOM.getValue();
22 if (rank < minRanking) {minRanking = rank;} 22 if (rank < minRanking) {
23 if (rank > maxRanking) {maxRanking = rank;} 23 minRanking = rank;
24 } 24 }
25 if (maxRanking*100 < max) { 25 if (rank > maxRanking) {
26 maxRanking = rank;
27 }
28 }
29 if (maxRanking * 100 < max) {
26 str += "At least one fragment must be selected." 30 str += "At least one fragment must be selected."
27 state = false; 31 state = false;
28 } 32 }
29 if (!state) { 33 if (!state) {
30 console.log(str); 34 console.log(str);
31 this.storeErrorNode(str); 35 this.storeErrorNode(str);
32 interfaceContext.lightbox.post("Message",str); 36 interfaceContext.lightbox.post("Message", str);
33 } 37 }
34 return state; 38 return state;
35 } 39 }
36 40
37 // The injection point into the HTML page 41 // The injection point into the HTML page
38 interfaceContext.insertPoint = document.getElementById("topLevelBody"); 42 interfaceContext.insertPoint = document.getElementById("topLevelBody");
39 var testContent = document.createElement('div'); 43 var testContent = document.createElement('div');
40 testContent.id = 'testContent'; 44 testContent.id = 'testContent';
41 45
42 // Create the top div for the Title element 46 // Create the top div for the Title element
43 var titleAttr = specification.title; 47 var titleAttr = specification.title;
44 var title = document.createElement('div'); 48 var title = document.createElement('div');
45 title.className = "title"; 49 title.className = "title";
46 title.align = "center"; 50 title.align = "center";
47 var titleSpan = document.createElement('span'); 51 var titleSpan = document.createElement('span');
48 titleSpan.id = "test-title"; 52 titleSpan.id = "test-title";
49 53
50 // Set title to that defined in XML, else set to default 54 // Set title to that defined in XML, else set to default
51 if (titleAttr != undefined) { 55 if (titleAttr != undefined) {
52 titleSpan.textContent = titleAttr; 56 titleSpan.textContent = titleAttr;
53 } else { 57 } else {
54 titleSpan.textContent = 'Listening test'; 58 titleSpan.textContent = 'Listening test';
55 } 59 }
56 // Insert the titleSpan element into the title div element. 60 // Insert the titleSpan element into the title div element.
57 title.appendChild(titleSpan); 61 title.appendChild(titleSpan);
58 62
59 var pagetitle = document.createElement('div'); 63 var pagetitle = document.createElement('div');
60 pagetitle.className = "pageTitle"; 64 pagetitle.className = "pageTitle";
61 pagetitle.align = "center"; 65 pagetitle.align = "center";
62 var titleSpan = document.createElement('span'); 66 var titleSpan = document.createElement('span');
63 titleSpan.id = "pageTitle"; 67 titleSpan.id = "pageTitle";
64 pagetitle.appendChild(titleSpan); 68 pagetitle.appendChild(titleSpan);
65 69
66 // Create Interface buttons! 70 // Create Interface buttons!
67 var interfaceButtons = document.createElement('div'); 71 var interfaceButtons = document.createElement('div');
68 interfaceButtons.id = 'interface-buttons'; 72 interfaceButtons.id = 'interface-buttons';
69 interfaceButtons.style.height = '25px'; 73 interfaceButtons.style.height = '25px';
70 74
71 // Create playback start/stop points 75 // Create playback start/stop points
72 var playback = document.createElement("button"); 76 var playback = document.createElement("button");
73 playback.innerHTML = 'Stop'; 77 playback.innerHTML = 'Stop';
74 playback.id = 'playback-button'; 78 playback.id = 'playback-button';
75 playback.style.float = 'left'; 79 playback.style.float = 'left';
76 // onclick function. Check if it is playing or not, call the correct function in the 80 // onclick function. Check if it is playing or not, call the correct function in the
77 // audioEngine, change the button text to reflect the next state. 81 // audioEngine, change the button text to reflect the next state.
78 playback.onclick = function() { 82 playback.onclick = function () {
79 if (audioEngineContext.status == 1) { 83 if (audioEngineContext.status == 1) {
80 audioEngineContext.stop(); 84 audioEngineContext.stop();
81 this.innerHTML = 'Stop'; 85 this.innerHTML = 'Stop';
82 var time = audioEngineContext.timer.getTestTime(); 86 var time = audioEngineContext.timer.getTestTime();
83 console.log('Stopped at ' + time); // DEBUG/SAFETY 87 console.log('Stopped at ' + time); // DEBUG/SAFETY
84 } 88 }
85 }; 89 };
86 // Append the interface buttons into the interfaceButtons object. 90 // Append the interface buttons into the interfaceButtons object.
87 interfaceButtons.appendChild(playback); 91 interfaceButtons.appendChild(playback);
88 92
89 // Global parent for the comment boxes on the page 93 // Global parent for the comment boxes on the page
90 var feedbackHolder = document.createElement('div'); 94 var feedbackHolder = document.createElement('div');
91 feedbackHolder.id = 'feedbackHolder'; 95 feedbackHolder.id = 'feedbackHolder';
92 96
93 // Create outside reference holder 97 // Create outside reference holder
94 var outsideRef = document.createElement("div"); 98 var outsideRef = document.createElement("div");
95 outsideRef.id = "outside-reference-holder"; 99 outsideRef.id = "outside-reference-holder";
96 100
97 // Construct the AB Boxes 101 // Construct the AB Boxes
98 var boxes = document.createElement('div'); 102 var boxes = document.createElement('div');
99 boxes.align = "center"; 103 boxes.align = "center";
100 boxes.id = "box-holders"; 104 boxes.id = "box-holders";
101 boxes.style.float = "left"; 105 boxes.style.float = "left";
102 106
103 var submit = document.createElement('button'); 107 var submit = document.createElement('button');
104 submit.id = "submit"; 108 submit.id = "submit";
105 submit.onclick = buttonSubmitClick; 109 submit.onclick = buttonSubmitClick;
106 submit.className = "big-button"; 110 submit.className = "big-button";
107 submit.textContent = "submit"; 111 submit.textContent = "submit";
108 submit.style.position = "relative"; 112 submit.style.position = "relative";
109 submit.style.left = (window.innerWidth-250)/2 + 'px'; 113 submit.style.left = (window.innerWidth - 250) / 2 + 'px';
110 114
111 feedbackHolder.appendChild(boxes); 115 feedbackHolder.appendChild(boxes);
112 116
113 // Create holder for comment boxes 117 // Create holder for comment boxes
114 var comments = document.createElement("div"); 118 var comments = document.createElement("div");
115 comments.id = "comment-box-holder"; 119 comments.id = "comment-box-holder";
116 120
117 // Inject into HTML 121 // Inject into HTML
118 testContent.appendChild(title); // Insert the title 122 testContent.appendChild(title); // Insert the title
119 testContent.appendChild(pagetitle); 123 testContent.appendChild(pagetitle);
120 testContent.appendChild(interfaceButtons); 124 testContent.appendChild(interfaceButtons);
121 testContent.appendChild(outsideRef); 125 testContent.appendChild(outsideRef);
122 testContent.appendChild(feedbackHolder); 126 testContent.appendChild(feedbackHolder);
123 testContent.appendChild(submit); 127 testContent.appendChild(submit);
124 testContent.appendChild(comments); 128 testContent.appendChild(comments);
125 interfaceContext.insertPoint.appendChild(testContent); 129 interfaceContext.insertPoint.appendChild(testContent);
126 130
127 // Load the full interface 131 // Load the full interface
128 testState.initialise(); 132 testState.initialise();
129 testState.advanceState(); 133 testState.advanceState();
130 } 134 }
131 135
132 function loadTest(audioHolderObject) 136 function loadTest(audioHolderObject) {
133 { 137 var feedbackHolder = document.getElementById('feedbackHolder');
134 var feedbackHolder = document.getElementById('feedbackHolder'); 138 var interfaceObj = audioHolderObject.interfaces;
135 var interfaceObj = audioHolderObject.interfaces; 139 if (interfaceObj.length > 1) {
136 if (interfaceObj.length > 1) 140 console.log("WARNING - This interface only supports one <interface> node per page. Using first interface node");
137 { 141 }
138 console.log("WARNING - This interface only supports one <interface> node per page. Using first interface node"); 142 interfaceObj = interfaceObj[0];
139 } 143
140 interfaceObj = interfaceObj[0];
141
142 var commentHolder = document.getElementById('comment-box-holder'); 144 var commentHolder = document.getElementById('comment-box-holder');
143 commentHolder.innerHTML = ""; 145 commentHolder.innerHTML = "";
144 146
145 // Delete outside reference 147 // Delete outside reference
146 var outsideReferenceHolder = document.getElementById("outside-reference-holder"); 148 var outsideReferenceHolder = document.getElementById("outside-reference-holder");
147 outsideReferenceHolder.innerHTML = ""; 149 outsideReferenceHolder.innerHTML = "";
148 150
149 // Set the page title 151 // Set the page title
150 if (typeof audioHolderObject.title == "string" && audioHolderObject.title.length > 0) { 152 if (typeof audioHolderObject.title == "string" && audioHolderObject.title.length > 0) {
151 document.getElementById("test-title").textContent = audioHolderObject.title 153 document.getElementById("test-title").textContent = audioHolderObject.title
152 } 154 }
153 155
154 if(interfaceObj.title != null) 156 if (interfaceObj.title != null) {
155 { 157 document.getElementById("pageTitle").textContent = interfaceObj.title;
156 document.getElementById("pageTitle").textContent = interfaceObj.title; 158 }
157 } 159
158
159 var interfaceOptions = specification.interfaces.options.concat(interfaceObj.options); 160 var interfaceOptions = specification.interfaces.options.concat(interfaceObj.options);
160 // Clear the interfaceElements 161 // Clear the interfaceElements
161 { 162 {
162 var node = document.getElementById('playback-holder'); 163 var node = document.getElementById('playback-holder');
163 if (node){feedbackHolder.removeChild(node);} 164 if (node) {
165 feedbackHolder.removeChild(node);
166 }
164 node = document.getElementById('page-count'); 167 node = document.getElementById('page-count');
165 if (node){document.getElementById('interface-buttons').removeChild(node);} 168 if (node) {
169 document.getElementById('interface-buttons').removeChild(node);
170 }
166 node = document.getElementById('master-volume-holder-float'); 171 node = document.getElementById('master-volume-holder-float');
167 if (node){feedbackHolder.removeChild(node);} 172 if (node) {
168 } 173 feedbackHolder.removeChild(node);
169 174 }
175 }
176
170 // Populate the comparator object 177 // Populate the comparator object
171 interfaceContext.comparator = new comparator(audioHolderObject); 178 interfaceContext.comparator = new comparator(audioHolderObject);
172 179
173 for (var option of interfaceOptions) 180 for (var option of interfaceOptions) {
174 { 181 if (option.type == "show") {
175 if (option.type == "show") 182 switch (option.name) {
176 {
177 switch(option.name) {
178 case "playhead": 183 case "playhead":
179 var playbackHolder = document.getElementById('playback-holder'); 184 var playbackHolder = document.getElementById('playback-holder');
180 if (playbackHolder == null) 185 if (playbackHolder == null) {
181 {
182 playbackHolder = document.createElement('div'); 186 playbackHolder = document.createElement('div');
183 playbackHolder.id = 'playback-holder'; 187 playbackHolder.id = 'playback-holder';
184 playbackHolder.style.width = "100%"; 188 playbackHolder.style.width = "100%";
185 playbackHolder.style.float = "left"; 189 playbackHolder.style.float = "left";
186 playbackHolder.align = 'center'; 190 playbackHolder.align = 'center';
188 feedbackHolder.appendChild(playbackHolder); 192 feedbackHolder.appendChild(playbackHolder);
189 } 193 }
190 break; 194 break;
191 case "page-count": 195 case "page-count":
192 var pagecountHolder = document.getElementById('page-count'); 196 var pagecountHolder = document.getElementById('page-count');
193 if (pagecountHolder == null) 197 if (pagecountHolder == null) {
194 {
195 pagecountHolder = document.createElement('div'); 198 pagecountHolder = document.createElement('div');
196 pagecountHolder.id = 'page-count'; 199 pagecountHolder.id = 'page-count';
197 document.getElementById('interface-buttons').appendChild(pagecountHolder); 200 document.getElementById('interface-buttons').appendChild(pagecountHolder);
198 } 201 }
199 pagecountHolder.innerHTML = '<span>Page '+(testState.stateIndex+1)+' of '+testState.stateMap.length+'</span>'; 202 pagecountHolder.innerHTML = '<span>Page ' + (testState.stateIndex + 1) + ' of ' + testState.stateMap.length + '</span>';
200 break; 203 break;
201 case "volume": 204 case "volume":
202 if (document.getElementById('master-volume-holder-float') == null) 205 if (document.getElementById('master-volume-holder-float') == null) {
203 {
204 feedbackHolder.appendChild(interfaceContext.volume.object); 206 feedbackHolder.appendChild(interfaceContext.volume.object);
205 } 207 }
206 break; 208 break;
207 case "comments": 209 case "comments":
208 // Generate one comment box per presented page 210 // Generate one comment box per presented page
209 for (var element of audioEngineContext.audioObjects) 211 for (var element of audioEngineContext.audioObjects) {
210 {
211 interfaceContext.commentBoxes.createCommentBox(element); 212 interfaceContext.commentBoxes.createCommentBox(element);
212 } 213 }
213 interfaceContext.commentBoxes.showCommentBoxes(commentHolder,true); 214 interfaceContext.commentBoxes.showCommentBoxes(commentHolder, true);
214 break; 215 break;
215 } 216 }
216 } 217 }
217 } 218 }
218 219
219 $(audioHolderObject.commentQuestions).each(function(index,element) { 220 $(audioHolderObject.commentQuestions).each(function (index, element) {
220 var node = interfaceContext.createCommentQuestion(element); 221 var node = interfaceContext.createCommentQuestion(element);
221 commentHolder.appendChild(node.holder); 222 commentHolder.appendChild(node.holder);
222 }); 223 });
223 224
224 resizeWindow(null); 225 resizeWindow(null);
225 } 226 }
226 227
227 function comparator(audioHolderObject) 228 function comparator(audioHolderObject) {
228 { 229 this.comparatorBox = function (audioElement, id, text) {
229 this.comparatorBox = function(audioElement,id,text) 230 this.parent = audioElement;
230 { 231 this.id = id;
231 this.parent = audioElement; 232 this.value = 0;
232 this.id = id; 233 this.disabled = true;
233 this.value = 0; 234 this.box = document.createElement('div');
234 this.disabled = true; 235 this.box.className = 'comparator-holder';
235 this.box = document.createElement('div'); 236 this.box.setAttribute('track-id', audioElement.id);
236 this.box.className = 'comparator-holder'; 237 this.box.id = 'comparator-' + text;
237 this.box.setAttribute('track-id',audioElement.id); 238 this.selector = document.createElement('div');
238 this.box.id = 'comparator-'+text; 239 this.selector.className = 'comparator-selector disabled';
239 this.selector = document.createElement('div'); 240 var selectorText = document.createElement('span');
240 this.selector.className = 'comparator-selector disabled'; 241 selectorText.textContent = text;
241 var selectorText = document.createElement('span'); 242 this.selector.appendChild(selectorText);
242 selectorText.textContent = text; 243 this.playback = document.createElement('button');
243 this.selector.appendChild(selectorText); 244 this.playback.className = 'comparator-button';
244 this.playback = document.createElement('button'); 245 this.playback.disabled = true;
245 this.playback.className = 'comparator-button'; 246 this.playback.textContent = "Listen";
246 this.playback.disabled = true; 247 this.box.appendChild(this.selector);
247 this.playback.textContent = "Listen"; 248 this.box.appendChild(this.playback);
248 this.box.appendChild(this.selector); 249 this.selector.onclick = function (event) {
249 this.box.appendChild(this.playback); 250 var time = audioEngineContext.timer.getTestTime();
250 this.selector.onclick = function(event) 251 if ($(event.currentTarget).hasClass('disabled')) {
251 { 252 console.log("Please wait until sample has loaded");
252 var time = audioEngineContext.timer.getTestTime(); 253 return;
253 if ($(event.currentTarget).hasClass('disabled')) 254 }
254 { 255 if (audioEngineContext.status == 0) {
255 console.log("Please wait until sample has loaded"); 256 interfaceContext.lightbox.post("Message", "Please listen to the samples before making a selection");
256 return; 257 console.log("Please listen to the samples before making a selection");
257 } 258 return;
258 if (audioEngineContext.status == 0) 259 }
259 { 260 var id = event.currentTarget.parentElement.getAttribute('track-id');
260 interfaceContext.lightbox.post("Message","Please listen to the samples before making a selection"); 261 interfaceContext.comparator.selected = id;
261 console.log("Please listen to the samples before making a selection");
262 return;
263 }
264 var id = event.currentTarget.parentElement.getAttribute('track-id');
265 interfaceContext.comparator.selected = id;
266 if ($(event.currentTarget).hasClass("selected")) { 262 if ($(event.currentTarget).hasClass("selected")) {
267 $(".comparator-selector").removeClass('selected'); 263 $(".comparator-selector").removeClass('selected');
268 for (var i=0; i<interfaceContext.comparator.comparators.length; i++) 264 for (var i = 0; i < interfaceContext.comparator.comparators.length; i++) {
269 {
270 var obj = interfaceContext.comparator.comparators[i]; 265 var obj = interfaceContext.comparator.comparators[i];
271 obj.parent.metric.moved(time,0); 266 obj.parent.metric.moved(time, 0);
272 obj.value = 0; 267 obj.value = 0;
273 } 268 }
274 } else { 269 } else {
275 $(".comparator-selector").removeClass('selected'); 270 $(".comparator-selector").removeClass('selected');
276 $(event.currentTarget).addClass('selected'); 271 $(event.currentTarget).addClass('selected');
277 for (var i=0; i<interfaceContext.comparator.comparators.length; i++) 272 for (var i = 0; i < interfaceContext.comparator.comparators.length; i++) {
278 {
279 var obj = interfaceContext.comparator.comparators[i]; 273 var obj = interfaceContext.comparator.comparators[i];
280 if (i == id) { 274 if (i == id) {
281 obj.value = 1; 275 obj.value = 1;
282 } else { 276 } else {
283 obj.value = 0; 277 obj.value = 0;
284 } 278 }
285 obj.parent.metric.moved(time,obj.value); 279 obj.parent.metric.moved(time, obj.value);
286 } 280 }
287 console.log("Selected "+id+' ('+time+')'); 281 console.log("Selected " + id + ' (' + time + ')');
288 } 282 }
289 }; 283 };
290 this.playback.setAttribute("playstate","ready"); 284 this.playback.setAttribute("playstate", "ready");
291 this.playback.onclick = function(event) 285 this.playback.onclick = function (event) {
292 { 286 var id = event.currentTarget.parentElement.getAttribute('track-id');
293 var id = event.currentTarget.parentElement.getAttribute('track-id'); 287 if (event.currentTarget.getAttribute("playstate") == "ready") {
294 if (event.currentTarget.getAttribute("playstate") == "ready")
295 {
296 audioEngineContext.play(id); 288 audioEngineContext.play(id);
297 } else if (event.currentTarget.getAttribute("playstate") == "playing") { 289 } else if (event.currentTarget.getAttribute("playstate") == "playing") {
298 audioEngineContext.stop(); 290 audioEngineContext.stop();
299 } 291 }
300 292
301 }; 293 };
302 294
303 this.enable = function() 295 this.enable = function () {
304 { 296 if (this.parent.state == 1) {
305 if (this.parent.state == 1) 297 $(this.selector).removeClass('disabled');
306 { 298 this.playback.disabled = false;
307 $(this.selector).removeClass('disabled'); 299 }
308 this.playback.disabled = false; 300 };
309 } 301 this.updateLoading = function (progress) {
310 }; 302 if (progress != 100) {
311 this.updateLoading = function(progress) 303 progress = String(progress);
312 { 304 progress = progress.split('.')[0];
313 if (progress != 100) 305 this.playback.textContent = progress + '%';
314 { 306 } else {
315 progress = String(progress); 307 this.playback.textContent = "Play";
316 progress = progress.split('.')[0]; 308 }
317 this.playback.textContent = progress+'%'; 309 };
318 } else { 310 this.error = function () {
319 this.playback.textContent = "Play";
320 }
321 };
322 this.error = function() {
323 // audioObject has an error!! 311 // audioObject has an error!!
324 this.playback.textContent = "Error"; 312 this.playback.textContent = "Error";
325 $(this.playback).addClass("error-colour"); 313 $(this.playback).addClass("error-colour");
326 } 314 }
327 this.startPlayback = function() 315 this.startPlayback = function () {
328 {
329 if (this.parent.specification.parent.playOne || specification.playOne) { 316 if (this.parent.specification.parent.playOne || specification.playOne) {
330 $('.comparator-button').text('Wait'); 317 $('.comparator-button').text('Wait');
331 $('.comparator-button').attr("disabled","true"); 318 $('.comparator-button').attr("disabled", "true");
332 $(this.playback).removeAttr("disabled"); 319 $(this.playback).removeAttr("disabled");
333 } else { 320 } else {
334 $('.comparator-button').text('Listen'); 321 $('.comparator-button').text('Listen');
335 } 322 }
336 $(this.playback).text('Stop'); 323 $(this.playback).text('Stop');
337 this.playback.setAttribute("playstate","playing"); 324 this.playback.setAttribute("playstate", "playing");
338 }; 325 };
339 this.stopPlayback = function() 326 this.stopPlayback = function () {
340 {
341 if (this.playback.getAttribute("playstate") == "playing") { 327 if (this.playback.getAttribute("playstate") == "playing") {
342 $('.comparator-button').text('Listen'); 328 $('.comparator-button').text('Listen');
343 $('.comparator-button').removeAttr("disabled"); 329 $('.comparator-button').removeAttr("disabled");
344 this.playback.setAttribute("playstate","ready"); 330 this.playback.setAttribute("playstate", "ready");
345 } 331 }
346 }; 332 };
347 this.exportXMLDOM = function(audioObject) 333 this.exportXMLDOM = function (audioObject) {
348 { 334 var node = storage.document.createElement('value');
349 var node = storage.document.createElement('value'); 335 node.textContent = this.value;
350 node.textContent = this.value; 336 return node;
351 return node; 337 };
352 }; 338 this.getValue = function () {
353 this.getValue = function() { 339 return this.value;
354 return this.value; 340 };
355 }; 341 this.getPresentedId = function () {
356 this.getPresentedId = function() 342 return this.selector.children[0].textContent;
357 { 343 };
358 return this.selector.children[0].textContent; 344 this.canMove = function () {
359 }; 345 return false;
360 this.canMove = function() 346 };
361 { 347 };
362 return false; 348
363 }; 349 this.boxHolders = document.getElementById('box-holders');
364 }; 350 this.boxHolders.innerHTML = "";
365 351 this.comparators = [];
366 this.boxHolders = document.getElementById('box-holders'); 352 this.selected = null;
367 this.boxHolders.innerHTML = ""; 353
368 this.comparators = []; 354 // First generate the Audio Objects for the Audio Engine
369 this.selected = null; 355 for (var index = 0; index < audioHolderObject.audioElements.length; index++) {
370 356 var element = audioHolderObject.audioElements[index];
371 // First generate the Audio Objects for the Audio Engine
372 for (var index=0; index<audioHolderObject.audioElements.length; index++)
373 {
374 var element = audioHolderObject.audioElements[index];
375 var audioObject = audioEngineContext.newTrack(element); 357 var audioObject = audioEngineContext.newTrack(element);
376 if (index == audioHolderObject.outsideReference || element.type == 'outside-reference') 358 if (index == audioHolderObject.outsideReference || element.type == 'outside-reference') {
377 { 359 var orNode = new interfaceContext.outsideReferenceDOM(audioObject, index, document.getElementById("outside-reference-holder"));
378 var orNode = new interfaceContext.outsideReferenceDOM(audioObject,index,document.getElementById("outside-reference-holder")); 360 audioObject.bindInterface(orNode);
379 audioObject.bindInterface(orNode);
380 } else { 361 } else {
381 var label; 362 var label;
382 switch(audioObject.specification.parent.label) { 363 switch (audioObject.specification.parent.label) {
383 case "none": 364 case "none":
384 label = ""; 365 label = "";
385 break; 366 break;
386 case "number": 367 case "number":
387 label = ""+index; 368 label = "" + index;
388 break; 369 break;
389 case "letter": 370 case "letter":
390 label = String.fromCharCode(97 + index); 371 label = String.fromCharCode(97 + index);
391 break; 372 break;
392 default: 373 default:
393 label = String.fromCharCode(65 + index); 374 label = String.fromCharCode(65 + index);
394 break; 375 break;
395 } 376 }
396 var node = new this.comparatorBox(audioObject,index,label); 377 var node = new this.comparatorBox(audioObject, index, label);
397 audioObject.bindInterface(node); 378 audioObject.bindInterface(node);
398 this.comparators.push(node); 379 this.comparators.push(node);
399 this.boxHolders.appendChild(node.box); 380 this.boxHolders.appendChild(node.box);
400 } 381 }
401 } 382 }
402 return this; 383 return this;
403 } 384 }
404 385
405 function resizeWindow(event) 386 function resizeWindow(event) {
406 { 387 document.getElementById('submit').style.left = (window.innerWidth - 250) / 2 + 'px';
407 document.getElementById('submit').style.left = (window.innerWidth-250)/2 + 'px'; 388 var numObj = interfaceContext.comparator.comparators.length;
408 var numObj = interfaceContext.comparator.comparators.length; 389 var boxW = numObj * 312;
409 var boxW = numObj*312;
410 var diff = window.innerWidth - boxW; 390 var diff = window.innerWidth - boxW;
411 while (diff < 0) 391 while (diff < 0) {
412 { 392 numObj = Math.ceil(numObj / 2);
413 numObj = Math.ceil(numObj/2); 393 boxW = numObj * 312;
414 boxW = numObj*312;
415 diff = window.innerWidth - boxW; 394 diff = window.innerWidth - boxW;
416 } 395 }
417 document.getElementById('box-holders').style.marginLeft = diff/2 + 'px'; 396 document.getElementById('box-holders').style.marginLeft = diff / 2 + 'px';
418 document.getElementById('box-holders').style.marginRight = diff/2 + 'px'; 397 document.getElementById('box-holders').style.marginRight = diff / 2 + 'px';
419 document.getElementById('box-holders').style.width = boxW + 'px'; 398 document.getElementById('box-holders').style.width = boxW + 'px';
420 399
421 var outsideRef = document.getElementById('outside-reference'); 400 var outsideRef = document.getElementById('outside-reference');
422 if(outsideRef != null) 401 if (outsideRef != null) {
423 { 402 outsideRef.style.left = (window.innerWidth - 120) / 2 + 'px';
424 outsideRef.style.left = (window.innerWidth-120)/2 + 'px'; 403 }
425 } 404 }
426 } 405
427 406 function buttonSubmitClick() {
428 function buttonSubmitClick() 407 var checks = [];
429 { 408 checks = checks.concat(testState.currentStateMap.interfaces[0].options);
430 var checks = []; 409 checks = checks.concat(specification.interfaces.options);
431 checks = checks.concat(testState.currentStateMap.interfaces[0].options); 410 var canContinue = true;
432 checks = checks.concat(specification.interfaces.options); 411
433 var canContinue = true; 412 for (var i = 0; i < checks.length; i++) {
434 413 if (checks[i].type == 'check') {
435 for (var i=0; i<checks.length; i++) { 414 switch (checks[i].name) {
436 if (checks[i].type == 'check') 415 case 'fragmentPlayed':
437 { 416 // Check if all fragments have been played
438 switch(checks[i].name) { 417 var checkState = interfaceContext.checkAllPlayed();
439 case 'fragmentPlayed': 418 if (checkState == false) {
440 // Check if all fragments have been played 419 canContinue = false;
441 var checkState = interfaceContext.checkAllPlayed(); 420 }
442 if (checkState == false) {canContinue = false;} 421 break;
443 break; 422 case 'fragmentFullPlayback':
444 case 'fragmentFullPlayback': 423 // Check all fragments have been played to their full length
445 // Check all fragments have been played to their full length 424 var checkState = interfaceContext.checkFragmentsFullyPlayed();
446 var checkState = interfaceContext.checkFragmentsFullyPlayed(); 425 if (checkState == false) {
447 if (checkState == false) {canContinue = false;} 426 canContinue = false;
448 break; 427 }
449 case 'fragmentMoved': 428 break;
450 // Check all fragment sliders have been moved. 429 case 'fragmentMoved':
451 var checkState = interfaceContext.checkAllMoved(); 430 // Check all fragment sliders have been moved.
452 if (checkState == false) {canContinue = false;} 431 var checkState = interfaceContext.checkAllMoved();
453 break; 432 if (checkState == false) {
454 case 'fragmentComments': 433 canContinue = false;
455 // Check all fragment sliders have been moved. 434 }
456 var checkState = interfaceContext.checkAllCommented(); 435 break;
457 if (checkState == false) {canContinue = false;} 436 case 'fragmentComments':
458 break; 437 // Check all fragment sliders have been moved.
459 case 'scalerange': 438 var checkState = interfaceContext.checkAllCommented();
460 // Check the scale has been used effectively 439 if (checkState == false) {
461 var checkState = interfaceContext.checkScaleRange(checks[i].min,checks[i].max); 440 canContinue = false;
462 if (checkState == false) {canContinue = false;} 441 }
463 break; 442 break;
464 default: 443 case 'scalerange':
465 console.log("WARNING - Check option "+checks[i].check+" is not supported on this interface"); 444 // Check the scale has been used effectively
466 break; 445 var checkState = interfaceContext.checkScaleRange(checks[i].min, checks[i].max);
467 } 446 if (checkState == false) {
468 447 canContinue = false;
469 } 448 }
470 if (!canContinue) {break;} 449 break;
471 } 450 default:
472 if (canContinue) 451 console.log("WARNING - Check option " + checks[i].check + " is not supported on this interface");
473 { 452 break;
474 if (audioEngineContext.status == 1) { 453 }
475 var playback = document.getElementById('playback-button'); 454
476 playback.click(); 455 }
477 // This function is called when the submit button is clicked. Will check for any further tests to perform, or any post-test options 456 if (!canContinue) {
478 } else 457 break;
479 { 458 }
480 if (audioEngineContext.timer.testStarted == false) 459 }
481 { 460 if (canContinue) {
482 interfaceContext.lightbox.post("Warning",'You have not started the test! Please click play on a sample to begin the test!'); 461 if (audioEngineContext.status == 1) {
483 return; 462 var playback = document.getElementById('playback-button');
484 } 463 playback.click();
485 } 464 // This function is called when the submit button is clicked. Will check for any further tests to perform, or any post-test options
486 testState.advanceState(); 465 } else {
487 } 466 if (audioEngineContext.timer.testStarted == false) {
488 } 467 interfaceContext.lightbox.post("Warning", 'You have not started the test! Please click play on a sample to begin the test!');
489 468 return;
490 function pageXMLSave(store, pageSpecification) 469 }
491 { 470 }
492 // MANDATORY 471 testState.advanceState();
493 // Saves a specific test page 472 }
494 // You can use this space to add any extra nodes to your XML <audioHolder> saves 473 }
495 // Get the current <page> information in store (remember to appendChild your data to it) 474
496 // pageSpecification is the current page node configuration 475 function pageXMLSave(store, pageSpecification) {
497 // To create new XML nodes, use storage.document.createElement(); 476 // MANDATORY
498 } 477 // Saves a specific test page
478 // You can use this space to add any extra nodes to your XML <audioHolder> saves
479 // Get the current <page> information in store (remember to appendChild your data to it)
480 // pageSpecification is the current page node configuration
481 // To create new XML nodes, use storage.document.createElement();
482 }