merging changes
This commit is contained in:
commit
719ffc050a
68 changed files with 421 additions and 428 deletions
|
@ -10,8 +10,8 @@ Ox.Bar <f:Ox.Element> Bar
|
|||
self <o> Shared private variable
|
||||
@*/
|
||||
Ox.Bar = function(options, self) {
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
orientation: 'horizontal',
|
||||
size: 'medium' // can be int
|
||||
|
|
|
@ -20,8 +20,8 @@ Ox.Resizebar <f:Ox.Element> Resizebar
|
|||
*/
|
||||
Ox.Resizebar = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
collapsed: false,
|
||||
collapsible: true,
|
||||
|
|
|
@ -13,8 +13,8 @@ Ox.Tabbar <f:Ox.Bar> Tabbar
|
|||
*/
|
||||
Ox.Tabbar = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Bar({
|
||||
self = self || {};
|
||||
var that = Ox.Bar({
|
||||
size: 20
|
||||
}, self)
|
||||
.defaults({
|
||||
|
@ -30,7 +30,7 @@ Ox.Tabbar = function(options, self) {
|
|||
selectable: true,
|
||||
selected: self.options.selected,
|
||||
size: 'medium',
|
||||
style: 'tab',
|
||||
style: 'tab'
|
||||
}).appendTo(that);
|
||||
|
||||
return that;
|
||||
|
|
|
@ -3,8 +3,8 @@
|
|||
fixme: no need for this
|
||||
*/
|
||||
Ox.Toolbar = function(options, self) {
|
||||
var self = self || {},
|
||||
that = new Ox.Bar({
|
||||
self = self || {};
|
||||
var that = Ox.Bar({
|
||||
size: Ox.UI.getBarSize(options.size)
|
||||
}, self);
|
||||
return that;
|
||||
|
|
|
@ -28,7 +28,7 @@ Ox.Calendar <f:Ox.Element> Basic calendar object
|
|||
Ox.Calendar = function(options, self) {
|
||||
|
||||
self = self || {};
|
||||
var that = new Ox.Element({}, self)
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
date: new Date(),
|
||||
events: [],
|
||||
|
@ -338,7 +338,7 @@ Ox.Calendar = function(options, self) {
|
|||
})
|
||||
.appendTo(self.$toolbar);
|
||||
|
||||
self.$scalebar = new Ox.Element()
|
||||
self.$scalebar = Ox.Element()
|
||||
.addClass('OxTimeline')
|
||||
.css({
|
||||
posision: 'absolute',
|
||||
|
@ -346,7 +346,7 @@ Ox.Calendar = function(options, self) {
|
|||
})
|
||||
.appendTo(that);
|
||||
|
||||
self.$container = new Ox.Element()
|
||||
self.$container = Ox.Element()
|
||||
.addClass('OxCalendarContainer')
|
||||
.css({
|
||||
top: '40px',
|
||||
|
@ -367,15 +367,15 @@ Ox.Calendar = function(options, self) {
|
|||
})
|
||||
.appendTo(that);
|
||||
|
||||
self.$content = new Ox.Element()
|
||||
self.$content = Ox.Element()
|
||||
.addClass('OxCalendarContent')
|
||||
.appendTo(self.$container);
|
||||
|
||||
self.$background = new Ox.Element()
|
||||
self.$background = Ox.Element()
|
||||
.addClass('OxBackground')
|
||||
.appendTo(self.$content);
|
||||
|
||||
self.$scrollbar = new Ox.Element()
|
||||
self.$scrollbar = Ox.Element()
|
||||
.addClass('OxTimeline')
|
||||
.css({
|
||||
posision: 'absolute',
|
||||
|
@ -383,7 +383,7 @@ Ox.Calendar = function(options, self) {
|
|||
})
|
||||
.appendTo(that);
|
||||
|
||||
self.$zoombar = new Ox.Element()
|
||||
self.$zoombar = Ox.Element()
|
||||
.css({
|
||||
position: 'absolute',
|
||||
bottom: 0,
|
||||
|
@ -391,7 +391,7 @@ Ox.Calendar = function(options, self) {
|
|||
})
|
||||
.appendTo(that);
|
||||
|
||||
self.$zoomInput = new Ox.Range({
|
||||
self.$zoomInput = Ox.Range({
|
||||
arrows: true,
|
||||
max: self.maxZoom,
|
||||
min: 0,
|
||||
|
@ -405,7 +405,7 @@ Ox.Calendar = function(options, self) {
|
|||
})
|
||||
.appendTo(self.$zoombar);
|
||||
|
||||
self.$tooltip = new Ox.Tooltip({
|
||||
self.$tooltip = Ox.Tooltip({
|
||||
animate: false
|
||||
})
|
||||
.css({
|
||||
|
@ -547,7 +547,7 @@ Ox.Calendar = function(options, self) {
|
|||
Ox.loop(-n, n + 1, function(i) {
|
||||
if (u == 0 || Ox.mod(value + i, 2)) {
|
||||
$elements.push(
|
||||
new Ox.Element()
|
||||
Ox.Element()
|
||||
.addClass(
|
||||
u == 0 ? 'line' : ''
|
||||
)
|
||||
|
@ -599,7 +599,7 @@ Ox.Calendar = function(options, self) {
|
|||
paddingLeft = 0;
|
||||
width = getPosition(event.endTime, zoom) - left;
|
||||
}
|
||||
return new Ox.Element()
|
||||
return Ox.Element()
|
||||
.addClass('OxEvent' +
|
||||
(event.type ? ' Ox' + Ox.toTitleCase(event.type) : '' ) +
|
||||
(event.current ? ' OxCurrent' : '') +
|
||||
|
@ -869,7 +869,7 @@ Ox.Calendar = function(options, self) {
|
|||
});
|
||||
if (line == self.lineEvents.length) {
|
||||
self.lineEvents[line] = [];
|
||||
self.$lines[line] = new Ox.Element()
|
||||
self.$lines[line] = Ox.Element()
|
||||
.addClass('OxLine')
|
||||
.css({
|
||||
top: (line * 16) + 'px'
|
||||
|
|
|
@ -4,7 +4,6 @@
|
|||
Ox.App <f> Basic application instance that communicates with a JSON API
|
||||
() -> <f> App object
|
||||
(options) -> <f> App object
|
||||
(options, self) -> <f> App object
|
||||
options <o> Options object
|
||||
timeout <n> request timeout
|
||||
type <s> HTTP Request type, i.e. 'GET' or 'POST'
|
||||
|
@ -14,9 +13,7 @@ Ox.App <f> Basic application instance that communicates with a JSON API
|
|||
|
||||
@*/
|
||||
|
||||
Ox.App = (function() {
|
||||
|
||||
return function(options) {
|
||||
Ox.App = function(options) {
|
||||
|
||||
options = options || {};
|
||||
var self = {
|
||||
|
@ -27,7 +24,7 @@ Ox.App = (function() {
|
|||
}, options || {}),
|
||||
time: new Date()
|
||||
},
|
||||
that = new Ox.Element({}, self);
|
||||
that = Ox.Element({}, self);
|
||||
|
||||
that.api = {
|
||||
api: function(callback) {
|
||||
|
@ -128,6 +125,4 @@ Ox.App = (function() {
|
|||
|
||||
return that;
|
||||
|
||||
};
|
||||
|
||||
}());
|
||||
};
|
||||
|
|
|
@ -14,10 +14,10 @@ Ox.Container <f> Container (depricated)
|
|||
@*/
|
||||
Ox.Container = function(options, self) {
|
||||
// fixme: to be deprecated
|
||||
var that = new Ox.Element({}, self)
|
||||
var that = Ox.Element({}, self)
|
||||
.options(options || {})
|
||||
.addClass('OxContainer');
|
||||
that.$content = new Ox.Element({}, self) // fixme: passing self twice??
|
||||
that.$content = Ox.Element({}, self) // fixme: passing self twice??
|
||||
.options(options || {})
|
||||
.addClass('OxContent')
|
||||
.appendTo(that);
|
||||
|
|
|
@ -48,12 +48,10 @@ Ox.Element <function:Ox.JQueryElement> Basic UI element object
|
|||
* <*> original event properties
|
||||
@*/
|
||||
|
||||
Ox.Element = function() {
|
||||
|
||||
return function(options, self) {
|
||||
Ox.Element = function(options, self) {
|
||||
|
||||
/*
|
||||
// allow for 'Ox.Element()' instead of 'new Ox.Element()'
|
||||
// allow for 'Ox.Element()' instead of 'Ox.Element()'
|
||||
if (!(this instanceof arguments.callee)) {
|
||||
return new arguments.callee(options, self);
|
||||
}
|
||||
|
@ -69,8 +67,8 @@ Ox.Element = function() {
|
|||
if (Ox.isString(self.options)) {
|
||||
self.options = {
|
||||
element: self.options
|
||||
}
|
||||
};
|
||||
};
|
||||
}
|
||||
// create event handler
|
||||
if (!self.$eventHandler) {
|
||||
self.$eventHandler = $('<div>');
|
||||
|
@ -376,6 +374,4 @@ Ox.Element = function() {
|
|||
|
||||
return that;
|
||||
|
||||
}
|
||||
|
||||
}();
|
||||
};
|
||||
|
|
|
@ -101,7 +101,7 @@
|
|||
buffer = '';
|
||||
}, 1000);
|
||||
|
||||
Ox.print(ret)
|
||||
Ox.print(ret);
|
||||
return ret;
|
||||
|
||||
}
|
||||
|
|
|
@ -10,8 +10,8 @@ Ox.LoadingIcon <f:Ox.Element> Loading Icon Element
|
|||
@*/
|
||||
|
||||
Ox.LoadingIcon = function(options, self) {
|
||||
var self = self || {},
|
||||
that = new Ox.Element('<img>', self)
|
||||
self = self || {};
|
||||
var that = Ox.Element('<img>', self)
|
||||
.defaults({
|
||||
size: 'medium'
|
||||
})
|
||||
|
@ -42,6 +42,6 @@ Ox.LoadingIcon = function(options, self) {
|
|||
opacity: 0
|
||||
}, 250);
|
||||
return that;
|
||||
}
|
||||
};
|
||||
return that;
|
||||
}
|
||||
};
|
||||
|
|
|
@ -135,10 +135,10 @@ Ox.Request = function(options) {
|
|||
width: 768,
|
||||
height: 384
|
||||
}),
|
||||
$dialog = new Ox.Dialog({
|
||||
$dialog = Ox.Dialog({
|
||||
title: 'Application Error',
|
||||
buttons: [
|
||||
new Ox.Button({
|
||||
Ox.Button({
|
||||
title: 'Close'
|
||||
})
|
||||
.bindEvent({
|
||||
|
@ -186,10 +186,10 @@ Ox.Request = function(options) {
|
|||
if (data.status.code < 500) {
|
||||
callback(data);
|
||||
} else {
|
||||
var $dialog = new Ox.Dialog({
|
||||
var $dialog = Ox.Dialog({
|
||||
title: 'Application Error',
|
||||
buttons: [
|
||||
new Ox.Button({
|
||||
Ox.Button({
|
||||
id: 'details',
|
||||
title: 'Details'
|
||||
})
|
||||
|
@ -200,7 +200,7 @@ Ox.Request = function(options) {
|
|||
});
|
||||
}
|
||||
}),
|
||||
new Ox.Button({
|
||||
Ox.Button({
|
||||
id: 'close',
|
||||
title: 'Close'
|
||||
})
|
||||
|
|
|
@ -18,7 +18,7 @@ Ox.SyntaxHighlighter <function> Syntax Highlighter
|
|||
|
||||
Ox.SyntaxHighlighter = function(options, self) {
|
||||
|
||||
self = self || {};
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
lineLength: 0,
|
||||
|
@ -61,9 +61,9 @@ Ox.SyntaxHighlighter = function(options, self) {
|
|||
classNames = 'Ox' + Ox.toTitleCase(token.type);
|
||||
if (self.options.showWhitespace && token.type == 'whitespace') {
|
||||
if (isAfterLinebreak() && hasIrregularSpaces()) {
|
||||
classNames += ' OxLeading'
|
||||
classNames += ' OxLeading';
|
||||
} else if (isBeforeLinebreak()) {
|
||||
classNames += ' OxTrailing'
|
||||
classNames += ' OxTrailing';
|
||||
}
|
||||
}
|
||||
source += '<span class="' + classNames + '">' +
|
||||
|
@ -89,7 +89,7 @@ Ox.SyntaxHighlighter = function(options, self) {
|
|||
lines = source.split('<br/>');
|
||||
that.empty();
|
||||
if (self.options.showLineNumbers) {
|
||||
$lineNumbers = new Ox.Element()
|
||||
$lineNumbers = Ox.Element()
|
||||
.addClass('OxLineNumbers')
|
||||
.html(
|
||||
Ox.range(lines.length).map(function(line) {
|
||||
|
@ -98,19 +98,19 @@ Ox.SyntaxHighlighter = function(options, self) {
|
|||
)
|
||||
.appendTo(that);
|
||||
}
|
||||
$source = new Ox.Element()
|
||||
$source = Ox.Element()
|
||||
.addClass('OxSourceCode')
|
||||
.html(source)
|
||||
.appendTo(that);
|
||||
if (self.options.lineLength) {
|
||||
$line = new Ox.Element()
|
||||
$line = Ox.Element()
|
||||
.css({
|
||||
position: 'absolute',
|
||||
top: '-1000px'
|
||||
})
|
||||
.html(Ox.repeat(' ', self.options.lineLength))
|
||||
.appendTo(that),
|
||||
width = $line.width() + 4; // add padding
|
||||
.appendTo(that);
|
||||
width = $line.width() + 4; // add padding
|
||||
$line.removeElement();
|
||||
['moz', 'webkit'].forEach(function(browser) {
|
||||
$source.css({
|
||||
|
@ -129,4 +129,4 @@ Ox.SyntaxHighlighter = function(options, self) {
|
|||
|
||||
return that;
|
||||
|
||||
};
|
||||
};
|
||||
|
|
|
@ -24,8 +24,9 @@ Ox.Button <f:Ox.Element> Button Object
|
|||
@*/
|
||||
|
||||
Ox.Button = function(options, self) {
|
||||
var self = self || {},
|
||||
that = new Ox.Element('<input>', self)
|
||||
|
||||
self = self || {};
|
||||
var that = Ox.Element('<input>', self)
|
||||
.defaults({
|
||||
disabled: false,
|
||||
group: false,
|
||||
|
@ -72,7 +73,7 @@ Ox.Button = function(options, self) {
|
|||
|
||||
if (self.options.tooltip) {
|
||||
self.tooltips = Ox.isArray(self.options.tooltip) ? self.options.tooltip : [self.options.tooltip];
|
||||
self.$tooltip = new Ox.Tooltip({
|
||||
self.$tooltip = Ox.Tooltip({
|
||||
title: self.tooltips[self.selectedTitle]
|
||||
});
|
||||
that.mouseenter(mouseenter)
|
||||
|
|
|
@ -16,8 +16,8 @@ Ox.ButtonGroup <f:Ox.Element> ButtonGroup Object
|
|||
|
||||
Ox.ButtonGroup = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
buttons: [],
|
||||
max: 1,
|
||||
|
|
|
@ -17,8 +17,8 @@ Ox.Checkbox <f:Ox.Element> Checkbox Element
|
|||
|
||||
Ox.Checkbox = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
disabled: false,
|
||||
id: '',
|
||||
|
@ -41,7 +41,7 @@ Ox.Checkbox = function(options, self) {
|
|||
self.options.width != 'auto' && that.css({
|
||||
width: self.options.width + 'px'
|
||||
});
|
||||
self.$title = new Ox.Label({
|
||||
self.$title = Ox.Label({
|
||||
disabled: self.options.disabled,
|
||||
id: self.options.id + 'Label',
|
||||
overlap: 'left',
|
||||
|
@ -55,7 +55,7 @@ Ox.Checkbox = function(options, self) {
|
|||
.appendTo(that);
|
||||
}
|
||||
|
||||
self.$button = new Ox.Button({
|
||||
self.$button = Ox.Button({
|
||||
disabled: self.options.disabled,
|
||||
id: self.options.id + 'Button',
|
||||
title: [
|
||||
|
|
|
@ -17,8 +17,8 @@ Ox.CheckboxGroup <f:Ox.Element> CheckboxGroup Object
|
|||
|
||||
Ox.CheckboxGroup = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
checkboxes: [],
|
||||
max: 1,
|
||||
|
@ -45,7 +45,7 @@ Ox.CheckboxGroup = function(options, self) {
|
|||
});
|
||||
self.options.checkboxes.forEach(function(checkbox, position) {
|
||||
var id = self.options.id + Ox.toTitleCase(checkbox.id)
|
||||
self.$checkboxes[position] = new Ox.Checkbox($.extend(checkbox, {
|
||||
self.$checkboxes[position] = Ox.Checkbox($.extend(checkbox, {
|
||||
group: true,
|
||||
id: id,
|
||||
width: self.checkboxWidth[position]
|
||||
|
|
|
@ -11,18 +11,18 @@ Ox.ColorInput <f:Ox.InputGroup> ColorInput Element
|
|||
@*/
|
||||
Ox.ColorInput = function(options, self) {
|
||||
|
||||
var self = $.extend(self || {}, {
|
||||
self = $.extend(self || {}, {
|
||||
options: $.extend({
|
||||
id: '',
|
||||
value: '0, 0, 0'
|
||||
}, options)
|
||||
}),
|
||||
that;
|
||||
});
|
||||
var that;
|
||||
|
||||
self.values = self.options.value.split(', ');
|
||||
self.$inputs = [];
|
||||
['red', 'green', 'blue'].forEach(function(v, i) {
|
||||
self.$inputs[i] = new Ox.Input({
|
||||
self.$inputs[i] = Ox.Input({
|
||||
id: v,
|
||||
max: 255,
|
||||
type: 'integer',
|
||||
|
@ -31,14 +31,14 @@ Ox.ColorInput = function(options, self) {
|
|||
})
|
||||
.bindEvent('autovalidate', change);
|
||||
});
|
||||
self.$inputs[3] = new Ox.Label({
|
||||
self.$inputs[3] = Ox.Label({
|
||||
id: 'color',
|
||||
width: 36
|
||||
})
|
||||
.css({
|
||||
background: 'rgb(' + self.options.value + ')'
|
||||
});
|
||||
self.$inputs[4] = new Ox.ColorPicker({
|
||||
self.$inputs[4] = Ox.ColorPicker({
|
||||
id: 'picker'
|
||||
})
|
||||
.bindEvent('change', function(event, data) {
|
||||
|
@ -55,7 +55,7 @@ Ox.ColorInput = function(options, self) {
|
|||
width: 16 // this is just a hack to make the InputGroup layout work
|
||||
});
|
||||
|
||||
that = new Ox.InputGroup({
|
||||
that = Ox.InputGroup({
|
||||
id: self.options.id,
|
||||
inputs: self.$inputs,
|
||||
separators: [
|
||||
|
|
|
@ -14,8 +14,8 @@ Ox.ColorPicker <f:Ox.Element> ColorPicker Element
|
|||
|
||||
Ox.ColorPicker = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
id: '',
|
||||
value: '0, 0, 0'
|
||||
|
@ -28,7 +28,7 @@ Ox.ColorPicker = function(options, self) {
|
|||
self.values = self.options.value.split(', ');
|
||||
|
||||
Ox.range(3).forEach(function(i) {
|
||||
self.$ranges[i] = new Ox.Range({
|
||||
self.$ranges[i] = Ox.Range({
|
||||
arrows: true,
|
||||
id: self.options.id + Ox.toTitleCase(self.rgb[i]),
|
||||
max: 255,
|
||||
|
@ -64,7 +64,7 @@ Ox.ColorPicker = function(options, self) {
|
|||
}
|
||||
});
|
||||
|
||||
that = new Ox.Picker({
|
||||
that = Ox.Picker({
|
||||
element: that,
|
||||
elementHeight: 46,
|
||||
elementWidth: 328,
|
||||
|
@ -97,7 +97,7 @@ Ox.ColorPicker = function(options, self) {
|
|||
'rgb(' + $.map(Ox.range(3), function(v) {
|
||||
return v == index ? 255 : self.values[v];
|
||||
}).join(', ') + ')'
|
||||
]
|
||||
];
|
||||
}
|
||||
|
||||
return that;
|
||||
|
|
|
@ -15,7 +15,8 @@ Ox.DateInput <f:Ox.Element> DateInput Element
|
|||
@*/
|
||||
Ox.DateInput = function(options, self) {
|
||||
|
||||
var self = $.extend(self || {}, {
|
||||
var that;
|
||||
self = $.extend(self || {}, {
|
||||
options: $.extend({
|
||||
format: 'short',
|
||||
value: Ox.formatDate(new Date(), '%F'),
|
||||
|
@ -27,8 +28,7 @@ Ox.DateInput = function(options, self) {
|
|||
year: 48
|
||||
}
|
||||
}, options)
|
||||
}),
|
||||
that;
|
||||
});
|
||||
|
||||
$.extend(self, {
|
||||
date: new Date(self.options.value.replace(/-/g, '/')),
|
||||
|
@ -48,7 +48,7 @@ Ox.DateInput = function(options, self) {
|
|||
});
|
||||
|
||||
self.$input = $.extend(self.options.weekday ? {
|
||||
weekday: new Ox.Input({
|
||||
weekday: Ox.Input({
|
||||
autocomplete: self.weekdays,
|
||||
autocompleteReplace: true,
|
||||
autocompleteReplaceCorrect: true,
|
||||
|
@ -58,7 +58,7 @@ Ox.DateInput = function(options, self) {
|
|||
})
|
||||
.bindEvent('autocomplete', changeWeekday),
|
||||
} : {}, {
|
||||
day: new Ox.Input({
|
||||
day: Ox.Input({
|
||||
autocomplete: $.map(Ox.range(1, Ox.getDaysInMonth(
|
||||
parseInt(Ox.formatDate(self.date, '%Y'), 10),
|
||||
parseInt(Ox.formatDate(self.date, '%m'), 10)
|
||||
|
@ -73,7 +73,7 @@ Ox.DateInput = function(options, self) {
|
|||
width: self.options.width.day
|
||||
})
|
||||
.bindEvent('autocomplete', changeDay),
|
||||
month: new Ox.Input({
|
||||
month: Ox.Input({
|
||||
autocomplete: self.options.format == 'short' ? $.map(Ox.range(1, 13), function(v, i) {
|
||||
return Ox.pad(v, 2);
|
||||
}) : self.months,
|
||||
|
@ -85,7 +85,7 @@ Ox.DateInput = function(options, self) {
|
|||
width: self.options.width.month
|
||||
})
|
||||
.bindEvent('autocomplete', changeMonthOrYear),
|
||||
year: new Ox.Input({
|
||||
year: Ox.Input({
|
||||
autocomplete: $.map($.merge(Ox.range(1900, 3000), Ox.range(1000, 1900)), function(v, i) {
|
||||
return v.toString();
|
||||
}),
|
||||
|
@ -99,7 +99,7 @@ Ox.DateInput = function(options, self) {
|
|||
.bindEvent('autocomplete', changeMonthOrYear)
|
||||
});
|
||||
|
||||
that = new Ox.InputGroup($.extend(self.options, {
|
||||
that = Ox.InputGroup($.extend(self.options, {
|
||||
id: self.options.id,
|
||||
inputs: $.merge(self.options.weekday ? [
|
||||
self.$input.weekday
|
||||
|
|
|
@ -17,8 +17,8 @@ Ox.DateTimeInput <f:Ox.Element> DateTimeInput Element
|
|||
|
||||
Ox.DateTimeInput = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
ampm: false,
|
||||
format: 'short',
|
||||
|
@ -31,15 +31,15 @@ Ox.DateTimeInput = function(options, self) {
|
|||
self.values = self.options.value.split(' ');
|
||||
//Ox.print(self.values)
|
||||
|
||||
that = new Ox.InputGroup({
|
||||
that = Ox.InputGroup({
|
||||
inputs: [
|
||||
new Ox.DateInput({
|
||||
Ox.DateInput({
|
||||
format: self.options.format,
|
||||
id: 'date',
|
||||
value: self.values[0],
|
||||
weekday: self.options.weekday
|
||||
}),
|
||||
new Ox.TimeInput({
|
||||
Ox.TimeInput({
|
||||
ampm: self.options.ampm,
|
||||
id: 'time',
|
||||
value: self.values[1],
|
||||
|
|
|
@ -292,7 +292,7 @@ Ox.Filter = function(options, self) {
|
|||
subpos = Ox.isUndefined(subpos) ? -1 : subpos;
|
||||
var isGroup = subpos == -1 && self.options.query.conditions[pos].conditions;
|
||||
return Ox.merge([
|
||||
new Ox.Button({
|
||||
Ox.Button({
|
||||
disabled: self.options.query.conditions.length == 1,
|
||||
id: 'remove',
|
||||
title: 'remove',
|
||||
|
|
|
@ -15,8 +15,8 @@ Ox.Form <f:Ox.Element> Form Object
|
|||
|
||||
Ox.Form = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
error: '',
|
||||
id: '',
|
||||
|
@ -38,7 +38,7 @@ Ox.Form = function(options, self) {
|
|||
self.options.items.forEach(function(item, i) {
|
||||
self.itemIds[i] = item.options('id') || item.id;
|
||||
self.itemIsValid[i] = !!item.value().length;
|
||||
that.append(self.$items[i] = new Ox.FormItem({element: item}));
|
||||
that.append(self.$items[i] = Ox.FormItem({element: item}));
|
||||
item.bindEvent({
|
||||
/*
|
||||
blur: function(event, data) {
|
||||
|
@ -89,7 +89,7 @@ Ox.Form = function(options, self) {
|
|||
that.addItem = function(pos, item) {
|
||||
Ox.print('addItem', pos)
|
||||
self.options.items.splice(pos, 0, item);
|
||||
self.$items.splice(pos, 0, new Ox.FormItem({element: item}));
|
||||
self.$items.splice(pos, 0, Ox.FormItem({element: item}));
|
||||
pos == 0 ?
|
||||
self.$items[pos].insertBefore(self.$items[0]) :
|
||||
self.$items[pos].insertAfter(self.$items[pos - 1]);
|
||||
|
|
|
@ -16,8 +16,8 @@ Ox.FormElementGroup <f:Ox.Element> FormElementGroup Element
|
|||
|
||||
Ox.FormElementGroup = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
id: '',
|
||||
elements: [],
|
||||
|
|
|
@ -13,8 +13,8 @@ Ox.FormItem <f:Ox.Element> FormItem Element, wrap form element with an error mes
|
|||
|
||||
Ox.FormItem = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
element: null,
|
||||
error: '',
|
||||
|
@ -23,7 +23,7 @@ Ox.FormItem = function(options, self) {
|
|||
.addClass('OxFormItem')
|
||||
.append(self.options.element);
|
||||
|
||||
self.$message = new Ox.Element()
|
||||
self.$message = Ox.Element()
|
||||
.addClass('OxFormMessage')
|
||||
.appendTo(that);
|
||||
|
||||
|
@ -33,7 +33,7 @@ Ox.FormItem = function(options, self) {
|
|||
@*/
|
||||
that.setMessage = function(message) {
|
||||
self.$message.html(message)[message !== '' ? 'show' : 'hide']();
|
||||
}
|
||||
};
|
||||
|
||||
/*@
|
||||
value <f> get value
|
||||
|
@ -45,4 +45,4 @@ Ox.FormItem = function(options, self) {
|
|||
|
||||
return that;
|
||||
|
||||
}
|
||||
};
|
||||
|
|
|
@ -59,8 +59,8 @@ Ox.Input <f:Ox.Element> Input Element
|
|||
|
||||
Ox.Input = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
arrows: false,
|
||||
arrowStep: 1,
|
||||
|
@ -133,7 +133,7 @@ Ox.Input = function(options, self) {
|
|||
}
|
||||
|
||||
if (self.options.label) {
|
||||
self.$label = new Ox.Label({
|
||||
self.$label = Ox.Label({
|
||||
overlap: 'right',
|
||||
textAlign: 'right',
|
||||
title: self.options.label,
|
||||
|
@ -152,7 +152,7 @@ Ox.Input = function(options, self) {
|
|||
if (self.options.arrows) {
|
||||
self.arrows = [];
|
||||
self.arrows[0] = [
|
||||
new Ox.Button({
|
||||
Ox.Button({
|
||||
overlap: 'right',
|
||||
title: 'left',
|
||||
type: 'image'
|
||||
|
@ -164,7 +164,7 @@ Ox.Input = function(options, self) {
|
|||
clickArrow(0);
|
||||
})
|
||||
.appendTo(that),
|
||||
new Ox.Button({
|
||||
Ox.Button({
|
||||
overlap: 'left',
|
||||
title: 'right',
|
||||
type: 'image'
|
||||
|
@ -187,7 +187,7 @@ Ox.Input = function(options, self) {
|
|||
});
|
||||
|
||||
if (self.options.clear) {
|
||||
self.$button = new Ox.Button({
|
||||
self.$button = Ox.Button({
|
||||
overlap: 'left',
|
||||
title: 'close',
|
||||
type: 'image'
|
||||
|
@ -401,7 +401,7 @@ Ox.Input = function(options, self) {
|
|||
}
|
||||
|
||||
function constructAutocompleteMenu() {
|
||||
var menu = new Ox.Menu({
|
||||
var menu = Ox.Menu({
|
||||
element: self.$input,
|
||||
id: self.options.id + 'Menu', // fixme: we do this in other places ... are we doing it the same way? var name?,
|
||||
offset: {
|
||||
|
@ -908,8 +908,8 @@ Ox.Input_ = function(options, self) {
|
|||
events:
|
||||
*/
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
autocomplete: null,
|
||||
autocorrect: null,
|
||||
|
@ -1066,7 +1066,7 @@ Ox.Input_ = function(options, self) {
|
|||
self.options[self.keyName].forEach(function(key, keyPos) {
|
||||
//Ox.print('keyPos key', keyPos, key)
|
||||
if (self.keyName == 'label' && key.label.length == 1) {
|
||||
that.$key[keyPos] = new Ox.Label({
|
||||
that.$key[keyPos] = Ox.Label({
|
||||
overlap: 'right',
|
||||
title: key.label[0].title,
|
||||
width: self.options.labelWidth
|
||||
|
@ -1083,7 +1083,7 @@ Ox.Input_ = function(options, self) {
|
|||
self.selectKeyId = self.options.id + Ox.toTitleCase(self.keyName) +
|
||||
(self.options[self.keyName].length == 1 ? '' : keyPos);
|
||||
//Ox.print('three', self.selectedKey, keyPos, self.selectedKey[keyPos]);
|
||||
that.$key[keyPos] = new Ox.Select({
|
||||
that.$key[keyPos] = Ox.Select({
|
||||
id: self.selectKeyId,
|
||||
items: $.map(key.label, function(value, valuePos) {
|
||||
return {
|
||||
|
@ -1107,7 +1107,7 @@ Ox.Input_ = function(options, self) {
|
|||
}
|
||||
|
||||
if (self.options.clear) {
|
||||
that.$clear = new Ox.Button({
|
||||
that.$clear = Ox.Button({
|
||||
overlap: 'left',
|
||||
title: 'close',
|
||||
type: 'image'
|
||||
|
@ -1120,7 +1120,7 @@ Ox.Input_ = function(options, self) {
|
|||
}
|
||||
|
||||
if (self.options.unit.length == 1) {
|
||||
that.$unit = new Ox.Label({
|
||||
that.$unit = Ox.Label({
|
||||
overlap: 'left',
|
||||
title: self.options.unit[0].title,
|
||||
width: self.options.unitWidth
|
||||
|
@ -1134,7 +1134,7 @@ Ox.Input_ = function(options, self) {
|
|||
.appendTo(that);
|
||||
} else if (self.options.unit.length > 1) {
|
||||
self.selectUnitId = self.options.id + 'Unit';
|
||||
that.$unit = new Ox.Select({
|
||||
that.$unit = Ox.Select({
|
||||
id: self.selectUnitId,
|
||||
items: $.map(self.options.unit, function(unit, i) {
|
||||
//Ox.print('unit', unit)
|
||||
|
@ -1159,7 +1159,7 @@ Ox.Input_ = function(options, self) {
|
|||
that.$separator = [];
|
||||
self.options.value.forEach(function(v, i) {
|
||||
if (i < self.values - 1) {
|
||||
that.$separator[i] = new Ox.Label({
|
||||
that.$separator[i] = Ox.Label({
|
||||
textAlign: 'center',
|
||||
title: self.options.separator[i],
|
||||
width: self.options.separatorWidth[i] + 32
|
||||
|
@ -1185,7 +1185,7 @@ Ox.Input_ = function(options, self) {
|
|||
//self.margin -= (i == 0 ? 16 : self.options.value[i - 1].width)
|
||||
//Ox.print('v:', v, 'id:', id)
|
||||
if (self.options.type == 'select') {
|
||||
that.$input[i] = new Ox.Select({
|
||||
that.$input[i] = Ox.Select({
|
||||
id: v.id,
|
||||
items: v.items,
|
||||
width: v.width
|
||||
|
@ -1194,12 +1194,12 @@ Ox.Input_ = function(options, self) {
|
|||
float: 'left'
|
||||
});
|
||||
} else if (self.options.type == 'range') {
|
||||
that.$input[i] = new Ox.Range(v)
|
||||
that.$input[i] = Ox.Range(v)
|
||||
.css({
|
||||
float: 'left'
|
||||
});
|
||||
} else {
|
||||
that.$input[i] = new Ox.InputElement({
|
||||
that.$input[i] = Ox.InputElement({
|
||||
autocomplete: self.options.autocomplete[id],
|
||||
autocorrect: self.options.autocorrect[id],
|
||||
autosuggest: self.options.autosuggest[id],
|
||||
|
@ -1339,8 +1339,8 @@ Ox.Input_ = function(options, self) {
|
|||
|
||||
Ox.InputElement_ = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element(
|
||||
self = self || {};
|
||||
var that = Ox.Element(
|
||||
options.type == 'textarea' ? 'textarea' : 'input', self
|
||||
)
|
||||
.defaults({
|
||||
|
@ -1388,7 +1388,7 @@ Ox.InputElement_ = function(options, self) {
|
|||
|
||||
if (self.options.autosuggest) {
|
||||
self.autosuggestId = self.options.id + 'Menu'; // fixme: we do this in other places ... are we doing it the same way? var name?
|
||||
self.$autosuggestMenu = new Ox.Menu({
|
||||
self.$autosuggestMenu = Ox.Menu({
|
||||
element: that.$element,
|
||||
id: self.autosuggestId,
|
||||
offset: {
|
||||
|
@ -1663,8 +1663,8 @@ Ox.Range_ = function(options, self) {
|
|||
/*
|
||||
init
|
||||
*/
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
animate: false,
|
||||
arrows: false,
|
||||
|
@ -1715,7 +1715,7 @@ Ox.Range_ = function(options, self) {
|
|||
.click(clickArrowDec)
|
||||
.appendTo(that.$element);
|
||||
}
|
||||
var $track = new Ox.Element()
|
||||
var $track = Ox.Element()
|
||||
.addClass('OxTrack')
|
||||
.mousedown(clickTrack)
|
||||
.appendTo(that.$element);
|
||||
|
|
|
@ -14,8 +14,8 @@ Ox.InputGroup <f:Ox.Element> InputGroup Object
|
|||
@*/
|
||||
|
||||
Ox.InputGroup = function(options, self) {
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
id: '',
|
||||
inputs: [],
|
||||
|
@ -42,7 +42,7 @@ Ox.InputGroup = function(options, self) {
|
|||
|
||||
self.options.separators.forEach(function(v, i) {
|
||||
self.options.id == 'debug' && Ox.print('separator #' + i + ' ' + self.options.inputs[i].options('id') + ' ' + self.options.inputs[i].options('width'))
|
||||
self.$separator[i] = new Ox.Label({
|
||||
self.$separator[i] = Ox.Label({
|
||||
textAlign: 'center',
|
||||
title: v.title,
|
||||
width: v.width + 32
|
||||
|
|
|
@ -9,8 +9,8 @@ Ox.Label <f:Ox.Element> Label Object
|
|||
@*/
|
||||
Ox.Label = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
disabled: false,
|
||||
id: '',
|
||||
|
@ -36,9 +36,9 @@ Ox.Label = function(options, self) {
|
|||
if (key == 'title') {
|
||||
that.html(value);
|
||||
} else if (key == 'width') {
|
||||
that.css({width: self.options.width - 14 + 'px'})
|
||||
that.css({width: self.options.width - 14 + 'px'});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return that;
|
||||
|
||||
|
|
|
@ -14,10 +14,9 @@ Ox.OptionGroup = function(items, min, max, property) {
|
|||
/*
|
||||
to be used by ButtonGroup, CheckboxGroup, Select and Menu
|
||||
*/
|
||||
|
||||
var property = property || 'checked'
|
||||
length = items.length,
|
||||
max = max == -1 ? length : max;
|
||||
var length = items.length;
|
||||
property = property || 'checked';
|
||||
max = max == -1 ? length : max;
|
||||
|
||||
function getLastBefore(pos) {
|
||||
// returns the position of the last checked item before position pos
|
||||
|
@ -47,7 +46,7 @@ Ox.OptionGroup = function(items, min, max, property) {
|
|||
if (item[property]) {
|
||||
num++;
|
||||
}
|
||||
})
|
||||
});
|
||||
return num;
|
||||
}
|
||||
|
||||
|
|
|
@ -16,8 +16,8 @@ Ox.Picker <f:Ox.Element> Picker Object
|
|||
|
||||
Ox.Picker = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
element: null,
|
||||
elementHeight: 128,
|
||||
|
@ -27,7 +27,7 @@ Ox.Picker = function(options, self) {
|
|||
})
|
||||
.options(options || {});
|
||||
|
||||
self.$selectButton = new Ox.Button({
|
||||
self.$selectButton = Ox.Button({
|
||||
overlap: self.options.overlap,
|
||||
title: 'select',
|
||||
type: 'image'
|
||||
|
@ -35,7 +35,7 @@ Ox.Picker = function(options, self) {
|
|||
.click(showMenu)
|
||||
.appendTo(that);
|
||||
|
||||
self.$menu = new Ox.Element()
|
||||
self.$menu = Ox.Element()
|
||||
.addClass('OxPicker')
|
||||
.css({
|
||||
width: self.options.elementWidth + 'px',
|
||||
|
@ -49,18 +49,18 @@ Ox.Picker = function(options, self) {
|
|||
})
|
||||
.appendTo(self.$menu);
|
||||
|
||||
self.$bar = new Ox.Bar({
|
||||
self.$bar = Ox.Bar({
|
||||
orientation: 'horizontal',
|
||||
size: 24
|
||||
})
|
||||
.appendTo(self.$menu);
|
||||
|
||||
that.$label = new Ox.Label({
|
||||
that.$label = Ox.Label({
|
||||
width: self.options.elementWidth - 60
|
||||
})
|
||||
.appendTo(self.$bar);
|
||||
|
||||
self.$doneButton = new Ox.Button({
|
||||
self.$doneButton = Ox.Button({
|
||||
title: 'Done',
|
||||
width: 48
|
||||
})
|
||||
|
@ -81,7 +81,7 @@ Ox.Picker = function(options, self) {
|
|||
WebkitBorderRadius: '8px'
|
||||
});
|
||||
that.triggerEvent('hide');
|
||||
};
|
||||
}
|
||||
|
||||
function showMenu() {
|
||||
var offset = that.offset(),
|
||||
|
@ -101,7 +101,7 @@ Ox.Picker = function(options, self) {
|
|||
})
|
||||
.appendTo(Ox.UI.$body);
|
||||
that.triggerEvent('show');
|
||||
};
|
||||
}
|
||||
|
||||
return that;
|
||||
|
||||
|
|
|
@ -13,22 +13,21 @@ Ox.PlaceInput <f:Ox.FormElementGroup> PlaceInput Object
|
|||
|
||||
Ox.PlaceInput = function(options, self) {
|
||||
|
||||
var self = $.extend(self || {}, {
|
||||
var that;
|
||||
self = $.extend(self || {}, {
|
||||
options: $.extend({
|
||||
id: '',
|
||||
value: 'United States'
|
||||
}, options)
|
||||
}),
|
||||
that;
|
||||
|
||||
that = new Ox.FormElementGroup({
|
||||
});
|
||||
that = Ox.FormElementGroup({
|
||||
id: self.options.id,
|
||||
elements: [
|
||||
new Ox.Input({
|
||||
Ox.Input({
|
||||
id: 'input',
|
||||
value: self.options.value
|
||||
}),
|
||||
new Ox.PlacePicker({
|
||||
Ox.PlacePicker({
|
||||
id: 'picker',
|
||||
overlap: 'left',
|
||||
value: self.options.value
|
||||
|
|
|
@ -13,21 +13,21 @@ Ox.PlacePicker <f:Ox.Element> PlacePicker Object
|
|||
|
||||
Ox.PlacePicker = function(options, self) {
|
||||
|
||||
var self = $.extend(self || {}, {
|
||||
var that;
|
||||
self = $.extend(self || {}, {
|
||||
options: $.extend({
|
||||
id: '',
|
||||
value: 'United States'
|
||||
}, options)
|
||||
}),
|
||||
that;
|
||||
});
|
||||
|
||||
self.$element = new Ox.Element()
|
||||
self.$element = Ox.Element()
|
||||
.css({
|
||||
width: '256px',
|
||||
height: '192px'
|
||||
})
|
||||
.append(
|
||||
self.$topBar = new Ox.Bar({
|
||||
self.$topBar = Ox.Bar({
|
||||
size: 16
|
||||
})
|
||||
.css({
|
||||
|
@ -35,7 +35,7 @@ Ox.PlacePicker = function(options, self) {
|
|||
WebkitBorderRadius: '0 8px 0 0'
|
||||
})
|
||||
.append(
|
||||
self.$input = new Ox.Input({
|
||||
self.$input = Ox.Input({
|
||||
clear: true,
|
||||
id: self.options.id + 'Input',
|
||||
placeholder: 'Find',
|
||||
|
@ -45,18 +45,18 @@ Ox.PlacePicker = function(options, self) {
|
|||
)
|
||||
)
|
||||
.append(
|
||||
self.$container = new Ox.Element()
|
||||
self.$container = Ox.Element()
|
||||
.css({
|
||||
width: '256px',
|
||||
height: '160px'
|
||||
})
|
||||
)
|
||||
.append(
|
||||
self.$bottomBar = new Ox.Bar({
|
||||
self.$bottomBar = Ox.Bar({
|
||||
size: 16
|
||||
})
|
||||
.append(
|
||||
self.$range = new Ox.Range({
|
||||
self.$range = Ox.Range({
|
||||
arrows: true,
|
||||
id: self.options.id + 'Range',
|
||||
max: 22,
|
||||
|
@ -83,7 +83,7 @@ Ox.PlacePicker = function(options, self) {
|
|||
WebkitBorderRadius: 0
|
||||
});
|
||||
|
||||
that = new Ox.Picker({
|
||||
that = Ox.Picker({
|
||||
element: self.$element,
|
||||
elementHeight: 192,
|
||||
elementWidth: 256,
|
||||
|
@ -93,7 +93,7 @@ Ox.PlacePicker = function(options, self) {
|
|||
}, self)
|
||||
.bindEvent('show', showPicker);
|
||||
|
||||
that.$label.bind('click', clickLabel)
|
||||
that.$label.bind('click', clickLabel);
|
||||
|
||||
self.map = false;
|
||||
|
||||
|
@ -118,7 +118,7 @@ Ox.PlacePicker = function(options, self) {
|
|||
//Ox.print('findPlace', data);
|
||||
self.$map.find(data.value, function(place) {
|
||||
place && that.$label.html(place.geoname);
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
function onSelect(event, data) {
|
||||
|
@ -133,7 +133,7 @@ Ox.PlacePicker = function(options, self) {
|
|||
|
||||
function showPicker() {
|
||||
if (!self.map) {
|
||||
self.$map = new Ox.Map({
|
||||
self.$map = Ox.Map({
|
||||
clickable: true,
|
||||
id: self.options.id + 'Map',
|
||||
//places: [self.options.value]
|
||||
|
|
|
@ -26,8 +26,8 @@ Ox.Range <f:Ox.Element> Range Object
|
|||
|
||||
Ox.Range = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
arrows: false,
|
||||
arrowStep: 1,
|
||||
|
@ -66,7 +66,7 @@ Ox.Range = function(options, self) {
|
|||
if (self.options.arrows) {
|
||||
self.$arrows = [];
|
||||
Ox.range(0, 2).forEach(function(i) {
|
||||
self.$arrows[i] = new Ox.Button({
|
||||
self.$arrows[i] = Ox.Button({
|
||||
overlap: i == 0 ? 'right' : 'left',
|
||||
title: self.options.arrowSymbols[i],
|
||||
type: 'image'
|
||||
|
@ -84,7 +84,7 @@ Ox.Range = function(options, self) {
|
|||
});
|
||||
}
|
||||
|
||||
self.$track = new Ox.Element()
|
||||
self.$track = Ox.Element()
|
||||
.addClass('OxTrack')
|
||||
.css($.extend({
|
||||
width: (self.trackSize - 2) + 'px'
|
||||
|
@ -235,7 +235,7 @@ Ox.Range = function(options, self) {
|
|||
}
|
||||
|
||||
function setValue(value, animate) {
|
||||
var value = Ox.limit(value, self.options.min, self.options.max);
|
||||
value = Ox.limit(value, self.options.min, self.options.max);
|
||||
if (value != self.options.value) {
|
||||
//time = getTime(self.options.value, value);
|
||||
self.options.value = value;
|
||||
|
|
|
@ -24,8 +24,8 @@ Ox.Select <f:Ox.Element> Select Object
|
|||
Ox.Select = function(options, self) {
|
||||
|
||||
// fixme: selected item needs attribute "checked", not "selected" ... that's strange
|
||||
var self = self || {},
|
||||
that = new Ox.Element({
|
||||
self = self || {};
|
||||
var that = Ox.Element({
|
||||
tooltip: options.tooltip || ''
|
||||
}, self)
|
||||
.defaults({
|
||||
|
@ -57,7 +57,7 @@ Ox.Select = function(options, self) {
|
|||
key_down: showMenu
|
||||
});
|
||||
|
||||
Ox.print('Ox.Select', self.options)
|
||||
Ox.print('Ox.Select', self.options);
|
||||
|
||||
$.extend(self, {
|
||||
buttonId: self.options.id + 'Button',
|
||||
|
@ -87,7 +87,7 @@ Ox.Select = function(options, self) {
|
|||
// that.focus();
|
||||
})
|
||||
.appendTo(that);
|
||||
};
|
||||
}
|
||||
|
||||
if (self.options.type == 'text') {
|
||||
self.$title = $('<div>')
|
||||
|
@ -105,7 +105,7 @@ Ox.Select = function(options, self) {
|
|||
.appendTo(that.$element);
|
||||
}
|
||||
|
||||
self.$button = new Ox.Button({
|
||||
self.$button = Ox.Button({
|
||||
id: self.buttonId,
|
||||
style: 'symbol',
|
||||
title: 'select',
|
||||
|
@ -114,7 +114,7 @@ Ox.Select = function(options, self) {
|
|||
.bindEvent('click', showMenu)
|
||||
.appendTo(that);
|
||||
|
||||
self.$menu = new Ox.Menu({
|
||||
self.$menu = Ox.Menu({
|
||||
element: self.$title || self.$button,
|
||||
id: self.menuId,
|
||||
items: [self.options.selectable ? {
|
||||
|
|
|
@ -16,8 +16,8 @@ Ox.TimeInput <f:Ox.Element> TimeInput Object
|
|||
Ox.TimeInput = function(options, self) {
|
||||
|
||||
// fixme: seconds get set even if options.seconds is false
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
ampm: false,
|
||||
seconds: false,
|
||||
|
@ -46,7 +46,7 @@ Ox.TimeInput = function(options, self) {
|
|||
self.values = getValues();
|
||||
|
||||
self.$input = {
|
||||
hours: new Ox.Input({
|
||||
hours: Ox.Input({
|
||||
autocomplete: $.map(self.options.ampm ? Ox.range(1, 13) : Ox.range(0, 24), function(v) {
|
||||
return Ox.pad(v, 2);
|
||||
}),
|
||||
|
@ -57,7 +57,7 @@ Ox.TimeInput = function(options, self) {
|
|||
value: self.values.hours,
|
||||
width: 32//self.options.width.hours
|
||||
}),
|
||||
minutes: new Ox.Input({
|
||||
minutes: Ox.Input({
|
||||
autocomplete: $.map(Ox.range(0, 60), function(v) {
|
||||
return Ox.pad(v, 2);
|
||||
}),
|
||||
|
@ -68,7 +68,7 @@ Ox.TimeInput = function(options, self) {
|
|||
value: self.values.minutes,
|
||||
width: 32//self.options.width.minutes
|
||||
}),
|
||||
seconds: new Ox.Input({
|
||||
seconds: Ox.Input({
|
||||
autocomplete: $.map(Ox.range(0, 60), function(v) {
|
||||
return Ox.pad(v, 2);
|
||||
}),
|
||||
|
@ -79,7 +79,7 @@ Ox.TimeInput = function(options, self) {
|
|||
value: self.values.seconds,
|
||||
width: 32//self.options.width.seconds
|
||||
}),
|
||||
milliseconds: new Ox.Input({
|
||||
milliseconds: Ox.Input({
|
||||
autocomplete: $.map(Ox.range(0, 1000), function(v) {
|
||||
return Ox.pad(v, 3);
|
||||
}),
|
||||
|
@ -90,7 +90,7 @@ Ox.TimeInput = function(options, self) {
|
|||
value: self.values.milliseconds,
|
||||
width: 40//self.options.width.milliseconds
|
||||
}),
|
||||
ampm: new Ox.Input({
|
||||
ampm: Ox.Input({
|
||||
autocomplete: ['AM', 'PM'],
|
||||
autocompleteReplace: true,
|
||||
autocompleteReplaceCorrect: true,
|
||||
|
@ -100,7 +100,7 @@ Ox.TimeInput = function(options, self) {
|
|||
})
|
||||
};
|
||||
|
||||
that = new Ox.InputGroup($.extend(self.options, {
|
||||
that = Ox.InputGroup($.extend(self.options, {
|
||||
inputs: $.merge($.merge($.merge([
|
||||
self.$input.hours,
|
||||
self.$input.minutes,
|
||||
|
@ -169,7 +169,7 @@ Ox.TimeInput = function(options, self) {
|
|||
if (key == 'value') {
|
||||
setValues();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return that;
|
||||
|
||||
|
|
|
@ -20,8 +20,8 @@ Ox.IconItem = function(options, self) {
|
|||
|
||||
//Ox.print('IconItem', options, self)
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
height: 128,
|
||||
id: '',
|
||||
|
@ -31,7 +31,7 @@ Ox.IconItem = function(options, self) {
|
|||
width: 128,
|
||||
url: ''
|
||||
})
|
||||
.options(options || {})
|
||||
.options(options || {});
|
||||
|
||||
$.extend(self, {
|
||||
fontSize: self.options.size == 64 ? 6 : 9,
|
||||
|
|
|
@ -9,7 +9,8 @@ Ox.IconList <f:Ox.Element> IconList Object
|
|||
draggable <b|true> can be dragged
|
||||
id <s|''> element id
|
||||
item <f|null> called with data, sort, size,
|
||||
extends data with information needed for Ox.IconItem
|
||||
extends data with information needed for constructor
|
||||
itemConstructor <f|Ox.IconItem> contructor used to create item
|
||||
items <f|null> items array or callback function
|
||||
keys <a|[]> available item keys
|
||||
max <n|-1> maximum selected selected items
|
||||
|
@ -23,13 +24,14 @@ Ox.IconList <f:Ox.Element> IconList Object
|
|||
|
||||
Ox.IconList = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
centerSelection: false,
|
||||
draggable: true,
|
||||
id: '',
|
||||
item: null,
|
||||
itemConstructor: Ox.IconItem,
|
||||
items: null,
|
||||
keys: [],
|
||||
max: -1,
|
||||
|
@ -46,7 +48,7 @@ Ox.IconList = function(options, self) {
|
|||
itemWidth: self.options.size
|
||||
});
|
||||
|
||||
that.$element = new Ox.List({
|
||||
that.$element = Ox.List({
|
||||
centered: self.options.centered,
|
||||
construct: constructItem,
|
||||
draggable: self.options.draggable,
|
||||
|
@ -55,10 +57,9 @@ Ox.IconList = function(options, self) {
|
|||
items: self.options.items,
|
||||
itemWidth: self.itemWidth,
|
||||
keys: self.options.keys,
|
||||
orientation: self.options.orientation,
|
||||
keys: self.options.keys,
|
||||
max: self.options.max,
|
||||
min: self.options.min,
|
||||
orientation: self.options.orientation,
|
||||
selected: self.options.selected,
|
||||
size: self.options.size,
|
||||
sort: self.options.sort,
|
||||
|
@ -81,7 +82,7 @@ Ox.IconList = function(options, self) {
|
|||
self.options.item(data, self.options.sort, self.options.size) :
|
||||
{height: 8, width: 5},
|
||||
ratio = data.width / data.height;
|
||||
return new Ox.IconItem($.extend(data, {
|
||||
return self.options.itemConstructor($.extend(data, {
|
||||
height: Math.round(self.options.size / (ratio <= 1 ? 1 : ratio)),
|
||||
size: self.options.size,
|
||||
width: Math.round(self.options.size * (ratio >= 1 ? 1 : ratio))
|
||||
|
@ -115,7 +116,7 @@ Ox.IconList = function(options, self) {
|
|||
} else if (key == 'selected') {
|
||||
that.$element.options(key, value);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/*@
|
||||
closePreview <f> close preview
|
||||
|
@ -189,7 +190,7 @@ Ox.IconList = function(options, self) {
|
|||
that.$element.value(id, key, value);
|
||||
return that;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return that;
|
||||
|
||||
|
|
|
@ -17,8 +17,8 @@ Ox.ItemInput <f:Ox.Element> ItemInput Object
|
|||
|
||||
Ox.ItemInput = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
type: 'textarea',
|
||||
value: '',
|
||||
|
@ -27,7 +27,6 @@ Ox.ItemInput = function(options, self) {
|
|||
})
|
||||
.options(options || {});
|
||||
|
||||
|
||||
self.$input = Ox.Input({
|
||||
changeOnKeypress: true,
|
||||
height: self.options.height,
|
||||
|
@ -130,7 +129,7 @@ Ox.ItemInput = function(options, self) {
|
|||
|
||||
/*
|
||||
that.append(
|
||||
$input = new Ox.Input({
|
||||
$input = Ox.Input({
|
||||
height: self.options.height,
|
||||
style: 'square',
|
||||
type: self.options.type,
|
||||
|
@ -144,15 +143,15 @@ Ox.ItemInput = function(options, self) {
|
|||
}
|
||||
})
|
||||
)
|
||||
.append(new Ox.Element()
|
||||
.append(new Ox.Button({type: 'text', title: 'Cancel'})
|
||||
.append(Ox.Element()
|
||||
.append(Ox.Button({type: 'text', title: 'Cancel'})
|
||||
.css('width', '42%')
|
||||
.bindEvent({
|
||||
'click': function() {
|
||||
that.triggerEvent('cancel');
|
||||
}
|
||||
}))
|
||||
.append(new Ox.Button({type: 'text', title: 'Save'})
|
||||
.append(Ox.Button({type: 'text', title: 'Save'})
|
||||
.css('width', '42%')
|
||||
.bindEvent({
|
||||
'click': function() {
|
||||
|
@ -172,4 +171,4 @@ Ox.ItemInput = function(options, self) {
|
|||
|
||||
return that;
|
||||
|
||||
}
|
||||
};
|
||||
|
|
|
@ -41,8 +41,8 @@ Ox.List <f:Ox.Element> List Element
|
|||
|
||||
Ox.List = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Container({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Container({}, self)
|
||||
.defaults({
|
||||
centered: false,
|
||||
construct: null,
|
||||
|
@ -274,11 +274,11 @@ Ox.List = function(options, self) {
|
|||
|
||||
function constructEmptyPage(page) {
|
||||
//Ox.print('cEP', page)
|
||||
var i, $page = new Ox.ListPage().css(getPageCSS(page));
|
||||
var i, $page = Ox.ListPage().css(getPageCSS(page));
|
||||
for (i = 0; i < getPageLength(page); i++
|
||||
) {
|
||||
// fixme: why does chainging fail here?
|
||||
new Ox.ListItem({
|
||||
Ox.ListItem({
|
||||
construct: self.options.construct
|
||||
}).appendTo($page);
|
||||
}
|
||||
|
@ -427,7 +427,7 @@ Ox.List = function(options, self) {
|
|||
visibleItems = Math.ceil(height / self.options.itemHeight);
|
||||
if (self.listLength < visibleItems) {
|
||||
Ox.range(self.listLength, visibleItems).forEach(function(v) {
|
||||
var $item = new Ox.ListItem({
|
||||
var $item = Ox.ListItem({
|
||||
construct: self.options.construct,
|
||||
});
|
||||
$item.addClass('OxEmpty').removeClass('OxTarget');
|
||||
|
@ -472,7 +472,7 @@ Ox.List = function(options, self) {
|
|||
function getAbove() {
|
||||
var pos = -1;
|
||||
if (self.selected.length) {
|
||||
pos = self.selected[self.selected.length - 1] - self.rowLength
|
||||
pos = self.selected[self.selected.length - 1] - self.rowLength;
|
||||
if (pos < 0) {
|
||||
pos = -1;
|
||||
}
|
||||
|
@ -543,7 +543,7 @@ Ox.List = function(options, self) {
|
|||
} : {
|
||||
top: (page * self.pageHeight + self.listMargin / 2) + 'px',
|
||||
width: self.pageWidth + 'px'
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function getPageHeight() {
|
||||
|
@ -622,7 +622,7 @@ Ox.List = function(options, self) {
|
|||
function getRowLength() {
|
||||
return self.options.orientation == 'both' ?
|
||||
Math.floor((getWidth() - self.listMargin) /
|
||||
(self.options.itemWidth + self.itemMargin)) : 1
|
||||
(self.options.itemWidth + self.itemMargin)) : 1;
|
||||
}
|
||||
|
||||
function getScrollPosition() {
|
||||
|
@ -703,10 +703,10 @@ Ox.List = function(options, self) {
|
|||
sort: self.options.sort
|
||||
}, function(result) {
|
||||
var $emptyPage = Ox.clone(self.$pages[page]);
|
||||
self.$pages[page] = new Ox.ListPage().css(getPageCSS(page));
|
||||
self.$pages[page] = Ox.ListPage().css(getPageCSS(page));
|
||||
result.data.items.forEach(function(v, i) {
|
||||
var pos = offset + i;
|
||||
self.$items[pos] = new Ox.ListItem({
|
||||
self.$items[pos] = Ox.ListItem({
|
||||
construct: self.options.construct,
|
||||
data: v,
|
||||
draggable: self.options.draggable,
|
||||
|
@ -1342,7 +1342,7 @@ Ox.List = function(options, self) {
|
|||
});
|
||||
items.forEach(function(item, i) {
|
||||
var $item;
|
||||
$items.push($item = new Ox.ListItem({
|
||||
$items.push($item = Ox.ListItem({
|
||||
construct: self.options.construct,
|
||||
data: item,
|
||||
draggable: self.options.draggable,
|
||||
|
@ -1383,7 +1383,7 @@ Ox.List = function(options, self) {
|
|||
.empty()
|
||||
.addClass('OxEdit');
|
||||
|
||||
$input = new Ox.ItemInput({
|
||||
$input = Ox.ItemInput({
|
||||
type: 'textarea',
|
||||
value: item.value,
|
||||
height: height,
|
||||
|
|
|
@ -18,8 +18,8 @@ Ox.ListItem <f:Ox.Element> ListItem Object
|
|||
|
||||
Ox.ListItem = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
construct: function() {},
|
||||
data: {},
|
||||
|
@ -52,7 +52,7 @@ Ox.ListItem = function(options, self) {
|
|||
if (key == 'data') {
|
||||
constructItem(true);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return that;
|
||||
|
||||
|
|
|
@ -8,8 +8,8 @@ Ox.ListPage <f:Ox.Element> ListPage Object
|
|||
self <o> shared private variable
|
||||
@*/
|
||||
Ox.ListPage = function(options, self) {
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.addClass('OxPage');
|
||||
return that;
|
||||
};
|
||||
|
|
|
@ -39,8 +39,8 @@ Ox.TextList = function(options, self) {
|
|||
|
||||
// fixme: rename to TableList
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
columns: [],
|
||||
columnsMovable: false,
|
||||
|
@ -114,7 +114,7 @@ Ox.TextList = function(options, self) {
|
|||
if (!Ox.isUndefined(v.position)) {
|
||||
self.visibleColumns[v.position] = v;
|
||||
}
|
||||
})
|
||||
});
|
||||
$.extend(self, {
|
||||
columnWidths: $.map(self.visibleColumns, function(v, i) {
|
||||
return v.width;
|
||||
|
@ -132,11 +132,11 @@ Ox.TextList = function(options, self) {
|
|||
// Head
|
||||
|
||||
if (self.options.columnsVisible) {
|
||||
that.$bar = new Ox.Bar({
|
||||
that.$bar = Ox.Bar({
|
||||
orientation: 'horizontal',
|
||||
size: 16
|
||||
}).appendTo(that);
|
||||
that.$head = new Ox.Container()
|
||||
that.$head = Ox.Container()
|
||||
.addClass('OxHead')
|
||||
.css({
|
||||
right: self.options.scrollbarVisible ? Ox.UI.SCROLLBAR_SIZE + 'px' : 0
|
||||
|
@ -145,7 +145,7 @@ Ox.TextList = function(options, self) {
|
|||
that.$head.$content.addClass('OxTitles');
|
||||
constructHead();
|
||||
if (self.options.columnsRemovable) {
|
||||
that.$select = new Ox.Select({
|
||||
that.$select = Ox.Select({
|
||||
id: self.options.id + 'SelectColumns',
|
||||
items: $.map(self.options.columns, function(v, i) {
|
||||
return {
|
||||
|
@ -166,7 +166,7 @@ Ox.TextList = function(options, self) {
|
|||
|
||||
// Body
|
||||
|
||||
that.$body = new Ox.List({
|
||||
that.$body = Ox.List({
|
||||
construct: constructItem,
|
||||
id: self.options.id,
|
||||
items: self.options.items,
|
||||
|
@ -299,7 +299,7 @@ Ox.TextList = function(options, self) {
|
|||
var $order, $resize, $left, $center, $right;
|
||||
offset += self.columnWidths[i];
|
||||
self.columnOffsets[i] = offset - self.columnWidths[i] / 2;
|
||||
that.$titles[i] = new Ox.Element()
|
||||
that.$titles[i] = Ox.Element()
|
||||
.addClass('OxTitle OxColumn' + Ox.toTitleCase(v.id))
|
||||
.css({
|
||||
width: (self.columnWidths[i] - 9) + 'px',
|
||||
|
@ -338,7 +338,7 @@ Ox.TextList = function(options, self) {
|
|||
$(this).prev().trigger('click')
|
||||
})
|
||||
.appendTo(that.$head.$content.$element);
|
||||
$resize = new Ox.Element()
|
||||
$resize = Ox.Element()
|
||||
.addClass('OxResize')
|
||||
.appendTo(that.$head.$content.$element);
|
||||
// if columns are resizable, bind click and drag events
|
||||
|
@ -741,7 +741,7 @@ Ox.TextList = function(options, self) {
|
|||
.css({
|
||||
width: width + 'px'
|
||||
});
|
||||
$input = new Ox.Input({
|
||||
$input = Ox.Input({
|
||||
autovalidate: column.input ? column.input.autovalidate : null,
|
||||
style: 'square',
|
||||
value: html,
|
||||
|
|
|
@ -19,8 +19,8 @@ Ox.TreeList = function(options, self) {
|
|||
|
||||
// fixme: expanding the last item should cause some scroll
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
data: null,
|
||||
items: [],
|
||||
|
@ -40,7 +40,7 @@ Ox.TreeList = function(options, self) {
|
|||
//Ox.print('d', self.options.data, 'i', self.options.items)
|
||||
}
|
||||
|
||||
that.$element = new Ox.List({
|
||||
that.$element = Ox.List({
|
||||
construct: constructItem,
|
||||
itemHeight: 16,
|
||||
items: parseItems(),
|
||||
|
@ -114,9 +114,9 @@ Ox.TreeList = function(options, self) {
|
|||
}
|
||||
|
||||
function getItemById(id, items, level) {
|
||||
var items = items || self.options.items,
|
||||
level = level || 0,
|
||||
ret = null;
|
||||
var ret = null;
|
||||
items = items || self.options.items;
|
||||
level = level || 0;
|
||||
Ox.forEach(items, function(item) {
|
||||
if (item.id == id) {
|
||||
ret = $.extend(item, {
|
||||
|
@ -151,15 +151,15 @@ Ox.TreeList = function(options, self) {
|
|||
type == 'function' ?
|
||||
value.toString().split('{')[0] :
|
||||
JSON.stringify(value)
|
||||
)
|
||||
);
|
||||
}
|
||||
return ret;
|
||||
}
|
||||
|
||||
function parseItems(items, level) {
|
||||
var items = items || self.options.items,
|
||||
level = level || 0,
|
||||
ret = [];
|
||||
var ret = [];
|
||||
items = items || self.options.items;
|
||||
level = level || 0;
|
||||
items.forEach(function(item, i) {
|
||||
var item_ = $.extend({
|
||||
level: level
|
||||
|
|
|
@ -16,8 +16,8 @@ Ox.ListMap <f:Ox.Element> ListMap Object
|
|||
|
||||
Ox.ListMap = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
addPlace: null,
|
||||
editPlace: null,
|
||||
|
|
|
@ -89,7 +89,7 @@ Ox.Map <function> Basic map object
|
|||
Ox.Map = function(options, self) {
|
||||
|
||||
self = self || {};
|
||||
var that = new Ox.Element({}, self)
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
// fixme: isClickable? hasZoombar?
|
||||
clickable: false,
|
||||
|
@ -155,7 +155,7 @@ Ox.Map = function(options, self) {
|
|||
that.zoomToPlace();
|
||||
},
|
||||
key_shift_equal: function() {
|
||||
zoom(2)
|
||||
zoom(2);
|
||||
},
|
||||
key_shift_left: function() {
|
||||
pan(-2, 0);
|
||||
|
@ -182,7 +182,7 @@ Ox.Map = function(options, self) {
|
|||
'id', 'name', 'alternativeNames', 'geoname', 'countryCode', 'type',
|
||||
'lat', 'lng', 'south', 'west', 'north', 'east', 'area',
|
||||
'editable'
|
||||
],
|
||||
];
|
||||
self.scaleMeters = [
|
||||
50000000, 20000000, 10000000,
|
||||
5000000, 2000000, 1000000,
|
||||
|
@ -200,7 +200,7 @@ Ox.Map = function(options, self) {
|
|||
});
|
||||
|
||||
if (self.options.toolbar) {
|
||||
self.$toolbar = new Ox.Bar({
|
||||
self.$toolbar = Ox.Bar({
|
||||
size: 24
|
||||
})
|
||||
.appendTo(that);
|
||||
|
@ -219,7 +219,7 @@ Ox.Map = function(options, self) {
|
|||
.css({float: 'left', margin: '4px'})
|
||||
.appendTo(self.$toolbar);
|
||||
/*
|
||||
self.$labelsButton = new Ox.Checkbox({
|
||||
self.$labelsButton = Ox.Checkbox({
|
||||
title: 'Labels',
|
||||
width: 64
|
||||
})
|
||||
|
@ -229,7 +229,7 @@ Ox.Map = function(options, self) {
|
|||
})
|
||||
.appendTo(self.$toolbar)
|
||||
*/
|
||||
self.$findInput = new Ox.Input({
|
||||
self.$findInput = Ox.Input({
|
||||
clear: true,
|
||||
placeholder: self.options.findPlaceholder,
|
||||
width: 192
|
||||
|
@ -241,7 +241,7 @@ Ox.Map = function(options, self) {
|
|||
.appendTo(self.$toolbar)
|
||||
}
|
||||
|
||||
self.$map = new Ox.Element()
|
||||
self.$map = Ox.Element()
|
||||
.css({
|
||||
left: 0,
|
||||
top: self.options.toolbar * 24 + 'px',
|
||||
|
@ -251,7 +251,7 @@ Ox.Map = function(options, self) {
|
|||
.appendTo(that);
|
||||
|
||||
if (self.options.zoombar) {
|
||||
self.$zoombar = new Ox.Bar({
|
||||
self.$zoombar = Ox.Bar({
|
||||
size: 16
|
||||
})
|
||||
.css({
|
||||
|
@ -261,7 +261,7 @@ Ox.Map = function(options, self) {
|
|||
}
|
||||
|
||||
if (self.options.statusbar) {
|
||||
self.$statusbar = new Ox.Bar({
|
||||
self.$statusbar = Ox.Bar({
|
||||
size: 24
|
||||
})
|
||||
.css({
|
||||
|
@ -275,21 +275,21 @@ Ox.Map = function(options, self) {
|
|||
})
|
||||
.css({float: 'left', margin: '4px 2px 4px 4px'})
|
||||
.appendTo(self.$statusbar.$element);
|
||||
self.$placeNameInput = new Ox.Input({
|
||||
self.$placeNameInput = Ox.Input({
|
||||
placeholder: 'Name',
|
||||
width: 96
|
||||
})
|
||||
//.css({position: 'absolute', left: 4, top: 4})
|
||||
.css({float: 'left', margin: '4px 2px 4px 2px'})
|
||||
.appendTo(self.$statusbar);
|
||||
self.$placeGeonameInput = new Ox.Input({
|
||||
self.$placeGeonameInput = Ox.Input({
|
||||
placeholder: 'Geoname',
|
||||
width: 96
|
||||
})
|
||||
//.css({position: 'absolute', left: 104, top: 4})
|
||||
.css({float: 'left', margin: '4px 2px 4px 2px'})
|
||||
.appendTo(self.$statusbar);
|
||||
self.$placeButton = new Ox.Button({
|
||||
self.$placeButton = Ox.Button({
|
||||
title: 'New Place',
|
||||
width: 96
|
||||
})
|
||||
|
@ -301,7 +301,7 @@ Ox.Map = function(options, self) {
|
|||
}
|
||||
|
||||
self.$navigationButtons = {
|
||||
'center': new Ox.Button({
|
||||
'center': Ox.Button({
|
||||
title: 'close',
|
||||
type: 'image'
|
||||
})
|
||||
|
@ -310,7 +310,7 @@ Ox.Map = function(options, self) {
|
|||
left: '24px',
|
||||
top: '24px'
|
||||
}),
|
||||
'east': new Ox.Button({
|
||||
'east': Ox.Button({
|
||||
title: 'right',
|
||||
type: 'image'
|
||||
})
|
||||
|
@ -319,7 +319,7 @@ Ox.Map = function(options, self) {
|
|||
left: '44px',
|
||||
top: '24px',
|
||||
}),
|
||||
'north': new Ox.Button({
|
||||
'north': Ox.Button({
|
||||
title: 'up',
|
||||
type: 'image'
|
||||
})
|
||||
|
@ -328,7 +328,7 @@ Ox.Map = function(options, self) {
|
|||
left: '24px',
|
||||
top: '4px',
|
||||
}),
|
||||
'south': new Ox.Button({
|
||||
'south': Ox.Button({
|
||||
title: 'down',
|
||||
type: 'image'
|
||||
})
|
||||
|
@ -337,7 +337,7 @@ Ox.Map = function(options, self) {
|
|||
left: '24px',
|
||||
top: '44px',
|
||||
}),
|
||||
'west': new Ox.Button({
|
||||
'west': Ox.Button({
|
||||
title: 'left',
|
||||
type: 'image'
|
||||
})
|
||||
|
@ -353,7 +353,7 @@ Ox.Map = function(options, self) {
|
|||
});
|
||||
});
|
||||
|
||||
self.$scaleLabel = new Ox.Label({
|
||||
self.$scaleLabel = Ox.Label({
|
||||
textAlign: 'center',
|
||||
title: '...'
|
||||
})
|
||||
|
@ -488,7 +488,7 @@ Ox.Map = function(options, self) {
|
|||
//Ox.print('constructZoomInput', self.minZoom, self.maxZoom)
|
||||
if (self.options.zoombar) {
|
||||
self.$zoomInput && self.$zoomInput.removeElement();
|
||||
self.$zoomInput = new Ox.Range({
|
||||
self.$zoomInput = Ox.Range({
|
||||
arrows: true,
|
||||
max: self.maxZoom,
|
||||
min: self.minZoom,
|
||||
|
|
|
@ -17,7 +17,7 @@ Ox.MapImage <f:Ox.Element> MapImage Object
|
|||
Ox.MapImage = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element('<img>', self)
|
||||
that = Ox.Element('<img>', self)
|
||||
.defaults({
|
||||
height: 360,
|
||||
markerColorHighlight: 'yellow',
|
||||
|
|
|
@ -13,11 +13,11 @@ Ox.MapRectangle <f> MapRectangle Object
|
|||
|
||||
Ox.MapRectangle = function(options, self) {
|
||||
|
||||
var options = Ox.extend({
|
||||
var that = this;
|
||||
options = Ox.extend({
|
||||
map: null,
|
||||
place: null
|
||||
}, options),
|
||||
that = this;
|
||||
}, options);
|
||||
|
||||
Ox.forEach(options, function(val, key) {
|
||||
that[key] = val;
|
||||
|
|
|
@ -14,8 +14,8 @@ Ox.MainMenu <f:Ox.Bar> MainMenu Object
|
|||
|
||||
Ox.MainMenu = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Bar({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Bar({}, self)
|
||||
.defaults({
|
||||
extras: [],
|
||||
menus: [],
|
||||
|
@ -38,7 +38,7 @@ Ox.MainMenu = function(options, self) {
|
|||
.html(menu.title)
|
||||
.data('position', position)
|
||||
.appendTo(that.$element);
|
||||
that.menus[position] = new Ox.Menu($.extend(menu, {
|
||||
that.menus[position] = Ox.Menu($.extend(menu, {
|
||||
element: that.titles[position],
|
||||
mainmenu: that,
|
||||
size: self.options.size
|
||||
|
|
|
@ -27,9 +27,9 @@ Ox.Menu <f:Ox.Element> Menu Object
|
|||
@*/
|
||||
|
||||
Ox.Menu = function(options, self) {
|
||||
Ox.print(options)
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
Ox.print(options);
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
element: null,
|
||||
id: '',
|
||||
|
@ -199,12 +199,12 @@ Ox.print(options)
|
|||
items.forEach(function(item) {
|
||||
var position;
|
||||
if ('id' in item) {
|
||||
that.items.push(new Ox.MenuItem($.extend(item, {
|
||||
that.items.push(Ox.MenuItem($.extend(item, {
|
||||
menu: that,
|
||||
position: position = that.items.length
|
||||
})).data('position', position).appendTo(that.$content)); // fixme: jquery bug when passing {position: position}? does not return the object?;
|
||||
if (item.items) {
|
||||
that.submenus[item.id] = new Ox.Menu({
|
||||
that.submenus[item.id] = Ox.Menu({
|
||||
element: that.items[position],
|
||||
id: Ox.toCamelCase(self.options.id + '/' + item.id),
|
||||
items: item.items,
|
||||
|
|
|
@ -21,8 +21,8 @@ Ox.MenuItem <f:Ox.Element> MenuItem Object
|
|||
|
||||
Ox.MenuItem = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element('<tr>', self)
|
||||
self = self || {};
|
||||
var that = Ox.Element('<tr>', self)
|
||||
.defaults({
|
||||
bind: [], // fixme: what's this?
|
||||
checked: null,
|
||||
|
@ -113,7 +113,7 @@ Ox.MenuItem = function(options, self) {
|
|||
self.options.title = Ox.toArray(value);
|
||||
that.$title.html(self.options.title[0]);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
that.toggle = function() {
|
||||
// toggle id and title
|
||||
|
|
|
@ -14,8 +14,9 @@ Ox.CollapsePanel <f:Ox.Panel> CollapsePanel Object
|
|||
@*/
|
||||
|
||||
Ox.CollapsePanel = function(options, self) {
|
||||
var self = self || {},
|
||||
that = new Ox.Panel({}, self)
|
||||
|
||||
self = self || {};
|
||||
var that = Ox.Panel({}, self)
|
||||
.defaults({
|
||||
collapsed: false,
|
||||
extras: [],
|
||||
|
@ -28,33 +29,33 @@ Ox.CollapsePanel = function(options, self) {
|
|||
title = self.options.collapsed ?
|
||||
[{id: 'expand', title: 'right'}, {id: 'collapse', title: 'down'}] :
|
||||
[{id: 'collapse', title: 'down'}, {id: 'expand', title: 'right'}],
|
||||
$titlebar = new Ox.Bar({
|
||||
$titlebar = Ox.Bar({
|
||||
orientation: 'horizontal',
|
||||
size: self.options.size,
|
||||
})
|
||||
.dblclick(dblclickTitlebar)
|
||||
.appendTo(that),
|
||||
$switch = new Ox.Button({
|
||||
$switch = Ox.Button({
|
||||
style: 'symbol',
|
||||
title: title,
|
||||
type: 'image',
|
||||
})
|
||||
.click(toggleCollapsed)
|
||||
.appendTo($titlebar),
|
||||
$title = new Ox.Element()
|
||||
$title = Ox.Element()
|
||||
.addClass('OxTitle')
|
||||
.html(self.options.title/*.toUpperCase()*/)
|
||||
.appendTo($titlebar),
|
||||
$extras;
|
||||
if (self.options.extras.length) {
|
||||
$extras = new Ox.Element()
|
||||
$extras = Ox.Element()
|
||||
.addClass('OxExtras')
|
||||
.appendTo($titlebar);
|
||||
self.options.extras.forEach(function($extra) {
|
||||
$extra.appendTo($extras);
|
||||
});
|
||||
}
|
||||
that.$content = new Ox.Element()
|
||||
that.$content = Ox.Element()
|
||||
.addClass('OxContent')
|
||||
.appendTo(that);
|
||||
// fixme: doesn't work, content still empty
|
||||
|
|
|
@ -10,8 +10,8 @@ Ox.Panel <f:Ox.Element> Panel Object
|
|||
@*/
|
||||
|
||||
Ox.Panel = function(options, self) {
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.addClass('OxPanel');
|
||||
return that;
|
||||
};
|
||||
|
|
|
@ -30,8 +30,8 @@ Ox.SplitPanel <f:Ox.Element> SpliPanel Object
|
|||
*/
|
||||
Ox.SplitPanel = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self) // fixme: Container
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self) // fixme: Container
|
||||
.defaults({
|
||||
elements: [],
|
||||
orientation: 'horizontal'
|
||||
|
@ -72,7 +72,7 @@ Ox.SplitPanel = function(options, self) {
|
|||
if (v.collapsible || v.resizable) {
|
||||
//Ox.print('v.size', v.size)
|
||||
self.resizebarElements[index] = i < 2 ? [0, 1] : [1, 2];
|
||||
self.$resizebars[index] = new Ox.Resizebar({
|
||||
self.$resizebars[index] = Ox.Resizebar({
|
||||
collapsible: v.collapsible,
|
||||
edge: self.edges[index],
|
||||
elements: [
|
||||
|
@ -211,7 +211,7 @@ Ox.SplitPanel = function(options, self) {
|
|||
});
|
||||
});
|
||||
return that;
|
||||
}
|
||||
};
|
||||
|
||||
that.size = function(id, size) {
|
||||
// one can pass pos instead of id
|
||||
|
@ -255,9 +255,9 @@ Ox.SplitPanel = function(options, self) {
|
|||
|
||||
that.updateSize = function(pos, size) {
|
||||
// this is called from resizebar
|
||||
var pos = pos == 0 ? 0 : self.options.elements.length - 1; // fixme: silly that 0 or 1 is passed, and not pos
|
||||
pos = pos == 0 ? 0 : self.options.elements.length - 1; // fixme: silly that 0 or 1 is passed, and not pos
|
||||
self.options.elements[pos].size = size;
|
||||
}
|
||||
};
|
||||
|
||||
return that;
|
||||
|
||||
|
@ -265,8 +265,8 @@ Ox.SplitPanel = function(options, self) {
|
|||
|
||||
Ox.SplitPanel_ = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
elements: [],
|
||||
orientation: 'horizontal'
|
||||
|
|
|
@ -16,8 +16,8 @@ Ox.AnnotationPanel <f:Ox.Element> AnnotationPanel Object
|
|||
|
||||
Ox.AnnotationPanel = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
id: '',
|
||||
items: [],
|
||||
|
@ -29,10 +29,10 @@ Ox.AnnotationPanel = function(options, self) {
|
|||
|
||||
self.selected = -1;
|
||||
|
||||
that.$element = new Ox.CollapsePanel({
|
||||
that.$element = Ox.CollapsePanel({
|
||||
collapsed: false,
|
||||
extras: self.options.editable ? [
|
||||
new Ox.Button({
|
||||
Ox.Button({
|
||||
id: 'add',
|
||||
style: 'symbol',
|
||||
title: 'add',
|
||||
|
@ -53,9 +53,9 @@ Ox.AnnotationPanel = function(options, self) {
|
|||
});
|
||||
that.$content = that.$element.$content;
|
||||
|
||||
self.$annotations = new Ox.List({
|
||||
self.$annotations = Ox.List({
|
||||
construct: function(data) {
|
||||
return new Ox.Element()
|
||||
return Ox.Element()
|
||||
.addClass('OxAnnotation OxEditable OxTarget')
|
||||
.html(Ox.parseHTML(data.value));
|
||||
},
|
||||
|
@ -87,11 +87,11 @@ Ox.AnnotationPanel = function(options, self) {
|
|||
.appendTo(that.$content);
|
||||
|
||||
/*
|
||||
self.$annotations = new Ox.Element()
|
||||
self.$annotations = Ox.Element()
|
||||
.appendTo(that.$content);
|
||||
self.$annotation = [];
|
||||
self.options.items.forEach(function(item, i) {
|
||||
self.$annotation[i] = new Ox.Element()
|
||||
self.$annotation[i] = Ox.Element()
|
||||
.addClass('OxAnnotation')
|
||||
.html(item.value.replace(/\n/g, '<br/>'))
|
||||
.click(function() {
|
||||
|
@ -141,7 +141,7 @@ Ox.AnnotationPanel = function(options, self) {
|
|||
that.deselectItems = function() {
|
||||
if(self.$annotations.options('selected'))
|
||||
self.$annotations.options('selected',[]);
|
||||
}
|
||||
};
|
||||
|
||||
return that;
|
||||
|
||||
|
|
|
@ -11,8 +11,8 @@ Ox.BlockTimeline <f:Ox.Element> BlockTimeline Object
|
|||
|
||||
Ox.BlockTimeline = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
duration: 0,
|
||||
find: '',
|
||||
|
@ -40,7 +40,7 @@ Ox.BlockTimeline = function(options, self) {
|
|||
$markerPoint: [],
|
||||
$selection: [],
|
||||
$subtitles: [],
|
||||
$tooltip: new Ox.Tooltip({
|
||||
$tooltip: Ox.Tooltip({
|
||||
animate: false
|
||||
}).css({
|
||||
textAlign: 'center'
|
||||
|
@ -94,7 +94,7 @@ Ox.BlockTimeline = function(options, self) {
|
|||
|
||||
function addLine(i) {
|
||||
// fixme: get URLs once, not once for every line
|
||||
self.$lines[i] = new Ox.Element()
|
||||
self.$lines[i] = Ox.Element()
|
||||
.css({
|
||||
top: i * (self.height + self.margin) + 'px',
|
||||
width: self.options.width + 'px'
|
||||
|
@ -108,7 +108,7 @@ Ox.BlockTimeline = function(options, self) {
|
|||
.css({
|
||||
marginLeft: (-i * self.options.width) + 'px'
|
||||
})
|
||||
.appendTo(self.$lines[i].$element)
|
||||
.appendTo(self.$lines[i].$element);
|
||||
if (self.hasSubtitles) {
|
||||
self.subtitlesImageURL = getSubtitlesImageURL();
|
||||
self.$subtitles[i] = $('<img>')
|
||||
|
@ -169,7 +169,7 @@ Ox.BlockTimeline = function(options, self) {
|
|||
data[index] = color[0];
|
||||
data[index + 1] = color[1];
|
||||
data[index + 2] = color[2];
|
||||
data[index + 3] = color[3]
|
||||
data[index + 3] = color[3];
|
||||
});
|
||||
});
|
||||
context.putImageData(imageData, 0, 0);
|
||||
|
@ -213,7 +213,7 @@ Ox.BlockTimeline = function(options, self) {
|
|||
data[index] = color[0];
|
||||
data[index + 1] = color[1];
|
||||
data[index + 2] = color[2];
|
||||
data[index + 3] = 128
|
||||
data[index + 3] = 128;
|
||||
});
|
||||
});
|
||||
});
|
||||
|
@ -278,7 +278,7 @@ Ox.BlockTimeline = function(options, self) {
|
|||
$target.hasClass('OxTimelineSmallSubtitles') ||
|
||||
$target.hasClass('OxTimelineSmallSelection')
|
||||
) {
|
||||
position = getPosition(e),
|
||||
position = getPosition(e);
|
||||
subtitle = getSubtitle(position);
|
||||
self.$tooltip.options({
|
||||
title: subtitle ?
|
||||
|
@ -361,7 +361,7 @@ Ox.BlockTimeline = function(options, self) {
|
|||
//Ox.print('key', key, 'value', value)
|
||||
setMarkerPoint(0);
|
||||
setMarkerPoint(1);
|
||||
updateSelection()
|
||||
updateSelection();
|
||||
} else if (key == 'position') {
|
||||
setPosition();
|
||||
} else if (key == 'width') {
|
||||
|
|
|
@ -1,7 +1,8 @@
|
|||
// vim: et:ts=4:sw=4:sts=4:ft=js
|
||||
Ox.BlockVideoTimeline = function(options, self) {
|
||||
|
||||
self = self || {};
|
||||
var that = new Ox.Element({}, self)
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
duration: 0,
|
||||
find: '',
|
||||
|
@ -32,7 +33,7 @@ Ox.BlockVideoTimeline = function(options, self) {
|
|||
self.$images = [];
|
||||
self.$interfaces = [];
|
||||
self.$lines = [];
|
||||
self.$tooltip = new Ox.Tooltip({
|
||||
self.$tooltip = Ox.Tooltip({
|
||||
animate: false
|
||||
}).css({
|
||||
textAlign: 'center'
|
||||
|
@ -263,7 +264,7 @@ Ox.BlockVideoTimeline = function(options, self) {
|
|||
|
||||
self.setOption = function(key, value) {
|
||||
if (key == 'in' || key == 'out') {
|
||||
setPoint(key)
|
||||
setPoint(key);
|
||||
} else if (key == 'position') {
|
||||
setPositionMarker();
|
||||
} else if (key == 'results') {
|
||||
|
@ -271,8 +272,8 @@ Ox.BlockVideoTimeline = function(options, self) {
|
|||
} else if (key == 'width') {
|
||||
setWidth();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return that;
|
||||
|
||||
};
|
||||
};
|
||||
|
|
|
@ -3,8 +3,8 @@
|
|||
|
||||
Ox.Flipbook = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
frame = $('<img>').css({
|
||||
self = self || {};
|
||||
var frame = $('<img>').css({
|
||||
'position': 'absolute',
|
||||
'width': '100%',
|
||||
'height': 'auto'
|
||||
|
@ -22,7 +22,7 @@ Ox.Flipbook = function(options, self) {
|
|||
'width': '100%'
|
||||
})
|
||||
.hide(),
|
||||
that = new Ox.Element({}, self)
|
||||
that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
frames: {},
|
||||
duration: 0,
|
||||
|
|
|
@ -11,8 +11,8 @@ Ox.LargeTimeline <f:Ox.Element> LargeTimeline Object
|
|||
|
||||
Ox.LargeTimeline = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
cuts: [],
|
||||
duration: 0,
|
||||
|
@ -40,7 +40,7 @@ Ox.LargeTimeline = function(options, self) {
|
|||
$markerPoint: [],
|
||||
$subtitles: [],
|
||||
$tiles: {},
|
||||
$tooltip: new Ox.Tooltip({
|
||||
$tooltip: Ox.Tooltip({
|
||||
animate: false
|
||||
}),
|
||||
center: parseInt(self.options.width / 2),
|
||||
|
@ -55,7 +55,7 @@ Ox.LargeTimeline = function(options, self) {
|
|||
.css({
|
||||
left: self.center + 'px'
|
||||
})
|
||||
.appendTo(that.$element)
|
||||
.appendTo(that.$element);
|
||||
|
||||
self.options.subtitles.forEach(function(v, i) {
|
||||
self.$subtitles[i] = $('<div>')
|
||||
|
@ -65,7 +65,7 @@ Ox.LargeTimeline = function(options, self) {
|
|||
width: (((v['out'] - v['in']) * self.fps) - 2) + 'px'
|
||||
})
|
||||
.html(Ox.highlight(v.value, self.options.find, 'OxHighlight'))
|
||||
.appendTo(self.$timeline)
|
||||
.appendTo(self.$timeline);
|
||||
});
|
||||
|
||||
self.options.cuts.forEach(function(v, i) {
|
||||
|
@ -77,7 +77,7 @@ Ox.LargeTimeline = function(options, self) {
|
|||
.css({
|
||||
left: (v * self.fps) + 'px'
|
||||
})
|
||||
.appendTo(self.$timeline)
|
||||
.appendTo(self.$timeline);
|
||||
});
|
||||
|
||||
self.$markerPosition = $('<img>')
|
||||
|
@ -124,7 +124,7 @@ Ox.LargeTimeline = function(options, self) {
|
|||
}
|
||||
|
||||
function getPosition(e) {
|
||||
return self.options.position + (e.clientX - that.offset().left - self.center - 1) / self.fps
|
||||
return self.options.position + (e.clientX - that.offset().left - self.center - 1) / self.fps;
|
||||
}
|
||||
|
||||
function mouseleave(e) {
|
||||
|
|
|
@ -11,8 +11,8 @@ Ox.LargeVideoTimeline <f:Ox.Element> LargeTimeline Object
|
|||
|
||||
Ox.LargeVideoTimeline = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
cuts: [],
|
||||
duration: 0,
|
||||
|
@ -41,7 +41,7 @@ Ox.LargeVideoTimeline = function(options, self) {
|
|||
$cuts: [],
|
||||
$pointMarker: {},
|
||||
$tiles: {},
|
||||
$tooltip: new Ox.Tooltip({
|
||||
$tooltip: Ox.Tooltip({
|
||||
animate: false
|
||||
}),
|
||||
center: parseInt(self.options.width / 2),
|
||||
|
@ -117,7 +117,7 @@ Ox.LargeVideoTimeline = function(options, self) {
|
|||
}
|
||||
|
||||
function getPosition(e) {
|
||||
return self.options.position + (e.clientX - that.offset().left - self.center - 1) / self.fps
|
||||
return self.options.position + (e.clientX - that.offset().left - self.center - 1) / self.fps;
|
||||
}
|
||||
|
||||
function mouseleave(e) {
|
||||
|
@ -182,7 +182,7 @@ Ox.LargeVideoTimeline = function(options, self) {
|
|||
width: (((subtitle.out - subtitle['in']) * self.fps) - 2) + 'px'
|
||||
})
|
||||
.html(Ox.highlight(subtitle.text, self.options.find, 'OxHighlight'))
|
||||
.appendTo(self.$timeline)
|
||||
.appendTo(self.$timeline);
|
||||
});
|
||||
}
|
||||
|
||||
|
|
|
@ -11,8 +11,8 @@ Ox.SmallTimeline <f:Ox.Element> SmallTimeline Object
|
|||
|
||||
Ox.SmallTimeline = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
duration: 0,
|
||||
find: '',
|
||||
|
@ -38,7 +38,7 @@ Ox.SmallTimeline = function(options, self) {
|
|||
$images: [],
|
||||
$markerPoint: [],
|
||||
$subtitles: [],
|
||||
$tooltip: new Ox.Tooltip({
|
||||
$tooltip: Ox.Tooltip({
|
||||
animate: false
|
||||
}).css({
|
||||
textAlign: 'center'
|
||||
|
@ -135,7 +135,7 @@ Ox.SmallTimeline = function(options, self) {
|
|||
$target.hasClass('OxTimelineSmallImage') ||
|
||||
$target.hasClass('OxTimelineSmallSubtitles')
|
||||
) {
|
||||
position = getPosition(e),
|
||||
position = getPosition(e);
|
||||
subtitle = getSubtitle(position);
|
||||
self.$tooltip.options({
|
||||
title: subtitle ?
|
||||
|
|
|
@ -215,8 +215,8 @@ Ox.SmallVideoTimelineImage = function(options, self) {
|
|||
self.$subtitles.css({width: value + 'px'});
|
||||
self.$timeline.css({width: value + 'px'});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return that;
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
@ -11,8 +11,8 @@ Ox.VideoEditor <f:Ox.Element> VideoEditor Object
|
|||
|
||||
Ox.VideoEditor = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
annotationsSize: 0,
|
||||
cuts: [],
|
||||
|
@ -97,10 +97,10 @@ Ox.VideoEditor = function(options, self) {
|
|||
// toggleSize
|
||||
},
|
||||
key_shift_comma: function() {
|
||||
movePositionTo('match', -1)
|
||||
movePositionTo('match', -1);
|
||||
},
|
||||
key_shift_dot: function() {
|
||||
movePositionTo('match', 1)
|
||||
movePositionTo('match', 1);
|
||||
},
|
||||
key_shift_down: function() {
|
||||
movePositionBy(self.options.duration);
|
||||
|
@ -143,7 +143,7 @@ Ox.VideoEditor = function(options, self) {
|
|||
videoRatio: self.options.videoWidth / self.options.videoHeight
|
||||
});
|
||||
|
||||
self.words = []
|
||||
self.words = [];
|
||||
Ox.forEach(Ox.count(Ox.words(self.options.subtitles.map(function(subtitle) {
|
||||
return subtitle.text;
|
||||
}).join(' '))), function(count, word) {
|
||||
|
@ -155,7 +155,7 @@ Ox.VideoEditor = function(options, self) {
|
|||
return obj.word;
|
||||
});
|
||||
|
||||
self.$editor = new Ox.Element()
|
||||
self.$editor = Ox.Element()
|
||||
.addClass('OxVideoEditor')
|
||||
.click(function(e) {
|
||||
var $target = $(e.target);
|
||||
|
@ -165,7 +165,7 @@ Ox.VideoEditor = function(options, self) {
|
|||
self.sizes = getSizes();
|
||||
|
||||
['play', 'in', 'out'].forEach(function(type, i) {
|
||||
self.$player[i] = new Ox.VideoPlayer({
|
||||
self.$player[i] = Ox.VideoPlayer({
|
||||
controlsBottom: type == 'play' ?
|
||||
['play', 'playInToOut', 'volume', 'size', 'space', 'position'] :
|
||||
['goto', 'set', 'space', 'position'],
|
||||
|
@ -207,7 +207,7 @@ Ox.VideoEditor = function(options, self) {
|
|||
.appendTo(self.$editor);
|
||||
});
|
||||
|
||||
self.$timeline[0] = new Ox.LargeVideoTimeline({
|
||||
self.$timeline[0] = Ox.LargeVideoTimeline({
|
||||
cuts: self.options.cuts,
|
||||
duration: self.options.duration,
|
||||
find: self.options.find,
|
||||
|
@ -228,7 +228,7 @@ Ox.VideoEditor = function(options, self) {
|
|||
.bindEvent('position', changeTimelineLarge)
|
||||
.appendTo(self.$editor);
|
||||
|
||||
self.$timeline[1] = new Ox.BlockVideoTimeline({
|
||||
self.$timeline[1] = Ox.BlockVideoTimeline({
|
||||
cuts: self.options.cuts,
|
||||
duration: self.options.duration,
|
||||
find: self.options.find,
|
||||
|
@ -249,14 +249,14 @@ Ox.VideoEditor = function(options, self) {
|
|||
.bindEvent('position', changeTimelineSmall)
|
||||
.appendTo(self.$editor);
|
||||
|
||||
self.$annotations = new Ox.Element()
|
||||
self.$annotations = Ox.Element()
|
||||
.css({
|
||||
overflowY: 'auto'
|
||||
});
|
||||
self.$annotationPanel = [];
|
||||
|
||||
self.options.layers.forEach(function(layer, i) {
|
||||
self.$annotationPanel[i] = new Ox.AnnotationPanel(
|
||||
self.$annotationPanel[i] = Ox.AnnotationPanel(
|
||||
$.extend({
|
||||
width: self.options.annotationSize
|
||||
}, layer)
|
||||
|
@ -352,7 +352,7 @@ Ox.VideoEditor = function(options, self) {
|
|||
.html(shortcut.action)
|
||||
)
|
||||
);
|
||||
})
|
||||
});
|
||||
|
||||
self.$videoMenuButton = Ox.Select({
|
||||
items: Ox.merge([
|
||||
|
@ -401,7 +401,7 @@ Ox.VideoEditor = function(options, self) {
|
|||
.appendTo(self.$videobar);
|
||||
self.$videoMenuButton.find('input').attr({
|
||||
src: Ox.UI.getImagePath('symbolSet.svg')
|
||||
})
|
||||
});
|
||||
|
||||
self.$selectButton = Ox.Button({
|
||||
style: 'symbol',
|
||||
|
@ -413,7 +413,7 @@ Ox.VideoEditor = function(options, self) {
|
|||
click: function() {
|
||||
self.$menuButton.find('input').trigger('click')
|
||||
}
|
||||
})
|
||||
});
|
||||
//.appendTo(self.$videobar);
|
||||
|
||||
|
||||
|
@ -426,7 +426,7 @@ Ox.VideoEditor = function(options, self) {
|
|||
change: function() {
|
||||
|
||||
}
|
||||
})
|
||||
});
|
||||
//.appendTo(self.$videobar);
|
||||
|
||||
|
||||
|
@ -441,7 +441,7 @@ Ox.VideoEditor = function(options, self) {
|
|||
.css({float: 'left'})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
setPosition(self.options.posterFrame)
|
||||
setPosition(self.options.posterFrame);
|
||||
}
|
||||
})
|
||||
.appendTo(self.$videobar);
|
||||
|
@ -517,7 +517,7 @@ Ox.VideoEditor = function(options, self) {
|
|||
}
|
||||
})
|
||||
.appendTo(self.$videobar);
|
||||
self.$findInput.find('input').css({background: 'transparent'})
|
||||
self.$findInput.find('input').css({background: 'transparent'});
|
||||
|
||||
self.$findButton = Ox.Button({
|
||||
//disabled: true,
|
||||
|
@ -531,7 +531,7 @@ Ox.VideoEditor = function(options, self) {
|
|||
click: function() {
|
||||
|
||||
}
|
||||
})
|
||||
});
|
||||
//.appendTo(self.$videobar);
|
||||
|
||||
self.$nextButton = Ox.Button({
|
||||
|
@ -544,7 +544,7 @@ Ox.VideoEditor = function(options, self) {
|
|||
.css({float: 'right'})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
setPosition(getNextPosition('result', 1))
|
||||
setPosition(getNextPosition('result', 1));
|
||||
}
|
||||
})
|
||||
.appendTo(self.$videobar);
|
||||
|
@ -559,7 +559,7 @@ Ox.VideoEditor = function(options, self) {
|
|||
.css({float: 'right'})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
setPosition(getNextPosition('result', -1))
|
||||
setPosition(getNextPosition('result', -1));
|
||||
}
|
||||
})
|
||||
.appendTo(self.$videobar);
|
||||
|
@ -597,7 +597,7 @@ Ox.VideoEditor = function(options, self) {
|
|||
.appendTo(self.$annotationsbar);
|
||||
self.$annotationsMenuButton.find('input').attr({
|
||||
src: Ox.UI.getImagePath('symbolSet.svg')
|
||||
})
|
||||
});
|
||||
|
||||
|
||||
that.$element = Ox.SplitPanel({
|
||||
|
@ -767,7 +767,7 @@ Ox.VideoEditor = function(options, self) {
|
|||
top: self.margin / 2,
|
||||
width: widths[i],
|
||||
height: Math.round(widths[1] / self.videoRatio)
|
||||
}
|
||||
};
|
||||
width += widths[i];
|
||||
});
|
||||
} else {
|
||||
|
@ -775,32 +775,32 @@ Ox.VideoEditor = function(options, self) {
|
|||
left: self.margin / 2,
|
||||
top: self.margin / 2,
|
||||
width: Math.round((contentWidth - 3 * self.margin + (self.controlsHeight + self.margin) / 2 * self.videoRatio) * 2/3),
|
||||
}
|
||||
};
|
||||
size.player[0].height = Math.round(size.player[0].width / self.videoRatio);
|
||||
size.player[1] = {
|
||||
left: size.player[0].left + size.player[0].width + self.margin,
|
||||
top: size.player[0].top,
|
||||
width: contentWidth - 3 * self.margin - size.player[0].width
|
||||
}
|
||||
size.player[1].height = Math.ceil(size.player[1].width / self.videoRatio)
|
||||
};
|
||||
size.player[1].height = Math.ceil(size.player[1].width / self.videoRatio);
|
||||
size.player[2] = {
|
||||
left: size.player[1].left,
|
||||
top: size.player[0].top + size.player[1].height + self.controlsHeight + self.margin,
|
||||
width: size.player[1].width,
|
||||
height: size.player[0].height - size.player[1].height - self.controlsHeight - self.margin
|
||||
}
|
||||
};
|
||||
}
|
||||
size.timeline[0] = {
|
||||
left: self.margin / 2,
|
||||
top: size.player[0].height + self.controlsHeight + 1.5 * self.margin,
|
||||
width: contentWidth - 2 * self.margin,
|
||||
height: 64
|
||||
}
|
||||
};
|
||||
size.timeline[1] = {
|
||||
left: size.timeline[0].left,
|
||||
top: size.timeline[0].top + size.timeline[0].height + self.margin,
|
||||
width: size.timeline[0].width
|
||||
}
|
||||
};
|
||||
lines = Math.ceil(self.options.duration / size.timeline[1].width);
|
||||
height = getHeight();
|
||||
self.$editor.css({
|
||||
|
@ -1000,12 +1000,12 @@ Ox.VideoEditor = function(options, self) {
|
|||
that.addAnnotation = function(layer, item) {
|
||||
var i = Ox.getPositionById(self.options.layers, layer);
|
||||
self.$annotationPanel[i].addItem(item);
|
||||
}
|
||||
};
|
||||
|
||||
that.removeAnnotations = function(layer, ids) {
|
||||
var i = Ox.getPositionById(self.options.layers, layer);
|
||||
self.$annotationPanel[i].removeItems(ids);
|
||||
}
|
||||
};
|
||||
|
||||
return that;
|
||||
|
||||
|
|
|
@ -11,8 +11,8 @@ Ox.VideoEditorPlayer <f:Ox.Element> VideoEditorPlayer Object
|
|||
|
||||
Ox.VideoEditorPlayer = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
duration: 0,
|
||||
find: '',
|
||||
|
@ -36,7 +36,7 @@ Ox.VideoEditorPlayer = function(options, self) {
|
|||
self.controlsHeight = 16;
|
||||
|
||||
if (self.options.type == 'play') {
|
||||
self.$video = new Ox.VideoElement({
|
||||
self.$video = Ox.VideoElement({
|
||||
height: self.options.height,
|
||||
paused: true,
|
||||
points: self.options.points,
|
||||
|
@ -112,7 +112,7 @@ Ox.VideoEditorPlayer = function(options, self) {
|
|||
});
|
||||
});
|
||||
|
||||
self.$controls = new Ox.Bar({
|
||||
self.$controls = Ox.Bar({
|
||||
size: self.controlsHeight
|
||||
})
|
||||
.css({
|
||||
|
@ -122,7 +122,7 @@ Ox.VideoEditorPlayer = function(options, self) {
|
|||
|
||||
if (self.options.type == 'play') {
|
||||
// fixme: $buttonPlay etc. ?
|
||||
self.$playButton = new Ox.Button({
|
||||
self.$playButton = Ox.Button({
|
||||
id: self.options.id + 'Play',
|
||||
title: [
|
||||
{id: 'play', title: 'play'},
|
||||
|
@ -133,7 +133,7 @@ Ox.VideoEditorPlayer = function(options, self) {
|
|||
})
|
||||
.bindEvent('click', togglePlay)
|
||||
.appendTo(self.$controls);
|
||||
self.$playInToOutButton = new Ox.Button({
|
||||
self.$playInToOutButton = Ox.Button({
|
||||
id: self.options.id + 'PlayInToOut',
|
||||
title: 'PlayInToOut',
|
||||
tooltip: 'Play In to Out',
|
||||
|
@ -143,7 +143,7 @@ Ox.VideoEditorPlayer = function(options, self) {
|
|||
that.playInToOut();
|
||||
})
|
||||
.appendTo(self.$controls);
|
||||
self.$muteButton = new Ox.Button({
|
||||
self.$muteButton = Ox.Button({
|
||||
id: self.options.id + 'Mute',
|
||||
title: [
|
||||
{id: 'mute', title: 'mute'},
|
||||
|
@ -154,7 +154,7 @@ Ox.VideoEditorPlayer = function(options, self) {
|
|||
})
|
||||
.bindEvent('click', toggleMute)
|
||||
.appendTo(self.$controls);
|
||||
self.$sizeButton = new Ox.Button({
|
||||
self.$sizeButton = Ox.Button({
|
||||
id: self.options.id + 'Size',
|
||||
title: self.options.size == 'small' ? [
|
||||
{id: 'large', title: 'grow'},
|
||||
|
@ -169,7 +169,7 @@ Ox.VideoEditorPlayer = function(options, self) {
|
|||
.bindEvent('click', toggleSize)
|
||||
.appendTo(self.$controls);
|
||||
} else {
|
||||
self.$goToPointButton = new Ox.Button({
|
||||
self.$goToPointButton = Ox.Button({
|
||||
id: self.options.id + 'GoTo' + Ox.toTitleCase(self.options.type),
|
||||
title: 'GoTo' + Ox.toTitleCase(self.options.type),
|
||||
tooltip: 'Go to ' + Ox.toTitleCase(self.options.type) + ' Point',
|
||||
|
@ -177,7 +177,7 @@ Ox.VideoEditorPlayer = function(options, self) {
|
|||
})
|
||||
.bindEvent('click', goToPoint)
|
||||
.appendTo(self.$controls);
|
||||
self.$setPointButton = new Ox.Button({
|
||||
self.$setPointButton = Ox.Button({
|
||||
id: self.options.id + 'Set' + Ox.toTitleCase(self.options.type),
|
||||
title: 'Set' + Ox.toTitleCase(self.options.type),
|
||||
tooltip: 'Set ' + Ox.toTitleCase(self.options.type) + ' Point',
|
||||
|
@ -187,7 +187,7 @@ Ox.VideoEditorPlayer = function(options, self) {
|
|||
.appendTo(self.$controls);
|
||||
}
|
||||
|
||||
self.$positionInput = new Ox.TimeInput({
|
||||
self.$positionInput = Ox.TimeInput({
|
||||
milliseconds: true,
|
||||
seconds: true,
|
||||
value: Ox.formatDuration(self.options.position, 3)
|
||||
|
@ -220,7 +220,7 @@ Ox.VideoEditorPlayer = function(options, self) {
|
|||
});
|
||||
|
||||
if (self.options.type == 'play') {
|
||||
self.$loadingIcon = new Ox.LoadingIcon()
|
||||
self.$loadingIcon = Ox.LoadingIcon()
|
||||
.appendTo(that)
|
||||
.start();
|
||||
self.loadingInterval = setInterval(function() {
|
||||
|
@ -309,7 +309,7 @@ Ox.VideoEditorPlayer = function(options, self) {
|
|||
self.$loadingIcon && self.$loadingIcon.stop();
|
||||
url = self.options.url(position);
|
||||
if (self.$video.attr('src') != url) {
|
||||
self.$loadingIcon = new Ox.LoadingIcon()
|
||||
self.$loadingIcon = Ox.LoadingIcon()
|
||||
.appendTo(that)
|
||||
.start();
|
||||
self.$video.attr({
|
||||
|
|
|
@ -2,8 +2,8 @@
|
|||
|
||||
Ox.VideoElement = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element('<video>', self)
|
||||
self = self || {};
|
||||
var that = Ox.Element('<video>', self)
|
||||
.defaults({
|
||||
fps: 25,
|
||||
height: 0,
|
||||
|
@ -42,7 +42,7 @@ Ox.VideoElement = function(options, self) {
|
|||
self.video.currentTime = self.options.position;
|
||||
that.triggerEvent('loadedmetadata', {
|
||||
video: self.video
|
||||
})
|
||||
});
|
||||
},
|
||||
progress: function() {
|
||||
that.triggerEvent('progress', {
|
||||
|
|
|
@ -11,8 +11,8 @@ Ox.VideoPanelPlayer <f:Ox.Element> VideoPanelPlayer Object
|
|||
|
||||
Ox.VideoPanelPlayer = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
annotationsSize: 256,
|
||||
duration: 0,
|
||||
|
@ -60,7 +60,7 @@ Ox.VideoPanelPlayer = function(options, self) {
|
|||
});
|
||||
//alert(JSON.stringify([self.playerHeight, self.playerWidth, self.videoCSS]))
|
||||
|
||||
self.$player = new Ox.Element()
|
||||
self.$player = Ox.Element()
|
||||
.css({
|
||||
overflowX: 'hidden',
|
||||
overflowY: 'hidden'
|
||||
|
@ -72,7 +72,7 @@ Ox.VideoPanelPlayer = function(options, self) {
|
|||
resize: resizeVideo
|
||||
});
|
||||
|
||||
self.$video = new Ox.VideoElement({
|
||||
self.$video = Ox.VideoElement({
|
||||
height: self.videoCSS.height,
|
||||
paused: true,
|
||||
points: self.options.points,
|
||||
|
@ -87,12 +87,12 @@ Ox.VideoPanelPlayer = function(options, self) {
|
|||
})
|
||||
.appendTo(self.$player);
|
||||
|
||||
self.$controls = new Ox.Element()
|
||||
self.$controls = Ox.Element()
|
||||
.bindEvent({
|
||||
toggle: toggleControls
|
||||
});
|
||||
|
||||
self.$buttons = new Ox.Element()
|
||||
self.$buttons = Ox.Element()
|
||||
.css({
|
||||
float: 'left',
|
||||
width: '16px',
|
||||
|
@ -101,7 +101,7 @@ Ox.VideoPanelPlayer = function(options, self) {
|
|||
.appendTo(self.$controls);
|
||||
|
||||
self.$button = {
|
||||
play: new Ox.Button({
|
||||
play: Ox.Button({
|
||||
id: 'play',
|
||||
title: [
|
||||
{id: 'play', title: 'play'},
|
||||
|
@ -113,7 +113,7 @@ Ox.VideoPanelPlayer = function(options, self) {
|
|||
.bindEvent({
|
||||
click: self.$video.togglePlay
|
||||
}),
|
||||
mute: new Ox.Button({
|
||||
mute: Ox.Button({
|
||||
id: 'mute',
|
||||
title: [
|
||||
{id: 'mute', title: 'mute'},
|
||||
|
@ -125,7 +125,7 @@ Ox.VideoPanelPlayer = function(options, self) {
|
|||
.bindEvent({
|
||||
click: self.$video.toggleMute
|
||||
}),
|
||||
size: new Ox.Button({
|
||||
size: Ox.Button({
|
||||
id: 'size',
|
||||
title: self.options.videoSize == 'fit' ? [
|
||||
{id: 'fill', title: 'fill'},
|
||||
|
@ -144,7 +144,7 @@ Ox.VideoPanelPlayer = function(options, self) {
|
|||
.bindEvent({
|
||||
click: toggleSize
|
||||
}),
|
||||
fullscreen: new Ox.Button({
|
||||
fullscreen: Ox.Button({
|
||||
id: 'size',
|
||||
title: [
|
||||
{id: 'grow', title: 'grow'},
|
||||
|
@ -169,7 +169,7 @@ Ox.VideoPanelPlayer = function(options, self) {
|
|||
.appendTo(self.$buttons);
|
||||
});
|
||||
|
||||
self.$timelines = new Ox.Element()
|
||||
self.$timelines = Ox.Element()
|
||||
.css({
|
||||
float: 'left',
|
||||
margin: '4px'
|
||||
|
@ -177,7 +177,7 @@ Ox.VideoPanelPlayer = function(options, self) {
|
|||
.appendTo(self.$controls);
|
||||
|
||||
self.$timeline = {
|
||||
large: new Ox.LargeTimeline({
|
||||
large: Ox.LargeTimeline({
|
||||
duration: self.options.duration,
|
||||
position: self.options.position,
|
||||
subtitles: self.options.subtitles,
|
||||
|
@ -190,7 +190,7 @@ Ox.VideoPanelPlayer = function(options, self) {
|
|||
.bindEvent({
|
||||
change: changeLargeTimeline
|
||||
}),
|
||||
small: new Ox.SmallTimeline({
|
||||
small: Ox.SmallTimeline({
|
||||
duration: self.options.duration,
|
||||
position: self.options.position,
|
||||
subtitles: self.options.subtitles,
|
||||
|
@ -208,7 +208,7 @@ Ox.VideoPanelPlayer = function(options, self) {
|
|||
$timeline.appendTo(self.$timelines);
|
||||
});
|
||||
|
||||
self.$panel = new Ox.SplitPanel({
|
||||
self.$panel = Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: self.$player
|
||||
|
@ -226,14 +226,14 @@ Ox.VideoPanelPlayer = function(options, self) {
|
|||
resize: resizePanel
|
||||
});
|
||||
|
||||
self.$annotations = new Ox.Element()
|
||||
self.$annotations = Ox.Element()
|
||||
.bindEvent({
|
||||
resize: resizeAnnotations,
|
||||
resizeend: resizeendAnnotations,
|
||||
toggle: toggleAnnotations
|
||||
});
|
||||
|
||||
that.$element = new Ox.SplitPanel({
|
||||
that.$element = Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: self.$panel
|
||||
|
|
|
@ -13,8 +13,8 @@ Ox.Dialog = function(options, self) {
|
|||
|
||||
// fixme: dialog should be derived from a generic draggable
|
||||
// fixme: buttons should have a close attribute, or the dialog a close id
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
title: '',
|
||||
buttons: [],
|
||||
|
@ -43,9 +43,9 @@ Ox.Dialog = function(options, self) {
|
|||
$.extend(self, {
|
||||
initialWidth: self.options.width,
|
||||
initialHeight: self.options.height
|
||||
})
|
||||
});
|
||||
|
||||
that.$titlebar = new Ox.Bar({
|
||||
that.$titlebar = Ox.Bar({
|
||||
size: 'medium'
|
||||
})
|
||||
.addClass('OxTitleBar')
|
||||
|
@ -57,12 +57,12 @@ Ox.Dialog = function(options, self) {
|
|||
drag: drag
|
||||
});
|
||||
|
||||
that.$title = new Ox.Element()
|
||||
that.$title = Ox.Element()
|
||||
.addClass('OxTitle')
|
||||
.html(self.options.title)
|
||||
.appendTo(that.$titlebar);
|
||||
|
||||
that.$content = new Ox.Element()
|
||||
that.$content = Ox.Element()
|
||||
.addClass('OxContent')
|
||||
.css({
|
||||
padding: self.options.padding + 'px',
|
||||
|
@ -71,14 +71,14 @@ Ox.Dialog = function(options, self) {
|
|||
.append(self.options.content)
|
||||
.appendTo(that);
|
||||
|
||||
that.$buttonsbar = new Ox.Bar({})
|
||||
that.$buttonsbar = Ox.Bar({})
|
||||
.addClass('OxButtonsBar')
|
||||
.appendTo(that);
|
||||
loadButtons();
|
||||
|
||||
//that.$buttons[0].focus();
|
||||
|
||||
that.$layer = new Ox.Element() // fixme: Layer widget that would handle click?
|
||||
that.$layer = Ox.Element() // fixme: Layer widget that would handle click?
|
||||
.addClass('OxLayer')
|
||||
.mousedown(mousedownLayer)
|
||||
.mouseup(mouseupLayer);
|
||||
|
@ -224,7 +224,7 @@ Ox.Dialog = function(options, self) {
|
|||
.appendTo(that.$buttonsbar);
|
||||
});
|
||||
if (self.options.resizable) {
|
||||
that.$resize = new Ox.Element()
|
||||
that.$resize = Ox.Element()
|
||||
.addClass('OxResize')
|
||||
.dblclick(reset)
|
||||
.bindEvent({
|
||||
|
@ -304,7 +304,7 @@ Ox.Dialog = function(options, self) {
|
|||
}, 100);
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
that.center = function() {
|
||||
|
||||
|
@ -323,14 +323,14 @@ Ox.Dialog = function(options, self) {
|
|||
that.removeElement();
|
||||
callback();
|
||||
});
|
||||
Ox.UI.$window.unbind('mouseup', mouseupLayer)
|
||||
Ox.UI.$window.unbind('mouseup', mouseupLayer);
|
||||
return that;
|
||||
};
|
||||
|
||||
that.content = function($element) {
|
||||
that.$content.empty().append($element);
|
||||
return that;
|
||||
}
|
||||
};
|
||||
|
||||
that.disable = function() {
|
||||
// to be used on submit of form, like login
|
||||
|
@ -369,7 +369,7 @@ Ox.Dialog = function(options, self) {
|
|||
reset();
|
||||
// fixme: the following line prevents preview-style dialog
|
||||
that.gainFocus();
|
||||
Ox.UI.$window.bind('mouseup', mouseupLayer)
|
||||
Ox.UI.$window.bind('mouseup', mouseupLayer);
|
||||
//Ox.print('after open')
|
||||
return that;
|
||||
};
|
||||
|
@ -391,7 +391,7 @@ Ox.Dialog = function(options, self) {
|
|||
that.$content.height(self.options.height - 48 - 2 * self.options.padding); // fixme: this should happen automatically
|
||||
callback();
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
return that;
|
||||
|
||||
|
|
|
@ -11,8 +11,8 @@ Ox.Tooltip <f:Ox.Element> Tooltip Object
|
|||
|
||||
Ox.Tooltip = function(options, self) {
|
||||
|
||||
var self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
animate: true,
|
||||
title: ''
|
||||
|
|
|
@ -15,8 +15,8 @@ Ox.Window <f:Ox.Element> Window object
|
|||
@*/
|
||||
Ox.Window = function(options, self) {
|
||||
|
||||
self = self || {},
|
||||
that = new Ox.Element({}, self)
|
||||
self = self || {};
|
||||
var that = Ox.Element({}, self)
|
||||
.defaults({
|
||||
draggable: true,
|
||||
fullscreenable: true, // fixme: silly name
|
||||
|
@ -25,7 +25,7 @@ Ox.Window = function(options, self) {
|
|||
scaleable: true,
|
||||
width: 400
|
||||
})
|
||||
.options(options || {})
|
||||
.options(options || {});
|
||||
|
||||
self.center = function() {
|
||||
|
||||
|
|
|
@ -746,6 +746,7 @@ Ox.map = function(obj, fn) {
|
|||
var isObject = Ox.isObject(obj),
|
||||
ret = isObject ? {} : [];
|
||||
Ox.forEach(obj, function(val, key) {
|
||||
var v;
|
||||
if ((v = fn(val, key)) !== null) {
|
||||
ret[isObject ? key : ret.length] = v;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue