responsiveAds.js

var freeWheel = {

  /**
   * Configure correct ad width and height
   * @returns {undefined}
   */

  setAdWidthHeight: function () {
    var adWidth,
        adHeight,
        $input,
        inputNewValue,
        $spanParent,
        $adContainer,
        slid,
        slau;

    for(var i = 0, len = this.config.$ads.length; i < len; i++) {

      /**
       * Find correct width, height, slau and slid
       */

      if(this.getBreakpoint() === 'desktop') {
        adWidth = this.config.$ads[i].dataset.dw;
        adHeight = this.config.$ads[i].dataset.dh;
        slau = this.config.$ads[i].dataset.dslau;
        slid = this.config.$ads[i].dataset.dslid;
      } else if (this.getBreakpoint() === 'tablet') {
        adWidth = this.config.$ads[i].dataset.tw;
        adHeight = this.config.$ads[i].dataset.th;
        slau = this.config.$ads[i].dataset.tslau;
        slid = this.config.$ads[i].dataset.tslid;
      } else {
        adWidth = this.config.$ads[i].dataset.mw;
        adHeight = this.config.$ads[i].dataset.mh;
        slau = this.config.$ads[i].dataset.mslau;
        slid = this.config.$ads[i].dataset.mslid;
      }

      /**
       * Apply correct width and height for ad
       * and prepare markup for ad.
       */

      if(adWidth && adHeight) {
        $input = this.config.$ads[i].querySelector('input');
        $spanParent = this.config.$ads[i].parentNode;
        $adContainer = $spanParent.querySelector('._fwac');

        /**
         * Change classes.
         */

        if(slid !== $spanParent.id) {
          $spanParent.id = slid;
          $input.id = '_fw_input_' + slid;
          $input.name = '_fw_input' + slid;
          $adContainer.id = '_fw_container_' + slid;
          this.config.$ads[i].id = '_fw_form_' + slid;
        }

        /**
         * Generate input value
         * 'ptgt=s&w=[AdWidth]&h=[adHeight]&slau=[slau]'
         */


        inputNewValue = 'ptgt=s&w=' + adWidth + '&h=' + adHeight + '&slau=' + slau;
        $input.value = inputNewValue;

        /**
         * Remove ad. Prepare space for new ad.
         */

        while($adContainer.firstChild) {
          $adContainer.removeChild($adContainer.firstChild);
        }
      }
    }
    this.setApiConfig();
  },


  /**
   * Get current breakpoint
   * @returns {string}
   */

  getBreakpoint: function () {
    return (window.innerWidth <= 640) ? 'mobile' :
      (window.innerWidth <= 1024) ? 'tablet' : 'desktop';
  },

  /**
   * Set configuration for freewheel
   * @returns {undefined}
   */

  setApiConfig: function () {
    var profilePath = Drupal.settings.foxFreewheelCoreSettings.profile_path,
      serverUrl = Drupal.settings.foxFreewheelCoreSettings.server_url,
      profileID = Drupal.settings.foxFreewheelCoreSettings.profile_id,
      networkID = Drupal.settings.foxFreewheelCoreSettings.network_id,
      csID = Drupal.settings.foxFreewheelCoreSettings.csid;

    if(profilePath === '') {
      profilePath = 'fox_test';
      Drupal.settings.foxFreewheelCoreSettings.profile_path = profilePath;
    }

    if(this.getBreakpoint() === 'tablet') {
      csID = csID.replace('www', 'mtab');
    } else if (this.getBreakpoint() === 'mobile') {
      csID = csID.replace('www', 'mweb');
    } else {
      csID = csID.replace('mtab', 'www');
      csID = csID.replace('mweb', 'www');
    }

    /*
     * Override default settings.
     */
    Drupal.settings.foxFreewheelCoreSettings.csid = csID;

    /*
     * Set configuration
     */

    window._fw_linktag_params = {
      scan_delay : 0,
      allow_rescan_after: 1,
      server : serverUrl,
      network_id : networkID,
      profile : profileID,
      other_global_params : "csid="+ csID,
      key_values :  "_fw_fss=_fw_search"
    };
    this.appendAdApi();
  },

  /**
   * Append API for ads.
   * @returns {undefined}
   */

  appendAdApi: function () {
    /**
     * Prepare config to reinit
     * LinktTag2 script.
     */

    window._fw_page_ready = true;
    window._fw_admanager = undefined;
    setTimeout(function () {
      $.getScript('http://adm.fwmrm.net/p/' + Drupal.settings.foxFreewheelCoreSettings.profile_path + '/LinkTag2.js', function () {
      });
    }, 1000);
  },

  /**
   * Bind resize event we need to refresh ad
   * on breakpoint change.
   * @returns undefined
   */

  bindResizeEvent: function () {
    window.addEventListener('resize', this.preprocessAds.bind(this));
  },

  /**
   * configuration and refreshing
   * ads
   * @returns {undefined}
   */

  preprocessAds: function () {
    var bp = this.getBreakpoint();

    if(bp !== this.config.currentBP || !this.config.isAdProcessed) {
      this.config.isAdProcessed = true;
      this.setAdWidthHeight();
    }
    this.config.currentBP = bp;
  },

  config: {
    $ads: document.querySelectorAll('.block-content form[data-dw]'),
    currentBP: '',
    isAdProcessed: true
  },

  init: function () {
    this.config.currentBP = this.getBreakpoint();
    var that = this;
    that.setAdWidthHeight();
    that.bindResizeEvent();
    $('.lrec-general').show();
  }
};

if(isWatchPage) {
  $document.ready(function () {
    freeWheel.init();
  });
}