ドクターストレッチの予約画面からGoogle Calendarの予定を作成するブックマークレットを作った

通い始めて二ヶ月が経過したドクターストレッチだが、予約はWebからもできて便利な一方、予定管理をしているGoogle Calendarへの転記が必要でめんどい。予約をすっぽかしたりしたくないので、どうにかしたい。

そこで、ブックマークレットからGoogle Calendarの予定作成画面に自動で行ってくれるようにした

ブックマークレット自体はこういう感じ。やりたいことだけ書いて、コードはChatGPTに書いてもらった。思ったよりDOMの要素をちゃんと見てくれなかった。。

javascript:(function() {
  // 予約タイトルを取得 (店舗名と担当者名を組み合わせる)
  var storeName = document.querySelector('#reserveShop').innerText;  // 店舗名を取得
  var staffName = document.querySelector('#reserveStaff').innerText;  // 担当者名を取得
  var title = 'ドクターストレッチ予約: ' + storeName + ' & ' + staffName;
  
  // 日付・時間を取得
  var date = document.querySelector('#reserveDate').innerText;  // 予約日
  var time = document.querySelector('#reserveTime').innerText;  // 予約時間
  
  // 日付と時間を正規表現で分割
  var dateMatch = date.match(/(\d{4})年(\d{2})月(\d{2})日/);
  var timeMatch = time.match(/(\d{2}):(\d{2}) ~ (\d{2}):(\d{2})/);
  
  // 開始時間と終了時間をUTC形式に変換
  var startTime = new Date(`${dateMatch[1]}-${dateMatch[2]}-${dateMatch[3]}T${timeMatch[1]}:${timeMatch[2]}:00+09:00`).toISOString().replace(/[-:]/g, "").split(".")[0] + 'Z';
  var endTime = new Date(`${dateMatch[1]}-${dateMatch[2]}-${dateMatch[3]}T${timeMatch[3]}:${timeMatch[4]}:00+09:00`).toISOString().replace(/[-:]/g, "").split(".")[0] + 'Z';
  
  // 場所情報を取得
  var address = document.querySelector('.address').innerText;  // 場所情報を取得
  
  // GoogleカレンダーのURLを作成
  var calendarUrl = 'https://calendar.google.com/calendar/render?action=TEMPLATE&text=' + encodeURIComponent(title) +
                    '&dates=' + startTime + '/' + endTime +
                    '&location=' + encodeURIComponent(address) +
                    '&add=' + encodeURIComponent('hoge@me.com'); // ゲストを追加

  // Googleカレンダーのページを開く
  window.open(calendarUrl, '_blank');
})();