Google 日本語入力 Cloud API を利用してiPadのSafariでも動作する日本語ソフトウェアキーボードを作ってみた
最近になってjQueryの使い方を覚えたので、忘れないうちに何かを作りたいなぁと思っていたところ、ちょうどGoogle CGI API for Japanese Inputというのが公開されたので、これを使ったソフトウェアキーボードを作ってみました。
実用性は低いですが、所要時間1〜1.5日くらいでとりあえず動くようになりました。実物はこちら。
最初はiPadでフリック入力ができると面白いんじゃないかと思って作り始めたのですが、フリック入力だとUIを作るのが面倒技術的に悩ましい点があったので、単純な五十音キーから入力になっています。*1これはこれで、少しだけ新鮮な感覚が味わえるのではないかなと思っています。（追記：結局フリック入力を実現しました。）
技術的に特別なことは何もないのですが、１点だけ、iPadに対応させるための工夫として、テキストフィールドにフォーカスされた際にblurを呼び出してフォーカスを外すということをしています。テキストフィールドにフォーカスされた際、本来はデフォルトのキーボードが起動するのですが、即座にフォーカスを外すことでデフォルトのキーボードを消すことができます。*2
ただし、フォーカスを外すことで、テキストの範囲選択等の編集操作が出来なくなるという問題が発生します。このままでは実用性に難があるのですが、今のところこの問題は未解決です。恐らくテキストフィールド内の文字列の編集操作も実装することで解決できるような気がしていますが、そこまでは実装していません。また現在のものはキーボードの表示位置が変になったり、スペースが入力できなかったり、文節区切りの変更が出来なかったりしますが、とりあえずのコンセプトモデルなのでご了承下さい。
ちなみにGoogle CGI API for Japanese Input (日本語入力 Cloud API？)はJSONPに未対応、Access-Control-Allow-Originヘッダーが付与されていないため、クロスドメインでの利用ができません。そのため、Google CGI for Japanese Input Proxyというサービスを利用させて頂いています。クロスドメインでの利用への対応については、公式フォーラムの方で Google CGI API for Japanese Input」のクロスドメイン対応要望 として挙がっているのですが、今のところ反応はないようです*3。
