Compare commits
No commits in common. "6e1e2be9c41dd75e9acfc5acaf300327b3944b19" and "570fa30d4180a2070f6d03c8c1e2356da750832c" have entirely different histories.
6e1e2be9c4
...
570fa30d41
5 changed files with 37 additions and 139 deletions
|
|
@ -16,9 +16,6 @@ a:hover, .OxLink:hover {
|
||||||
blockquote {
|
blockquote {
|
||||||
margin: 0 1.5em 0 1.5em;
|
margin: 0 1.5em 0 1.5em;
|
||||||
}
|
}
|
||||||
html, body {
|
|
||||||
overscroll-behavior: none;
|
|
||||||
}
|
|
||||||
body {
|
body {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
cursor: default;
|
cursor: default;
|
||||||
|
|
|
||||||
|
|
@ -25,7 +25,6 @@ Ox.ArrayEditable = function(options, self) {
|
||||||
var that = Ox.Element({}, self)
|
var that = Ox.Element({}, self)
|
||||||
.defaults({
|
.defaults({
|
||||||
clickLink: null,
|
clickLink: null,
|
||||||
confirmDeleteDialog: null,
|
|
||||||
editable: true,
|
editable: true,
|
||||||
format: null,
|
format: null,
|
||||||
getSortValue: null,
|
getSortValue: null,
|
||||||
|
|
@ -117,21 +116,15 @@ Ox.ArrayEditable = function(options, self) {
|
||||||
|
|
||||||
self.selected = getSelectedPosition();
|
self.selected = getSelectedPosition();
|
||||||
|
|
||||||
function deleteItem(id, empty) {
|
function deleteItem(id) {
|
||||||
// it is possible to delete an (empty-value) item
|
// it is possible to delete an (empty-value) item
|
||||||
// by selecting another one
|
// by selecting another one
|
||||||
id = id || self.options.selected;
|
id = id || self.options.selected;
|
||||||
|
|
||||||
(self.options.confirmDeleteDialog && !empty ? self.options.confirmDeleteDialog: Ox.noop)({
|
|
||||||
items: Ox.isArray(id) ? id : [id],
|
|
||||||
}, function(result) {
|
|
||||||
if (self.options.editable) {
|
|
||||||
(Ox.isArray(id) ? id : [id]).forEach(id => {
|
|
||||||
var position = Ox.getIndexById(self.options.items, id)
|
var position = Ox.getIndexById(self.options.items, id)
|
||||||
|
if (self.options.editable) {
|
||||||
self.options.items.splice(position, 1);
|
self.options.items.splice(position, 1);
|
||||||
that.triggerEvent('delete', {id: id});
|
|
||||||
})
|
|
||||||
renderItems();
|
renderItems();
|
||||||
|
that.triggerEvent('delete', {id: id});
|
||||||
self.editing = false;
|
self.editing = false;
|
||||||
if (self.options.selected == id) {
|
if (self.options.selected == id) {
|
||||||
self.selected = -1;
|
self.selected = -1;
|
||||||
|
|
@ -140,8 +133,6 @@ Ox.ArrayEditable = function(options, self) {
|
||||||
self.selected = Ox.getIndexById(self.options.item, self.options.selected)
|
self.selected = Ox.getIndexById(self.options.item, self.options.selected)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function doubleclick(e) {
|
function doubleclick(e) {
|
||||||
|
|
@ -155,20 +146,12 @@ Ox.ArrayEditable = function(options, self) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function getId(position) {
|
|
||||||
return position > -1 ? self.options.items[position].id : '';
|
|
||||||
}
|
|
||||||
|
|
||||||
function getSelectedId() {
|
function getSelectedId() {
|
||||||
return getId(self.selected);
|
return self.selected > -1 ? self.options.items[self.selected].id : '';
|
||||||
}
|
|
||||||
|
|
||||||
function getPosition(id) {
|
|
||||||
return Ox.getIndexById(self.options.items, id);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function getSelectedPosition() {
|
function getSelectedPosition() {
|
||||||
return getPosition(self.options.selected);
|
return Ox.getIndexById(self.options.items, self.options.selected);
|
||||||
}
|
}
|
||||||
|
|
||||||
function renderItems(blur) {
|
function renderItems(blur) {
|
||||||
|
|
@ -284,50 +267,6 @@ Ox.ArrayEditable = function(options, self) {
|
||||||
: that.triggerEvent('selectprevious');
|
: that.triggerEvent('selectprevious');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
function toggleItem(idOrPosition) {
|
|
||||||
var id, position;
|
|
||||||
if (Ox.isString(idOrPosition)) {
|
|
||||||
id = idOrPosition
|
|
||||||
position = getPosition(id);
|
|
||||||
} else {
|
|
||||||
position = idOrPosition
|
|
||||||
id = getId(position);
|
|
||||||
}
|
|
||||||
if (!Ox.isArray(self.options.selected)) {
|
|
||||||
self.options.selected = [self.options.selected]
|
|
||||||
}
|
|
||||||
if (!Ox.isArray(self.selected)) {
|
|
||||||
self.selected = [self.selected]
|
|
||||||
}
|
|
||||||
if (!self.options.selected.includes(id)) {
|
|
||||||
var minPos, maxPos;
|
|
||||||
if (Ox.min(self.selected) > position) {
|
|
||||||
minPos = position
|
|
||||||
maxPos = Ox.min(self.selected)
|
|
||||||
} else {
|
|
||||||
minPos = Ox.max(self.selected) + 1
|
|
||||||
maxPos = position + 1
|
|
||||||
}
|
|
||||||
Ox.range(minPos, maxPos).forEach(pos => {
|
|
||||||
self.selected.push(pos)
|
|
||||||
self.options.selected.push(getId(pos))
|
|
||||||
})
|
|
||||||
|
|
||||||
}
|
|
||||||
that.find('.OxSelected').removeClass('OxSelected').removeClass('OxMultiple');
|
|
||||||
that.find('.OxGroup').removeClass('OxGroup')
|
|
||||||
if (self.options.selected.length == 1) {
|
|
||||||
self.options.selected = self.options.selected[0]
|
|
||||||
self.selected = self.selected[0]
|
|
||||||
self.$items[self.selected].addClass('OxSelected');
|
|
||||||
self.options.highlightGroup && that.updateItemGroup()
|
|
||||||
} else {
|
|
||||||
Ox.forEach(self.selected, function(selected) {
|
|
||||||
self.$items[selected].addClass('OxSelected').addClass('OxMultiple');
|
|
||||||
})
|
|
||||||
}
|
|
||||||
triggerSelectEvent();
|
|
||||||
}
|
|
||||||
|
|
||||||
function selectItem(idOrPosition) {
|
function selectItem(idOrPosition) {
|
||||||
if (Ox.isString(idOrPosition)) {
|
if (Ox.isString(idOrPosition)) {
|
||||||
|
|
@ -388,14 +327,8 @@ Ox.ArrayEditable = function(options, self) {
|
||||||
position = $element.data('position');
|
position = $element.data('position');
|
||||||
// if clicked on an element
|
// if clicked on an element
|
||||||
if (position != self.selected) {
|
if (position != self.selected) {
|
||||||
if (e.shiftKey && self.selected != -1) {
|
|
||||||
// add/remove item from multiple selection
|
|
||||||
document.getSelection().removeAllRanges();
|
|
||||||
toggleItem(position);
|
|
||||||
} else {
|
|
||||||
// select another item
|
// select another item
|
||||||
selectItem(position);
|
selectItem(position);
|
||||||
}
|
|
||||||
} else if (e.metaKey) {
|
} else if (e.metaKey) {
|
||||||
// or deselect current item
|
// or deselect current item
|
||||||
selectNone();
|
selectNone();
|
||||||
|
|
@ -437,7 +370,7 @@ Ox.ArrayEditable = function(options, self) {
|
||||||
var item = Ox.getObjectById(self.options.items, id);
|
var item = Ox.getObjectById(self.options.items, id);
|
||||||
Ox.Log('AE', 'submitItem', id, item)
|
Ox.Log('AE', 'submitItem', id, item)
|
||||||
if (value === '') {
|
if (value === '') {
|
||||||
deleteItem(item.id, true);
|
deleteItem(item.id);
|
||||||
} else {
|
} else {
|
||||||
that.triggerEvent(item.value === value ? 'blur' : 'submit', {
|
that.triggerEvent(item.value === value ? 'blur' : 'submit', {
|
||||||
id: item.id,
|
id: item.id,
|
||||||
|
|
|
||||||
|
|
@ -35,7 +35,6 @@ Ox.AnnotationFolder = function(options, self) {
|
||||||
var that = Ox.Element({}, self)
|
var that = Ox.Element({}, self)
|
||||||
.defaults({
|
.defaults({
|
||||||
clickLink: null,
|
clickLink: null,
|
||||||
confirmDeleteDialog: null,
|
|
||||||
collapsed: false,
|
collapsed: false,
|
||||||
editable: false,
|
editable: false,
|
||||||
highlight: '',
|
highlight: '',
|
||||||
|
|
@ -282,7 +281,6 @@ Ox.AnnotationFolder = function(options, self) {
|
||||||
}
|
}
|
||||||
self.$annotations = Ox.ArrayEditable(Ox.extend({
|
self.$annotations = Ox.ArrayEditable(Ox.extend({
|
||||||
clickLink: self.options.clickLink,
|
clickLink: self.options.clickLink,
|
||||||
confirmDeleteDialog: self.options.confirmDeleteDialog,
|
|
||||||
editable: self.options.editable,
|
editable: self.options.editable,
|
||||||
getSortValue: self.options.type == 'text'
|
getSortValue: self.options.type == 'text'
|
||||||
? function(value) {
|
? function(value) {
|
||||||
|
|
@ -581,19 +579,7 @@ Ox.AnnotationFolder = function(options, self) {
|
||||||
|
|
||||||
function selectAnnotation(data) {
|
function selectAnnotation(data) {
|
||||||
if (self.loaded) {
|
if (self.loaded) {
|
||||||
var extendedData;
|
var item = Ox.getObjectById(self.options.items, data.id);
|
||||||
if (Ox.isArray(data.id) && data.id.length) {
|
|
||||||
var items = data.id.map(id => {
|
|
||||||
return Ox.getObjectById(self.options.items, id);
|
|
||||||
})
|
|
||||||
self.options.selected = data.id;
|
|
||||||
extendedData = Ox.extend(data, {
|
|
||||||
'in': Ox.min(items.map(item => { return item["in"]; })),
|
|
||||||
out: Ox.max(items.map(item => { return item["out"]; })),
|
|
||||||
layer: self.options.id
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
var item = Ox.getObjectById(self.options.items, data.id)
|
|
||||||
self.options.selected = item ? data.id : '';
|
self.options.selected = item ? data.id : '';
|
||||||
if (self.widget) {
|
if (self.widget) {
|
||||||
if (self.options.type == 'event') {
|
if (self.options.type == 'event') {
|
||||||
|
|
@ -608,13 +594,11 @@ Ox.AnnotationFolder = function(options, self) {
|
||||||
.panToPlace();
|
.panToPlace();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
extendedData = Ox.extend(data, item ? {
|
that.triggerEvent('select', Ox.extend(data, item ? {
|
||||||
'in': item['in'],
|
'in': item['in'],
|
||||||
out: item.out,
|
out: item.out,
|
||||||
layer: self.options.id
|
layer: self.options.id
|
||||||
} : {});
|
} : {}));
|
||||||
}
|
|
||||||
that.triggerEvent('select', extendedData)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -48,11 +48,9 @@ Ox.AnnotationPanel = function(options, self) {
|
||||||
.defaults({
|
.defaults({
|
||||||
calendarSize: 256,
|
calendarSize: 256,
|
||||||
clickLink: null,
|
clickLink: null,
|
||||||
confirmDeleteDialog: null,
|
|
||||||
editable: false,
|
editable: false,
|
||||||
enableExport: false,
|
enableExport: false,
|
||||||
enableImport: false,
|
enableImport: false,
|
||||||
enableTranscribe: false,
|
|
||||||
highlight: '',
|
highlight: '',
|
||||||
highlightAnnotations: 'none',
|
highlightAnnotations: 'none',
|
||||||
highlightLayer: '*',
|
highlightLayer: '*',
|
||||||
|
|
@ -305,11 +303,7 @@ Ox.AnnotationPanel = function(options, self) {
|
||||||
{},
|
{},
|
||||||
{id: 'import', title: Ox._('Import Annotations...'), disabled: !self.options.enableImport},
|
{id: 'import', title: Ox._('Import Annotations...'), disabled: !self.options.enableImport},
|
||||||
{id: 'export', title: Ox._('Export Annotations...'), disabled: !self.options.enableExport},
|
{id: 'export', title: Ox._('Export Annotations...'), disabled: !self.options.enableExport},
|
||||||
].concat(
|
]
|
||||||
self.options.enableTranscribe ? [
|
|
||||||
{id: 'transcribeaudio', title: Ox._('Transcribe Audio...')},
|
|
||||||
]: []
|
|
||||||
)
|
|
||||||
),
|
),
|
||||||
maxWidth: 256,
|
maxWidth: 256,
|
||||||
style: 'square',
|
style: 'square',
|
||||||
|
|
@ -357,8 +351,6 @@ Ox.AnnotationPanel = function(options, self) {
|
||||||
// ...
|
// ...
|
||||||
} else if (data.id == 'showentityinfo') {
|
} else if (data.id == 'showentityinfo') {
|
||||||
that.triggerEvent('showentityinfo', annotation.entity);
|
that.triggerEvent('showentityinfo', annotation.entity);
|
||||||
} else if (data.id == 'transcribeaudio') {
|
|
||||||
that.triggerEvent('transcribeaudio');
|
|
||||||
} else if (data.id == 'undo') {
|
} else if (data.id == 'undo') {
|
||||||
// ...
|
// ...
|
||||||
}
|
}
|
||||||
|
|
@ -379,7 +371,6 @@ Ox.AnnotationPanel = function(options, self) {
|
||||||
self.$folder[index] = Ox.AnnotationFolder(
|
self.$folder[index] = Ox.AnnotationFolder(
|
||||||
Ox.extend({
|
Ox.extend({
|
||||||
clickLink: self.options.clickLink,
|
clickLink: self.options.clickLink,
|
||||||
confirmDeleteDialog: self.options.confirmDeleteDialog,
|
|
||||||
collapsed: !self.options.showLayers[layer.id],
|
collapsed: !self.options.showLayers[layer.id],
|
||||||
editable: self.options.editable,
|
editable: self.options.editable,
|
||||||
highlight: getHighlight(layer.id),
|
highlight: getHighlight(layer.id),
|
||||||
|
|
|
||||||
|
|
@ -61,13 +61,11 @@ Ox.VideoAnnotationPanel = function(options, self) {
|
||||||
censoredIcon: '',
|
censoredIcon: '',
|
||||||
censoredTooltip: '',
|
censoredTooltip: '',
|
||||||
clickLink: null,
|
clickLink: null,
|
||||||
confirmDeleteDialog: null,
|
|
||||||
cuts: [],
|
cuts: [],
|
||||||
duration: 0,
|
duration: 0,
|
||||||
enableDownload: false,
|
enableDownload: false,
|
||||||
enableImport: false,
|
enableImport: false,
|
||||||
enableExport: false,
|
enableExport: false,
|
||||||
enableTranscribe: false,
|
|
||||||
enableSetPosterFrame: false,
|
enableSetPosterFrame: false,
|
||||||
enableSubtitles: false,
|
enableSubtitles: false,
|
||||||
find: '',
|
find: '',
|
||||||
|
|
@ -846,11 +844,9 @@ Ox.VideoAnnotationPanel = function(options, self) {
|
||||||
autocomplete: self.options.autocomplete,
|
autocomplete: self.options.autocomplete,
|
||||||
calendarSize: self.options.annotationsCalendarSize,
|
calendarSize: self.options.annotationsCalendarSize,
|
||||||
clickLink: self.options.clickLink,
|
clickLink: self.options.clickLink,
|
||||||
confirmDeleteDialog: self.options.confirmDeleteDialog,
|
|
||||||
editable: true,
|
editable: true,
|
||||||
enableExport: self.options.enableExport,
|
enableExport: self.options.enableExport,
|
||||||
enableImport: self.options.enableImport,
|
enableImport: self.options.enableImport,
|
||||||
enableTranscribe: self.options.enableTranscribe,
|
|
||||||
highlight: self.options.find,
|
highlight: self.options.find,
|
||||||
highlightAnnotations: self.options.annotationsHighlight,
|
highlightAnnotations: self.options.annotationsHighlight,
|
||||||
highlightLayer: self.options.findLayer,
|
highlightLayer: self.options.findLayer,
|
||||||
|
|
@ -953,9 +949,6 @@ Ox.VideoAnnotationPanel = function(options, self) {
|
||||||
that.triggerEvent('showentityinfo', data);
|
that.triggerEvent('showentityinfo', data);
|
||||||
},
|
},
|
||||||
submit: submitAnnotation,
|
submit: submitAnnotation,
|
||||||
transcribeaudio: function() {
|
|
||||||
that.triggerEvent('transcribeaudio');
|
|
||||||
},
|
|
||||||
toggle: toggleAnnotations,
|
toggle: toggleAnnotations,
|
||||||
togglecalendar: function(data) {
|
togglecalendar: function(data) {
|
||||||
self.options.showAnnotationsCalendar = !data.collapsed;
|
self.options.showAnnotationsCalendar = !data.collapsed;
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue