-
Notifications
You must be signed in to change notification settings - Fork 2
/
vhx.html
100 lines (84 loc) · 2.98 KB
/
vhx.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
<!doctype html>
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script>
<script type="text/javascript" src="http://vhx.tv/javascripts/jquery.swfobject-1.1.1.js"></script>
<script type="text/javascript">
$(document).ready(
function() {
$('#vhx_megaplaya').flash({
swf: 'http://vhx.tv/embed/megaplaya.swf',
width: 850,
allowFullScreen: true,
allowScriptAccess: "always",
height: 480
});
}
);
// Megaplaya calls this function when it's ready
var megaplaya = false;
var arg = null;
function megaplaya_loaded()
{
megaplaya = $('#vhx_megaplaya').children()[0];
megaplaya_addListeners();
load_videos();
}
function megaplaya_call(method)
{
// "pause" => megaplaya.api_pause();
(megaplaya["api_" + method])();
}
function megaplaya_addListeners()
{
var events = ['onVideoFinish', 'onVideoLoad', 'onError', 'onPause', 'onPlay', 'onFullscreen', 'onPlaybarShow', 'onPlaybarHide', 'onKeyboardDown'];
// Loop through and add in call the callback methods. Flash will automatically call megaplaya_callback
$.each(events, function(index, value) {
megaplaya.api_addListener(value, "function() { megaplaya_callback('" + value + "', arguments); }")
});
}
function megaplaya_callback(event_name, args)
{
var pretty_args = '';
pretty_args += args[0] || ''
if (args[1]) pretty_args += ', ' + (args[1] || '')
if (args[2]) pretty_args += ', ' + (args[2] || '')
// dev.vhx.tv/video-player.html#javascript-api
console.log("current time: " + megaplaya.api_getCurrentTime());
$('#megaplaya_log')[0].innerHTML = event_name + "(" + pretty_args + ")<br />" + $('#megaplaya_log')[0].innerHTML;
}
function load_videos()
{
console.log("loading videos");
$.ajax({
type: "GET",
url: "http://vimeo.com/api/v2/vhx/videos.json",
dataType: "jsonp",
success: function(videos, status, ajax) {
if (videos) {
megaplaya.api_playQueue(videos);
}
}
});
}
</script>
</head>
<body>
<div id="vhx_megaplaya">Loading...</div>
<div id="controls">
<input type="button" class="btn" onclick="megaplaya_call('playVideo')" value="Play" />
<input type="button" class="btn" onclick="megaplaya_call('pauseVideo')" value="Pause" />
<input type="button" class="btn" onclick="megaplaya_call('prevVideo')" value="Prev video" />
<input type="button" class="btn" onclick="megaplaya_call('nextVideo')" value="Next video" />
<input type="button" class="btn" onclick="megaplaya_call('disablePlaybar')" value="Disable playbar" />
<input type="button" class="btn" onclick="megaplaya_call('enablePlaybar')" value="Enable playbar" />
<input type="button" class="btn" onclick="megaplaya_call('zoomify')" value="Zoom-in" />
<input type="button" class="btn" onclick="megaplaya_call('unzoomify')" value="Zoom-out" />
</div>
<br />
Megaplaya log
<div id="megaplaya_log">
</div>
</body>
</html>