scripts.html

<a href ="/" class="mobile-logo"><svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M28.6799 1.36802V28.68H1.31982V1.32004H28.6799V1.36802ZM30 0H0V30H30V0Z" fill="black"/><path d="M21.6357 21.0469V9.04688H22.9556V21.0469H21.6357Z" fill="black"/><path d="M18.5639 9.04688V21.0469H17.2439V11.0629L13.4039 21.0469H12.2039L8.36395 11.0629V21.0469H7.04395V9.04688H8.95195L12.8039 19.0789L16.6559 9.04688H18.5639Z" fill="black"/></svg></a>

<script>
  const topButtonHtml =
    `<div id="top-button-wrapper" onclick="scrollPageToTop()"><svg id="top-button" width="59" height="96" viewBox="0 0 59 96" fill="none"
     xmlns="http://www.w3.org/2000/svg"
     style="opacity: 0">
    <path d="M19.984 75.8284V84.2844H18.416V75.8284H15.35V74.5124H23.05V75.8284H19.984ZM28.9945 84.4524C28.3785 84.4524 27.8419 84.3404 27.3845 84.1164C26.9365 83.8831 26.5632 83.5518 26.2645 83.1224C25.9752 82.6931 25.7605 82.1658 25.6205 81.5404C25.4805 80.9151 25.4105 80.2011 25.4105 79.3984C25.4105 78.6051 25.4805 77.8958 25.6205 77.2704C25.7605 76.6358 25.9752 76.1038 26.2645 75.6744C26.5632 75.2451 26.9365 74.9184 27.3845 74.6944C27.8419 74.4611 28.3785 74.3444 28.9945 74.3444C29.6105 74.3444 30.1425 74.4611 30.5905 74.6944C31.0479 74.9184 31.4212 75.2451 31.7105 75.6744C32.0092 76.1038 32.2285 76.6358 32.3685 77.2704C32.5085 77.8958 32.5785 78.6051 32.5785 79.3984C32.5785 80.2011 32.5085 80.9151 32.3685 81.5404C32.2285 82.1658 32.0092 82.6931 31.7105 83.1224C31.4212 83.5518 31.0479 83.8831 30.5905 84.1164C30.1425 84.3404 29.6105 84.4524 28.9945 84.4524ZM28.9945 83.1504C29.6945 83.1504 30.1892 82.8891 30.4785 82.3664C30.7679 81.8344 30.9125 81.1158 30.9125 80.2104V78.5724C30.9125 77.6764 30.7679 76.9671 30.4785 76.4444C30.1892 75.9124 29.6945 75.6464 28.9945 75.6464C28.2945 75.6464 27.7999 75.9124 27.5105 76.4444C27.2212 76.9671 27.0765 77.6764 27.0765 78.5724V80.2244C27.0765 81.1204 27.2212 81.8344 27.5105 82.3664C27.7999 82.8891 28.2945 83.1504 28.9945 83.1504ZM35.7651 84.2844V74.5124H39.4191C40.3524 74.5124 41.0617 74.7738 41.5471 75.2964C42.0417 75.8191 42.2891 76.5378 42.2891 77.4524C42.2891 78.3671 42.0417 79.0858 41.5471 79.6084C41.0617 80.1311 40.3524 80.3924 39.4191 80.3924H37.3331V84.2844H35.7651ZM37.3331 79.0904H39.1811C40.1517 79.0904 40.6371 78.6424 40.6371 77.7464V77.1444C40.6371 76.2578 40.1517 75.8144 39.1811 75.8144H37.3331V79.0904Z" fill="black"/>
    <path d="M0.999908 30.2843L29.2842 2.00006L57.5685 30.2843" stroke="black" stroke-width="2"/>
    <path d="M29.2842 58.5686V2.00006" stroke="black" stroke-width="2"/>
</svg></div>`

  function scrollPageToTop () {
    window.scrollTo({top: 0, left: 0, behavior: 'smooth'})
    jQuery('.body-inner').animate({scrollTop: 0}, 'fast');
  }

  function handleMenu() {
    window.sessionStorage.clear()

    if (window.innerWidth < 900){
      const summary = window.document.getElementsByClassName("with-summary")
      if (summary && summary[0]) {
        summary[0].classList.remove('with-summary')
      }
    } else if (document.getElementsByClassName("book")) {
      document.getElementsByClassName("book")[0].classList.add('with-summary')
    }
  }

  window.addEventListener('DOMContentLoaded', (event) => {
    document.querySelector(".page-inner section").innerHTML += topButtonHtml

    handleMenu()

    setTimeout(()=>{
      if (window.innerHeight < window.document.getElementsByClassName("page-inner")[0].clientHeight - 10) {
        document.getElementById("top-button").style.opacity = 1
      }
    }, 2000)
  })

  window.addEventListener('resize', (event) => {
    handleMenu()
  })

  window.addEventListener('load', (event) => {
    const searchInput = document.getElementById('search-box')

    if (searchInput) {
      searchInput.setAttribute('placeholder', 'Search...')

      searchInput.parentElement.innerHTML += `<svg class="input-clear" width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg"><line x1="15.6729" y1="0.53033" x2="1.53077" y2="14.6725" stroke="black" stroke-width="1.5"/><line x1="15.6122" y1="14.6724" x2="1.47011" y2="0.530286" stroke="black" stroke-width="1.5"/></svg>
    `
    }
  });

</script>