allow for splitpanels to load with elements in collapsed state, and for splitpanel elements to be replaced with splitpanels that have collapsed elements

This commit is contained in:
rlx 2011-01-03 18:52:18 +00:00
parent 106a7f7c9c
commit 2f336f4f5c

View File

@ -1451,6 +1451,7 @@ requires
});
if (self.options.size != size) {
that.css(self.edges[self.leftOrTop ? 2 : 3], self.options.size + 'px');
// fixme: send {size: x}, not x
if (self.leftOrTop) {
self.options.elements[0]
.css(self.dimensions[1], self.options.size + 'px')
@ -1458,7 +1459,7 @@ requires
self.options.elements[1]
.css(self.edges[2], (self.options.size + 1) + 'px')
.triggerEvent('resize', self.options.elements[1][self.dimensions[1]]());
self.options.parent.updateSize(self.ids[0], self.options.size);
self.options.parent.updateSize(0, self.options.size);
} else {
self.options.elements[0]
.css(self.edges[3], (self.options.size + 1) + 'px')
@ -1466,7 +1467,7 @@ requires
self.options.elements[1]
.css(self.dimensions[1], self.options.size + 'px')
.triggerEvent('resize', self.options.size);
self.options.parent.updateSize(self.ids[1], self.options.size); // fixme: listen to event instead?
self.options.parent.updateSize(1, self.options.size); // fixme: listen to event instead?
}
}
}
@ -9105,10 +9106,9 @@ requires
$resizebars: []
});
// create elements
that.$elements = [];
$.each(self.options.elements, function(i, v) {
Ox.print('$$$$ v', v)
self.options.elements.forEach(function(v, i) {
self.options.elements[i] = $.extend({
collapsible: false,
collapsed: false,
@ -9117,11 +9117,12 @@ requires
size: 'auto'
}, v);
that.$elements[i] = v.element
.css(self.edges[2], 0)
.css(self.edges[3], 0);
.css(self.edges[2], (parseInt(v.element.css(self.edges[2])) || 0) + 'px')
.css(self.edges[3], (parseInt(v.element.css(self.edges[3])) || 0) + 'px');
});
$.each(self.options.elements, function(i, v) {
// create resizebars
self.options.elements.forEach(function(v, i) {
//that.append(element)
//Ox.print('V: ', v, that.$elements[i])
var index = i == 0 ? 0 : 1;
@ -9147,7 +9148,13 @@ requires
}
});
setSizes();
self.options.elements.forEach(function(v, i) {
v.collapsed && that.css(
self.edges[i == 0 ? 0 : 1], -self.options.elements[i].size + 'px'
);
});
setSizes(true);
function getPositionById(id) {
var position = -1;
@ -9162,34 +9169,43 @@ requires
}
function getSize(element) {
return element.size + element.resizable;
return element.size + (element.collapsible || element.resizable);
//return (element.size + (element.collapsible || element.resizable)) * !element.collapsed;
}
function setSizes() {
$.each(self.options.elements, function(i, v) {
function getVisibleSize(element) {
return getSize(element) * !element.collapsed;
}
function setSizes(init) {
self.options.elements.forEach(function(v, i) {
var edges = [
(init && parseInt(that.$elements[i].css(self.edges[0]))) || 0,
(init && parseInt(that.$elements[i].css(self.edges[1]))) || 0
];
v.size != 'auto' && that.$elements[i].css(self.dimensions[0], v.size + 'px');
if (i == 0) {
that.$elements[i].css(self.edges[0], 0);
that.$elements[i].css(
self.edges[0], edges[0] + 'px'
);
that.$elements[i].css(
self.edges[1], (getSize(self.options.elements[1]) + (length == 3 ? getSize(self.options.elements[2]) : 0)) + 'px'
);
} else if (i == 1) {
that.$elements[i].css(
self.edges[0], 'auto'
);
self.options.elements[0].size != 'auto' && that.$elements[i].css(
self.edges[0], getSize(self.options.elements[0]) + 'px'
self.edges[0], self.options.elements[0].size == 'auto' ? 'auto' :
edges[0] + getSize(self.options.elements[0]) + 'px'
);
(self.options.elements[0].size != 'auto' || v.size != 'auto') && that.$elements[i].css(
self.edges[1], (self.length == 3 ? getSize(self.options.elements[2]) : 0) + 'px'
);
} else {
that.$elements[i].css(
self.edges[0], 'auto'
self.edges[0], v.size == 'auto' ? 'auto' :
(getVisibleSize(self.options.elements[0]) + getVisibleSize(self.options.elements[1])) + 'px'
);
that.$elements[i].css(self.edges[1], 0);
v.size != 'auto' && that.$elements[i].css(
self.edges[0], (getSize(self.options.elements[0]) + getSize(self.options.elements[1])) + 'px'
that.$elements[i].css(
self.edges[1], edges[1] + 'px'
);
}
if (v.collapsible || v.resizable) {
@ -9211,8 +9227,8 @@ requires
self.options.elements[pos].element.replaceWith(element.$element.$element || element.$element);
self.options.elements[pos].element = element;
that.$elements[pos] = element
.css(self.edges[2], 0)
.css(self.edges[3], 0);
.css(self.edges[2], (parseInt(element.css(self.edges[2])) || 0) + 'px')
.css(self.edges[3], (parseInt(element.css(self.edges[3])) || 0) + 'px');
setSizes();
self.$resizebars.forEach(function($resizebar, i) {
$resizebar.options({
@ -9256,12 +9272,9 @@ requires
// one can pass pos instead of id
var pos = Ox.isNumber(id) ? id : getPositionById(id),
element = self.options.elements[pos];
Ox.print('pos', pos, 'size', size);
if (arguments.length == 1) {
Ox.print('get size', self.options.id, id, element.element[self.dimensions[0]]() * !that.isCollapsed(pos))
return element.element[self.dimensions[0]]() * !that.isCollapsed(pos);
} else {
Ox.print('set size', self.options.id, id, size)
element.size = size;
setSizes();
return that;
@ -9271,17 +9284,6 @@ requires
that.toggle = function(id) {
// one can pass pos instead of id
Ox.print('toggle', id);
/*
// something like this is needed to load in collapsed state
if (Ox.isUndefined(self.options.position)) {
self.options.position = parseInt(self.options.parent.css(self.options.edge)) +
(self.options.collapsed ? self.options.size : 0);
}
var size = self.options.position -
(self.options.collapsed ? 0 : self.options.size),
animate = {};
Ox.print('s.o.e', self.options.edge);
*/
var pos = Ox.isNumber(id) ? id : getPositionById(id),
element = self.options.elements[pos],
value = parseInt(that.css(self.edges[pos == 0 ? 0 : 1])) +
@ -9289,7 +9291,7 @@ requires
(element.collapsed ? 1 : -1),
animate = {};
animate[self.edges[pos == 0 ? 0 : 1]] = value;
Ox.print('animate', animate, 'value', value)
Ox.print('animate', animate)
that.animate(animate, 200, function() {
element.collapsed = !element.collapsed;
element.element.triggerEvent('toggle', {
@ -9303,11 +9305,9 @@ requires
});
};
that.updateSize = function(id, size) {
that.updateSize = function(pos, size) {
// this is called from resizebar
// one can pass pos instead of id
Ox.print('updateSize', self.options.id, id, size);
var pos = Ox.isNumber(id) ? id : getPositionById(id);
var 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;
}
@ -9371,7 +9371,7 @@ requires
that.animate({
opacity: 0
}, 250, function() {
!self.isRunning && clear();
self.isRunning && clear();
self.isRunning = false;
});
return that;