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

update video editor

Browse source
This commit is contained in:
rlx 2012-01-16 23:21:53 +05:30
parent f5d587cf5b
commit 7da384d03a
5 changed files with 98 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

48
source/Ox.UI/js/Form/Ox.ArrayEditable.js
View file

@ -60,11 +60,13 @@ Ox.ArrayEditable = function(options, self) {
if (!$target.is('.OxInput')) {
Ox.print('BLURRED EDITING', self.blurred, self.editing)
if ($parent.is('.OxEditableElement')) {
// select another item
selectItem(
e.metaKey && position == self.selected
? '' : $parent.data('position')
);
if (!$parent.is('.OxSelected')) {
// select another item
selectItem(
e.metaKey && position == self.selected
? '' : $parent.data('position')
);
}
} else if (!self.blurred) {
// if there wasn't an active input element
if (self.editing) {
@ -197,27 +199,21 @@ Ox.ArrayEditable = function(options, self) {
}
function selectItem(idOrPosition) {
var isId = Ox.isString(idOrPosition);
if (
(isId && idOrPosition != self.options.selected)
|| (!isId && idOrPosition != self.selected)
) {
if (isId) {
self.options.selected = idOrPosition;
self.selected = getSelectedPosition();
} else {
self.selected = idOrPosition;
self.options.selected = getSelectedId();
}
if (/*self.options.selected == '' && */self.editing) {
self.editing = false;
that.blurItem();
}
Ox.print('SELECT ITEM', self.options.selected, self.selected);
that.find('.OxSelected').removeClass('OxSelected');
self.selected > -1 && self.$items[self.selected].addClass('OxSelected');
triggerSelectEvent();
if (Ox.isString(idOrPosition)) {
self.options.selected = idOrPosition;
self.selected = getSelectedPosition();
} else {
self.selected = idOrPosition;
self.options.selected = getSelectedId();
}
if (/*self.options.selected == '' && */self.editing) {
self.editing = false;
that.blurItem();
}
Ox.print('SELECT ITEM', self.options.selected, self.selected);
that.find('.OxSelected').removeClass('OxSelected');
self.selected > -1 && self.$items[self.selected].addClass('OxSelected');
triggerSelectEvent();
}
function selectLast() {
@ -263,6 +259,8 @@ Ox.ArrayEditable = function(options, self) {
that.triggerEvent('select', Ox.extend({
id: self.options.selected
}, self.options.selected ? {
height: self.$items[self.selected].$element.height()
+ (self.options.type == 'textarea' ? 8 : 0),
top: self.$items[self.selected].offset().top
} : {}));
self.triggered = true;

13
source/Ox.UI/js/Map/Ox.Map.js
View file

@ -850,7 +850,6 @@ Ox.Map = function(options, self) {
if (isEmpty(mapBounds)) {
self.map.setZoom(self.minZoom);
} else {
Ox.print("FITTING BOUNDS")
self.map.fitBounds(mapBounds);
}
}
@ -901,7 +900,7 @@ Ox.Map = function(options, self) {
function mapChanged() {
// gets called after panning or zooming
Ox.Log('Map', 'mapChanged');
Ox.print('Map', 'mapChanged');
if (self.boundsChanged) {
var bounds = self.map.getBounds(),
southWest = bounds.getSouthWest(),
@ -1388,7 +1387,15 @@ Ox.Map = function(options, self) {
Ox.print('MAP SET OPTIONS PLACES', value);
addPlaces();
getMapBounds(function(mapBounds) {
self.map.fitBounds(mapBounds);
if (mapBounds) {
self.map.fitBounds(mapBounds);
} else {
self.map.setZoom(self.minZoom);
self.map.setCenter(new google.maps.LatLng(0, 0));
}
// fixme: the following is just a guess
self.boundsChanged = true;
mapChanged();
});
if (self.options.selected) {
if (getSelectedPlace()) {

31
source/Ox.UI/js/Video/Ox.AnnotationFolder.js
View file

@ -42,6 +42,8 @@ Ox.AnnotationFolder = function(options, self) {
})
.options(options || {});
self.points = getPoints();
self.position = self.options.position;
self.sort = getSort();
self.widget = self.options.type == 'event' ? 'Calendar'
: self.options.type == 'place' ? 'Map' : '';
@ -143,6 +145,7 @@ Ox.AnnotationFolder = function(options, self) {
.bindEvent({
// FIXME: should be select, not selectplace
selectplace: function(data) {
Ox.print('ANNOTATION ID IS', data.annotationId)
self.$annotations.options({selected: data.annotationId});
// selectAnnotation({id: data.annotationId});
}
@ -228,6 +231,15 @@ Ox.AnnotationFolder = function(options, self) {
that.triggerEvent('change', item);
}
function crossesPoint() {
var sort = [self.position, self.options.position].sort(),
positionA = sort[0],
positionB = sort[1];
return self.points.some(function(point) {
return point > positionA && point < positionB;
});
}
function dragstart() {
if (self.options.showWidget) {
self.drag = {
@ -279,6 +291,14 @@ Ox.AnnotationFolder = function(options, self) {
});
}
function getPoints() {
return Ox.unique(Ox.flatten(
self.options.items.map(function(item) {
return [item['in'], item.out];
})
));
}
function getEvents() {
var events = [];
getAnnotations().forEach(function(item) {
@ -388,7 +408,8 @@ Ox.AnnotationFolder = function(options, self) {
if (['in', 'out'].indexOf(key) > -1 && self.editing) {
var index = Ox.getIndexById(self.options.items, self.options.selected);
self.options.items[index][key] = value;
self.options.items[index].duration = self.options.out - self.options['in'];
self.options.items[index].duration = self.options.out - self.options['in'];
self.points = getPoints();
}
if (key == 'in') {
//fixme: array editable should support item updates while editing
@ -403,9 +424,11 @@ Ox.AnnotationFolder = function(options, self) {
}
} else if (key == 'position') {
if (self.options.range == 'position') {
Ox.print('POSITION CHANGED, UPDATING')
self.widget && updateWidget();
updateAnnotations();
if (crossesPoint()) {
self.widget && updateWidget();
updateAnnotations();
}
self.position = self.options.position;
}
} else if (key == 'range') {
self.widget && updateWidget();

24
source/Ox.UI/js/Video/Ox.AnnotationPanel.js
View file

@ -243,15 +243,33 @@ Ox.AnnotationPanel = function(options, self) {
}
function selectAnnotation(data, index) {
var height, scrollTop;
var height, scrollBottom, scrollTop, top;
if (data.id) {
self.$folder.forEach(function($folder, i) {
i != index && $folder.options({selected: ''});
});
}
if (data.top) {
data.bottom = data.top + data.height;
height = self.$folders.height();
top = self.$folders.offset().top;
Ox.print('top', top);
scrollTop = self.$folders.scrollTop();
Ox.print('data/self t/b/h', data.top, data.bottom, data.height, scrollTop, height)
if (data.top < top || data.bottom > height) {
if (data.top < top) {
Ox.print('top scrollTop', data.top, scrollTop)
scrollTop += data.top - top;
} else {
scrollTop += data.bottom - top - height;
}
self.$folders.animate({
scrollTop: scrollTop + 'px'
}, 0);
}
/*
data.top -= 60; // 20 + 24 + 16
Ox.print('HEIGHT', height, 'SCROLLTOP', scrollTop, 'TOP', data.top);
if (data.top < 0 || data.top > height - 16) {
@ -260,10 +278,8 @@ Ox.AnnotationPanel = function(options, self) {
} else if (data.top > height - 16) {
scrollTop += data.top - height + 14;
}
self.$folders.animate({
scrollTop: scrollTop + 'px'
}, 0);
}
*/
}
that.triggerEvent('select', data);
}

20
source/Ox.UI/themes/modern/css/modern.css
View file

@ -760,20 +760,36 @@ Video
//display: none;
}
.OxThemeModern .OxAnnotationFolder .OxEditableElement.OxSelected {
/* FIXME: the first two should apply for every ArrayEditable */
.OxThemeModern .OxAnnotationFolder .OxArrayEditable .OxSeparator {
color: rgb(160, 160, 160);
}
.OxThemeModern .OxAnnotationFolder .OxEditableElement.OxPlaceholder .OxValue {
color: rgb(96, 96, 96);
}
.OxThemeModern .OxAnnotationFolder .OxArrayEditable .OxEditableElement.OxSelected {
background: rgb(64, 64, 192);
}
.OxThemeModern .OxAnnotationFolder .OxArrayEditableInput .OxEditableElement.OxSelected {
box-shadow: 0 0 1px rgb(255, 255, 255);
}
.OxThemeModern .OxAnnotationFolder .OxArrayEditableTextarea .OxEditableElement.OxEditing {
background: rgb(64, 128, 64);
}
.OxThemeModern .OxAnnotationFolder .OxArrayEditable .OxInput.OxFocus {
box-shadow: none;
}
.OxThemeModern .OxAnnotationFolder .OxEditableElement input {
background: rgb(64, 128, 64);
color: rgb(255, 255, 255);
box-shadow: 0 0 1px rgb(255, 255, 255);
//box-shadow: 0 0 1px rgb(64, 64, 64);
}
.OxThemeModern .OxAnnotationFolder .OxEditableElement textarea {
background: rgb(64, 128, 64);
color: rgb(255, 255, 255);
}
/*
================================================================================
Miscellaneous