gitcoinco/code_fund_ads

View on GitHub
app/javascript/advertisements/smart-bar/index.js.erb

Summary

Maintainability
Test Coverage
import './theme.scss'
import TinyAnimate from 'TinyAnimate'

export default {
  mustache: '<%= File.read(Rails.root.join("app/javascript/advertisements/smart-bar/template.html.mustache"), encoding: "UTF-8").squish %>',
  initialize: ad => {
    document.body.prepend(ad.container)
    let visible = false
    let top = window.innerWidth >= 648 ? -80 : -196

    addEventListener('scroll', event => {
      if (ad.closed) return;
      if (scrollY >= 100 && !visible) {
        TinyAnimate.animateCSS(ad.element, 'top', 'px', top, 0, 600, 'easeInOutQuart')
        ad.trackImpression()
        visible = true
      } else if (scrollY < 100 && visible) {
        TinyAnimate.animateCSS(ad.element, 'top', 'px', 0, top, 300, 'easeInOutQuart')
        visible = false
      }
    })
  }
}