次の方法で共有

Windows Media Player － クロスブラウザ機能のための高度なスクリプティング

  • [アーティクル]

Microsoft Corporation

November 2000

この記事は、Windows Media Player バージョン6.4にのみ適用されます。

スクリプトコマンドは、Microsoft(R) Windows Media(TM) ファイルやライブストリームと Web ページを同期化し、制御するための簡単でパワフルな方法を提供します。埋め込んだ Windows Media Player ActiveX(R) コントロールやプラグインとともにスクリプトコマンドを使用すれば、リッチなマルチメディアWebサイトを作成できます。この記事では、Web ページでスクリプトコマンドの function を実行させる方法をご紹介します。以下のトピックがあります：

  • スクリプトコマンドの理解
  • Windows Media Player の埋め込み
  • イベントハンドラ アプレットの追加
  • スクリプトコマンド イベントを受け取るためのプラグインを有効にする
  • プラグインでスクリプトコマンド イベントを取り込む
  • ActiveX コントロールでスクリプトコマンド イベントを取り込む
  • クロスブラウザ サンプル
  • 詳細情報

スクリプトコマンドの理解

スクリプトコマンドは、メディア内の特定の時間に関連づけて、Windows Media ファイルやライブストリームに追加できるテキストオブジェクトです。再生中に、スクリプトコマンドが発生する時間になると、Windows Media Player がコマンドを受信して処理します。このように、スクリプトコマンドで、メディアや Web ページ内に同期化イベントを設計することが可能になります。たとえば、Windows Media ファイル内に記録されたダイアログと同期して、Web ページ上のフレームの画像を変更するようなコマンドを追加できます。

スクリプトコマンド オブジェクトは 2 つの文字列を含んでいます。「タイプ」文字列と「パラメータ」文字列です。Player は、タイプ文字列を使用してパラメータを処理します。たとえば、Player がタイプとして 「URL」 というタイプを受信すると、パラメータ文字列を URL として処理し、エンドユーザーのブラウザに渡します。「TEXT」 タイプの場合は、Player はパラメータを単純なテキスト文字列として処理し、Player のキャプションウィンドウに表示します。スクリプトコマンドのタイプに関する詳細な情報は、Windows Media Player 7 ソフトウェア開発キット (SDK) を参照してください。

埋め込まれた Windows Media Player は、Web ページ内のスクリプトによって処理できるスクリプトコマンド イベントを生成します。Web ページにスクリプトコマンド機能を追加するには2つのプロセスがあります。

  1. メディアにコマンドを追加する。 デジタルメディアにコマンドを追加するには、いくつかのエンコードツールを利用することができます。ツールがファイルやライブストリームをエンコードする時に、コマンドはメディア内にエンコードされます。コマンドを追加できるオーサリングツールに関する詳細情報は、「Windows Media サービスの中から VBScript を呼び出す」を参照してください。
  2. Web ページ内でコマンドを処理する。 スクリプトは、Player オブジェクトによって引き起こされたスクリプトコマンド イベントを処理します。ActiveX(R) コントロールまたはプラグインのどちらかで処理できるコマンドを使用可能にするために、イベントスクリプト、オブジェクト エレメント、クロスブラウザ スクリプトなどを追加します。

Web ページに、スクリプトコマンド処理を追加する最初のステップは、Windows Media Player ActiveX コントロールとプラグインを追加することです。これにより、ページで Microsoft Internet Explorer と Netscape Navigator をサポートすることができます。

Windows Media Player を埋め込む

次のスクリプトは、Internet Explorer には ActiveX コントロールを、Netscape Navigator にはプラグインを使用して、Web ページに Windows Media Player を埋め込みます。

次のコードを、Web ページの BODY タグの間に追加してください。https://server/path/your-file.asx という部分を、ローカルハードディスク上の Windows Media ファイルやメタファイル、Web サーバー上の Windows Media メタファイルの URL、Windows Media サーバー上の Windows Media ファイルの URL などに置き換えてください。ブラウザが ActiveX コントロールやプラグインをサポートしていない場合は、スタンドアロンの Windows Media Player でストリームを開くような単純なリンクが有効です。

<OBJECT ID="MediaPlayer1" width=176 height=144 
    classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95"
    CODEBASE="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,4,5,715"
        standby="Loading Microsoft(R) Windows(R) Media Player components..." 
        type="application/x-oleobject">
  <PARAM NAME="AutoStart" VALUE="True">
  <PARAM NAME="FileName" VALUE="https://server/path/your-file.asx">
  <PARAM NAME="ShowControls" VALUE="False">
  <PARAM NAME="ShowStatusBar" VALUE="False">
  <EMBED type="application/x-mplayer2" 
    pluginspage="https://www.microsoft.com/Windows/MediaPlayer/"
    SRC="https://server/path/your-file.asx"
    name="MediaPlayer1"
    width=176
    height=144
    autostart=1
    showcontrols=0>
  </EMBED>
</OBJECT>  

<a HREF="https://servername/path/your-file.asx">
    Start the streaming media presentation in the stand-alone Player.</a>

イベントハンドラ アプレットの追加

<script language="JavaScript">
<!--
    if ( navigator.appName == "Netscape" ) 
    {
        navigator.plugins.refresh();
        document.write("\x3C" + "applet MAYSCRIPT Code=NPDS.npDSEvtObsProxy.class" )
        document.writeln(" width=5 height=5 name=appObs\x3E \x3C/applet\x3E")
     }
//-->
</script>

ブラウザが Netscape Navigator の場合は、スクリプトはプラグインをリフレッシュし、スクリプトコマンドのためにプラグインを監視する MAYSCRIPT アプレットを読み出します。イベントハンドラ アプレットは Internet Explorer には必要ありません。

スクリプトコマンド イベントを受け取るためのプラグインを有効にする

次の簡単な JavaScript function を追加します。Internet Explorer には、追加のスクリプトは必要ありません。

<SCRIPT LANGUAGE="JavaScript">
function loader(){
    if ( navigator.appName == "Netscape" ) {
        var plugIn = document.MediaPlayer1;
        document.appObs.setByProxyDSScriptCommandObserver(plugIn,true); 
    }
}
</SCRIPT>

ブラウザが Netscape Navigator の場合は、MAYSCRIPT アプレットがスクリプトコマンド イベントのために Windows Media Player プラグインを監視します。

このfunction は、Web ページがロードされた時点で実行されなければなりません。そうするには、次のように BODY タグの中に Onload イベントを追加して、loader function をつけてください。

<BODY BGCOLOR="#ffffff" onload="loader()">

プラグインでスクリプトコマンド イベントを取り込む

Web ページが Windows Media プラグインからイベントを受け取る準備ができました。Windows Media ファイルやメタファイルからヘッダ情報 (作成者、タイトル、著作権情報を含む) を読み出すことも可能になっています。次のスクリプトは、OnDSScriptCommandEvt function を使って、Windows Media ストリーム内でスクリプトコマンドが受信された時点で、Windows Media Player によって送られる 2 つの文字列を (bstrType と bstrParam を通して)取り込みます。bstrType はスクリプトコマンドのタイプ文字列で、bstrParam はパラメータ文字列です。

最初に、次のように、コマンド Param のテキストを書くプラグインとコントロール function の両方に、contentNav LAYER と contentIE DIV を定義するスクリプトを追加します。

<LAYER id="contentNav" TOP=20 LEFT=190 WIDTH=240><NOLAYER>
<DIV id="contentIE" CLASS="content"></DIV></NOLAYER></LAYER>

さあ、イベント function を追加しましょう。画面にキャプションテキストを書きたい場合は、Windows Media ファイルにタイプ文字列を 「caption」 とし、パラメータ文字列にそのテキストを含めたコマンドを追加します。次のような function を Web ページに追加します。

function OnDSScriptCommandEvt (bstrType, bstrParam){
    if (bstrType.toLowerCase() == "caption") {
        var sCommand;
        
        sCommand = "document.contentNav.document.writeln(\"<SPAN ID=content>"
        sCommand = sCommand + bstrParam;
        sCommand = sCommand + "\");document.contentNav.document.close(); ";
        timerID = setTimeout(sCommand,0);
    }
}

この function は、Player プラグインがスクリプトコマンドを受信したときに呼び出されます。スクリプトコマンドのタイプが caption の場合は、スクリプトコマンドの Param のテキストと、テキストを画面に書き出すスクリプトを含むよう、文字列 (sCommand) が構築されます。setTimeout function は、文字列をプラグインに渡すために使われます。Netscape Navigator は appObs プロキシアプレットから呼び出された function のために新しいスレッドを必要とするため、これは必要な処理となっています。

それぞれの bstrType のために、多くの if ステートメントを追加することができます。たとえば、ひとつのスクリプトコマンドにはテキストを変更させ、もうひとつのコマンドにはWebページの画像を変更させ、3 つめにはページの背景色を変更させることができます。

ActiveX コントロールでスクリプトコマンド イベントを取り込む

Internet Explorer で使われる Windows Media Player ActiveX コントロールは、すでにストリーム内のイベントを受け取ることが可能ですので、追加のスクリプトは必要ありません。ActiveX コントロールとプラグインで、同じ名前をつけることができます。これは、ブラウザが、現在のブラウザにあわせて必要なほうだけをロードするからです。 ActiveX コントロールは、次のサンプルで示されているように、スクリプトコマンド イベントを受信するために ScriptCommand イベントを使います。


<SCRIPT FOR="MediaPlayer1" EVENT="ScriptCommand(bstrType, bstrParam)" LANGUAGE="Jscript">
    if (bstrType.toLowerCase() == "caption") {
        document.all.contentIE.innerHTML = bstrParam;
    } 
</SCRIPT>

Microsoft Visual Basic(R) Scripting Edition (VBScript) も使用することができますが、多くのブラウザは VBScript を読めないことに注意してください。このコード自身の SCRIPT タグ内で区切ることで、ページ上のほかの JavaScript とこのコードを必ず分けてください。

if ステートメントはブラウザが Internet Explorer であるかどうか確認します。true であれば、他の if ステートメントが bstrType 文字列をチェックします。もしそれが caption であれば、テキストエリアは bstrParam に変更されます。OnDSScriptCommandEvt で、それぞれの bstrType に対して欲しい分の if ステートメントを追加することができます。

このコードがどのように動くかを理解することは、上級の Web サイトの作成に成功する上での鍵となるでしょう。このスクリプトを Web ページにカットアンドペーストしてもかまいません。(これらのページが、VBScript や JavaScript のようなスクリプト言語への理解を前提としていることに注意してください。) ここで提供したコードをカスタマイズした場合は、変更部分を Internet Explorer と Netscape Navigator の両方でテストすることを忘れないでください。

クロスブラウザ サンプル

MSDN(TM) Online Sample エリア (たとえば、Cross-browser Embedding や Handling Events Cross-browser) にあるいくつかのサンプルは、Internet Explorer と Netscape Navigator の両方で動くようデザインされています。これらのサンプルは、両方のブラウザで、単純な JavaScript function を使って動きます。

Netscape Navigator は Dynamic HTML やと VBScript をサポートしていませんので、これらのスクリプト言語を使うサンプルは Internet Explorer のみで動きます。

Netscape Navigator は ActiveX コントロールをサポートしていませんので、このコントロールのみを使うサンプルは動きません。一方、Internet Explorer と Netscape Navigator の両方がプラグインをサポートしていますので、もう一方のプラグイン制御するイベントを使用しているWebページは、両方のブラウザで動くでしょう。

詳細情報

クロスブラウザ スクリプトに関する追加の情報は、Windows Media SDK の一部である Windows Media Player Control SDK を参照してください。SDK は Windows Media web サイトからダウンロードできます。