forked from 0x2620/oxjs
update video editor
This commit is contained in:
rlx
parent
56cf323110
commit
688ae65cf1
8 changed files with 413 additions and 176 deletions
|
|
@ -57,7 +57,12 @@ Ox.AnnotationFolder = function(options, self) {
|
|||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
|
||||
var item = Ox.getObjectById(self.options.items, self.options.selected);
|
||||
that.triggerEvent('define', item.place ? {
|
||||
id: item.place.id
|
||||
} : {
|
||||
name: item.value
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
@ -127,6 +132,7 @@ Ox.AnnotationFolder = function(options, self) {
|
|||
} else { // place
|
||||
self.$widget = self.$map = Ox.Map({
|
||||
places: getPlaces(),
|
||||
showTypes: true,
|
||||
// FIXME: should be showZoombar
|
||||
zoombar: true
|
||||
// showLabels: true
|
||||
|
|
@ -168,7 +174,9 @@ Ox.AnnotationFolder = function(options, self) {
|
|||
self.$annotations = Ox.ArrayEditable({
|
||||
editable: self.options.editable,
|
||||
items: getAnnotations(),
|
||||
placeholder: 'No ' + self.options.title,
|
||||
selected: self.options.selected,
|
||||
separator: ';',
|
||||
sort: self.sort,
|
||||
submitOnBlur: false,
|
||||
width: self.options.type == 'text' ? self.options.width + 8 : self.options.width,
|
||||
|
|
@ -177,12 +185,19 @@ Ox.AnnotationFolder = function(options, self) {
|
|||
//.css({marginTop: '256px'})
|
||||
.bindEvent({
|
||||
add: function(data) {
|
||||
that.triggerEvent('add', {value: data.value || ''});
|
||||
if (self.editing) {
|
||||
// FIXME: changed value will not be saved!
|
||||
}
|
||||
that.triggerEvent('add', {value: data.value || ''});
|
||||
},
|
||||
blur: function() {
|
||||
// the video editor will, if it has not received focus,
|
||||
// call blurItem
|
||||
that.triggerEvent('blur');
|
||||
},
|
||||
change: changeAnnotation,
|
||||
'delete': function(data) {
|
||||
self.editing = false;
|
||||
that.triggerEvent('remove', {id: data.id});
|
||||
},
|
||||
edit: function() {
|
||||
|
|
@ -208,6 +223,12 @@ Ox.AnnotationFolder = function(options, self) {
|
|||
|
||||
showWarnings();
|
||||
|
||||
function changeAnnotation(data) {
|
||||
var item = Ox.getObjectById(self.options.items, data.id);
|
||||
item.value = data.value;
|
||||
that.triggerEvent('change', item);
|
||||
}
|
||||
|
||||
function dragstart() {
|
||||
if (self.options.showWidget) {
|
||||
self.drag = {
|
||||
|
|
@ -298,7 +319,7 @@ Ox.AnnotationFolder = function(options, self) {
|
|||
function selectAnnotation(data) {
|
||||
var item = Ox.getObjectById(self.options.items, data.id);
|
||||
self.options.selected = item ? data.id : '';
|
||||
self.$defineButton.options({disabled: !self.options.selected});
|
||||
self.widget && self.$defineButton.options({disabled: !self.options.selected});
|
||||
///*
|
||||
if (self.options.type == 'place') {
|
||||
self.$map.options({
|
||||
|
|
@ -315,14 +336,16 @@ Ox.AnnotationFolder = function(options, self) {
|
|||
}
|
||||
|
||||
function showWarnings() {
|
||||
if (self.widget) {
|
||||
if (self.widget && self.options.items.length) {
|
||||
self.$annotations.find('.OxValue').each(function() {
|
||||
var $element = $(this);
|
||||
if (!Ox.getObject(
|
||||
self.options.items, 'value', $element.html()
|
||||
)[self.options.type]) {
|
||||
$element.css({color: 'rgb(192, 64, 64)'});
|
||||
}
|
||||
try { // FIXME: bad data, remove later!!
|
||||
if (!Ox.getObject(
|
||||
self.options.items, 'value', $element.html()
|
||||
)[self.options.type]) {
|
||||
$element.css({color: 'rgb(192, 64, 64)'});
|
||||
}
|
||||
} catch(e) {}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
@ -331,7 +354,6 @@ Ox.AnnotationFolder = function(options, self) {
|
|||
var item = Ox.getObjectById(self.options.items, data.id);
|
||||
item.value = data.value;
|
||||
self.editing = false;
|
||||
Ox.print('??:', self.options.items[0], self.$annotations.options('items')[0])
|
||||
//self.$annotations.options({items: self.options.items});
|
||||
self.options.sort == 'text' && self.$annotations.reloadItems();
|
||||
that.triggerEvent('submit', item);
|
||||
|
|
@ -353,6 +375,17 @@ Ox.AnnotationFolder = function(options, self) {
|
|||
that.triggerEvent('togglewidget', {collapsed: !self.options.showWidget});
|
||||
}
|
||||
|
||||
function updateAnnotations() {
|
||||
self.$annotations.options({items: getAnnotations()});
|
||||
showWarnings();
|
||||
}
|
||||
|
||||
function updateWidget() {
|
||||
self.options.type == 'event'
|
||||
? self.$calendar.options({events: getEvents()})
|
||||
: self.$map.options({places: getPlaces()});
|
||||
}
|
||||
|
||||
self.setOption = function(key, value) {
|
||||
if (['in', 'out'].indexOf(key) > -1 && self.editing) {
|
||||
var index = Ox.getIndexById(self.options.items, self.options.selected);
|
||||
|
|
@ -361,19 +394,19 @@ Ox.AnnotationFolder = function(options, self) {
|
|||
}
|
||||
if (key == 'in') {
|
||||
//fixme: array editable should support item updates while editing
|
||||
if (self.editing || self.options.range == 'selection') {
|
||||
self.options.type == 'place' ? self.$map.options({places: getPlaces()})
|
||||
: self.$annotations.options({items: getAnnotations()});
|
||||
if (self.options.range == 'selection') {
|
||||
self.widget && updateWidget();
|
||||
updateAnnotations();
|
||||
}
|
||||
} else if (key == 'out') {
|
||||
if (self.editing || self.options.range == 'selection') {
|
||||
self.options.type == 'place' ? self.$map.options({places: getPlaces()})
|
||||
: self.$annotations.options({items: getAnnotations()});
|
||||
if (self.options.range == 'selection') {
|
||||
self.widget && updateWidget();
|
||||
updateAnnotations();
|
||||
}
|
||||
} else if (key == 'position') {
|
||||
if (self.editing || self.options.range == 'position') {
|
||||
self.options.type == 'place' ? self.$map.options({places: getPlaces()})
|
||||
: self.$annotations.options({items: getAnnotations()});
|
||||
if (self.options.range == 'position') {
|
||||
self.widget && updateWidget();
|
||||
updateAnnotations();
|
||||
}
|
||||
} else if (key == 'range') {
|
||||
self.$annotations.options({items: getAnnotations()});
|
||||
|
|
@ -387,8 +420,7 @@ Ox.AnnotationFolder = function(options, self) {
|
|||
self.$annotations.options({sort: self.sort});
|
||||
showWarnings();
|
||||
} else if (key == 'users') {
|
||||
self.$annotations.options({items: getAnnotations()});
|
||||
showWarnings();
|
||||
updateAnnotations();
|
||||
} else if (key == 'width') {
|
||||
Ox.print('RESIZE!!!!')
|
||||
if (self.widget) {
|
||||
|
|
@ -406,18 +438,26 @@ Ox.AnnotationFolder = function(options, self) {
|
|||
addItem <f> addItem
|
||||
@*/
|
||||
that.addItem = function(item) {
|
||||
Ox.print('FOLDER ADD ITEM', item)
|
||||
var pos = 0;
|
||||
self.options.items.splice(pos, 0, item);
|
||||
self.$annotations.addItem(pos, item);
|
||||
self.$annotations.editItem(item.id);
|
||||
self.$annotations
|
||||
.addItem(pos, item)
|
||||
.options({selected: item.id})
|
||||
.editItem();
|
||||
//selectAnnotation(item);
|
||||
//that.triggerEvent('edit');
|
||||
return that;
|
||||
};
|
||||
|
||||
that.blurItem = function() {
|
||||
self.$annotations.blurItem();
|
||||
return that;
|
||||
};
|
||||
|
||||
that.editItem = function() {
|
||||
self.$annotations.editItem();
|
||||
return that;
|
||||
};
|
||||
|
||||
/*@
|
||||
|
|
@ -431,6 +471,14 @@ Ox.AnnotationFolder = function(options, self) {
|
|||
};
|
||||
*/
|
||||
|
||||
that.updateItem = function(item) {
|
||||
var index = Ox.getIndexById(self.options.items, item.id);
|
||||
self.options.items[index] = item;
|
||||
self.widget && updateWidget();
|
||||
updateAnnotations();
|
||||
return that;
|
||||
}
|
||||
|
||||
return that;
|
||||
|
||||
};
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue