video annotation panel: update subtitles on edit / remove
This commit is contained in:
parent
e533af5cff
commit
3a17fcfe62
1 changed files with 58 additions and 3 deletions
|
@ -86,6 +86,7 @@ Ox.VideoAnnotationPanel = function(options, self) {
|
|||
showLayers: {},
|
||||
showUsers: false,
|
||||
subtitles: [],
|
||||
subtitlesLayer: null,
|
||||
timeline: '',
|
||||
timelines: [],
|
||||
videoRatio: 16/9,
|
||||
|
@ -273,6 +274,8 @@ Ox.VideoAnnotationPanel = function(options, self) {
|
|||
}
|
||||
});
|
||||
|
||||
self.options.subtitles = self.options.subtitles || getSubtitles();
|
||||
|
||||
self.options.layers.forEach(function(layer, i) {
|
||||
that.bindEvent('key_' + (i + 1), function() {
|
||||
layer.editable
|
||||
|
@ -338,7 +341,7 @@ Ox.VideoAnnotationPanel = function(options, self) {
|
|||
showMarkers: true,
|
||||
showMilliseconds: 3,
|
||||
sizeIsLarge: self.options.videoSize == 'large',
|
||||
subtitles: self.options.subtitles,
|
||||
subtitles: Ox.clone(self.options.subtitles),
|
||||
type: type,
|
||||
video: type == 'play' ? self.options.video : self.options.getFrameURL,
|
||||
volume: self.options.volume,
|
||||
|
@ -773,6 +776,9 @@ Ox.VideoAnnotationPanel = function(options, self) {
|
|||
}
|
||||
},
|
||||
change: function(data) {
|
||||
if (data.layer == self.options.subtitlesLayer) {
|
||||
updateSubtitles();
|
||||
}
|
||||
that.triggerEvent('editannotation', data);
|
||||
},
|
||||
define: function(data) {
|
||||
|
@ -1019,6 +1025,22 @@ Ox.VideoAnnotationPanel = function(options, self) {
|
|||
}));
|
||||
}
|
||||
|
||||
function getSelectedLayer() {
|
||||
var layer;
|
||||
Ox.forEach(self.options.layers, function(layer) {
|
||||
Ox.forEach(layer.items, function(item) {
|
||||
if (item.id == self.options.selected) {
|
||||
layer = layer.id;
|
||||
return false;
|
||||
}
|
||||
});
|
||||
if (layer) {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
return layer;
|
||||
}
|
||||
|
||||
function getSizes(scrollbarIsVisible) {
|
||||
var scrollbarWidth = Ox.UI.SCROLLBAR_SIZE,
|
||||
contentWidth = self.options.width
|
||||
|
@ -1087,6 +1109,19 @@ Ox.VideoAnnotationPanel = function(options, self) {
|
|||
return (!scrollbarIsVisible && height > self.options.height - 16) ? getSizes(true) : size;
|
||||
}
|
||||
|
||||
function getSubtitles() {
|
||||
return self.options.subtitlesLayer ? self.options.layers.filter(function(layer) {
|
||||
return layer.id == self.options.subtitlesLayer;
|
||||
})[0].map(function(subtitle) {
|
||||
return {
|
||||
id: subtitle.id,
|
||||
'in': subtitle['in'],
|
||||
out: subtitle.out,
|
||||
text: subtitle.value.replace(/\n/g, ' ').replace(/<br\/?>/g, '\n')
|
||||
};
|
||||
}) : [];
|
||||
}
|
||||
|
||||
function getWords() {
|
||||
var words = [];
|
||||
Ox.forEach(Ox.count(Ox.words(
|
||||
|
@ -1136,6 +1171,9 @@ Ox.VideoAnnotationPanel = function(options, self) {
|
|||
self.positions = getPositions();
|
||||
self.options.find && submitFindInput(self.options.find);
|
||||
self.editing = false;
|
||||
if (data.layer == self.options.subtitlesLayer) {
|
||||
updateSubtitles();
|
||||
}
|
||||
setTimelineState();
|
||||
self.$annotationPanel.removeItem();
|
||||
that.triggerEvent('removeannotation', data);
|
||||
|
@ -1215,6 +1253,12 @@ Ox.VideoAnnotationPanel = function(options, self) {
|
|||
if (self.options['in'] > self.options.out) {
|
||||
setPoint(point == 'in' ? 'out' : 'in', position, keepSelected);
|
||||
} else {
|
||||
if (
|
||||
self.options.selected && self.options.subtitlesLayer
|
||||
&& getSelectedLayer() == self.options.subtitlesLayer
|
||||
) {
|
||||
updateSubtitles();
|
||||
}
|
||||
self.$annotationPanel.options({
|
||||
'in': self.options['in'],
|
||||
out: self.options.out
|
||||
|
@ -1321,6 +1365,9 @@ Ox.VideoAnnotationPanel = function(options, self) {
|
|||
updateWords('add');
|
||||
self.options.find && submitFindInput(self.options.find);
|
||||
self.editing = false;
|
||||
if (data.layer == self.options.subtitlesLayer) {
|
||||
updateSubtitles();
|
||||
}
|
||||
setTimelineState();
|
||||
if (
|
||||
self.options.annotationsRange == 'position'
|
||||
|
@ -1429,9 +1476,17 @@ Ox.VideoAnnotationPanel = function(options, self) {
|
|||
});
|
||||
}
|
||||
|
||||
function updateSubtitles() {
|
||||
self.options.subtitles = getSubtitles();
|
||||
self.$player.forEach(function($player) {
|
||||
player.options({subtitles: self.options.subtitles});
|
||||
});
|
||||
}
|
||||
|
||||
function updateTimelines() {
|
||||
self.$timeline[0].options({type: self.options.timeline});
|
||||
self.$timeline[1].options({type: self.options.timeline});
|
||||
self.$timeline.forEach(function($timeline) {
|
||||
$timeline.options({type: self.options.timeline});
|
||||
});
|
||||
}
|
||||
|
||||
function updateWords(action) {
|
||||
|
|
Loading…
Reference in a new issue