roam-remember-route-position

roam-remember-route-position.js

const whileTo = (cb) => {
  let v = cb()  
  let interval = setInterval(() => {
    if(cb()) {
      clearInterval(interval)      
    }
  } , 1000)
}

whileTo(() => {
  if(!window.roamAlphaAPI) {
    return false;
  }

  return main()
})

function onLocationChange(cb) {
  var oldHref = document.location.href;
  var bodyList = document.querySelector("body")
  var observer = new MutationObserver(function(mutations) {
        mutations.forEach(function(mutation) {
            if (oldHref != document.location.href) {
                oldHref = document.location.href;
                console.log('location change : ', oldHref, prevId)
                cb();
            }
        });
    });
    
  var config = {
      childList: true,
      subtree: true
  };
    
  observer.observe(bodyList, config);
  return true
}

const getCurrentId = () => {
  return window.location.href.split("/").pop()
}

const queryBlockEl = ui => {
  try { return document.querySelector(`[id*=${ui}]`)} catch(e) {
    console.warn(e)
  }
}
let prevId

function scrollToPrevBlock() {
  let currentId = getCurrentId()
  if(!currentId) {
    return;
  }
  // console.log(prevId, currentId)
  if(prevId) {
    const el = queryBlockEl(prevId)
    if(el) {
      el.scrollIntoView({behavior: "smooth", block: "center",});
      blink(el)
    }
  }
  
  prevId = currentId;
}

function main() {
  return onLocationChange(scrollToPrevBlock)
}


function blink(el) {
  let ofs = 0;
  const prevBackground = el.style.background
  
  const interval = setInterval(function(){
    el.style.background = 'rgba(255, 250, 0,'+Math.abs(Math.sin(ofs))+')';
    ofs += 0.03;
  }, 10);
  setTimeout(() => {
    el.style.background = prevBackground
    clearInterval(interval)
  } , 1500)
}