comparison interfaces/horizontal-sliders.js @ 1160:f0fa49f5bbb0

Interfaces have startPlayback and stopPlayback methods to clean up code management. Looping playbacks now have a 2s cross-fade.
author Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk>
date Tue, 26 Jan 2016 13:52:56 +0000
parents 79291bafbf5e
children cb348f6208b2 c0022a09c4f6
comparison
equal deleted inserted replaced
1159:48b16162cdd0 1160:f0fa49f5bbb0
264 this.play.onclick = function(event) 264 this.play.onclick = function(event)
265 { 265 {
266 var id = Number(event.currentTarget.value); 266 var id = Number(event.currentTarget.value);
267 //audioEngineContext.metric.sliderPlayed(id); 267 //audioEngineContext.metric.sliderPlayed(id);
268 audioEngineContext.play(id); 268 audioEngineContext.play(id);
269 $(".track-slider").removeClass('track-slider-playing');
270 $(event.currentTarget.parentElement).addClass('track-slider-playing');
271 var outsideReference = document.getElementById('outside-reference');
272 if (outsideReference != null) {
273 $(outsideReference).removeClass('track-slider-playing');
274 }
275 }; 269 };
276 this.resize = function(event) 270 this.resize = function(event)
277 { 271 {
278 this.holder.style.width = window.innerWidth-200 + 'px'; 272 this.holder.style.width = window.innerWidth-200 + 'px';
279 this.slider.style.width = window.innerWidth-420 + 'px'; 273 this.slider.style.width = window.innerWidth-420 + 'px';
287 }; 281 };
288 this.updateLoading = function(progress) 282 this.updateLoading = function(progress)
289 { 283 {
290 // progress is a value from 0 to 100 indicating the current download state of media files 284 // progress is a value from 0 to 100 indicating the current download state of media files
291 }; 285 };
286 this.startPlayback = function()
287 {
288 // Called when playback has begun
289 $(".track-slider").removeClass('track-slider-playing');
290 $(this.holder).addClass('track-slider-playing');
291 var outsideReference = document.getElementById('outside-reference');
292 if (outsideReference != null) {
293 $(outsideReference).removeClass('track-slider-playing');
294 }
295 };
296 this.stopPlayback = function()
297 {
298 // Called when playback has stopped. This gets called even if playback never started!
299 $(this.holder).removeClass('track-slider-playing');
300 };
292 this.getValue = function() 301 this.getValue = function()
293 { 302 {
294 // Return the current value of the object. If there is no value, return 0 303 // Return the current value of the object. If there is no value, return 0
295 return this.slider.value; 304 return this.slider.value;
296 }; 305 };
313 var node = storage.document.createElement('value'); 322 var node = storage.document.createElement('value');
314 node.textContent = this.slider.value; 323 node.textContent = this.slider.value;
315 return node; 324 return node;
316 }; 325 };
317 }; 326 };
327
328 function outsideReferenceDOM(audioObject,index,inject)
329 {
330 this.parent = audioObject;
331 this.outsideReferenceHolder = document.createElement('button');
332 this.outsideReferenceHolder.id = 'outside-reference';
333 this.outsideReferenceHolder.className = 'outside-reference';
334 this.outsideReferenceHolder.setAttribute('track-id',index);
335 this.outsideReferenceHolder.textContent = "Play Reference";
336 this.outsideReferenceHolder.disabled = true;
337
338 this.outsideReferenceHolder.onclick = function(event)
339 {
340 audioEngineContext.play(event.currentTarget.getAttribute('track-id'));
341 };
342 inject.appendChild(this.outsideReferenceHolder);
343 this.enable = function()
344 {
345 if (this.parent.state == 1)
346 {
347 this.outsideReferenceHolder.disabled = false;
348 }
349 };
350 this.updateLoading = function(progress)
351 {
352 if (progress != 100)
353 {
354 progress = String(progress);
355 progress = progress.split('.')[0];
356 this.outsideReferenceHolder[0].children[0].textContent = progress+'%';
357 } else {
358 this.outsideReferenceHolder[0].children[0].textContent = "Play Reference";
359 }
360 };
361 this.startPlayback = function()
362 {
363 // Called when playback has begun
364 $('.track-slider').removeClass('track-slider-playing');
365 $('.comment-div').removeClass('comment-box-playing');
366 $(this.outsideReferenceHolder).addClass('track-slider-playing');
367 };
368 this.stopPlayback = function()
369 {
370 // Called when playback has stopped. This gets called even if playback never started!
371 $(this.outsideReferenceHolder).removeClass('track-slider-playing');
372 };
373 this.exportXMLDOM = function(audioObject)
374 {
375 return null;
376 };
377 this.getValue = function()
378 {
379 return 0;
380 };
381 this.getPresentedId = function()
382 {
383 return 'reference';
384 };
385 this.canMove = function()
386 {
387 return false;
388 };
389 }
318 390
319 function resizeWindow(event) 391 function resizeWindow(event)
320 { 392 {
321 // Called on every window resize event, use this to scale your page properly 393 // Called on every window resize event, use this to scale your page properly
322 394