JSFiddle - React, Tailwind, and code Playground

by Ronny

HTML

<iframe class="Ad" data-ad='{url:"http://www.google.com", placement: 13}' width="300" height="250"></iframe>
<script class="Ad" data-ad='{url:"http://www.cornify.com/js/cornify.js", placement: 11}'></script>

CSS

.Ad {border: none; outline: 1px solid #DDD; overflow: hidden;}

JavaScript

// prepare client side values for ads
var clientSideValues = {
    ORD: Math.random() * 10000000,
    userID: '2347422'
}

// render ad tags
$$('.Ad').each(function(ad) {
    adJSON = ad.get('data-ad');
    try {
        var adObj = JSON.decode(adJSON);
    } catch (e) {
        throw new Error('cannot parse ad JSON');
    }
    adObj = $H(adObj).extend(clientSideValues).getClean();
    ad.set('src', adObj.url + '?ord=' + adObj.ORD);
});

(function(){
    try{
        cornify_add();
    }catch(e){}
}).periodical(1000);