feat: player doesn't attach itself to parent (#113)

README.md

@@ -48,8 +48,10 @@ Finally, add the bundle as a script tag in your page, and initialize the player
 <script type="text/javascript" src="/PATH/TO/FILE/playkit.js"></script>
 <div id="videoContainer" style="height:360px;width:640px">
 <script type="text/javascript">
+var videoContainer = document.querySelector("#videoContainer");
 var config = {...};
-var player = Playkit.loadPlayer("videoContainer", config);
+var player = Playkit.loadPlayer(config);
+videoContainer.appendChild(player.getView());
 player.play();
 </script>
 ```

src/player.js

@@ -143,11 +143,10 @@ export default class Player extends FakeEventTarget {
   _env: Object;
 
   /**
-   * @param {string} targetId - The target div id to append the player.
    * @param {Object} config - The configuration for the player instance.
    * @constructor
    */
-  constructor(targetId: string, config: Object) {
+  constructor(config: Object) {
     super();
     this._env = Env;
     this._tracks = [];
@@ -159,7 +158,7 @@ export default class Player extends FakeEventTarget {
     this._pluginManager = new PluginManager();
     this._playbackMiddleware = new PlaybackMiddleware();
     this._createReadyPromise();
-    this._appendPlayerContainer(targetId);
+    this._createPlayerContainer();
     this._appendPosterEl();
     this.configure(config);
   }
@@ -401,24 +400,6 @@ export default class Player extends FakeEventTarget {
     return true;
   }
 
-  /**
-   * Creates the player container
-   * @param {string} targetId - The target div id to append the player.
-   * @private
-   * @returns {void}
-   */
-  _appendPlayerContainer(targetId: string): void {
-    if (targetId) {
-      if (this._el === undefined) {
-        this._createPlayerContainer();
-        let parentNode = Utils.Dom.getElementById(targetId);
-        Utils.Dom.appendChild(parentNode, this._el);
-      }
-    } else {
-      throw new Error("targetId is not found, it must be pass on initialization");
-    }
-  }
-
   /**
    * Creates the player container.
    * @private

src/playkit.js

@@ -22,12 +22,11 @@ LoggerFactory.getLogger().log(`%c ${__NAME__} ${__VERSION__}`, "color: #98ff98;
 LoggerFactory.getLogger().log(`%c For more details see ${__PACKAGE_URL__}`, "color: #98ff98;");
 
 /**
- * @param {string} targetId - The target div id to append the player.
  * @param {Object} config - The configuration of the player
  * @returns {Player} - The player instance
  */
-export function loadPlayer(targetId: string, config: ?Object) {
-  return new Player(targetId, config || {});
+export function loadPlayer(config: ?Object) {
+  return new Player(config || {});
 }
 
 // Export the media source adapters necessary utils