Yes Second Life

セカンドライフ向けWebサービスを作ってました。このブログではVR・メタバースのことを書いていきます

HighFidelityで伝言掲示板をつくる

この記事は、セカンドライフ技術系アドベントカレンダー2017向けの記事です。ウチは例のごとくHigh Fidelityネタを書きます。

adventar.org

今回は実際に何か作ろうということで、伝言掲示板を作ってみようと思います。チャットかなにかで文言を指定すると、それを記録し残してくれるようなツールです。

f:id:sabro:20171123224654p:plain

セカンドライフではオブジェクトに文字列を残すのは結構大変で、すべての文字をテクスチャでアップロードして切り替えたり、プリムにWebページを表示してそこで文字列を表示したりしてましたが、HighFidelityではテキストオブジェクトというテキストを表示するためのオブジェクトが用意されています。これを使えば割りと簡単に実装できそうです。

f:id:sabro:20171123231439p:plain

しかし、ここで重大な事実が判明。なんとHighFidelityにはテキストチャットのインターフェースがデフォルトでは存在しません。テキストチャットから文字列を送信するという手法は取れなくなりました。

f:id:sabro:20171125020834p:plain

今はRiftみたいなHMDでアクセスするのが当たり前なので、マイクのチャットを使うだろうからデフォルトでテキストチャットがあっては邪魔だろうという判断みたいです。一応インターフェース(ビューワ)には、チャットを実装したインターフェーススクリプト、chat.jsが付属しているので、これを有効にしてやればテキストチャットできるようになります。

f:id:sabro:20171125023209p:plain

余談ですが、このchat.jsはすべて公開されているAPIで実装されています。つまり自分でオリジナルのチャットシステムを作ったりもできるということですね。実際、HighFidelityにはオリジナルのチャットシステムを作って公開してる人もいるみたいです。

f:id:sabro:20171125192819p:plain

しかし、デフォルトでOFFになっている機能を前提とするのも微妙なので、今回は伝言掲示板をクリックすると、入力ダイアログを表示するような方針で行こうと思います。

掲示板のタッチイベントで、javascriptのWindow.prompt関数を使って入力値を取得。それをEntities.editEntity関数でテキストエンティティのプロパティに設定します。

(function() {

    // クリックイベント
    this.clickDownOnEntity = function(entityID, mouseEvent) {

        // 入力ダイアログを表示
        var message = Window.prompt("Input Message!", "");

        // 入力値をテキストエンティのtextプロパティに設定
        Entities.editEntity(entityID, { "text" : message });
    };
})

残念ながら、Window.promptの表示メッセージに日本語を使用するとダイアログが出ませんでした。このスクリプトをWeb上に公開しテキストエンティティにScript URLを設定します。

f:id:sabro:20171125225951p:plain

このへんの話がわからない人は、こっちを見てね。

High Fidelityのスクリプト - Yes Second Life

またまた余談ですが、Script URLの下に、Server Script URLというプロパティがありますね。実はEntity Scriptは、Client Entity ScriptとServer Entity Scriptに分かれました。前者はユーザがエンティティの近くにいるときだけ動作し、後者はユーザがいるかどうかに関わらず動作し続けます。

さて、では作った掲示板の動作確認です。まずはタッチでダイアログを出してメッセージを入力。残念ながら日本語は入力無理でした。

f:id:sabro:20171125235420p:plain

入力後、無事メッセージが変わりました。

f:id:sabro:20171125235611p:plain

最初は、テキストの入力をどうするか分からなくて大変そうだなあと思ってたんですが、Window.promptが使えると気づいたら結構簡単に出来てしまいました。

今回のようなダイアログでなくセカンドライフのHUDのようにもっと複雑なUIを作りたい場合は、Tablet UI Frameworkというのを使う必要があります。こちらも機会があればまた記事にしたいと思います( ̄∇  ̄ )