fire select list event after timeout

This commit is contained in:
rolux 2010-07-17 10:46:27 +02:00
parent 6693a3996e
commit 32ff49402e
2 changed files with 107 additions and 54 deletions

View file

@ -55,6 +55,9 @@ Bars
white-space: nowrap;
}
.OxResizebar {
z-index: 2;
}
.OxResizebar.OxHorizontal {
width: 100%;
height: 5px;

View file

@ -827,8 +827,8 @@ requires
$element = that.$element;
}
*/
// why does this not work?
// ret = that.$element[v].apply(this, arguments);
// why does this not work? (that?)
// ret = that.$element[fn].apply(this, arguments);
if (length == 0) {
ret = that.$element[fn]();
} else if (length == 1) {
@ -1272,12 +1272,11 @@ requires
self.startSize = self.options.size;
Ox.print("startSize", self.startSize)
$window.mousemove(drag);
$window.mouseup(dragStop);
$window.one("mouseup", dragStop);
}
function dragStop() {
$window.unbind("mousemove");
$window.unbind("mouseup");
}
function toggle() {
@ -2790,11 +2789,7 @@ requires
self.$items[pos].addClass("OxSelected");
}
Ox.print("addToSelection")
that.triggerEvent("select", {
ids: $.map(self.selected, function(v, i) {
return self.ids[v];
})
});
triggerSelectEvent();
}
}
@ -2838,11 +2833,7 @@ requires
if (!Ox.isUndefined(self.$items[pos])) {
self.$items[pos].removeClass("OxSelected");
}
that.triggerEvent("select", {
ids: $.map(self.selected, function(v, i) {
return self.ids[v];
})
});
triggerSelectEvent();
}
}
@ -3129,6 +3120,24 @@ requires
}
}
function triggerSelectEvent() {
var ids = $.map(self.selected, function(v, i) {
return self.ids[v];
});
setTimeout(function() {
var ids_ = $.map(self.selected, function(v, i) {
return self.ids[v];
});
if (ids.length == ids_.length && (ids.length == 0 || ids[0] == ids_[0])) {
that.triggerEvent("select", {
ids: ids
});
} else {
Ox.print("select event not triggered after timeout")
}
}, 100);
}
function unloadPage(page) {
if (page < 0 || page >= self.pages) {
return;
@ -4606,13 +4615,25 @@ requires
----------------------------------------------------------------------------
Ox.SplitPanel
options:
elements: [{ array of one, two or three elements
collapsible: false, collapsible or not (only for outer elements)
collapsed: false, collapsed or not (only for collapsible elements)
element: {}, OxElement (if any element is resizable or
collapsible, all OxElements must have an id)
resizable: false, resizable or not (only for outer elements)
resize: [], array of sizes (only for resizable elements,
first value is min, last value is max,
other values are "snappy" points in between)
size: 0 size in px (one element must have no size)
}],
orientation: "" "horizontal" or "vertical"
elements: [{
element, Ox Element
size: 0, size in px
resizable: false resizable or not
}]
methods:
isCollapsed(id) element is collapsed or not
resize(id, size) resize element to size px
toggle(id) collapse or expand element
events:
resize
toggle
----------------------------------------------------------------------------
*/
@ -4625,51 +4646,52 @@ requires
orientation: "horizontal"
})
.options(options || {})
.addClass("OxSplitPanel"),
length = self.options.elements.length,
dimensions = oxui.getDimensions(self.options.orientation),
edges = oxui.getEdges(self.options.orientation);
.addClass("OxSplitPanel");
$.extend(self, {
dimensions: oxui.getDimensions(self.options.orientation),
edges: oxui.getEdges(self.options.orientation),
length: self.options.elements.length
});
that.$elements = [];
$.each(self.options.elements, function(i, v) {
if (Ox.isUndefined(v.collapsible)) {
v.collapsible = false;
}
if (Ox.isUndefined(v.resizable)) {
v.resizable = false;
}
self.options.elements[i] = $.extend({
collapsible: false,
collapsed: false,
resizable: false,
resize: [],
size: "auto"
}, v);
that.$elements[i] = v.element
.css(edges[2], 0)
.css(edges[3], 0);
.css(self.edges[2], 0)
.css(self.edges[3], 0);
});
setSizes();
$.each(self.options.elements, function(i, v) {
//that.append(element)
Ox.print("V: ", v)
that.$elements[i].appendTo(that); // fixme: that.$content
if (v.collapsible || v.resizable) {
Ox.print("v.size", v.size)
$resizebar = new Ox.Resizebar({
var $resizebar = new Ox.Resizebar({
collapsible: v.collapsible,
edge: self.options.orientation == "horizontal" ?
(i == 0 ? "left" : "right") : (i == 0 ? "top" : "bottom"),
edge: self.edges[i == 0 ? 0 : 1],
elements: i < 2 ?
[that.$elements[0], that.$elements[1]] :
[that.$elements[1], that.$elements[2]],
id: v.element.options("id"),
orientation: self.options.orientation == "horizontal" ? "vertical" : "horizontal",
parent: that, // fixme: that.$content
resizable: v.resizable,
resize: v.resize,
size: v.size
})
.css(edges[i == 0 ? 0 : 1], v.size);
if (i == 0) {
$resizebar.appendTo(that);
} else {
$resizebar.prependTo(that); // fixme: that.$content
}
.css(self.edges[i == 0 ? 0 : 1], v.size);
$resizebar[i == 0 ? "insertAfter" : "insertBefore"](that.$elements[i]);
}
});
@ -4677,7 +4699,7 @@ requires
var position = -1;
$.each(self.options.elements, function(i, element) {
if (element.element.options("id") == id) {
position = 1;
position = i;
return false;
}
});
@ -4690,28 +4712,32 @@ requires
function setSizes() {
$.each(self.options.elements, function(i, v) {
!Ox.isUndefined(v.size) && that.$elements[i].css(dimensions[0], v.size + "px");
v.size != "auto" && that.$elements[i].css(self.dimensions[0], v.size + "px");
if (i == 0) {
that.$elements[i].css(edges[0], 0);
!Ox.isUndefined(v.size) && that.$elements[i].css(
edges[1], (getSize(self.options.elements[1]) + (length == 3 ? getSize(self.options.elements[2]) : 0)) + "px"
that.$elements[i].css(self.edges[0], 0);
v.size != "auto" && 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) {
!Ox.isUndefined(self.options.elements[0].size) && that.$elements[i].css(
edges[0], getSize(self.options.elements[0]) + "px"
self.options.elements[0].size != "auto" && that.$elements[i].css(
self.edges[0], getSize(self.options.elements[0]) + "px"
);
(!Ox.isUndefined(self.options.elements[0].size) || !Ox.isUndefined(v.size)) && that.$elements[i].css(
edges[1], (length == 3 ? getSize(self.options.elements[2]) : 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(edges[1], 0);
!Ox.isUndefined(v.size) && that.$elements[i].css(
edges[0], (getSize(self.options.elements[0]) + getSize(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.isCollapsed = function(id) {
return self.options.elements[getPositionById(id)].collapsed;
};
that.resize = function(id, size) {
// one can pass pos instead of id
var pos = Ox.isNumber(id) ? id : getPositionById(id);
@ -4721,6 +4747,30 @@ requires
return that;
};
that.toggle = function(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 = getPositionById(id),
size = self.options.elements[pos].collapsed ? 0 : self.options.elements[pos].size,
animate = {};
animate[self.edges[pos == 0 ? 0 : 1]] = size;
self.options.parent.animate(animate, 200, function() {
var i = (self.options.edge == "left" || self.options.edge == "top") ? 1 : 0;
Ox.Event.trigger("resize_" + id, self.options.elements[i][self.dimensions[1]]());
self.options.elements[pos].collapsed = !self.options.elements[pos].collapsed;
});
};
return that;
};