Mercurial > hg > webaudioevaluationtool
comparison ape.js @ 1469:006ecc7f906c
APE: Can drag a slider whilst listening to another fragment
author | Nicholas Jillings <nickjillings@users.noreply.github.com> |
---|---|
date | Fri, 27 Nov 2015 11:08:45 +0000 |
parents | a49ef3d8d471 |
children | 2647dd909229 |
comparison
equal
deleted
inserted
replaced
1468:a49ef3d8d471 | 1469:006ecc7f906c |
---|---|
172 alert('Please use the full width of the scale'); | 172 alert('Please use the full width of the scale'); |
173 return false; | 173 return false; |
174 } else { | 174 } else { |
175 return true; | 175 return true; |
176 } | 176 } |
177 }; | |
178 | |
179 Interface.prototype.objectSelected = null; | |
180 Interface.prototype.objectMoved = false; | |
181 Interface.prototype.selectObject = function(object) | |
182 { | |
183 if (this.objectSelected == null) | |
184 { | |
185 this.objectSelected = object; | |
186 this.objectMoved = false; | |
187 } | |
188 }; | |
189 Interface.prototype.moveObject = function() | |
190 { | |
191 if (this.objectMoved == false) | |
192 { | |
193 this.objectMoved = true; | |
194 } | |
195 }; | |
196 Interface.prototype.releaseObject = function() | |
197 { | |
198 this.objectSelected = null; | |
199 this.objectMoved = false; | |
200 }; | |
201 Interface.prototype.getSelectedObject = function() | |
202 { | |
203 return this.objectSelected; | |
204 }; | |
205 Interface.prototype.hasSelectedObjectMoved = function() | |
206 { | |
207 return this.objectMoved; | |
177 }; | 208 }; |
178 | 209 |
179 // Bindings for audioObjects | 210 // Bindings for audioObjects |
180 | 211 |
181 // Create the top div for the Title element | 212 // Create the top div for the Title element |
404 audioObject.metric.initialised(convSliderPosToRate(audioObject.interfaceDOM.trackSliderObj)); | 435 audioObject.metric.initialised(convSliderPosToRate(audioObject.interfaceDOM.trackSliderObj)); |
405 | 436 |
406 }); | 437 }); |
407 | 438 |
408 $('.track-slider').mousedown(function(event) { | 439 $('.track-slider').mousedown(function(event) { |
409 clicking = this.getAttribute('trackIndex'); | 440 interfaceContext.selectObject($(this)[0]); |
410 }); | 441 }); |
411 | 442 |
412 $('.track-slider').mousemove(function(event) { | 443 $('.track-slider').mousemove(function(event) { |
413 event.preventDefault(); | 444 event.preventDefault(); |
414 }); | 445 }); |
415 | 446 |
416 $('#slider').mousemove(function(event) { | 447 $('#slider').mousemove(function(event) { |
417 event.preventDefault(); | 448 event.preventDefault(); |
418 if (clicking == -1) | 449 var obj = interfaceContext.getSelectedObject(); |
419 { | 450 if (obj == null) {return;} |
420 return; | 451 $(obj).css("left",event.clientX + "px"); |
421 } | 452 interfaceContext.moveObject(); |
422 $("#track-slider-"+clicking).css("left",event.clientX + "px"); | 453 }); |
423 }); | 454 |
424 | |
425 $(document).mouseup(function(event){ | 455 $(document).mouseup(function(event){ |
426 if (clicking >= 0) | 456 event.preventDefault(); |
427 { | 457 var obj = interfaceContext.getSelectedObject(); |
428 var l = $("#track-slider-"+clicking).css("left"); | 458 if (obj == null) {return;} |
459 if (interfaceContext.hasSelectedObjectMoved() == true) | |
460 { | |
461 var l = $(obj).css("left"); | |
462 var id = obj.getAttribute('trackIndex'); | |
429 var time = audioEngineContext.timer.getTestTime(); | 463 var time = audioEngineContext.timer.getTestTime(); |
430 var rate = convSliderPosToRate(document.getElementById("track-slider-"+clicking)); | 464 var rate = convSliderPosToRate(obj); |
431 audioEngineContext.audioObjects[clicking].metric.moved(time,rate); | 465 audioEngineContext.audioObjects[id].metric.moved(time,rate); |
432 console.log("slider "+clicking+" moved to "+rate+' ('+time+')'); | 466 console.log("slider "+id+" moved to "+rate+' ('+time+')'); |
433 } | 467 } else { |
434 clicking = -1; | 468 var id = Number(obj.attributes['trackIndex'].value); |
469 //audioEngineContext.metric.sliderPlayed(id); | |
470 audioEngineContext.play(id); | |
471 // Currently playing track red, rest green | |
472 | |
473 //document.getElementById('track-slider-'+index).style.backgroundColor = "#FF0000"; | |
474 $('.track-slider').removeClass('track-slider-playing'); | |
475 $(obj).addClass('track-slider-playing'); | |
476 $('.comment-div').removeClass('comment-box-playing'); | |
477 $('#comment-div-'+id).addClass('comment-box-playing'); | |
478 var outsideReference = document.getElementById('outside-reference'); | |
479 if (outsideReference != undefined) | |
480 $(outsideReference).removeClass('track-slider-playing'); | |
481 } | |
482 interfaceContext.releaseObject(); | |
435 }); | 483 }); |
436 | 484 |
437 | 485 |
438 if (commentShow) { | 486 if (commentShow) { |
439 interfaceContext.showCommentBoxes(feedbackHolder,true); | 487 interfaceContext.showCommentBoxes(feedbackHolder,true); |
482 | 530 |
483 this.trackSliderObj.setAttribute('trackIndex',audioObject.id); | 531 this.trackSliderObj.setAttribute('trackIndex',audioObject.id); |
484 this.trackSliderObj.innerHTML = '<span>'+audioObject.id+'</span>'; | 532 this.trackSliderObj.innerHTML = '<span>'+audioObject.id+'</span>'; |
485 | 533 |
486 // Onclick, switch playback to that track | 534 // Onclick, switch playback to that track |
487 this.trackSliderObj.onclick = function(event) { | |
488 // Cannot continue to issue play command until audioObjects reported as ready! | |
489 // Get the track ID from the object ID | |
490 var element; | |
491 if (event.currentTarget.nodeName == "SPAN") { | |
492 element = event.currentTarget.parentNode; | |
493 } else { | |
494 element = event.currentTarget; | |
495 } | |
496 var id = Number(element.attributes['trackIndex'].value); | |
497 //audioEngineContext.metric.sliderPlayed(id); | |
498 audioEngineContext.play(id); | |
499 // Currently playing track red, rest green | |
500 | |
501 //document.getElementById('track-slider-'+index).style.backgroundColor = "#FF0000"; | |
502 $('.track-slider').removeClass('track-slider-playing'); | |
503 $(element).addClass('track-slider-playing'); | |
504 $('.comment-div').removeClass('comment-box-playing'); | |
505 $('#comment-div-'+id).addClass('comment-box-playing'); | |
506 var outsideReference = document.getElementById('outside-reference'); | |
507 if (outsideReference != undefined) | |
508 $(outsideReference).removeClass('track-slider-playing'); | |
509 }; | |
510 | 535 |
511 this.enable = function() { | 536 this.enable = function() { |
512 if (this.parent.state == 1) | 537 if (this.parent.state == 1) |
513 { | 538 { |
514 $(this.trackSliderObj).removeClass('track-slider-disabled'); | 539 $(this.trackSliderObj).removeClass('track-slider-disabled'); |