xiply

commit

e1b3f7ee5d669e7d1b81f791ead14abcdc3d6569

parent

2d52910c31eb711cde29c39b0502e986648e5968

Author

Tobias Bengfort <tobias.bengfort@gmx.net>

Date

2015-01-11 21:59

add events

Diffstat

2 files changed, 14 insertions, 0 deletions

diff --git a/README.md b/README.md

@@ -17,4 +17,8 @@ When you click a `track` it will start playing.
   17    17 When it is finished playing it will automatically start the
   18    18 next `track` from the same `player` div.
   19    19 
   -1    20 `init_xiply` returns the generated audio element. Two additional event types
   -1    21 will be triggered on this element: `'selectTrack'` and `'unselectTrack'`. In
   -1    22 both cases, `event.detail` contains the title.
   -1    23 
   20    24 xiply.js tries to be accessible and degrade gracefully

diff --git a/xiply.js b/xiply.js

@@ -12,6 +12,12 @@ function init_xiply(container) {
   12    12 	player.setAttribute('controls', true);
   13    13 	container.appendChild(player);
   14    14 
   -1    15 	function dispatchEvent(name, trackTitle) {
   -1    16 		player.dispatchEvent(new CustomEvent(name, {
   -1    17 			'detail': trackTitle
   -1    18 		}));
   -1    19 	}
   -1    20 
   15    21 	function _current() {
   16    22 		return container.getElementsByClassName('current')[0];
   17    23 	}
@@ -29,12 +35,14 @@ function init_xiply(container) {
   29    35 		var current = _current();
   30    36 		if (current) {
   31    37 			current.classList.remove('current');
   -1    38 			dispatchEvent('unselectTrack', current.textContent);
   32    39 		}
   33    40 	}
   34    41 
   35    42 	function select(element) {
   36    43 		if (element) {
   37    44 			element.classList.add('current');
   -1    45 			dispatchEvent('selectTrack', element.textContent);
   38    46 		}
   39    47 	}
   40    48 
@@ -76,4 +84,6 @@ function init_xiply(container) {
   76    84 	// player.addEventListener('ended', function(e) {
   77    85 	// 	loadNext();
   78    86 	// });
   -1    87 
   -1    88 	return player;
   79    89 }