MWWPFORM+ACFでdatepickerに定休日と営業期間を追加した話

[mwform_datepicker name="カレンダー" size="30" js="dateFormat:'yy年Md日',firstDay:1"]

function returnDate($date) {

  // $date = "Y/n/j"
  $array = explode('/', $date); 

  // "Y,n-1,j"
  return "{$array[0]},{$array[1]}-1,{$array[2]}";

}

// reserve = 位置設定で指定したページのslug
$start_text = returnDate(get_field('range_start', get_page_by_path("reserve")->ID));
$end_text   = returnDate(get_field('range_end', get_page_by_path("reserve")->ID));

// 定休日（曜日）の取得
$holiday_date = get_field('holiday_date', get_page_by_path("reserve")->ID);
  
// 返り値がString型なのでint型に変更
foreach($holiday_date as $k => $v) { 
  $holiday_date[$k] = (int) $v;
}
  
// json形式にエンコード
$holiday_date_object = json_encode($holiday_date);

// 定休日（日付）の取得
$holiday_day = get_field('holiday_day', get_page_by_path("reserve")->ID);
  
// 改行で分割して配列に（ACFテキストエリアの性質上）
$holiday_day_array = explode("\r\n", $holiday_day);
  
// json形式にエンコード
$holiday_day_object = json_encode($holiday_day_array);

jQuery(function($) {
  $('input[name="カレンダー"]').datepicker('option', 'minDate', new Date(<?php echo $start_text?>));
  $('input[name="カレンダー"]').datepicker('option', 'maxDate', new Date(<?php echo $end_text?>));

$('input[name="カレンダー"]').datepicker('option', 'beforeShowDay', function(date){

  // 定休日（曜日）の取得
  var holiday_day = <?php echo $holiday_day_object ?>;

  // 定休日（曜日）のjsonを回す
  for (var i = 0; i < holiday_day.length; i++) {
  
    // 協定世界時のミリ秒取得
    var holiday_time = Date.parse(holiday_day[i]);
  
    // 日付を初期化
    var holiday      = new Date();
  
    // 経過ミリ秒の取得
    holiday.setTime(holiday_time);
    
    // 各日付ブロックとの相違判定
    if (holiday.getYear() == date.getYear() && holiday.getMonth() == date.getMonth() && holiday.getDate() == date.getDate()) {
　　　　return false;  // 全て一致で非選択の日付ブロックとする
    }
  }

    // 定休日（曜日）の取得
    var holiday_date = <?php echo $holiday_date_object ?>;
    
    // 曜日が一致すれば非選択とする
    return [!holiday_date.includes(date.getDay())];
  });
});

<?php if(is_page('位置設定で指定したページのslug')):

  // 初期設定
  $form_page_id = get_page_by_path("位置設定で指定したページのslug")->ID;

  // 日付取得の関数化（フォーマット）
  function returnDate($date) {
    $array = explode('/', $date);
    return "{$array[0]},{$array[1]}-1,{$array[2]}";
  }

  // 営業期間の処理（日付選択範囲の設定）
  $start_text = returnDate(get_field('range_start', $form_page_id));
  $end_text = returnDate(get_field('range_end', $form_page_id));

  // 定休日（曜日）の設定
  $holiday_date = get_field('holiday_date', $form_page_id);
  foreach($holiday_date as $k => $v) { 
    $holiday_date[$k] = (int) $v;
  }
  $holiday_date_object = json_encode($holiday_date);

  // 定休日の処理（日付）
  $holiday_day = get_field('holiday_day', $form_page_id);
  $holiday_day_array = explode("\r\n", $holiday_day);
  $holiday_day_object = json_encode($holiday_day_array);

?>

<script>
  jQuery(function($) {

    // 営業期間の設定
    // 複数項目がある場合は $('input[name="カレンダー1"]', 'input[name="カレンダー2"]')
    var calendar = $('input[name="カレンダー"]');
    calendar.datepicker('option', 'minDate', new Date(<?php echo $start_text?>));
    calendar.datepicker('option', 'maxDate', new Date(<?php echo $end_text?>));

    // 定休日の処理（日付）
    calendar.datepicker('option', 'beforeShowDay', function(date){
      var holiday_day = <?php echo $holiday_day_object ?>;
      for (var i = 0; i < holiday_day.length; i++) {
        var holiday_time = Date.parse(holiday_day[i]);
        var holiday = new Date();
        holiday.setTime(holiday_time);
        if (holiday.getYear() == date.getYear() && holiday.getMonth() == date.getMonth() && holiday.getDate() == date.getDate()) {
          return false;
        }
      }

      // 定休日の処理（曜日）
      var holiday_date = <?php echo $holiday_date_object ?>;
      return [!holiday_date.includes(date.getDay())];
    });
  });
</script>

<?php endif; ?>