Question

有没有办法从BEML引用自定义javascript函数？我想远离Flash，因为我也需要在HTML5播放器中工作。

<Runtime>
  <Layout width="800" height="600" id="backgroundTemplate">
    <Canvas>
      <VideoDisplay id="videoPlayer" width="788" height="487" x="9" y="13"/>
      <MediaControls x="5" y="509" width="791" height="87" id="mediaControls">
        <VBox>
          <Canvas height="25" padding="20">
            <Playhead mediaController="{videoPlayer}" autohideSlider="false" useTimeToolTip="true"/>
          </Canvas>
          <HBox padding="10">
            <HBox id="leftBtn_container" hAlign="left">
              <ToggleButton id="playButton" width="60" height="60" x="0" y="0" showBack="true" click="{videoPlayer.play()}" toggledClick="{videoPlayer.pause()}" toggled="{videoPlayer.playing}"/>
            </HBox>
            <HBox id="rightBtn_container" hAlign="right">

               <Button width="60" height="60" id="cite_btn" click="{someFunction.doSomething()}"/>

             </HBox>
          </HBox>
        </VBox>
      </MediaControls>
    </Canvas>
  </Layout>
</Runtime>

Answer 1

您需要创建自定义组件。Creating Custom Player Components

在BEML中调用自定义组件。

<Modules>
        <Module file="http://urltocustomcomponent.com/my_component.swf" />
</Modules>

BEML中的按钮

<ToggleButton id="my_button" width="40" height="40" />

自定义组件的Actionscript。

package
{

    import com.brightcove.api.APIModules;
    import com.brightcove.api.BrightcoveModuleWrapper
    import com.brightcove.api.CustomModule;
    import com.brightcove.api.modules.ExperienceModule;
    import com.brightcove.api.events.BEMLMouseEvent;
    import flash.events.Event;
    import flash.external.ExternalInterface;
    import com.brightcove.api.components.Button;

    public class yogaComponent extends CustomModule
    {

        override protected function initialize():void
        { 

            // Get the experience module
            var experienceModule:ExperienceModule = player.getModule(APIModules.EXPERIENCE) as ExperienceModule;

            // Define Info Button
            var button:Button = experienceModule.getElementByID("my_button") as Button;

            // Our listener that calls the function
            button.addEventListener(BEMLMouseEvent.CLICK, myCustomFunc);

        }

        // Custom Function
        private function myCustomFunc(event:Event):void
        {

            if(ExternalInterface.available)
            {
                // this calls a javascript function in your html
                ExternalInterface.call('myJavascriptAlertFunction');
            }
        }

    }
}

在事件点击时调用的Javascript函数。

function myJavascriptAlertFunction()
{
alert('it works!');
}

来自Brightcove BEML的外部JavaScript调用

1 个答案: