writefreely with gitalk

wf.js

console.log('this is from wf.js');

(function(){
  function ready(fn) {
    if (document.readyState != 'loading'){
      fn();
    } else {
      document.addEventListener('DOMContentLoaded', fn);
    }
  }
  let siteArr = ['paper.wf/lgh06', 'writee.org/lgh06', 'paper.wf/hidden', 'writee.org/hidden'];


  function gitalkJsOnloadFunc(){
    console.log('inside gitalkJsOnloadFunc')
    // not show gitalk on list page
    if(['/lgh06/', '/lgh06', '/hidden/', '/hidden'].includes(location.pathname)){
      return;
    }
    let gitalkContainer = document.createElement('div');
    gitalkContainer.setAttribute("id", "gitalk-container");
    document.querySelector('article#post-body').insertAdjacentElement('beforeend', gitalkContainer);

    let siteIndex = siteArr.findIndex((v) =>{
      return window.location.href.includes(v);
    })

    let clientID, clientSecret;
    if(siteIndex === 0 || siteIndex ===2){
      clientID = 'a897eba10fa751d5b8a4';
      clientSecret = '46b61d9921a39654e8c7135c3da69e4572327e8f';
    }else if (siteIndex === 1 || siteIndex ===3){
      clientID = '49650cc4ec19ecc90d7a';
      clientSecret = '63edbd7444e5f3df66118be1df68aad3b731694c';
    }

    var gitalk = new Gitalk({
      clientID,
      clientSecret,
      repo: 'gitalk_comments_site_wf_lgh06',
      owner: 'lgh06',
      admin: ['lgh06'],
      id: `/${siteIndex}/${window.location.href.split('/').pop().substring(0,40).replace(/\?code\=\w+/, '')}`,      // Ensure uniqueness and length less than 50
      proxy: "https://cors-anywhere.ahuan.store/?https://github.com/login/oauth/access_token",
      distractionFreeMode: false  // Facebook-like distraction free mode
    })
    
    gitalk.render('gitalk-container')
  }

  function main(){

    const match = siteArr.find(v => {
      if (window.location.href.includes(v)) {
        return true;
      }
    });
    if(match){
      let head = document.getElementsByTagName('head')[0];
      let gitalkCssTag = document.createElement('link');
      gitalkCssTag.rel  = 'stylesheet';
      gitalkCssTag.type = 'text/css';
      gitalkCssTag.href = 'https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.css';
      gitalkCssTag.media = 'all';
      head.appendChild(gitalkCssTag);

      let gitalkJsTag = document.createElement('script');
      gitalkJsTag.src = "https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.min.js";
      gitalkJsTag.onload = gitalkJsOnloadFunc;
      head.appendChild(gitalkJsTag)
    }

  }
  ready(main);

})();