PepperのタブレットにはAndroid 4.0.4がいて、ここでWebブラウザが走っています。おそらくAndroidデフォルトのブラウザのようで、JavaScriptなども(4.0.4なのでつらいところもありますが)動きます。
が、デフォルトのボックスなど使ってもそのままではちょっとログまわりが貧弱な感じで開発はつらそうだなと。そんなわけでいくつか試行してみたのでそのメモ。

なお、今回のお試しコード類は https://github.com/yacchin1205/pepper-tablet に置いてあります。

アプリケーション内にタブレット用コンテンツを定義

まず、アプリケーション内にタブレット用のリソースを定義する方法を簡単にまとめてみます。
基本的には、Pepperで画像を撮影してタブレットに画像表示にある通り。

アプリケーション内に html フォルダを作り、そこに index.html 他必要なリソースを置く
tabletボックスライブラリの Show Appボックスを配置する。基本的には以下のボックスだけでOK

ただ、Pepper TechFes 2014で配布されたバージョンのChoregrapheだと、tablet関連ボックスが前提とするパス構成に問題があるので、 Show Imageボックスの実装をみてみるあたりを参考に、パス処理の部分を修正するなりする必要がある。

これで、タブレットに index.html で定義したコンテンツが表示されます。コンテンツを表示させること自体は割と簡単。

アプリケーション中の html ディレクトリが、ユーザのホームディレクトリの public_html がWebサーバ経由で見えるようになるのと同じような雰囲気。Pepper内にいるローカルなWebサーバが、タブレットのブラウザから参照できるようになっている雰囲気っぽい。

タブレットのブラウザで発生するメッセージを取得

デフォルトではJavaScriptにエラーなどが発生しても、Choregrapheのログ上は何も言わないみたいで、エラーなど起きてても全然わかりません。これでは開発はつらい感じなので、エラーログを取ったり、あるいは console.log などで状況を出力させたくなります。

なお、今回は以下のようなコンテンツをタブレットに表示させてみてテストしました。以下のように、わざとエラーを発生させるボタンと、 console.log を呼び出すようなボタンがあります。

まあ、スクリーンショットのようにChrome Developer Toolsみたいなのがほしいんですけど、とにかくログが出力されるだけでも・・・

メモリイベントで取得

とりあえず、NAOqiのアーキテクチャを考えると、メモリイベントとしてログがあらわれるのかな、と思いつつAPIドキュメントを調べると、ずばりなものが見つかります。

Event: "ALTabletService/message"
callback(std::string eventName, std::string subscriberIdentifier)

Raised when message occurs.

メモリウォッチャーで ALTabletService/message を監視しつつ、わざとコンテンツでエラーを起こしてみると、こんな感じで見える。

うむ・・・！

まあ、メモリウォッチャーのみだとちょっと確認しずらいので（たぶん、最後に出力されたログのみが表示されている）。せめてログビューアに流したくなるのが人情というものです。

ログに流す

APIドキュメントを見ていたら、 ALTabletService::onConsoleMessage(message) というものもあった。tabletボックスライブラリのタッチイベント取得はこのSignals機構でやってるっぽいし、このシグナルで処理するのがALTabletService API流のように見える。ということで、Show Appボックスを以下のように修正。

なお、以下の感じの修正をしたバージョンのコードを最初に書いたgithub上の webview-console プロジェクトに置いてあります。

consoleMessageCallbackメソッドの追加

console messageを受け取るためのメソッドを作る。Show AppボックスのPythonスクリプト末尾に以下のようなコードを追加。

    def consoleMessageCallback(self, message):
        self.logger.info("[ConsoleMessage] %s" % message)

メッセージを受け取ったら、 self.logger を使ってログを出力している。

onInput_onStartメソッドの修正

tabletService.loadApplication を実行する手前に以下のようなコードを追加。

                # コンソールを監視開始
                if not self.consoleConnectId:
                    self.consoleConnectId = tabletService.onConsoleMessage.connect(self.consoleMessageCallback)

これで、consoleMessageCallback を onConsoleMessage に反応するように設定できる。

onLoad, onUnloadメソッドの修正

アンロード時にハンドラを登録解除するようにする。onUnloadメソッドに以下のようなコードを追加。

        # コンソールの監視終了
        if self.consoleConnectId:
            try:
                self._getTabletService().onConsoleMessage.disconnect(self.consoleConnectId)
                self.consoleConnectId = None
            except Exception as e:
                self.logger.error(e)

あと、ロード時に、メンバの初期化もしておく。onLoadメソッドに以下のようなコードを追加。

        self.consoleConnectId = None

動かす

この修正を施したプロジェクトを動かしてみると、ログビューアでログが見えます。エラーが起きればこんな感じ。

[INFO ] behavior.box :consoleMessageCallback:80 _Behavior__lastUploadedChoregrapheBehaviorbehavior_1143658480__root__ShowApp_2: [ConsoleMessage] Uncaught TypeError: Cannot call method 'call' of null

記録し忘れたけど、ちゃんと console.log の出力も見えます。十分ではないけど、これでだいぶデバッグが楽になるのではないかなー。と期待。
PepperのタブレットでJavaScriptとかどの程度動くのかもいじってみたいなあ・・・

Pepperのタブレットでのログメッセージ処理