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

filter rewrite, element update

Browse source
This commit is contained in:
rlx 2011-06-02 03:02:16 +00:00
parent d660e0e30a
commit a96f6fdfd1
2 changed files with 118 additions and 84 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
source/Ox.UI/js/Core/Ox.Element.js
View file

@ -106,7 +106,10 @@ Ox.Element = function() {
function bind(action, event, fn) {
self.$eventHandler[action]('ox_' + event, function(event, data) {
// fixme: remove second parameter
fn(Ox.extend({_event: event}, data), data);
fn(Ox.extend({
_element: that.$element,
_event: event
}, data), data);
});
}

165
source/Ox.UI/js/Form/Ox.Filter.js
View file

@ -227,31 +227,37 @@ Ox.Filter = function(options, self) {
}
function changeConditionKey(pos, subpos, key) {
subpos = Ox.isUndefined(subpos) ? -1 : subpos;
Ox.print('changeConditionKey', pos, subpos, key);
var oldOperator = self.options.query.conditions[pos].operator,
oldType = Ox.getObjectById(
self.options.findKeys, self.options.query.conditions[pos].key
).type,
newType = Ox.getObjectById(
self.options.findKeys, key
).type,
var condition = subpos == -1
? self.options.query.conditions[pos]
: self.options.query.conditions[pos].conditions[subpos],
oldOperator = condition.operator,
oldType = Ox.getObjectById(self.options.findKeys, condition.key).type,
newType = Ox.getObjectById(self.options.findKeys, key).type,
oldConditionType = getConditionType(oldType),
newConditionType = getConditionType(newType);
changeConditionType = oldConditionType != newConditionType;
Ox.print('old new', oldConditionType, newConditionType)
self.options.query.conditions[pos].key = key;
condition.key = key;
if (changeConditionType) {
self.$conditions[pos].replaceElement(1, constructConditionOperator(pos, oldOperator));
renderConditions();
//self.$conditions[pos].replaceElement(1, constructConditionOperator(pos, oldOperator));
}
}
function changeConditionOperator(pos, operator) {
var oldOperator = self.options.query.conditions[pos].operator;
self.options.query.conditions[pos].operator = operator;
if (oldOperator.indexOf('-') == -1 && operator.indexOf('-') > -1) {
self.$conditions[pos].replaceElement(2, constructInput(true));
} else if (oldOperator.indexOf('-') > -1 && operator.indexOf('-') == -1) {
self.$conditions[pos].replaceElement(2, constructInput());
function changeConditionOperator(pos, subpos, operator) {
subpos = Ox.isUndefined(subpos) ? -1 : subpos;
var condition = subpos == -1
? self.options.query.conditions[pos]
: self.options.quert.conditions[pos].conditions[subpos],
oldOperator = condition.operator
condition.operator = operator;
if (
(oldOperator.indexOf('-') == -1 && operator.indexOf('-') > -1)
|| (oldOperator.indexOf('-') > -1 && operator.indexOf('-') == -1)
) {
renderConditions();
}
}
@ -260,32 +266,6 @@ Ox.Filter = function(options, self) {
that.$element.find('.OxGroupLabel').html(self.options.query.operator == '&' ? 'and' : 'or');
}
function constructConditionOperator(pos, subpos, selected) {
subpos = Ox.isUndefined(subpos) ? -1 : subpos;
Ox.print('constructConditionOperator', pos, subpos)
var condition = subpos == -1
? self.options.query.conditions[pos]
: self.options.query.conditions[pos].conditions[subpos];
return Ox.Select({
items: $.map(self.conditionOperators[getConditionType(
Ox.getObjectById(self.options.findKeys, condition.key).type
)], function(operator) {
return {
checked: operator.id == selected, // fixme: should be "selected", not "checked"
id: operator.id,
title: operator.title
};
}),
overlap: 'right',
width: 128
})
.bindEvent({
change: function(event, data) {
changeConditionOperator(/*$condition.data('position')*/ pos, data.selected[0].id)
}
});
}
function constructInput(isBetween) {
var $input;
if (!isBetween) {
@ -336,6 +316,7 @@ Ox.Filter = function(options, self) {
}
function renderButtons(pos, subpos) {
subpos = Ox.isUndefined(subpos) ? -1 : subpos;
var isGroup = subpos == -1 && self.options.query.conditions[pos].conditions;
return Ox.merge([
new Ox.Button({
@ -345,13 +326,18 @@ Ox.Filter = function(options, self) {
type: 'image'
})
.css({margin: '0 4px 0 ' + (isGroup ? '296px' : '8px')})
.bind({
click: function() {
.bindEvent({
click: function(data) {
Ox.print('remove...', data)
if (data._element.parent().data('subposition') == -1) {
removeCondition(data._element.parent().data('position'));
} else {
removeCondition(
$(this).parent().data('position'),
$(this).parent().data('subposition')
data._element.parent().data('position'),
data._element.parent().data('subposition')
);
}
}
}),
Ox.Button({
id: 'add',
@ -359,14 +345,15 @@ Ox.Filter = function(options, self) {
type: 'image'
})
.css({margin: '0 ' + (subpos == -1 ? '4px' : '0') + ' 0 4px'})
.bind({
click: function() {
if (subpos == -1) {
addCondition($(this).parent().data('position') + 1);
.bindEvent({
click: function(data) {
Ox.print('add...', data, data._element.parent().data('position'), data._element.parent().data('subposition'))
if (data._element.parent().data('subposition') == -1) {
addCondition(data._element.parent().data('position') + 1);
} else {
addCondition(
$(this).parent().data('position'),
$(this).parent().data('subposition') + 1
data._element.parent().data('position'),
data._element.parent().data('subposition') + 1
);
}
}
@ -378,9 +365,9 @@ Ox.Filter = function(options, self) {
type: 'image'
})
.css({margin: '0 0 0 4px'})
.bind({
click: function() {
addCondition($(this).parent().data('position') + 1, -1, true)
.bindEvent({
click: function(data) {
addCondition(data._element.parent().data('position') + 1, -1, true)
}
})
] : []);
@ -388,12 +375,26 @@ Ox.Filter = function(options, self) {
function renderCondition(condition, pos, subpos) {
subpos = Ox.isUndefined(subpos) ? -1 : subpos;
var condition = subpos == -1
? self.options.query.conditions[pos]
: self.options.query.conditions[pos].conditions[subpos];
Ox.print('renderCondition', condition, pos, subpos)
var $condition = Ox.FormElementGroup({
return Ox.FormElementGroup({
elements: Ox.merge([
Ox.Select({
renderConditionKey(condition),
renderConditionOperator(condition),
renderConditionValue(condition)
], renderButtons(pos, subpos))
})
.css({marginLeft: subpos == -1 ? 0 : '24px'})
.data({position: pos, subposition: subpos});
}
function renderConditionKey(condition) {
return Ox.Select({
items: $.map(self.options.findKeys, function(key) {
return {
checked: key.id == condition.key,
id: key.id,
title: key.title
};
@ -403,22 +404,52 @@ Ox.Filter = function(options, self) {
width: 128
})
.bindEvent({
change: function(event, data) {
Ox.print('event', event)
change: function(data) {
Ox.print('changeKey', data)
changeConditionKey(
$condition.data('position'),
$condition.data('subposition'),
data._element.parent().data('position'),
data._element.parent().data('subposition'),
data.selected[0].id
);
}
});
}
function renderConditionOperator(condition) {
return Ox.Select({
items: $.map(self.conditionOperators[getConditionType(
Ox.getObjectById(self.options.findKeys, condition.key).type
)], function(operator) {
return {
checked: operator.id == condition.operator, // fixme: should be "selected", not "checked"
id: operator.id,
title: operator.title
};
}),
constructConditionOperator(pos, subpos),
constructInput()
], renderButtons(pos, subpos))
overlap: 'right',
width: 128
})
.css({marginLeft: subpos == -1 ? 0 : '24px'})
.data({position: pos, subpostion: subpos});
return $condition;
.bindEvent({
change: function(data) {
changeConditionOperator(
data._element.parent().data('position'),
data._element.parent().data('subposition'),
data.selected[0].id
);
}
});
}
function renderConditionValue(condition) {
return Ox.Input({
value: condition.value,
width: 288
})
.bindEvent({
change: function(data) {
}
});
}
function renderConditions() {