gyorgy@0
|
1 /*
|
gyorgy@0
|
2 * ContextMenu Plugin
|
gyorgy@0
|
3 *
|
gyorgy@0
|
4 *
|
gyorgy@0
|
5 */
|
gyorgy@0
|
6
|
gyorgy@0
|
7
|
gyorgy@0
|
8 mejs.MepDefaults.contextMenuItems = [
|
gyorgy@0
|
9 // demo of a fullscreen option
|
gyorgy@0
|
10 {
|
gyorgy@0
|
11 render: function(player) {
|
gyorgy@0
|
12
|
gyorgy@0
|
13 // check for fullscreen plugin
|
gyorgy@0
|
14 if (typeof player.enterFullScreen == 'undefined')
|
gyorgy@0
|
15 return null;
|
gyorgy@0
|
16
|
gyorgy@0
|
17 if (player.isFullScreen) {
|
gyorgy@0
|
18 return "Turn off Fullscreen";
|
gyorgy@0
|
19 } else {
|
gyorgy@0
|
20 return "Go Fullscreen";
|
gyorgy@0
|
21 }
|
gyorgy@0
|
22 },
|
gyorgy@0
|
23 click: function(player) {
|
gyorgy@0
|
24 if (player.isFullScreen) {
|
gyorgy@0
|
25 player.exitFullScreen();
|
gyorgy@0
|
26 } else {
|
gyorgy@0
|
27 player.enterFullScreen();
|
gyorgy@0
|
28 }
|
gyorgy@0
|
29 }
|
gyorgy@0
|
30 }
|
gyorgy@0
|
31 ,
|
gyorgy@0
|
32 // demo of a mute/unmute button
|
gyorgy@0
|
33 {
|
gyorgy@0
|
34 render: function(player) {
|
gyorgy@0
|
35 if (player.media.muted) {
|
gyorgy@0
|
36 return "Unmute";
|
gyorgy@0
|
37 } else {
|
gyorgy@0
|
38 return "Mute";
|
gyorgy@0
|
39 }
|
gyorgy@0
|
40 },
|
gyorgy@0
|
41 click: function(player) {
|
gyorgy@0
|
42 if (player.media.muted) {
|
gyorgy@0
|
43 player.setMuted(false);
|
gyorgy@0
|
44 } else {
|
gyorgy@0
|
45 player.setMuted(true);
|
gyorgy@0
|
46 }
|
gyorgy@0
|
47 }
|
gyorgy@0
|
48 },
|
gyorgy@0
|
49 // separator
|
gyorgy@0
|
50 {
|
gyorgy@0
|
51 isSeparator: true
|
gyorgy@0
|
52 }
|
gyorgy@0
|
53 ,
|
gyorgy@0
|
54 // demo of simple download video
|
gyorgy@0
|
55 {
|
gyorgy@0
|
56 render: function(player) {
|
gyorgy@0
|
57 return "Download Video";
|
gyorgy@0
|
58 },
|
gyorgy@0
|
59 click: function(player) {
|
gyorgy@0
|
60 window.location.href = player.media.currentSrc;
|
gyorgy@0
|
61 }
|
gyorgy@0
|
62 }
|
gyorgy@0
|
63
|
gyorgy@0
|
64 ];
|
gyorgy@0
|
65
|
gyorgy@0
|
66
|
gyorgy@0
|
67 (function($) {
|
gyorgy@0
|
68
|
gyorgy@0
|
69
|
gyorgy@0
|
70
|
gyorgy@0
|
71 MediaElementPlayer.prototype.buildcontextmenu = function(player, controls, layers, media) {
|
gyorgy@0
|
72
|
gyorgy@0
|
73 // create context menu
|
gyorgy@0
|
74 player.contextMenu = $('<div class="mejs-contextmenu"></div>')
|
gyorgy@0
|
75 .appendTo($('body'))
|
gyorgy@0
|
76 .hide();
|
gyorgy@0
|
77
|
gyorgy@0
|
78 // create events for showing context menu
|
gyorgy@0
|
79 player.container.bind('contextmenu', function(e) {
|
gyorgy@0
|
80 e.preventDefault();
|
gyorgy@0
|
81 player.renderContextMenu(e.clientX, e.clientY);
|
gyorgy@0
|
82 return false;
|
gyorgy@0
|
83 });
|
gyorgy@0
|
84 player.container.bind('click', function() {
|
gyorgy@0
|
85 player.contextMenu.hide();
|
gyorgy@0
|
86 });
|
gyorgy@0
|
87 }
|
gyorgy@0
|
88
|
gyorgy@0
|
89 MediaElementPlayer.prototype.renderContextMenu = function(x,y) {
|
gyorgy@0
|
90
|
gyorgy@0
|
91 // alway re-render the items so that things like "turn fullscreen on" and "turn fullscreen off" are always written correctly
|
gyorgy@0
|
92 var t = this,
|
gyorgy@0
|
93 html = '',
|
gyorgy@0
|
94 items = t.options.contextMenuItems;
|
gyorgy@0
|
95
|
gyorgy@0
|
96 for (var i=0, il=items.length; i<il; i++) {
|
gyorgy@0
|
97
|
gyorgy@0
|
98 if (items[i].isSeparator) {
|
gyorgy@0
|
99 html += '<div class="mejs-contextmenu-separator"></div>';
|
gyorgy@0
|
100 } else {
|
gyorgy@0
|
101
|
gyorgy@0
|
102 var rendered = items[i].render(t);
|
gyorgy@0
|
103
|
gyorgy@0
|
104 // render can return null if the item doesn't need to be used at the moment
|
gyorgy@0
|
105 if (rendered != null) {
|
gyorgy@0
|
106 html += '<div class="mejs-contextmenu-item" data-itemindex="' + i + '">' + rendered + '</div>';
|
gyorgy@0
|
107 }
|
gyorgy@0
|
108 }
|
gyorgy@0
|
109 }
|
gyorgy@0
|
110
|
gyorgy@0
|
111 // position and show the context menu
|
gyorgy@0
|
112 t.contextMenu
|
gyorgy@0
|
113 .empty()
|
gyorgy@0
|
114 .append($(html))
|
gyorgy@0
|
115 .css({top:y, left:x})
|
gyorgy@0
|
116 .show()
|
gyorgy@0
|
117
|
gyorgy@0
|
118 // bind events
|
gyorgy@0
|
119 t.contextMenu.find('.mejs-contextmenu-item').click(function() {
|
gyorgy@0
|
120 // which one is this?
|
gyorgy@0
|
121 var itemIndex = parseInt( $(this).data('itemindex'), 10 );
|
gyorgy@0
|
122
|
gyorgy@0
|
123 // perform click action
|
gyorgy@0
|
124 t.options.contextMenuItems[itemIndex].click(t);
|
gyorgy@0
|
125
|
gyorgy@0
|
126 // close
|
gyorgy@0
|
127 t.contextMenu.hide();
|
gyorgy@0
|
128 });
|
gyorgy@0
|
129
|
gyorgy@0
|
130 }
|
gyorgy@0
|
131
|
gyorgy@0
|
132 })(mejs.$); |