制作記事 運用情報お仕事・制作日記Googleカレンダーにがっつりハマる

Googleカレンダーにがっつりハマる

ここ数日、Googleカレンダーをホームページに表示するのにハマってる。
ようやく脱出できそうだが、結構な時間を費やしてしまった。
当初、WordPressのプラグインを使って速攻で終わらせる予定で、バッファ・検証込みで半人日の工数想定だったのだけど、、、
はい。UI含めてがっつり3人日かかってしまいました。
与件はこんな感じ。
・レスポンシブ対応
・同一ページ内で複数のGoogleカレンダーの切替を行う(Googleカレンダー内の表示切替は使わない)
・最大20つくらいのGoogleカレンダーを使う
デザイン問題。
・スマホでの見え方(リスト?月表?ハイブリット?)
仕様問題。
・iframeの配置場所によって、ページスクロールするたびに、カレンダーを再読み込みするという謎仕様(iPhone iOS10.3 で発覚。これに相当ハマった)
・プラグインを利用するとレスポンシブをケアし、ひとつのカレンダーにつき2つの見せ方をする必要があるため煩雑になる。またバージョンアップやGoogleカレンダーの仕様変更時にプラグインが使えなくなるリスクはつきまとう
・プラグインを使う場合、Ajaxで使用する場合の仕組みを考える
考えたこと。
・レスポンシブかつUXに配慮しつつもプレーンのiframeだけでどうにかする
・表示したいカレンダーを選択したときだけ、そのiframeを呼び出す
・同カレンダーは2回目以降はすでに呼び出したiframeを再利用する
Yes!コーダーズ・ハイ!