flatpickr まとめ と 祝日判定

カレンダー機能が欲しかったので、いいライブラリが見つかって使ってみた。
installもできるが、今回はlinkとscriptをhtml上においておく方法でやりました。
こういうの名前あると思うのですが、忘れました。
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
<script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
参考：
公式
https://flatpickr.js.org/getting-started/
日本語版
https://tr.you84815.space/flatpickr/examples.html

const config ={
mode: 'multiple',
dataFormat: 'Y/m/d',
locale: 'ja',
disable: ['2021-02-23']
}
flatpickr('.flatpickr',config)

こんな感じで使用可能。
mode:multipleはカレンダー複数選択可能になる。
disable:[]は中に日付を入れると、その日付は選択できないようになる。
一度選択したらこの中に入れて２度選択できないようにしてみるといいかもね。
例) config.disable.push(2021-02-28)

月日数計算

function detMonthDays(yearStr,monthStr){
 let dayStr = 01
 let jsMonth = monthStr -1
 return new Date(yearStr,jsMonth+1,0).getDate()
}

getMonthDays(2021,02) //28
//月の日数を計算する関数 多分これで閏年も行けるはず

祝日計算

加えて、祝日を判定することがあったのでやってみました。
祝日は、可変的で固定ではないので計算は基本できません。
元号が変われば、天皇誕生日が変わりますし、オリンピック開催とかでも変わるのかな？

国が出している、csvから情報を取得して判定する方法をとります。
こんな感じのデータ
国民の祝日・休日月日,国民の祝日・休日名称
2021/1/1,元日
2021/1/11,成人の日
2021/2/11,建国記念の日

function getHoliday(){
 let req = new XMLHttpRequest()
 req.open('get','syukujitsu.csv',true)
 req.send(null)
 req.onload = function(){
 splitCsv(req.responseText)
 }
}

function splitCsv(str){
 let result = []
 let tmp = str.split('\n')

 for(let i = 1,i < tmp.length,i++){
  result[i] = tmp[i].split(',')
  result[i][0] = result[i][0].replace('\//','')
  holiday_result.push(result[i][0])
 }
}

流れは：
getHolidayでcsvをXMLHttpRequestで読み込む

splitCsvを読む

回数分forで回す(ただし、初回は省く)

データが、2021/1/1の形ですが、今回は2021-1-1の形にしたかったので
正規表現を用いて、/と-を入れ替え処理を挟む

入れ替えたデータをholiday_resultの配列に入れる
な感じ。

req.onload = function(){
splitCsv(req.responseText)
}
はrerurn設定ができなかったために、今回は、関数外にholiday_resultの配列を定義して使用しました。

読み込みの中では値を返すことはできないのかもしれません。（検索しても出て来なかった..）
あくまで、csvを読み込む処理を行うのみなのかもしれません。