Name is required.
Email address is required.
Invalid email address
Answer is required.
Exceeding max length of 5KB

What does remove() actually do?


Hi,

I suppose this is more of an informational question, but what does "remove()" actually do? My assumption has been that it completely destroys any reference to the player and removes it completely from memory. However, my testing shows otherwise. Here's the code:

<!DOCTYPE html>
<html>
<head>
<title>JWPlayer Test</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://jwpsrv.com/library/cloud-player-key.js"></script>
</head>

<body>
<div><a href="#" id="removebtn">Remove The Player</div>
<div id="videoplayer"></div>

<script type="text/javascript">
jQuery(document).ready( function (jQuery) {
var myplayer = jwplayer('videoplayer').setup({
width: '100%',
aspectratio:'16:9',
autostart: 'true',
file: 'path/to/video.mp4'
});

jQuery('#removebtn').on('click', function(evt) {
evt.preventDefault();
myplayer.remove();
console.log(myplayer);
});
});
</script>
</body>
</html>

When I click the #removebtn, the console.log() line spits out what looks to me like the full JWPlayer object, with methods like "getCaptionsList()" and "getCurrentQuality()" and about 100 other methods. The ID value of the object is "videoplayer", the "container" is listed as "div#videoplayer.jwplayer aspectMode playlist-none jw-user-inactive".

So is this the expected behavior? If not, then how soon until this is fixed? If so, then what's the best way to *really* destroy this object?

7 Community Answers

Cooper Reid

JW Player Support Agent  
0 rated :

Yes, this is the expected behavior of the player. The video tag / flash object is removed from the DOM and the event listeners/timers are cleared.

From our documentation (http://support.jwplayer.com/customer/portal/articles/1413089-javascript-api-reference#setup):
remove() – Being the reverse of the setup() call, this call will remove a JW Player from the page. It ensures the player stops playback, the DOM is re-set to its original state and all event listeners and timers are cleaned up.

-Cooper

bmueller

User  
0 rated :

Thanks for the reply, Cooper. Help me understand the best way to handle this scenario: I'm invoking a video within an AJAX-based web app, which means no page reloads. I am, for various reason, reusing the variable in which JWPlayer is stored. So, a user requests a video, the player is created, using "setup()", and assigned to the "myplayer" var. Then the user navigates away from the video, and I call "remove()". Then the user navigates to a new video, I again create a player using "setup()" and again assign to "myplayer". Is this okay, as far as JWPlayer is concerned? Or should I do something like this:

myplayer.remove();
myplayer = undefined;

...to ensure that the previous JWPlayer instantiation is completely gone?

The reason this has come up is that remove() doesn't appear to behave quite right in IE9, and in attempting to track down the cause of that problem, I discovered that remove() doesn't really destroy the JWPlayer object.

Thanks.

bmueller

User  
0 rated :

For the record, when I want to get rid of a player, I'm doing this:

myplayer.stop();
myplayer.remove();
myplayer = null;

...and that appears to work in all the browsers I've tested (including IE9+). I don't know if that's truly the best solution, but it seems sensible.

Cooper Reid

JW Player Support Agent  
0 rated :

I don’t see the reason to delete that player reference entirely. I think you should simply use the `load` method to load a new video the next time the user plays a different video:
jwplayer().load({file:‘new-video.mp4’});

Cooper

bmueller

User  
-1 rated :

Cooper,

You may be right, except the container which holds the video gets obliterated and re-written when the app pages change, and therefore JWPlayer itself has to be re-added to the newly-created container.

Cooper Reid

JW Player Support Agent  
-1 rated :

Can you keep the player container on a common element within the app that doesn’t get removed when you navigate page-by-page? Also, As long as you call setup on the same ‘id’, .e.g. jwplayer(‘player’) , the player will occupy the same place in memory.

bmueller

User  
-1 rated :

I had started down the path of putting the player in an off-canvas container, and then moving it back and forth from that off-canvas container to the visible container as needed, and then moving it back again when I didn't need it, but that caused all kinds of headaches with IE. There's a whole separate thread regarding that issue somewhere on this forum. Turns out that the most reliable thing for my particular case is to just re-create the player each time.

There was some hope that perhaps version 6.12 would fix some of the issues I was having with the above solution, but since that's not available yet, and my launch window is quickly approaching, I went with this less elegant, yet more functional, solution. I intend to revisit the off-canvas solution when 6.12 is released.

This question has received the maximum number of answers.