Merge pull request #40 from nlalonde/mobile-sizes

add ad sizes settings for mobile DFP

assets/javascripts/discourse/components/google-dfp-ad.js.es6

@@ -62,14 +62,10 @@ function defineSlot(divId, placement, settings, isMobile) {
     return ads[divId];
   }
 
-  if (isMobile) {
-    // There are no settings for customizing the mobile ad sizes.
-    width = 320;
-    height = 50;
-  }
-
   if (placement === "topic-list-top" && settings.dfp_topic_list_top_code && settings.dfp_topic_list_top_ad_sizes) {
     if (isMobile) {
+      width = parseInt(splitWidthInt(settings.dfp_mobile_topic_list_top_ad_sizes));
+      height = parseInt(splitHeightInt(settings.dfp_mobile_topic_list_top_ad_sizes));
       ad = window.googletag.defineSlot('/' + settings.dfp_publisher_id + '/' + settings.dfp_mobile_topic_list_top_code, [width,height], divId).addService(window.googletag.pubads());
       custom_targeting((keyParse(Discourse.SiteSettings.dfp_target_topic_list_top_key_code)), (keyParse(settings.dfp_target_topic_list_top_value_code)), ad);
     } else {
@@ -80,6 +76,8 @@ function defineSlot(divId, placement, settings, isMobile) {
     }
   } else if (placement === "topic-above-post-stream" && settings.dfp_topic_above_post_stream_code && settings.dfp_topic_above_post_stream_ad_sizes) {
     if (isMobile) {
+      width = parseInt(splitWidthInt(settings.dfp_mobile_topic_above_post_stream_ad_sizes));
+      height = parseInt(splitHeightInt(settings.dfp_mobile_topic_above_post_stream_ad_sizes));
       ad = window.googletag.defineSlot('/' + settings.dfp_publisher_id + '/' + settings.dfp_mobile_topic_above_post_stream_code, [width,height], divId).addService(window.googletag.pubads());
       custom_targeting((keyParse(settings.dfp_target_topic_above_post_stream_key_code)), (keyParse(settings.dfp_target_topic_above_post_stream_value_code)), ad);
     } else {
@@ -90,6 +88,8 @@ function defineSlot(divId, placement, settings, isMobile) {
     }
   } else if (placement === "topic-above-suggested" && settings.dfp_topic_above_suggested_code && settings.dfp_topic_above_suggested_ad_sizes) {
     if (isMobile) {
+      width = parseInt(splitWidthInt(settings.dfp_mobile_topic_above_suggested_ad_sizes));
+      height = parseInt(splitHeightInt(settings.dfp_mobile_topic_above_suggested_ad_sizes));
       ad = window.googletag.defineSlot('/' + settings.dfp_publisher_id + '/' + settings.dfp_mobile_topic_above_suggested_code, [width,height], divId).addService(window.googletag.pubads());
       custom_targeting((keyParse(settings.dfp_target_topic_above_suggested_key_code)), (keyParse(settings.dfp_target_topic_above_suggested_value_code)), ad);
     } else {
@@ -100,6 +100,8 @@ function defineSlot(divId, placement, settings, isMobile) {
     }
   } else if (placement === "post-bottom" && settings.dfp_post_bottom_code && settings.dfp_post_bottom_ad_sizes) {
     if (isMobile) {
+      width = parseInt(splitWidthInt(settings.dfp_mobile_post_bottom_ad_sizes));
+      height = parseInt(splitHeightInt(settings.dfp_mobile_post_bottom_ad_sizes));
       ad = window.googletag.defineSlot('/' + settings.dfp_publisher_id + '/' + settings.dfp_mobile_post_bottom_code, [width,height], divId).addService(window.googletag.pubads());
       custom_targeting((keyParse(settings.dfp_target_post_bottom_key_code)), (keyParse(settings.dfp_target_post_bottom_value_code)), ad);
     } else {

config/locales/server.en.yml

@@ -6,18 +6,21 @@ en:
     dfp_topic_list_top_code: "Enter the code of the ad unit to display above topic lists. This is the short code (max 100 chars) of the ad unit, not the JavaScript code."
     dfp_topic_list_top_ad_sizes: "Choose your ad size for the ad unit above topic lists."
     dfp_mobile_topic_list_top_code: "Enter the code of the ad unit to display above topic lists on mobile view. This is the short code (max 100 chars) of the ad unit, not the JavaScript code."
+    dfp_mobile_topic_list_top_ad_sizes: "Choose your ad size for the ad unit above topic lists on mobile view."
     dfp_target_topic_list_top_key_code: "Input custom targeting keys - inventory Level"
     dfp_target_topic_list_top_value_code: "Input custom targeting values - inventory Level"
 
     dfp_topic_above_post_stream_code: "Enter the code of the ad unit to display above the title of a topic on the topic page. This is the short code (max 100 chars) of the ad unit, not the JavaScript code."
     dfp_topic_above_post_stream_ad_sizes: "Choose your ad size for the ad unit at the top of the topic page."
     dfp_mobile_topic_above_post_stream_code: "Enter the code of the ad unit to display above the title of a topic on the topic page on mobile. This is the short code (max 100 chars) of the ad unit, not the JavaScript code."
+    dfp_mobile_topic_above_post_stream_ad_sizes: "Choose your ad size for the ad unit at the top of the topic page on mobile view."
     dfp_target_topic_above_post_stream_key_code: "Input custom targeting keys - inventory Level"
     dfp_target_topic_above_post_stream_value_code: "Input custom targeting values - inventory Level"
 
     dfp_topic_above_suggested_code: "Enter the code of the ad unit to display after the last post in a topic, above the suggested topics. This is the short code (max 100 chars) of the ad unit, not the JavaScript code."
     dfp_topic_above_suggested_ad_sizes: "Choose your ad size for the ad unit after the last post in a topic."
     dfp_mobile_topic_above_suggested_code: "Enter the code of the ad unit to display after the last post in a topic, above the suggested topics. This is the short code (max 100 chars) of the ad unit, not the JavaScript code."
+    dfp_mobile_topic_above_suggested_ad_sizes: "Choose your ad size for the ad unit after the last post in a topic on mobile view."
     dfp_target_topic_above_suggested_key_code: "Input custom targeting keys - inventory Level"
     dfp_target_topic_above_suggested_value_code: "Input custom targeting values - inventory Level"
 
@@ -25,6 +28,7 @@ en:
     dfp_post_bottom_code: "Enter the code of the ad unit to display in between posts after every nth post. This is the short code (max 100 chars) of the ad unit, not the JavaScript code."
     dfp_post_bottom_ad_sizes: "Choose your ad size for the ad unit shown in between posts."
     dfp_mobile_post_bottom_code: "Enter the code of the ad unit to display in between posts after every nth post on mobile. This is the short code (max 100 chars) of the ad unit, not the JavaScript code."
+    dfp_mobile_post_bottom_ad_sizes: "Choose your ad size for the ad unit shown in between posts on mobile view."
     dfp_target_post_bottom_key_code: "Input custom targeting keys - inventory Level"
     dfp_target_post_bottom_value_code: "Input custom targeting values - inventory Level"
 

config/settings.yml

@@ -121,6 +121,8 @@ dfp_plugin:
       - 300*250 - medium rectangle
       - 970*90 - large leaderboard
       - 468*60 - banner
+      - 320*50 - mobile leaderboard
+      - 160*600 - wide skyscraper
       - 234*60 - half banner
       - 125*125 - button
       - 180*150 - small rectangle
@@ -130,6 +132,20 @@ dfp_plugin:
     client: true
     default: ''
     max: 50
+  dfp_mobile_topic_list_top_ad_sizes:
+    client: true
+    default: '320*50 - mobile leaderboard'
+    type: enum
+    choices:
+      - 320*50 - mobile leaderboard
+      - 300*250 - medium rectangle
+      - 336*280 - large rectangle
+      - 160*600 - wide skyscraper
+      - 234*60 - half banner
+      - 125*125 - button
+      - 180*150 - small rectangle
+      - 200*200 - small square
+      - 250*250 - square
   dfp_target_topic_list_top_key_code:
     default: ''
     type: value_list
@@ -152,6 +168,8 @@ dfp_plugin:
       - 300*250 - medium rectangle
       - 970*90 - large leaderboard
       - 468*60 - banner
+      - 320*50 - mobile leaderboard
+      - 160*600 - wide skyscraper
       - 234*60 - half banner
       - 125*125 - button
       - 180*150 - small rectangle
@@ -161,6 +179,20 @@ dfp_plugin:
     client: true
     default: ''
     max: 50
+  dfp_mobile_topic_above_post_stream_ad_sizes:
+    client: true
+    default: '320*50 - mobile leaderboard'
+    type: enum
+    choices:
+      - 320*50 - mobile leaderboard
+      - 300*250 - medium rectangle
+      - 336*280 - large rectangle
+      - 160*600 - wide skyscraper
+      - 234*60 - half banner
+      - 125*125 - button
+      - 180*150 - small rectangle
+      - 200*200 - small square
+      - 250*250 - square
   dfp_target_topic_above_post_stream_key_code:
     default: ''
     type: value_list
@@ -183,6 +215,8 @@ dfp_plugin:
       - 300*250 - medium rectangle
       - 970*90 - large leaderboard
       - 468*60 - banner
+      - 320*50 - mobile leaderboard
+      - 160*600 - wide skyscraper
       - 234*60 - half banner
       - 125*125 - button
       - 180*150 - small rectangle
@@ -192,6 +226,20 @@ dfp_plugin:
     client: true
     default: ''
     max: 50
+  dfp_mobile_topic_above_suggested_ad_sizes:
+    client: true
+    default: '320*50 - mobile leaderboard'
+    type: enum
+    choices:
+      - 320*50 - mobile leaderboard
+      - 300*250 - medium rectangle
+      - 336*280 - large rectangle
+      - 160*600 - wide skyscraper
+      - 234*60 - half banner
+      - 125*125 - button
+      - 180*150 - small rectangle
+      - 200*200 - small square
+      - 250*250 - square
   dfp_target_topic_above_suggested_key_code:
     default: ''
     type: value_list
@@ -219,11 +267,31 @@ dfp_plugin:
       - 300*250 - medium rectangle
       - 970*90 - large leaderboard
       - 468*60 - banner
+      - 320*50 - mobile leaderboard
+      - 160*600 - wide skyscraper
       - 234*60 - half banner
+      - 125*125 - button
+      - 180*150 - small rectangle
+      - 200*200 - small square
+      - 250*250 - square
   dfp_mobile_post_bottom_code:
     client: true
     default: ''
     max: 50
+  dfp_mobile_post_bottom_ad_sizes:
+    client: true
+    default: '320*50 - mobile leaderboard'
+    type: enum
+    choices:
+      - 320*50 - mobile leaderboard
+      - 300*250 - medium rectangle
+      - 336*280 - large rectangle
+      - 160*600 - wide skyscraper
+      - 234*60 - half banner
+      - 125*125 - button
+      - 180*150 - small rectangle
+      - 200*200 - small square
+      - 250*250 - square
   dfp_target_post_bottom_key_code:
     default: ''
     type: value_list