Reputation: 579
any enlightenment on this problem would be very helpful.
All I'm trying to do is dynamically add a videojs player with javascript.
<div class="video-wrapper" ng-repeat="videos in panel">
<button class="remove-video" ng-click="removeFromPanel($index)">x</button>
<video id="{{videos.id}}" class="video-js vjs-default-skin" preload="none" controls width="300" height="210"
poster="" >
<source src="{{videos.directory}}" type='video/mp4' />
</video>
</div>
So for each object in the array "panel" I want a video to show. If I try to add a video after the page has loaded the videos do not initialise properly, they just add as normal video tags.
I have tried to use :
_V_("player id", { "controls": true, "autoplay": false, "preload": "auto" }, function(){
// Player (this) is initialized and ready.
});
to set up the player manually, but to no success.
anybody had this problem and managed to fix it ?
I would love to do a js fiddle for this but I have used angular for my app and I can never make it work correctly in jsfiddle.
Thanks for reading and the help in advance
Upvotes: 3
Views: 4113
Reputation: 579
I solved this by using
myPlayer.dispose();
on the player object then using
_V_("player id", { "controls": true, "autoplay": false, "preload": "auto" }, function(){
// Player (this) is initialized and ready.
});
to initialise it after I had created a new player object in the dom.
So I assume my problem was something to do with having 2 references to the same player object.
Upvotes: 2