Googleカレンダーフィードを使用したシンプルカレンダー予約表示

Question

Googleカレンダーフィードを使用してウェブサイトに予約日を示す読み取り専用の月カレンダーを表示したいと考えています。すべての日は、Googleカレンダーでイベントを持つウェブサイトのカレンダーで強調表示された日付として表示されます。 jQueryのUI Datepickerはこれでうまくいくのでしょうか、それともシンプルなカレンダーですか？

Answer 1

jQuery UI datepickerとGoogleカレンダーのAPI V3イベントリスト（api hereで再生）を使用しました。私はapiキーを非公開にしたいので、実際の例は表示しません。

それは静的なカレンダーのように見えるように私は、デフォルト（矢印）カーソルでDatePickerのインラインスタイルを表示します。 Googleカレンダーはjsonのイベントを返し、 "beforeShowDay"関数を使用してdatePickerの関連日付に適用します。

Googleカレンダーフィードについて知っておくべきことがいくつかありました。

オプション "singleEvents = true"を使用して、繰り返しイベントがすべての日付を返すようにしました。

「fields = items」オプションを使用して、関連性の高いデータ（要約や日付など）のみを返してパフォーマンスを向上させました。

"timeMin"と "timeMax"オプションを使用して返される日付の範囲を指定しました（私は今日の日付の前後に計算された日付を使用しました）。 Googleでは、これらの日付が「yyyy-mm-ddT00：00：00 + 00：00」のような形式になると予想しています。

返されたjsonでは、すべての日のイベントの日付は変数 "start.date"と "end.date"にありますが、すべての日のイベントについては終了日が翌日です！イベントが終日でない場合は、代わりに "start.dateTime"および "end.dateTime"変数の日付を検索する必要があります。

GoogleのV3 APIを使用する理由の1つは、V2とは異なり、イベントカラー（colorId変数）を返すということです。ただし、色は16進数ではありません。 。