dbismut

class Post extends PureComponent {
  state = {
    dragProgress: 0
  }

  /* ... */

  onScroll = () => {
    const scrollTop = windowScroll.get('top');
    if (scrollTop < 0 && !this.isTransitioningFromDrag) {

dbismut

componentWillUnmount = () => {
  this.removeListeners();
};

addListeners = () => {
  window.addEventListener('scroll', this.onScroll);
};

removeListeners = () => {
  window.removeEventListener('scroll', this.onScroll);

dbismut

  onExit = () => {
    /* same code */
    this.to = this.getPreviewStyleAndPosition();

    const scrollTop = windowScroll.get('top');
    this.post.classList.add('scroll-block');
    this.postScroll.set('top', scrollTop);
  };

dbismut

onEnter = () => {
  const { post } = this.props.route.data;

  this.preview = document.querySelector(`.preview[data-id="${post.id}"]`);  
  this.pageList = document.querySelector('.page-list');
  this.pageListStyler = styler(this.pageList);

  this.from = this.getPreviewStyleAndPosition();
};

dbismut

executeExitingTransition = (node, done) => {
  // we're temporarily changing our spring to
  // a tween with a very long duration to check
  // everything is working properly

  tween({
    from: this.from,
    to: this.to,
    duration: 10000
    // stiffness: 100,

dbismut

onExit = () => {
  // we don't want to run this if there is no
  // preview element to transition to.
  if (!this.preview) return;

  this.from = {
    top: 0,
    height: this.post.offsetHeight,
    width: this.post.offsetWidth,
    borderRadius: this.postStyler.get('borderRadius'),

dbismut

.scroll-block {
  position: fixed !important;
  overflow: hidden !important;
  max-height: 100vh !important;
  pointer-events: none;
}

dbismut

executeExitingTransition = (node, done) => {
  spring({
    from: this.from,
    to: this.to,
    stiffness: 100,
    damping: 12,
    restDelta: true,
    restSpeed: 0.1
  }).start({
    update: this.postStyler.set,

dbismut

onExit = () => {
  // we don't want the code to run if there is no
  // preview element to transition to.
  if (!this.preview) return;
  
  this.from = {
    top: 0,
    height: this.post.offsetHeight,
    width: this.post.offsetWidth,
    borderRadius: this.postStyler.get('borderRadius')

dbismut

onExit = () => {}

executeExitingTransition = (node, done) => {
  // we're going to do some work in there!
  done();
}

onAddEndListener = (node, done) => {
  if (!this.preview) return done();