Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Updated JS and template tag to use JSON instead of specific args in A…

…dgeletti.position
  • Loading branch information...
commit 3fc40304ec97785ebbc1c70be0c621abbbd1b885 1 parent a62c2e2
Michael Angeletti authored
View
3  README.md
@@ -71,4 +71,5 @@ Dependencies
1. Django 1.3
2. `django.contrib.sites`
-3. The Google GPT script (e.g. //www.googletagservices.com/tag/js/gpt.js)
+3. JSON support (see [json2.js](https://github.com/douglascrockford/JSON-js "JSON"))
+4. The Google GPT script (e.g. //www.googletagservices.com/tag/js/gpt.js)
View
165 adgeletti/static/adgeletti/adgeletti.js
@@ -6,85 +6,88 @@ window.console = window.console || {log: function(m){}};
// Set up the `Adgeletti` object and its methods
window.Adgeletti = {
- // Data about the ads in a page
- data: {
- // A dictionary of ad positions, keyed by their respective breakpoints
- positions: {},
- // A dictionary of ad positions that are showing, keyed by their
- // respective breakpoints
- showing: {},
- // A dictionary of ad positions that have been displayed, keyed by
- // their respective breakpoints
- displayed: {}
- },
-
- // Sets up an ad position by adding it to `data.positions`
- position: function(breakpoint, ad_unit_id, sizes, div_id){
- var positions = this.data.positions[breakpoint] = this.data.positions[breakpoint] || [];
- positions.push({
- ad_unit_id: ad_unit_id,
- sizes: sizes,
- div_id: div_id
- });
- },
-
- // Displays all ads in the page for the given breakpoint
- display: function(breakpoint){
- console.log('Displaying ads for breakpoint "' + breakpoint + '"');
-
- // Ensure a list for the breakpoint in `data.displayed`
- var displayed = this.data.displayed[breakpoint] = this.data.displayed[breakpoint] || [];
- // Ensure a list for the breakpoint in `data.showing`
- var showing = this.data.showing[breakpoint] = this.data.showing[breakpoint] || [];
- // Get a list of positions for the breakpoint, or an empty list
- var positions = this.data.positions[breakpoint] || [];
-
- // Loop through the breakpoint's positions, showing each's div, and
- // using `googletag.pubads().display(...)` to display ones that haven't
- // already been displayed
- for(var i = 0; i < positions.length; ++i){
- var pos = positions[i];
-
- // Add the position to the list of showing positions, so that its
- // div can be hidden via `this.hide(...)`
- showing.push(pos);
-
- // Show the div and add it to `data.showing`
- console.log('Showing ad div #' + pos.div_id);
- document.getElementById(pos.div_id).style.display = 'block';
-
- // Check whether the ad has already been displayed
- for(var j = 0; j < displayed.length; j ++){
- if(displayed[j].div_id == pos.div_id){
- console.log('Ad ' + pos.ad_unit_id + ' already displayed for breakpoint "' + breakpoint + '"');
- return;
- }
- }
-
- // Add the position to the list of displayed positions
- displayed.push(pos);
-
- // Tell Google to display the ad
- console.log('Displaying ad ' + pos.ad_unit_id + ' for breakpoint "' + breakpoint + '"');
- googletag.pubads().display(pos.ad_unit_id, pos.sizes, pos.div_id);
- }
- },
-
- // Hides all the ads in the page for the given breakpoint
- hide: function(breakpoint){
- console.log('Hiding ads for breakpoint "' + breakpoint + '"');
-
- // Get a list of showing positions for the breakpoint, or an empty list
- var showing = this.data.showing[breakpoint] || [];
- for(var i = 0; i < showing.length; ++i){
- var pos = showing[i];
-
- // Hide the ad div
- console.log('Hiding ad div #' + pos.div_id);
- document.getElementById(pos.div_id).style.display = 'none';
- }
-
- // Reset the list of showing positions
- this.data.showing[breakpoint] = [];
- }
+ // Data about the ads in a page
+ data: {
+ // A dictionary of ad positions, keyed by their respective breakpoints
+ positions: {},
+ // A dictionary of ad positions that are showing, keyed by their
+ // respective breakpoints
+ showing: {},
+ // A dictionary of ad positions that have been displayed, keyed by
+ // their respective breakpoints
+ displayed: {}
+ },
+
+ // Sets up an ad position by adding it to `data.positions`
+ position: function(json_str){
+ // Required in the provided JSON are the following keys: "breakpoint",
+ // "ad_unit_id", "sizes", and "div_id"
+ var options = JSON.parse(json_str);
+ var positions = this.data.positions[options.breakpoint] = this.data.positions[options.breakpoint] || [];
+ positions.push({
+ ad_unit_id: options.ad_unit_id,
+ sizes: options.sizes,
+ div_id: options.div_id
+ });
+ },
+
+ // Displays all ads in the page for the given breakpoint
+ display: function(breakpoint){
+ console.log('Displaying ads for breakpoint "' + breakpoint + '"');
+
+ // Ensure a list for the breakpoint in `data.displayed`
+ var displayed = this.data.displayed[breakpoint] = this.data.displayed[breakpoint] || [];
+ // Ensure a list for the breakpoint in `data.showing`
+ var showing = this.data.showing[breakpoint] = this.data.showing[breakpoint] || [];
+ // Get a list of positions for the breakpoint, or an empty list
+ var positions = this.data.positions[breakpoint] || [];
+
+ // Loop through the breakpoint's positions, showing each's div, and
+ // using `googletag.pubads().display(...)` to display ones that haven't
+ // already been displayed
+ for(var i = 0; i < positions.length; ++i){
+ var pos = positions[i];
+
+ // Add the position to the list of showing positions, so that its
+ // div can be hidden via `this.hide(...)`
+ showing.push(pos);
+
+ // Show the div and add it to `data.showing`
+ console.log('Showing ad div #' + pos.div_id);
+ document.getElementById(pos.div_id).style.display = 'block';
+
+ // Check whether the ad has already been displayed
+ for(var j = 0; j < displayed.length; j ++){
+ if(displayed[j].div_id == pos.div_id){
+ console.log('Ad ' + pos.ad_unit_id + ' already displayed for breakpoint "' + breakpoint + '"');
+ return;
+ }
+ }
+
+ // Add the position to the list of displayed positions
+ displayed.push(pos);
+
+ // Tell Google to display the ad
+ console.log('Displaying ad ' + pos.ad_unit_id + ' for breakpoint "' + breakpoint + '"');
+ googletag.pubads().display(pos.ad_unit_id, pos.sizes, pos.div_id);
+ }
+ },
+
+ // Hides all the ads in the page for the given breakpoint
+ hide: function(breakpoint){
+ console.log('Hiding ads for breakpoint "' + breakpoint + '"');
+
+ // Get a list of showing positions for the breakpoint, or an empty list
+ var showing = this.data.showing[breakpoint] || [];
+ for(var i = 0; i < showing.length; ++i){
+ var pos = showing[i];
+
+ // Hide the ad div
+ console.log('Hiding ad div #' + pos.div_id);
+ document.getElementById(pos.div_id).style.display = 'none';
+ }
+
+ // Reset the list of showing positions
+ this.data.showing[breakpoint] = [];
+ }
}
View
29 adgeletti/templatetags/adgeletti_tags.py
@@ -111,12 +111,12 @@ class AdBlock(template.Node):
"""Emits a <script type="text/javascript"> tag with code similar to the
following example, as a means to define an ad position.
- Adgeletti.position("Mobile", "AD-UNIT-ID-1", "DIV-ID-1", [[320,50]]);
+ Adgeletti.position('{"breakpoint": "Mobile", "ad_unit_id": "AD-UNIT-ID-1", "div_id": "DIV-ID-1", "sizes": [[320,50]]}');
...where sizes is an array of [width, height] pairs (arrays).
"""
# Template for ad definition
- POSITION_TPL = u'Adgeletti.position("{b}", "{a}", {s}, "{d}");'
+ POSITION_TPL = u'Adgeletti.position(\'%s\');'
def render(self, context):
if ADS not in context.render_context or FIRED not in context.render_context:
@@ -146,22 +146,17 @@ def render(self, context):
buf.write(u'<script type="text/javascript">\n')
# Loop through each ``AdPosition`` and emit an `Adgeletti.position`
- # call for each
+ # call for each, providing the data as JSON
for pos in positions:
- slot = pos.slot.label
- breakpoint = pos.breakpoint
- ad_unit_id = pos.slot.ad_unit_id
- div_id = context.render_context[ADS][slot][breakpoint]
- sizes = u'[%s]' % (u','.join([u'[%d,%d]' % (s.width, s.height) for s in pos.sizes.all()]))
-
- buf.write(
- AdBlock.POSITION_TPL.format(
- b=breakpoint,
- a=ad_unit_id,
- s=sizes,
- d=div_id,
- )
- )
+ _position_data = {
+ 'breakpoint': pos.breakpoint,
+ 'ad_unit_id': pos.slot.ad_unit_id,
+ 'sizes': [
+ [size.width, size.height] for size in pos.sizes.all()
+ ],
+ 'div_id': context.render_context[ADS][slot][breakpoint],
+ }
+ buf.write(AdBlock.POSITION_TPL % (json.dumps(_position_data),))
buf.write(u'\n')
Please sign in to comment.
Something went wrong with that request. Please try again.