Duncanさんの記事を紹介します。(詳細はこのリリースノートを参照してください)。URLプロトコルの機能の拡張で、WebビューアからFileMakerスクリプトを呼び出して実行できるようになりました。これは大事件ですWebビューアとのやりとりがこれで双方向になりました。FileMakerからWebビューアを設定し、Webビューア内で起こった結果からデータを戻せるようになったのです。Serverでホストしている場合にのみ利用することができました。この制約がなくなることにより、開発者にとってはソリューションを拡張・改良するための大きな可能性が広がります。この記事では、Webビューアとデータをやりとりできるということがなぜ大事件なのかということを説明します。課題:Webビューアからデータを取得する今までも、WebビューアでJavascriptを利用して凝った部品を作って、画面上でFileMakerのインターフェース部品と並べることはできました。問題は、Webビューアの中で行うことはそのWebビューアの中に隔離されたままで、FileMakerがそれを知る術はありませんでした。従来はWebビューアから情報を取得してFileMaker側に返す機能は、開発時の制限要因でした。この機能がついにすべての環境で全面的に利用できるようになったことで、そのしくみを理解してソリューションの中でどのように使うかをしっかり学ぶ価値がでてきました。World」というメッセージを表示するシンプルなスクリプトから始めます。新規ファイルでも既存のファイルでも構いません。メニューのスクリプト->スクリプトの管理...でScriptMakerを開きます。新規スクリプトを作成し、名称を「Hello」にします。World」に設定します。キャンセルボタンを削除し、「OK」をクリックしてスクリプトを保存します。ここでレイアウト上にWebビューアを配置します。表示するのはクリックするリンクだけです。WebビューアのWebアドレスを次のように設定します。"</a></body></html>"これは、Webビューア内に表示するHTMLをすべて記述するデータURLという方式です。Webビューアの設定画面で「OK」をクリックして保存し、レイアウトを保存してブラウズモードで動作を確認します。Webビューアに表示される文字をクリックしてみてください。ダイアログに先ほど設定したメッセージが表示されます。ここで起こっていることを一つずつ見ていきましょう。クリックされたURLはfmpプロトコルを使用しています。FileMakerをインストールした時に、OSにこのプロトコルが登録されて、「fmp://」で始まるURLが起動された時にはその処理をFileMakerに渡すようになっています。URLの次の部分はドル記号($)で、アプリケーションが今開いているファイルを参照します。)関数で取得できます。これによって、自分が現在属している今開いているファイルを常に参照します。FileMakerに対してどのスクリプトを実行するかを指示しています。URLにparamの値を持ってスクリプト引数を渡すことも可能です。そのリンクをクリックすると、FileMakerを起動して今開いているファイルに対して「Hello」というスクリプトを実行するよう指示していることになります。リンクをクリックした時にはそのファイルの中にいることになるので、そのファイルが開いているということがわかっています。他に何ができるか?スクリプト引数を追加する...一つの例としては、Webビューアに表示されたHTMLフォームに入力されたデータを集めることができます。これは単なる一例で、これを読んだ方が自分のソリューションで何が可能になるか想像力を働かせてもらうためのきっかけとして紹介します。FileMakerでは、カスタムダイアログを使わない限りは、ネイティブな方法でパスワード入力時のように入力を伏せ字にするフィールドを持つことはできません。パスワード入力用のフィールドをレイアウト上に作りたい場合、スクリプトトリガを使うなど方法は限られます。この例では、Webビューアを使ってHTMLフォームにパスワードタイプのフィールドを表示しています。HTMLはパスワードタイプのフィールドをネイティブでサポートしていて、フォームが送信されるとそのフィールドの値をFileMakerのスクリプトに引数として渡します。)というメッセージを表示するように定義します。スクリプトを保存して、Webビューアを作成して次のWebアドレスを設定します。[日本語環境では¥])を入れます。することによってFileMakerがエラーを出さずにHTMLを表示できます。HTMLとJavascriptに馴染みがある方であれば、このコードが送信時にJavascriptが実行されるシンプルなフォームであることがわかるでしょう。Javascriptが入力フィールドをIDで参照してその値を取得します。URLを組み立ててFileMakerファイルに返し、先ほど作成したスクリプトを呼び出して、フォームに入力した値をスクリプト引数として渡します。これを保存してブラウズモードにします。パスワードフィールドに何かテキストを入力すると、自動的にドットで置き換えられます。リターンキーを押すかOKボタンを押すと、FileMakerスクリプトが実行され入力した内容が表示されます。通常はパスワードを誰かに見せるということはしません。引数を渡すしくみを示すのが今回の目的です。次はちょっと楽しいもの次は少し楽しいことをしてみましょう。Javascriptでできることはここで紹介する例にとどまらず、ネット上には優れたライブラリや情報が無限にあります。jQueryは私のお気に入りで、簡単に利用する事が可能です。私が見つけたのは、カラーピッカーです。ここ(http://bgrins.github.io/spectrum/)から参照でき、無料で利用できます。FileMakerのレイアウト上にカラーピッカーを作ってフィールド色を自由に選んだ色に設定したいという場合、どうすればいいでしょうか?この例では、いくつかのフィールドを作って、HTMLとJavascriptを入力しやすいようにしました。FileMakerがコードを計算の一部として評価するのではなく、フィールドからテキストを挿入するため、すべての引用符の前にバックスラッシュを入れなくてもよくしました。全体を2つの部品に分け、FileMakerが現在のファイルのファイル名を評価する部分を間に入れて、最終的に全部を組み合わせてできあがったHTMLをWebビューアに表示しています。resources::html2このしくみを機能させるリソースとして、外部参照によってjQuery、カラーピッカーのJavascript、CSSを読み込みます。この方法ではFileMaker内に作り込む手間は軽減されますが、時間をかけられるのであれば、ローカルに持たせることも可能です。このサンプルをインターネット接続なしで動作させたい場合はそのように作る必要がありますが、このサンプルではWebページを表示するのと同じ要領で動的に読み込んでいます。URLを追加しました。これによって選択されたRGBパラメータが渡され、FileMakerのフィールドに保存されます。対応するjavascript(実行時にFileMakerによってjQueryのコールバック関数に設定される)は次のようになります。"";},次にFileMakerの世界に戻り、フィールドに入っているデータを対象に処理を続けることができます。色を変えたいフィールドの自動入力の計算式で、Webビューアから取得したRGB値を解析します。自動入力の計算式を次のように設定します。)))ここで「フィールドに既存の値が存在する場合は置き換えない」のチェックボックスのチェックを外して、新しい値が設定されるたびに更新されるようにします。カラーピッカーから新しい値を選択すると、Javascriptから引数を渡すスクリプトを介してFileMakerのフィールドに値が設定されます。FileMakerのフィールドに値が保存されると、自動入力フィールドが選択した色に更新されます。すばらしい!本記事で紹介した内容は、以下のサンプルファイルで確認することができます。できるだけシンプルな構造にして理解しやすいよう考慮しました。これらのサンプルで、画面をもっと整理することもできたと思いますが、中身をいろいろいじってもらうためにあえてそのままにしました。Javascript_Example.zipWebビューアを使用する際には、次の点にも注意してください:コンテキストは現在のレコードです。今自分がいるレコードごとにWebビューアが読み込まれます。Goでは、一つのレイアウトに置けるWebビューアの数には制限があります。(主に開発者向け)FileMakerのバージョンは1つに統一する方がいいでしょう。ここでは、できることのほんの一部を紹介しただけです。JavascriptをFileMakerの開発時のツールに加えることができれば強力な武器になります。