0

Play video mp4 in zk

asked 2014-04-28 09:14:59 +0800

thantienbut gravatar image thantienbut
1 1

hj, every body i need your help about how to play video mp4 but do not use tag <video> of html5 ...thanks

delete flag offensive retag edit

2 Answers

Sort by ยป oldest newest most voted
0

answered 2014-04-28 09:51:19 +0800

sitansu gravatar image sitansu
2254 13
http://java91.blogspot.in...

you can use <flash/> tag for video play:

<flash src="SWF/cc.milestones.121503.swf" height="320" width="620"></flash>

Read More:New ZK Flash Based Components

link publish delete flag offensive edit
0

answered 2014-04-28 12:40:33 +0800

cyiannoulis gravatar image cyiannoulis
1201 10

Here is a complete sample of a ZUL page playing an MP4 video. The video is controlled from ZK ViewModel methods. It is using the jPlayer - a well known jquery media player.

The ZUL page:

<?page title="Media Player" contentType="text/html;charset=UTF-8"?>
<zk>

<style src="/skin/blue.monday/jplayer.blue.monday.css" ></style>
<script type="text/javascript" src="/js/jquery.jplayer.min.js"></script>

<script type="text/javascript"><![CDATA[

zk.afterMount(function() {

     $('$jquery_jplayer_1').jPlayer({
         ready: function() {
            $(this).jPlayer("setMedia", {
                title: "Trailer",
                m4v: "http://www.jplayer.org/video/m4v/Big_Buck_Bunny_Trailer.m4v",
                ogv: "http://www.jplayer.org/video/ogv/Big_Buck_Bunny_Trailer.ogv",
                poster: "http://www.jplayer.org/video/poster/Big_Buck_Bunny_Trailer_480x270.png"
            });
        },
        swfPath: "/js",
        supplied: "m4v, ogv"
     });

});

function play() {
    $('$jquery_jplayer_1').jPlayer("play");
}
function pause() {
    $('$jquery_jplayer_1').jPlayer("pause");
}
function stop() {
    $('$jquery_jplayer_1').jPlayer("stop");
}

]]></script>

<window title="Media Player" border="normal" xmlns:n="native"
        apply="org.zkoss.bind.BindComposer" 
        viewModel="@id('vm') @init('vm.MediaPlayerVM')"> 


<hlayout>
    <div id="jp_container_1" class="jp-video ">
        <div class="jp-type-single">
          <div id="jquery_jplayer_1" class="jp-jplayer"></div>
        </div>
    </div>

    <vlayout>
        <button label="Play" onClick="@command('play')" width="150px" />
        <button label="Pause" onClick="@command('pause')" width="150px" />
        <button label="Stop" onClick="@command('stop')" width="150px" />
    </vlayout>
</hlayout>

</window>
</zk>

And here is the view model:

package vm;
import org.zkoss.bind.annotation.Command;
import org.zkoss.zk.ui.util.Clients;

public class MediaPlayerVM {

    @Command
    public void play() {
        Clients.evalJavaScript("play()");
    }
    @Command
    public void pause() {
        Clients.evalJavaScript("pause()");
    }
    @Command
    public void stop() {
        Clients.evalJavaScript("stop()");
    }
}

Have a look at this page to start with jPlayer.

Hope that helps

Costas

link publish delete flag offensive edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow
1 follower

RSS

Stats

Asked: 2014-04-28 09:14:59 +0800

Seen: 34 times

Last updated: Apr 28 '14

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More