利用規約を全て読んだ上でチェックをしたら、ボタンをクリックさせる

したいこと

よくサービスにある利用規約。
こちらを以下の条件を満たさないとボタンをクリックさせないようにしたい。

（条件）
・利用規約を全て読むこと（規約を読んだ分のスクロール量を取得）
・同意するのチェックボタンの押下していること

今後よく使いそうなのでメモ。

ソースコード

<div id="agreeContents" class="p-agree-block">
　　本文本文本文本文本文本文本文本文本文本文本文本文
    本文本文本文本文本文本文本文本文本文本文本文本文...
  <div id="agreeEnd"></div>
</div>
<div class="text-center">
<div class="m-t-35 m-b-15">
  <div class="agree-check">
    <div class="border-checkbox-section">
<div class="border-checkbox-group border-checkbox-group-primary">
  <input class="border-checkbox" type="checkbox" id="checkbox1">
  <label class="border-checkbox-label" for="checkbox1">利用規約に同意する</label>
</div>
</div>
</div>
</div>
<div class="col-md-8 offset-md-2">
  <button class="btn btn-disabled btn-block" disabled="disabled" id="agreeButton" onclick="location.href='finance-matterLists.html'">
    利用を開始する
  </button>
</div>
</div>

"use strict";

$(function(){
  let scrollHeight,scrollPosition;
  const $Contents = $("#agreeContents");
  const $Button = $("#agreeButton");
  const $checkbox = $("#checkbox1");
  let checkboxFlag;
  let scrollFlag;
  let judge = () => {
    if(checkboxFlag && scrollFlag) {
      $Button.removeAttr("disabled");
      $Button.removeClass("btn-disabled");
      $Button.addClass("btn-primary");
    }else{
      $Button.attr("disabled");
      $Button.addClass("btn-disabled");
      $Button.removeClass("btn-primary");
    }
  }
  $Contents.scroll(function() {
    scrollHeight = $(this).get(0).scrollHeight;
    scrollPosition = $Contents.get(0).offsetHeight + $(this).scrollTop();
    if (scrollHeight <= scrollPosition ) {
      scrollFlag = true;
    }
    judge();
  });
  $checkbox.click(function() {
    checkboxFlag = $checkbox.get(0).checked;
    judge();
  });
});