コード置場

2012年11月30日金曜日

cybozu.com : サイボウズ Office JavaScript エディター

このブログでは、サイボウズ Office on cybozu.com を JavaScript でカスタマイズする話を多く取り上げています。作成した JavaScript を読み込ませる方法はマニュアルに記載の通りです。設定画面で JavaScript ファイルをダイアログから指定して読み込ませるので、以下のようなステップになります。

テキストエディターで JavaScript ファイルを開く、または新規に作成する。
JavaScript ファイルを編集し、ローカルのPC上に保存する。
設定画面で、保存した JavaScript ファイルを指定し、アップロードする。

すでに JavaScript ファイルがアップロード済みの場合は、テキストエディターで編集する前に、ダウンロードする作業も必要となります。（別の場所にバックアップ済みの場合は、そこから取得する方法もありますが）

頻繁に行う作業ではないので、上記の方法でもさほど問題があるわけではないのですが、この作業をもっと効率的にするために、Webブラウザ上で直接 JavaScript を編集し、「適用」ボタンを押下することでシステムに反映できるようなツールを作ってみました。

Chrome 拡張で実現してみました。Chrome ウェブストアからインストールすることができます。

サイボウズ Office JavaScript エディター

Chrome 拡張で実現した理由は、システム管理者が設定する機能なのでクライアントにインストールするツールにしても、また特定のブラウザに限定しても問題ない、と考えたからです。

この Chrome 拡張をインストールした後の使用方法は以下のようになります。

「システム設定（詳細） > カスタマイズ > JavaScript ファイルの設定」に移動します。
「JavaScript ファイル」の行にある「編集する」ボタンをクリックします。
新規タブに JavaScript エディターが立ち上がるので、JavaScript を編集し「適用」ボタンをクリックします。

※ このツールはサイボウズのサポートの対象外となります。

2012年11月20日火曜日

Cybozu CrossSync v1.0.4 リリース

Cybozu CrossSync v1.0.4 をリリースしました。
今回の更新内容は以下の通りです。

一部の予定が同期の度に何度もコピーされ増殖する。

また、今回から GitHub に移行しました。
https://github.com/hatashinya/cybozu-crosssync

※ 過去のリリース情報

2012年11月16日金曜日

Cybozu Advance v1.1.4 リリース

Cybozu Advance v1.1.4 をリリースしました。
今回の更新内容は主に不具合改修となります。

また、今回から GitHub に移行しました。
https://github.com/hatashinya/cybozu-advance

※ 過去のリリース情報

2012年10月16日火曜日

cybozu.com : フォローに「ToDoに登録する」メニューを追加する

サイボウズ Office on cybozu.com の掲示板やメッセージには「その他の操作」から「ToDoに登録する」という機能があります。しかし、掲示板やメッセージに書き込まれた各フォローに対しては、ToDoに登録する機能がありません。

今回はフォローに「ToDoに登録する」メニューを追加するカスタマイズを紹介します。

下記に示す JavaScript を登録した後に、フォローのある掲示板またはメッセージの画面に移動してください。今回のカスタマイズにより、フォローにマウスカーソルを合わせると、「固定リンク」や「削除する」というメニューと同時に「ToDoに登録する」というメニューが表示されると思います。これをクリックすると、ToDoの登録画面に移動し、ToDo名とメモがあらかじめ入力された状態となります。ToDo名にはフォローの内容の先頭行が入り、メモには対象のフォローの固定リンクとフォローの内容のすべてが入ります。

コードを解説していきます。処理は掲示板・メッセージの画面とToDo登録の画面とに分かれます。

掲示板・メッセージの画面では、まずフォローのメニューとして「ToDoに登録する」を追加します。URL には通常のToDo登録画面へのリンクと区別するために from=follow というパラメータが付きます。
1. のリンクがクリックされると、ToDo登録画面に移動しますが、その際、フォローの内容とフォローの固定リンクを sessionStorage に保存します。
ToDo登録画面ではURLに from=follow が付き、sessoinStorage にフォロー情報が保存されている場合に、次の特別な処理を行います。
フォロー内容の先頭行を取得しToDoのタイトル（ToDo名）にします。先頭行が空行や引用行の場合は次の行にします。
フォームにタイトルを代入し、フォローの固定リンクとフォロー全文をメモ欄に代入します。

ちなみに、サイボウズ Office on cybozu.com の10月版から jQuery があらかじめ読み込まれているので、今回紹介するコードからは jQuery の読み込み部分が不要となりました。

2012年9月26日水曜日

cybozu.com カンファレンスII での発表

本日、cybozu.com カンファレンスII で「自分達のサイボウズ Office を開発しよう～JavaScriptによるカスタマイズ」と題して発表してきました。発表に使用した資料になります。

自分達のサイボウズ Office を開発しよう from Shinya Hata

2012年7月18日水曜日

cybozu.com : ブックマークレットでリンク集に登録する

サイボウズ Office on cybozu.com にはリンク集という機能があるのですが、リンクを登録する際は、ブラウザのアドレスバーからURLをコピーし登録フォームに貼りつけ、さらにリンクのタイトルを入力する必要があります。

今回はこの一連の作業をブックマークレットを使って、より簡単に行うためのカスタマイズを紹介します。

下記に示す JavaScript を登録した後に、まず「リンクの追加」画面に移動してください。今回のカスタマイズにより「☆ブックマークレット」というリンクが表示されていると思いますので、このリンクをブックマークレットとしてブラウザの「お気に入り」や「ブックマーク」に登録してください。このブックマークレットには JavaScript が含まれているため、登録の際に警告が表示される場合があります。

そして、リンク集に登録したい外部のWebページを表示した際に、このブックマークレットを選んでください。すると、別ウィンドウ（タブ）で「リンクの追加」画面が開き、タイトルとURLがあらかじめ入力された状態になると思います。後は「追加する」ボタンをクリックするだけでリンクが登録されます。

仕組みは次のようになります。ブックマークレットを選んだ際に、表示中のWebページのタイトルとURLを JavaScript で取得して、それぞれ titite, url というURL引数として「リンクの追加」画面に渡します。「リンクの追加」画面では今回のカスタマイズにより、URL引数の title と url を読み取り、タイトルおよびURLのフィールドに代入します。

2012年7月6日金曜日

cybozu.com : Twitter のつぶやきをインライン表示する

サイボウズ Office on cybozu.com の掲示板やメッセージに Twitter へのリンクをはりつけたとき、リンクの直下にその内容をインライン表示してくれるカスタマイズを行ってみました。

前回のYouTubeのときは IFRMAE を挿入することで実現しましたが、今回は Twitter の JSONP API を呼び出して実現してみました。

このような表示となります。

ソースコードを以下に示します。