mps+Fandango Ad Scaling

mps-fandango-scaling-component.js

<script>// Fandango Redesign Ad Scaling
mps._ready(function() {
  mps._scaleAd = function (adslot,forceratio) {
    var scaleclass = 'mps-has-scaled',
      adslot = adslot,
      adivgpt = mps._select('#'+mps.adslots[adslot]),
      aiframe = mps._select('#'+mps.adslots[adslot]+' iframe');
    mps._classHas(adivgpt,scaleclass) && mps._scaleAdRevert(adslot);
    if(typeof(aiframe)==='object' && typeof(adivgpt)==='object' && typeof(vpSize)==='object' && vpSize.getW() < aiframe.clientWidth) {
      var vpwidth = vpSize.getW(),
        sideoffset = Math.floor(aiframe.offsetLeft),
        scaleratio = typeof(forceratio)!='number' ? (vpwidth / (aiframe.clientWidth + (sideoffset * 2))) : forceratio,
        scaleratiob = typeof(forceratio)!='number' ? (vpwidth / aiframe.clientWidth) : forceratio,
        scaledwidth = Math.floor(aiframe.clientWidth * scaleratio),
        scaledwidthb = Math.floor(aiframe.clientWidth * scaleratiob),
        scaledheight = Math.floor(aiframe.clientHeight * scaleratiob);
      mps.__prescalestate = mps.__prescalestate || {};
      mps.__prescalestate['topbanner'] = { 'div':adivgpt.getAttribute('style'), 'iframe':aiframe.getAttribute('style') }
      aiframe.setAttribute('style',
        'zoom: 1;'+
        'scale:'+scaleratio+';'+
        '-moz-transform-origin: 0 0;'+
        '-moz-transform: scale('+scaleratio+');'+
        '-o-transform-origin: 0 0;'+
        '-o-transform: scale('+scaleratio+');'+
        '-webkit-transform-origin: 0 0;'+
        '-webkit-transform: scale('+scaleratio+');'+
        'transform-origin: 0 0;'+
        'transform: scale('+scaleratio+');'+
        'border: 0');
      adivgpt.setAttribute('style',
        ((scaleratio < 1) ? 'overflow: hidden;' : '')+
        'margin: 0 auto;'+
        'padding: 0;'+
        'height:'+scaledheight+'px;'+
        'width:'+scaledwidth+'px;');
      aiframe.setAttribute('data-scale',scaleratio);
      mps._classAdd(adivgpt,scaleclass);
      window.console && console.debug('[mps.scaleAd] /'+adslot+'/ Viewport Width: '+vpwidth+'px | Left Offset: '+sideoffset+'px | Right Offset: '+(vpwidth-(scaledwidth+sideoffset))+'px | Iframe Width: '+aiframe.clientWidth+'px | Scale Ratio (w): '+scaleratio+' | Scale Ratio (h): '+scaleratiob+' | Scaled Width: '+scaledwidth+'px <target:'+(scaledwidthb)+'>'+' | Scaled Height: '+scaledheight+'px '+mps._elapsed());
    } else {
      debugmode.log && console.debug('[mps.scaleAd] /'+adslot+'/ Scaling Bypass '+mps._elapsed());
    }
  }
  mps._scaleAdRevert = function(adslots) {
    var adslots = adslots;
    if(typeof(mps.__prescalestate)!='object') return false;
    if(typeof(adslots)=='string') adslots = [adslots];
    if(typeof(adslots)!='object') adslots = mps._keys(mps.__prescalestate);
    for(k in adslots) {
      var adslot = adslots[k],
      aiframe = mps._select('#'+mps.adslots[adslot]+' iframe'),
      adivgpt = mps._select('#'+mps.adslots[adslot]);
      if(typeof(aiframe)==='object' && typeof(vpSize)==='object' && typeof(mps.__prescalestate[adslot])=='object') {
        aiframe.setAttribute('style',mps.__prescalestate[adslot].iframe);
        adivgpt.setAttribute('style',mps.__prescalestate[adslot].div);
        delete mps.__prescalestate[adslot];
        debugmode.log && console.debug('[mps.scaleAd] /'+adslot+'/ Unscaling Complete '+mps._elapsed());
      } else {
        debugmode.log && console.debug('[mps.scaleAd] /'+adslot+'/ Unscaling Bypass (ad missing or already unscaled)'+mps._elapsed());
      }
    }
    return true;
  }
  mps._scaleAdAsync = function (adslot,forceratio) {
    if(typeof(adslot) != 'string') return false;
    var checkslotcount = 1, checkslotinterval = 250, checkslotmax = 12, slotminwidth = 300;
    mps.__adcheck = mps.__adcheck || {};
    var checkslot = function (recheckms) {
      mps.__adcheck['scale-'+adslot] = mps.__adcheck['scale-'+adslot] || {};
      if(typeof(mps.__adcheck['scale-'+adslot].timer)=='number') {
        clearTimeout(mps.__adcheck['scale-'+adslot].timer);
      }
      mps.__adcheck['scale-'+adslot] = {'ran':false,'attempts':checkslotcount};
      mps.__adcheck['scale-'+adslot].timer = setTimeout(function () {
        if(mps.selectAd(adslot) && mps._select('#'+mps.adslots[adslot]+' iframe').clientWidth >= slotminwidth) {
          debugmode.log && console.debug('[mps.scaleAd] /'+adslot+'/ Execute Scaling (on try '+checkslotcount+') '+mps._elapsed());
          mps._scaleAd(adslot,forceratio);
          mps.__adcheck['scale-'+adslot].ran = true;
          clearTimeout(mps.__adcheck['scale-'+adslot].timer);
          delete(mps.__adcheck['scale-'+adslot].timer);
        } else {
          //debugmode.log && console.debug('--['+adslot+']--> rechecking in '+checkslotinterval+'ms ('+checkslotcount+'/'+checkslotmax+') '+mps._elapsed());
          checkslotcount++;
          if(checkslotcount < checkslotmax) {
            checkslot(checkslotinterval);
          } else {
            window.console && console.debug('[mps.scaleAd] /'+adslot+'/ did not load ('+checkslotmax+' attempts every '+recheckms+'ms) '+mps._elapsed());
            clearTimeout(mps.__adcheck['scale-'+adslot].timer);
            delete(mps.__adcheck['scale-'+adslot].timer);
          }
        }
      }, recheckms);
    };
    checkslot(checkslotinterval);
  }
  mps.__executeScaleAd = function(delayms) {
    var delayms = (typeof(delayms)=='number') ? delayms : 0;
    setTimeout(function(){ mps._scaleAdAsync('topbanner') },delayms);
    setTimeout(function(){ mps._scaleAdAsync('fishtank') },delayms+200);
  }
  mps.__executeScaleAd(1000); // Delay added for initial execution
});
</script>