Skip to content

Instantly share code, notes, and snippets.

@pzagor2
Created April 28, 2017 06:34
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save pzagor2/cd1a50135b31a2f95278894264cee22b to your computer and use it in GitHub Desktop.
Save pzagor2/cd1a50135b31a2f95278894264cee22b to your computer and use it in GitHub Desktop.
//# sourceURL=RAD.js
var radWrapper = document.getElementById('rad-wrapper');
var inEditor = window.location.href.indexOf('edit-loader.html') > -1 ? true : false;
//Use 'inScreenshot' to change behavior when the creative is loaded for fullbacks (Usually we don't run the animation)
var inScreenshot = window.location.href.indexOf('preview?screenshot=1') > -1 ? true : false;
var ad = Radical.getAdByContainer(window.frameElement);
if (inEditor) {
radWrapper.style.opacity = '1';
}
if (!inEditor) {
(function () {
var baseOffset = 0;
Radical.addListener(function(ev) {
var els = ['a1'];
//console.log(ev);
if(ev.name == 'visible' && ev.data.frame == window.frameElement) {
//console.log('became visible');
}
if(ev.name == 'hidden' && ev.data.frame == window.frameElement) {
//console.log('became hidden');
}
if(baseOffset != 0 && ev.name == 'resize' && ev.data.frame == window.frameElement) {
resetEffect(els);
setTimeout(function() { applyEffect(baseOffset, els); },10);
}
if(ev.name == 'scroll' && ev.data.frame == window.frameElement) {
var scrollMax = ev.data.viewport.height - radWrapper.clientHeight;
baseOffset =(ev.data.viewport.height - ev.data.bounds.bottom);
if (baseOffset > 0) {
applyEffect(baseOffset, scrollMax, els);
}
}
});
function applyEffect(offset, scrollMax, els) {
offset = offset * -1;
for(var i = 0; i < els.length; i++) {
var el = document.getElementById(els[i]);
if(!el.getAttribute('data-default-offset')) {
el.setAttribute('data-default-offset', parseInt(window.getComputedStyle(el).bottom, 10));
}
var maxBottom = el.clientHeight - radWrapper.clientHeight;
var percent = offset / (scrollMax);
var outputX = percent * maxBottom;
var negative = -Math.abs(outputX);
el.style.bottom = negative + 'px';
}
}
// function scale(x, min, max) { return (max-1) * x + min; }
function resetEffect(els) {
for(var i = 0; i < els.length; i++) {
var el = document.getElementById(els[i]);
el.setAttribute('data-default-offset', '');
el.style.bottom = '';
}
}
})();
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment