O2 Player DS response remove polyfill

In this example below you will see how to do a O2 Player DS response remove polyfill with some HTML / CSS and Javascript

Thumbnail
This awesome code was written by creativeadea, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright creativeadea ©
  • HTML
  • CSS
  • JavaScript
<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>O2 Player DS response remove polyfill</title>
  
  
  
      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>

  <div class="player-container">

  <!-- TAG START { player: "An eSports Stadium Is Being Built For $10 Million", owner: "Roscoe Stanley Productions", for: "AOL Management" } -->
  <div id="5ab21d7f9f25111f19f0a6d4" style="position:relative; width: 100%; height: 60px; padding-bottom: 56.25%; background:  #f2f2f2;">
    <div class="vdb_player vdb_5ab21d7f9f25111f19f0a6d4545db032e4b0af1a81424b48" vdb_params="m.loadingplaceholder=1" style="position: absolute; width: 100%; height: 100%; top: 0; left: 0;"></div>
  </div>
  <!-- TAG END { date: 03/21/18 } -->

</div>
  
  

    <script  src="js/index.js"></script>




</body>

</html>

/*Downloaded from https://www.codeseek.co/creativeadea/o2-player-ds-response-remove-polyfill-qorGBB */
.player-container {
  max-width: 640px;
}

/*Downloaded from https://www.codeseek.co/creativeadea/o2-player-ds-response-remove-polyfill-qorGBB */
(function() {
    _({
        "status": {
            "code": "OK"
        },
        "jsVersion": "17.20.1320",
        "id": "5ab21d7f9f25111f19f0a6d4",
        "wlcid": "551c163d1146fb1188cea145",
        "bid": {
            "id": "5ab21d7d16d7e20001b1f836",
            "videos": [{
                "videoId": "5ab17a74868e800d743194b3",
                "name": "An eSports Stadium Is Being Built For $10 Million",
                "description": "Almost all of us have been to at least one giant sports arena. Texas is actually building a brand new $10 million stadium and it will be just for video games. In fact, it will be the biggest eSports venue in America. The 100,000 square foot eSports venue will hold up to 1,000 spectators and it will be open 24/7, since eSport events last a lot longer than traditional sports. It will have the vibe of a high-end sports bar, which lounge area, large TVs and public gaming areas. The main theatre is adjustable to fit the size of the crowd. If you’re shocked that so much money and effort is being put into the stadium, you shouldn’t be, as video games draw major crowds. A Beijing stadium drew a crowd of 40,000 people for the championships for “League of Legends.” The stadium is a joint project between the city of Arlington, eSports venues, and the architecture firm populous. Given that eSports will be a projected $2.3 billion industry in 2022, the state will soon have a stadium that’s suitable for all of the buzz and crowds. Maybe soon, we’ll be going to eSports games like we go to baseball of football games.",
                "videoUrls": ["https://hlsrv.vidible.tv/prod/5ab17a74868e800d743194b3/2018-03-20/hls/playlist_v1.m3u8?PR=E&S=IBL7sKxb5tUWs34qjLWf5mqKkmvUr-8x6BPAx2Bqa9tPOwwpCC7lysXHxSAqUmbl", "https://videos.vidible.tv/prod/5ab17a74868e800d743194b3/2018-03-20/5ab17a74868e800d743194b3_720x720_v1.mp4?klLVqvRgxXYoDSF2_oPNxgwj3rNe7yBkrUnc1czwtkpOMDYL7BpBZ7EslASbCDHY"],
                "thumbnailId": "5ab17a74cbef8d1b98507292",
                "thumbnail": "https://cdn-ssl.vidible.tv/prod/2018-03/20/5ab17a74868e800d743194b3/5ab17a74cbef8d1b98507292_60x60_F_v0.jpg",
                "fullsizeThumbnail": "https://cdn-ssl.vidible.tv/prod/2018-03/20/5ab17a74868e800d743194b3/5ab17a74cbef8d1b98507292_o_F_v0.jpg",
                "captions": {},
                "metadata": {
                    "duration": 78895,
                    "publishDate": 1521598058000,
                    "keywords": ["innovation", "NowThis", "NowThis News", "eSports", "sports", "MV1", "video games"],
                    "videoType": "VOD",
                    "commonRating": {
                        "value": "G",
                        "descriptors": [],
                        "minAge": 0
                    }
                },
                "videoSourceType": "FILE",
                "rssVideoId": "https://www.nowthisnews.com/node/5008415?utm_medium%3DRSS%26utm_source%3Dfeeds",
                "iabCategories": [{
                    "id": "/AOL20",
                    "name": "/Sports"
                }],
                "partnerName": "NowThis Media LLC",
                "studioName": "NowThis News",
                "trailer": {
                    "gifs": [{
                        "url": "https://cdn-ssl.vidible.tv/prod/2018-03/20/5ab17a74868e800d743194b3/trailer/5ab17a74868e800d743194b3_eu_240x240.gif",
                        "size": "small"
                    }],
                    "videos": [{
                        "url": "https://cdn-ssl.vidible.tv/prod/2018-03/20/5ab17a74868e800d743194b3/trailer/5ab17a74868e800d743194b3_eu_240x240.mp4",
                        "size": "small"
                    }, {
                        "url": "https://cdn-ssl.vidible.tv/prod/2018-03/20/5ab17a74868e800d743194b3/trailer/5ab17a74868e800d743194b3_eu_720x720.mp4",
                        "size": "large"
                    }]
                },
                "cuePoints": [],
                "cs": {
                    "priority": false
                }
            }]
        },
        "playerTemplate": {
            "initialization": "autoplay",
            "mobileInit": "AUTOPLAY",
            "mobileAutoplayWifiOnly": true,
            "fullscreenOnUnmute": false,
            "previewPoster": "ANIMATED",
            "sound": "normal",
            "unmuteUx": "UNMUTE_BUTTON",
            "initialVolume": 1.0,
            "videosToPlay": 10,
            "videosToRequest": 10,
            "shuffleVideos": true,
            "prerollFrequency": 0,
            "backgroundSkinLocation": {
                "x": 0,
                "y": 0,
                "w": 0,
                "h": 0
            },
            "controlsSkin": "https://cdn-ssl.vidible.tv/prod/player/swf/17.06.352/ControlsAOL_5.swf",
            "html5Skin": "skin6",
            "controlsSkinLocation": {
                "x": 0,
                "y": 0,
                "w": 640,
                "h": 300
            },
            "videoLocation": {
                "x": 0,
                "y": 0,
                "w": 640,
                "h": 300
            },
            "afterVideosUI": "next",
            "scrubBarSkin": "https://cdn-ssl.vidible.tv/prod/2013-03/10/511e8160e4b0bf40bd0340a7_v2.swf",
            "coveringsSkinLocation": {
                "x": 0,
                "y": 0,
                "w": 640,
                "h": 300
            },
            "surroundSkinLocation": {
                "x": 0,
                "y": 0,
                "w": 0,
                "h": 0
            },
            "playerWidth": 640,
            "playerHeight": 360,
            "controlsAutoPosition": true,
            "controlsChromeless": true,
            "controlsBackgroundAlpha": "1.0",
            "controlsConfig": {
                "colorSchema": {
                    "mainColor": {
                        "backgroundColor": 16777215,
                        "backgroundAlpha": 1.0
                    }
                }
            },
            "nielsenSiteCampaign": "nlsn31325",
            "nielsenChannelCampaign": "cmp185270",
            "backgroundFill": true,
            "backgroundColor": 0,
            "surround3DBevelShadowColor": 16777215,
            "surround3DBevelHighlightColor": 16777215,
            "surroundInnerRadius": 0,
            "surroundCornerRadius": 0,
            "surroundHole": false,
            "surround3D": false,
            "surround3DBevelSize": 0,
            "surround3DBevelStrength": 0.0,
            "extras": [{
                "extraId": "55388b54e4b099bcc1225caa",
                "config": {
                    "backButton": {
                        "x": 0.0,
                        "width": 0.0,
                        "y": 0.0,
                        "height": 0.0
                    },
                    "nextButton": {
                        "x": 0.0,
                        "width": 0.0,
                        "y": 0.0,
                        "height": 0.0
                    },
                    "thumbHeight": "100%",
                    "backgroundAlpha": 0.0,
                    "gap": 3,
                    "alwaysOnScreen": "true"
                },
                "uiPosition": "BOTTOM",
                "region": {
                    "x": 0,
                    "y": 300,
                    "w": 640,
                    "h": 60
                },
                "blocking": false,
                "urls": {
                    "JS": "https://cdn-ssl.vidible.tv/prod/player/js/17.20.1320/extras/bottomrelated.js",
                    "FLASH": "https://cdn-ssl.vidible.tv/prod/player/swf/17.06.352/AOL_5_MotionCarousel.swf"
                },
                "subType": "CAROUSEL"
            }, {
                "extraId": "57ec9f14cc52c708cdb6a71b",
                "config": {
                    "LookAndFeel": null,
                    "PromoSettings": null
                },
                "uiPosition": "DEFAULT",
                "region": {
                    "x": 0,
                    "y": 0,
                    "w": 0,
                    "h": 0
                },
                "blocking": false,
                "urls": {
                    "JS": "https://cdn-ssl.vidible.tv/prod/player/js/17.20.1320/extras/upnextpromo.js"
                },
                "subType": "COMMON"
            }, {
                "extraId": "560bf017e4b02888bfc1f287",
                "config": {
                    "closeButton": null
                },
                "uiPosition": "DEFAULT",
                "region": {
                    "x": 0,
                    "y": 0,
                    "w": 0,
                    "h": 0
                },
                "blocking": true,
                "urls": {
                    "CORE": "https://cdn-ssl.vidible.tv/prod/player/js/17.20.1320/extras/floater.js"
                },
                "subType": "COMMON"
            }, {
                "extraId": "5a74958b4db5ff5a1962ad24",
                "uiPosition": "DEFAULT",
                "region": {
                    "x": 0,
                    "y": 0,
                    "w": 0,
                    "h": 0
                },
                "blocking": false,
                "urls": {
                    "CORE": "https://cdn-ssl.vidible.tv/prod/player/js/17.20.1320/extras/activitysensor.js"
                },
                "subType": "COMMON"
            }, {
                "extraId": "553e2d62e4b0f04ad3ca2560",
                "uiPosition": "DEFAULT",
                "region": {
                    "x": 0,
                    "y": 0,
                    "w": 0,
                    "h": 0
                },
                "blocking": false,
                "urls": {
                    "CORE": "https://cdn-ssl.vidible.tv/prod/player/js/17.20.1320/extras/nielsen_ocr.js"
                },
                "subType": "COMMON"
            }, {
                "extraId": "542e79b3e4b0b1e0a0e7e04c",
                "uiPosition": "DEFAULT",
                "region": {
                    "x": 0,
                    "y": 0,
                    "w": 0,
                    "h": 0
                },
                "blocking": true,
                "urls": {
                    "JS": "https://cdn-ssl.vidible.tv/prod/player/js/17.20.1320/extras/comscorestreamsense.js",
                    "FLASH": "https://cdn-ssl.vidible.tv/prod/player/swf/17.06.352/stream-sense-stacked-reporting.swf"
                },
                "subType": "COMMON"
            }, {
                "extraId": "55374b4ae4b0d985a76dd9df",
                "uiPosition": "DEFAULT",
                "region": {
                    "x": 0,
                    "y": 0,
                    "w": 0,
                    "h": 0
                },
                "blocking": true,
                "urls": {
                    "CORE": "https://cdn-ssl.vidible.tv/prod/player/js/17.20.1320/extras/comscorevmx.js"
                },
                "subType": "COMMON"
            }, {
                "extraId": "5a8edbd4c214e307ad9e8890",
                "uiPosition": "DEFAULT",
                "region": {
                    "x": 0,
                    "y": 0,
                    "w": 0,
                    "h": 0
                },
                "blocking": false,
                "urls": {
                    "CORE": "https://cdn-ssl.vidible.tv/prod/player/js/17.20.1320/extras/intentionscore.js"
                },
                "subType": "COMMON"
            }, {
                "extraId": "552e2ea3e4b01ea94a2831d3",
                "uiPosition": "DEFAULT",
                "region": {
                    "x": 0,
                    "y": 0,
                    "w": 0,
                    "h": 0
                },
                "blocking": true,
                "urls": {
                    "CORE": "https://cdn-ssl.vidible.tv/prod/player/js/17.20.1320/extras/nielsen_dcr.js"
                },
                "subType": "COMMON"
            }],
            "publisherPayout": "None",
            "publisherAmount": 0.0,
            "metaData": {},
            "showLogo": false,
            "autoplayInView": 0,
            "autoPauseOutOfView": "ALWAYS",
            "vrRenderer": "O2",
            "subtitleSettings": {
                "mode": "ENABLE",
                "defaultLanguage": "AUTO_DETECT",
                "machineTranslation": false
            },
            "isResponsive": true,
            "csid": "58172559cc52c73a8537bbbf",
            "HLSExtra": "https://cdn-ssl.vidible.tv/prod/player/swf/17.06.352/hls-plugin.swf",
            "IMAExtra": "https://cdn-ssl.vidible.tv/prod/player/swf/17.06.352/ima-ad-module.swf",
            "YuMeExtra": "https://cdn-ssl.vidible.tv/prod/player/swf/17.06.352/yume-ad-module.swf",
            "FreeWheelExtra": "https://cdn-ssl.vidible.tv/prod/player/swf/17.06.352/free-wheel-module.swf",
            "VASTExtra": "https://cdn-ssl.vidible.tv/prod/player/swf/17.06.352/vast-ad-engine.swf",
            "PlayerAdSystem": "https://cdn-ssl.vidible.tv/prod/player/swf/17.06.352/vidible-ad-server.swf",
            "UIExtra": "https://cdn-ssl.vidible.tv/prod/player/swf/17.06.352/controls-sticky.swf",
            "AgeGateExtra": "https://cdn-ssl.vidible.tv/prod/player/swf/17.06.352/age-gate.swf",
            "SubtitlesExtra": "https://cdn-ssl.vidible.tv/prod/player/swf/17.06.352/subtitles.swf",
            "ClickExtra": "https://cdn-ssl.vidible.tv/prod/player/swf/17.06.352/click-throughs.swf"
        },
        "timestamp": "20180321132512706",
        "adSettings": {
            "podSize": 1,
            "prerollInterleave": 1,
            "strictSiteCheckForAds": false,
            "blockContentOnAdBlocker": false,
            "domainOptimisation": true,
            "adStrategy": "CONTENT_BASED",
            "useSsai": false,
            "companions": [],
            "aeg": [],
            "asids": []
        },
        "playerWidget": {
            "playerType": "HTML5",
            "url": "https://cdn-ssl.vidible.tv/prod/player/swf/17.06.352/player-vast.swf",
            "adOnly": false,
            "isAol": true
        },
        "geo": {
            "country": "gbr",
            "region": "rdb",
            "zipCode": "e18 1",
            "areaCode": "0",
            "connSpeed": "cable",
            "latitude": "51.5866",
            "longitude": "0.0804"
        },
        "brandedContent": false,
        "sid": "d3adebe4-0cac-4d4c-a94c-fdb18051ac0d",
        "bcInfo": {
            "sid": "577",
            "sKey": "0",
            "networkId": 92736,
            "fwsitesection": 48085,
            "oo": true
        },
        "bsf": {
            "bs": {
                "l": "GREEN",
                "t1": ["Business"],
                "t2": ["Marketing"],
                "rtb": ["IAB3-11"],
                "r": 128202
            },
            "f": {
                "o2": 0.0
            }
        }
    });

    function _(json) {
        
        var cl = "vdb_5ab21d7f9f25111f19f0a6d4545db032e4b0af1a81424b48";
        var containers = document.getElementsByClassName(cl);
        var idx = containers.length;
        var c = containers[0];
        if (document.currentScript) {
            while (--idx > 0) {
                if (document.currentScript.parentNode == containers[idx]) {
                    c = containers[idx];
                    break;
                }
            }
        }
        c.className = c.className.replace(new RegExp("(\\s*)" + cl + "\\s*", "g"), "$1");
        var utilsObj = {
            GUID: function() {
                var ts = 20180321132512706 || 0;
                if (typeof ts !== 'number') {
                    ts = parseInt(ts, 10) || 0;
                }

                var d = utilsObj.numberizeUrl() + new Date().getTime() + ts;
                if (window.performance && typeof window.performance.now === "function") {
                    d += performance.now();
                }
                var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
                    var r = (d + Math.random() * 16) % 16 | 0;
                    d = Math.floor(d / 16);
                    return (c == 'x' ? r : (r & 0x3 | 0x8)).toString(16);
                });
                return uuid;
            },

            numberizeUrl: function() {
                var url = utilsObj.getPageUrl() || utilsObj.getDocumentReferrer();
                return utilsObj.numberizeString(url);
            },

            numberizeString: function(str) {
                var strNumber = 0;
                if (typeof str === "string") {
                    for (var i = 0, len = str.length; i < len; i++) {
                        strNumber += str.charCodeAt(i);
                    }
                }
                return strNumber;
            },

            getPageUrl: function() {
                try {
                    return window.top.location.href;
                } catch (e) {
                    return null;
                }
            },

            getDocumentReferrer: function() {
                try {
                    return window.top.document.referrer;
                } catch (e) {
                    return null;
                }
            },

            getTopMostWindow: function(currWindow) {
                var currP = currWindow || window;
                while (currP) {
                    try {
                        var newP = currP.parent;
                        // try to reach the document, if didn't succeed - goes to catch {}
                        var doc = newP.document;
                        if (!doc) break;
                        // reached the top
                        // newP is ok. use it.
                        currP = newP;
                        if (newP == newP.parent) break;

                    } catch (ex) {
                        break;
                    }
                }
                return currP;
            },

            getTopMostLocation: function(win) {
                var top = this.getTopMostWindow(win);
                if (top == window.top) {
                    return top.location.href;
                } else {
                    return top.document && top.document.referrer || top.location.href;
                }
            }

        };
        var vdb_params = c.getAttribute("vdb_params");
        var macro_params = "";
        if (vdb_params && macro_params) {
            vdb_params = vdb_params.concat("&");
        }
        var p = !vdb_params ? macro_params : macro_params === "" ? vdb_params : removeDuplicateParams(vdb_params + macro_params);

        function removeDuplicateParams(params) {
            var paramsArr = params.split('&');
            var keysMap = {};
            var result = [];
            for (var i = 0; i < paramsArr.length; i++) {
                var kvArr = paramsArr[i].split('=');
                if (kvArr[0] && !keysMap[kvArr[0]]) {
                    keysMap[kvArr[0]] = true;
                    result.push(paramsArr[i]);
                }
            }
            return result.join('&');
        }
        var cb = /(?:[\?&]|^)m\.cb=(.*?)(&m\..*?=|$)/g.exec(p);
        cb = cb && cb[1] || Math.random();
        var ur = /(?:[\?&]|^)m\.url=(.*?)(&m\..*?=|$)/g.exec(p);
        ur = ur && ur[1];

        function ee(pn, v, dv) {
            var ve = dv && dv(v) || v;
            if (ve == v) {
                try {
                    ve = decodeURIComponent(v);
                    ve = encodeURIComponent(ve);
                } catch (e) {
                    ve = encodeURIComponent(v);
                }
            }
            p = p.replace("m." + pn + "=" + v, "m." + pn + "=" + ve);
            v = ve;
            return v;
        }

        ee("url", ur);
        p += p && "&";
        var ifr = window != top;
        var r = encodeURIComponent(utilsObj.getTopMostLocation());
        var i = document.createElement("img");
        var it = new Date().getTime();
        var pt = "html5";
        var sid = "d3adebe4-0cac-4d4c-a94c-fdb18051ac0d";

        var scriptParams = "ifr=" + ifr + "&pt=" + pt + "&sid=" + sid + "&" + p + "r=" + r;
        var pixelParams = scriptParams + "&cb=" + cb;
        i.src = "https://trk.vidible.tv/trk/impression.gif?pid=5ab21d7f9f25111f19f0a6d4&bcid=545db032e4b0af1a81424b48&s=true&pv=17.20.1320&" + pixelParams;
        i = document.createElement("img");
        i.src = "https://trk.vidible.tv/trk/js-loaded.gif?pid=5ab21d7f9f25111f19f0a6d4&bcid=545db032e4b0af1a81424b48&s=true&" + pixelParams;
        var s = document.createElement("script");
        s.type = "text/javascript";
        s.crossOrigin = "anonymous";
        s.src = "https://cdn-ssl.vidible.tv/prod/player/js/17.20.1320/vidible-min.js?embedtag=1";
        s.onload = function() {
            var options = {
                pid: "5ab21d7f9f25111f19f0a6d4",
                bcid: "545db032e4b0af1a81424b48",
                params: p,
                it: it,
                site: r,
                pt: pt,
                sid: sid,
                generateGUID: utilsObj.GUID
            }
            options.content = c;
            var pl = vidible.createPlayer(options, json, {
                "cdn": "https://cdn-ssl.vidible.tv/prod/",
                "trk": "https://trk.vidible.tv/trk/",
                "ds": "https://delivery.vidible.tv/",
                "ads": "https://video.adaptv.advertising.com/",
                "adt": "https://ads-trk.vidible.tv/",
                "ptv": "https://portal.vidible.tv/"
            });
            var i = document.createElement("img");
            i.src = "https://trk.vidible.tv/trk/js-started.gif?pid=5ab21d7f9f25111f19f0a6d4&bcid=545db032e4b0af1a81424b48&s=true&" + pixelParams;
            var clb = window['vidibleInitialize'];
            if (clb) {
                if (typeof pl.then === 'function') {
                    pl.then(clb);
                } else {
                    clb(pl);
                }
            }
            s.onload = s.onreadystatechanged = function() {};
        };
        s.onreadystatechange = function() {
            if (s.readyState == 'complete' || s.readyState == 'loaded') {
                s.onload();
            }
        };
        c.appendChild(s);
        var l = document.createElement("link");
        l.href = "https://cdn-ssl.vidible.tv/prod/player/js/17.20.1320/html5/player-hls-latest-min.js";
        l.rel = "preload";
        l.as = "script";
        c.appendChild(l);
    }
})();

Comments