Backbone Integration for googleAdSense

GoogleAS.js

window.adsbygoogle = window.adsbygoogle || [];

var async = ( typeof c != "undefined" && !_.isUndefined(c.script) ) ? c.sript : $.getScript;
async("//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js");

var GoogleAS = new Backbone.Model({
    id: 'GoogleAS',
    client: 'pub-9565436045946419',
    currentCount: 0,
    maxSlots: 3,

    increment: function () {
        return this.currentCount++;
    }
});

GoogleAS.Slots = {};

var Banner = Backbone.View.extend({

    el: '.banner',

    active: false,

    template: _.template('<ins class="adsbygoogle" style="display:inline-block;width:<%= width %>px;height:<%= height %>px" data-ad-client="ca-<%= pubID %>"></ins>'),

    options: {
        id: 0,
        width: 0,
        height: 0
    },

    initialize: function (options) {
        this.options.pubID = GoogleAS.get("client");
        this.el = options.el || this.el;

        if (this.validResolution()) {
            GoogleAS.set({'currentCount': ( GoogleAS.get('currentCount') + 1 ) });
            this.render();
            this.active = true;
        }
    },

    render: function () {
        var html = this.template(this.options);
        $(this.el).html(html);

        window.adsbygoogle.push({});
    },

    validResolution: function () {
        return window.innerWidth > this.options.minWidth;
    }
});

GoogleAS.Slots.Banner = Banner;

GoogleAS.Slots.MediumRect = Banner.extend({
    el: '.banner.MediumRect',
    options: {
        id: 5642970087,
        width: 300,
        height: 250,
        minWidth: 320,
        alt: 'Mobile'
    }
});

GoogleAS.Slots.Leaderboard = Banner.extend({
    el: '.banner.Leaderboard',
    options: {
        id: 8515711286,
        width: 728,
        height: 90,
        minWidth: 786
    }
});

GoogleAS.Slots.LargeLeaderboard = Banner.extend({
    el: '.banner.LargeLeaderboard',
    options: {
        id: 4069688485,
        width: 728,
        height: 300,
        minWidth: 786,
        alt: 'Leaderboard'
    }
});

GoogleAS.Slots.WideSkyscraper = Banner.extend({
    el: '.banner.WideSkyscraper',
    options: {
        id: 2469177685,
        width: 160,
        height: 600,
        minWidth: 1200
    }
});

GoogleAS.Slots.LargeSkyscraper = Banner.extend({
    el: '.banner.LargeSkyscraper',
    options: {
        id: 5546421683,
        width: 300,
        height: 600,
        minWidth: 1600,
        alt: 'WideSkyscraper'
    }
});

GoogleAS.Slots.Mobile = Banner.extend({
    el: '.banner.Mobile',
    options: {
        id: 0,
        width: 320,
        height: 50,
        minWidth: 0
    }
});

return GoogleAS;