Embed guide

1. JavaScript

<html>
    <head>
        <!-- 1. add player source -->
        <script src="PLAYER_SOURCE.js"></script>
    </head>
    <body>

        <!-- 2. add player container element -->
        <div style="width: 890px;height: 500px;background: black;" id="PLAYER_DOM_ID"></div>

        <script type="text/javascript">

            /** 3. setup player configuration object */
            var playerConfig = {
                dataProvider: {
                    source: [
                        { url: "http://bradmax.com/static/video/tears_of_steel.mp4" }
                    ]
                }
            };

            /** 4. get player container element */
            var element = document.getElementById("PLAYER_DOM_ID");

            /** 5. initialize player */
            var player = window.bradmax.player.create(element, playerConfig);

        </script>

  </body>
</html>

2. HTML

bradmax player html script tag attributes:

<html>
    <body>

        <!-- 1. add player container element -->
        <div style="width: 890px; height: 500px; background: black;" id="PLAYER_DOM_ID"></div>
        
        <!-- 2. setup player script element ** -->
        <script type="text/javascript" 
            src="PLAYER_SOURCE.js" 
            data-bs-parent-id="PLAYER_DOM_ID" 
            data-bs-variables="%7BdataProvider%3A%20%7Bsource%3A%20%5B%7Burl%3A%20%22http%3A%2F%2Fbradmax.com%2Fstatic%2Fvideo%2Ftos%2F440272.mpd%22%7D%5D%7D%7D">
        </script>

    </body>
</html>

3. Mixed

<html>

    <body>

        <!-- 1. add player container element -->
        <div style="width: 890px; height: 500px; background: black;" id="PLAYER_DOM_ID"></div>

        <!-- 2. build player -->
        <script type="text/javascript">

            /** 2.a. setup player configuration */
            var playerConfig = {
                dataProvider: {
                    source: [
                        { url: "http://bradmax.com/static/video/tears_of_steel.mp4" }
                    ]
                }
            };

            /** 2.b. create HTML script element  */
            var script = document.createElement("script");

            /** 2.c. setup HTML script element  */
            var playerConfigStr = escape(JSON.stringify(playerConfig));
            script.setAttribute("data-bs-variables", playerConfigStr);
            script.setAttribute("data-bs-parent-id", "PLAYER_DOM_ID");
            script.setAttribute("src", "PLAYER_SOURCE.js");
            script.setAttribute("async", "true");
            script.setAttribute("type", "text/javascript");

            /** 2.d. append HTML script element to page DOM tree */
            var head = document.getElementsByTagName("head")[0];
            head.appendChild(script);

        </script>

    </body>
</html>