読者です 読者をやめる 読者になる 読者になる

Cybozu Advance - ドラッグ&ドロップ可能なスケジュール

畑です。

久々に投稿します。

先日、サイボウズ Office 8 連携API が一般公開されました。そこで、このAPIをアクセスすることにより実現する、ドラッグ&ドロップ可能なスケジューラ―(Cybozu Advance)を試しに作ってみました。この連携APIは サイボウズ ガルーン 3 連携API と共通であるため、ガルーン 3 に対しても動作します。

Google Code にてオープンソース(GPLv2)で公開しています。詳しくは Cybozu Advance のサイトをご覧頂ければと思います。以下、多少解説したいと思います。

API を利用

API をアクセスすることにより実現しています。よって、今回実装した部分は主にユーザーインタフェース部分になります。対応するAPIは以下の通りです。

また、これらのAPIはSOAPであるため、それをラップするJavaScriptのクラスも作成しました。このクラスは再利用可能かと思います。

HTML と JavaScript のみで実装

今回 JavaScript のライブラリとして jQuery を使いました。個人的には jQuery を使うのは初めてでしたが、プラグインも多く、非常に便利でした。

ドラッグ&ドロップ

ドラッグ&ドロップによる予定の移動、および時間変更が実現したのですが、それを可能にしたのが FullCalendar という jQuery のプラグインです。ですので、カレンダーの表示について私がやった事というのは、API経由で予定情報を取得して、それを FullCalendar にのっけることだけだったりします。

なお、Cybozu Advanceサポート対象外となりますので、あらかじめご了承ください。

追記

Cybozu Advance をオンラインデモでお試しできる環境を用意しました。

Cybozu Advance オンラインデモ

sato / suzuki / matsuda / tanaka / brown / liu の中から選んでログインしてください。
※ログイン名・パスワードは同じ

Cybozuadvance_5