diff --git a/src/js/player.js b/src/js/player.js index 87bd5e31b5..4271197a84 100644 --- a/src/js/player.js +++ b/src/js/player.js @@ -77,20 +77,7 @@ vjs.Player = vjs.Component.extend({ // this.addClass('vjs-touch-enabled'); // } - // Firstplay event implimentation. Not sold on the event yet. - // Could probably just check currentTime==0? - this.one('play', function(e){ - var fpEvent = { type: 'firstplay', target: this.el_ }; - // Using vjs.trigger so we can check if default was prevented - var keepGoing = vjs.trigger(this.el_, fpEvent); - - if (!keepGoing) { - e.preventDefault(); - e.stopPropagation(); - e.stopImmediatePropagation(); - } - }); - + this.on('loadstart', this.onLoadStart); this.on('ended', this.onEnded); this.on('play', this.onPlay); this.on('firstplay', this.onFirstPlay); @@ -407,7 +394,27 @@ vjs.Player.prototype.stopTrackingCurrentTime = function(){ clearInterval(this.cu * Fired when the user agent begins looking for media data * @event loadstart */ -vjs.Player.prototype.onLoadStart; +vjs.Player.prototype.onLoadStart = function() { + // remove any first play listeners that weren't triggered from a previous video. + this.off('play', initFirstPlay); + this.one('play', initFirstPlay); + + vjs.removeClass(this.el_, 'vjs-has-started'); +}; + + // Need to create this outside the scope of onLoadStart so it + // can be added and removed (to avoid piling first play listeners). +function initFirstPlay(e) { + var fpEvent = { type: 'firstplay', target: this.el_ }; + // Using vjs.trigger so we can check if default was prevented + var keepGoing = vjs.trigger(this.el_, fpEvent); + + if (!keepGoing) { + e.preventDefault(); + e.stopPropagation(); + e.stopImmediatePropagation(); + } +} /** * Fired when the player has initial duration and dimension information diff --git a/test/unit/player.js b/test/unit/player.js index 4b8f135d57..584df7f55e 100644 --- a/test/unit/player.js +++ b/test/unit/player.js @@ -371,3 +371,34 @@ test('should register players with generated ids', function(){ equal(player.el().id, player.id(), 'the player and element ids are equal'); ok(vjs.players[id], 'the generated id is registered'); }); + +test('should not add multiple first play events despite subsequent loads', function() { + expect(1); + + var player = PlayerTest.makePlayer({}); + + player.on('firstplay', function(){ + ok('First play should fire once.'); + }); + + // Checking to make sure onLoadStart removes first play listener before adding a new one. + player.trigger('loadstart'); + player.trigger('loadstart'); + player.trigger('play'); +}); + +test('should remove vjs-has-started class', function(){ + expect(3); + + var player = PlayerTest.makePlayer({}); + + player.trigger('loadstart'); + player.trigger('play'); + ok(player.el().className.indexOf('vjs-has-started') !== -1, 'vjs-has-started class added'); + + player.trigger('loadstart'); + ok(player.el().className.indexOf('vjs-has-started') === -1, 'vjs-has-started class removed'); + + player.trigger('play'); + ok(player.el().className.indexOf('vjs-has-started') !== -1, 'vjs-has-started class added again'); +});