0x2620/oxjs
2
0
Fork 1
Code Issues 172 Pull requests Releases Wiki Activity

make 'censored' icon/link/tooltip configurable (fixes #252)

Browse source
This commit is contained in:
rlx 2012-04-22 09:57:17 +00:00
parent bdab9b8a7d
commit f0d4043fd4
6 changed files with 89 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
source/Ox.UI/css/Ox.UI.css
View file

@ -2270,7 +2270,7 @@ Video
}
.OxVideoPlayer .OxCopyrightIcon {
.OxVideoPlayer .OxCensoredIcon {
position: absolute;
left: 0;
top: 0;

82
source/Ox.UI/js/Video/Ox.VideoEditor.js
View file

@ -25,6 +25,8 @@ Ox.VideoEditor = function(options, self) {
annotationsSize: 256,
annotationsSort: 'position',
censored: [],
censoredIcon: '',
censoredTooltip: '',
clickLink: null,
cuts: [],
duration: 0,
@ -236,6 +238,8 @@ Ox.VideoEditor = function(options, self) {
['play', 'in', 'out'].forEach(function(type, i) {
self.$player[i] = Ox.VideoPlayer({
censored: self.options.censored,
censoredIcon: self.options.censoredIcon,
censoredTooltip: self.options.censoredTooltip,
controlsBottom: type == 'play' ?
['play', 'playInToOut', 'volume', 'size', 'space', 'position'] :
['goto', 'set', 'space', 'position'],
@ -267,42 +271,48 @@ Ox.VideoEditor = function(options, self) {
left: self.sizes.player[i].left + 'px',
top: self.sizes.player[i].top + 'px'
})
.bindEvent(type == 'play' ? {
muted: function(data) {
that.triggerEvent('muted', data);
},
paused: function(data) {
that.triggerEvent('paused', data);
},
playing: function(data) {
setPosition(data.position, true);
},
position: function(data) {
setPosition(data.position);
},
resolution: function(data) {
that.triggerEvent('resolution', data);
},
size: function() {
toggleSize();
},
subtitles: function(data) {
that.triggerEvent('subtitles', data);
},
volume: function(data) {
that.triggerEvent('volume', data);
}
} : {
gotopoint: function() {
goToPoint(type);
},
position: function(data) {
setPoint(type, data.position);
},
setpoint: function() {
setPoint(type, self.options.position);
}
})
.bindEvent(
Ox.extend({
censored: function() {
that.triggerEvent('censored');
}
}, type == 'play' ? {
muted: function(data) {
that.triggerEvent('muted', data);
},
paused: function(data) {
that.triggerEvent('paused', data);
},
playing: function(data) {
setPosition(data.position, true);
},
position: function(data) {
setPosition(data.position);
},
resolution: function(data) {
that.triggerEvent('resolution', data);
},
size: function() {
toggleSize();
},
subtitles: function(data) {
that.triggerEvent('subtitles', data);
},
volume: function(data) {
that.triggerEvent('volume', data);
}
} : {
gotopoint: function() {
goToPoint(type);
},
position: function(data) {
setPoint(type, data.position);
},
setpoint: function() {
setPoint(type, self.options.position);
}
})
)
.appendTo(self.$editor);
});

7
source/Ox.UI/js/Video/Ox.VideoPanel.js
View file

@ -23,6 +23,8 @@ Ox.VideoPanel = function(options, self) {
annotationsSize: 256,
annotationsSort: 'position',
censored: [],
censoredIcon: '',
censoredTooltip: '',
clickLink: null,
cuts: [],
duration: 0,
@ -86,6 +88,8 @@ Ox.VideoPanel = function(options, self) {
self.$video = Ox.VideoPlayer({
annotations: getAnnotations(),
censored: self.options.censored,
censoredIcon: self.options.censoredIcon,
censoredTooltip: self.options.censoredTooltip,
controlsTop: ['fullscreen', 'title', 'find'],
controlsBottom: ['play', 'volume', 'scale', 'timeline', 'position', 'settings'],
enableDownload: self.options.enableDownload,
@ -112,6 +116,9 @@ Ox.VideoPanel = function(options, self) {
width: getPlayerWidth()
})
.bindEvent({
censored: function() {
that.triggerEvent('censored');
},
download: function(data) {
that.triggerEvent('downloadvideo', data);
},

19
source/Ox.UI/js/Video/Ox.VideoPlayer.js
View file

@ -12,6 +12,8 @@ Ox.VideoPlayer <f> Generic Video Player
out <n> Out point (sec)
text <s> Text
censored <a|[]> Array of censored ranges
censoredIcon <s|''> 'Censored' icon
censoredTooltip <s|''> Tooltip for 'censored' icon
controlsBottom <[s]|[]> Bottom controls, from left to right
Can be 'close', fullscreen', 'scale', 'title', 'find', 'open',
'play', 'playInToOut', 'previous', 'next', 'mute', 'volume', 'size',
@ -84,6 +86,8 @@ Ox.VideoPlayer = function(options, self) {
annotations: [],
brightness: 1,
censored: [],
censoredIcon: '',
censoredTooltip: '',
controlsBottom: [],
controlsTooltips: {},
controlsTop: [],
@ -298,7 +302,8 @@ Ox.VideoPlayer = function(options, self) {
self.options.enableMouse && self.$videoContainer.bindEvent({
anyclick: function(e) {
if (!$(e.target).is('.OxLogo')) {
var $target = $(e.target);
if (!$target.is('.OxLogo') && !$target.is('.OxCensoredIcon')) {
togglePaused();
}
},
@ -439,14 +444,18 @@ Ox.VideoPlayer = function(options, self) {
if (self.options.censored.length) {
self.$copyrightIcon = Ox.Element({
element: '<img>',
// fixme: make this configurable
tooltip: 'This part of this video is not available in<br/>your part of your country. Sorry for that.'
tooltip: self.options.censoredTooltip
})
.addClass('OxCopyrightIcon OxVideo')
.addClass('OxCensoredIcon OxVideo')
.attr({
src: Ox.UI.getImageURL('symbolNoCopyright', 'modern'),
src: Ox.UI.getImageURL('symbol' + self.options.censoredIcon, 'modern'),
})
.hide()
.bindEvent({
anyclick: function() {
that.triggerEvent('censored');
}
})
.appendTo(self.$videoContainer);
}

7
source/Ox.UI/js/Video/Ox.VideoTimelinePanel.js
View file

@ -18,6 +18,8 @@ Ox.VideoTimelinePanel = function(options, self) {
annotationsSize: 256,
annotationsSort: 'position',
censored: [],
censoredIcon: '',
censoredTooltip: '',
clickLink: null,
cuts: [],
duration: 0,
@ -65,6 +67,8 @@ Ox.VideoTimelinePanel = function(options, self) {
self.$player = Ox.VideoTimelinePlayer({
censored: self.options.censored,
censoredIcon: self.options.censoredIcon,
censoredTooltip: self.options.censoredTooltip,
cuts: self.options.cuts,
duration: self.options.duration,
followPlayer: self.options.followPlayer,
@ -85,6 +89,9 @@ Ox.VideoTimelinePanel = function(options, self) {
width: getPlayerWidth()
})
.bindEvent({
censored: function() {
that.triggerEvent('censored');
},
follow: function(data) {
that.triggerEvent('follow', data);
},

14
source/Ox.UI/js/Video/Ox.VideoTimelinePlayer.js
View file

@ -8,6 +8,8 @@ Ox.VideoTimelinePlayer = function(options, self) {
var that = Ox.Element({}, self)
.defaults({
censored: [],
censoredIcon: '',
censoredTooltip: '',
cuts: [],
duration: 0,
find: '',
@ -279,6 +281,8 @@ Ox.VideoTimelinePlayer = function(options, self) {
self.$frame = Ox.VideoPlayer({
censored: self.options.censored,
censoredIcon: self.options.censoredIcon,
censoredTooltip: self.options.censoredTooltip,
duration: self.options.duration,
height: self.tileHeight,
position: self.options.position,
@ -287,6 +291,11 @@ Ox.VideoTimelinePlayer = function(options, self) {
video: self.options.getFrameURL,
width: self.videoWidth
})
.bindEvent({
censored: function() {
that.triggerEvent('censored');
}
})
.appendTo(self.$frameBox);
$('<div>')
@ -316,6 +325,8 @@ Ox.VideoTimelinePlayer = function(options, self) {
self.$video = Ox.VideoPlayer({
censored: self.options.censored,
censoredIcon: self.options.censoredIcon,
censoredTooltip: self.options.censoredTooltip,
duration: self.options.duration,
height: self.tileHeight,
muted: self.options.muted,
@ -326,6 +337,9 @@ Ox.VideoTimelinePlayer = function(options, self) {
width: self.videoWidth
})
.bindEvent({
censored: function() {
that.triggerEvent('censored');
},
ended: function() {
togglePaused(true);
},