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

improvements for list resizing, and for text lists with less items than would fit on the screen

Browse source
This commit is contained in:
rolux 2010-09-18 10:48:20 +00:00
parent 20630117bc
commit 1d98189008
1 changed files with 89 additions and 54 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

121
build/js/ox.ui.js
View file

@ -1491,19 +1491,20 @@ requires
});
function drag(e) {
var d = e[self.clientXY] - self.startPos;
var d = e[self.clientXY] - self.startPos
size = self.options.size;
self.options.size = Ox.limit(
self.startSize + d * (self.leftOrTop ? 1 : -1),
self.options.resize[0],
self.options.resize[self.options.resize.length - 1]
);
Ox.print('sS', self.startSize, 'd', d, 's.o.s', self.options.size, 'edge', self.options.edge, self.edges)
$.each(self.options.resize, function(i, v) {
if (self.options.size > v - 8 && self.options.size < v + 8) {
self.options.size = v;
return false;
}
});
if (self.options.size != size) {
that.css(self.edges[self.leftOrTop ? 2 : 3], self.options.size + 'px');
if (self.leftOrTop) {
self.options.elements[0].css(self.dimensions[1], self.options.size + 'px');
@ -1517,6 +1518,7 @@ requires
Ox.Event.trigger(self.ids[0], 'resize', self.options.elements[0][self.dimensions[1]]());
}
}
}
function dragStart(e) {
self.startPos = e[self.clientXY];
@ -5766,6 +5768,10 @@ requires
that.$element.closePreview();
};
that.resize = function() {
that.$element.resize();
}
that.sortList = function(key, operator) {
self.options.sort = [{
key: key,
@ -5996,7 +6002,7 @@ requires
updateQuery();
Ox.print('s.o', self.options)
that.addEvent(self.keyboardEvents);
$window.resize(resize);
$window.resize(that.resize);
function addAboveToSelection() {
var pos = getAbove();
@ -6104,6 +6110,35 @@ requires
}
}
function emptyFirstPage() {
Ox.print('emptyFirstPage', self.$pages);
self.$pages[0].find('.OxEmpty').remove();
}
function fillFirstPage() {
var height = getHeight(),
lastItemHeight = height % self.options.itemHeight || self.options.itemHeight,
visibleItems = Math.ceil(height / self.options.itemHeight);
if (self.$items.length < visibleItems) {
$.each(Ox.range(self.$items.length, visibleItems), function(i, v) {
var $item = new Ox.ListItem({
construct: self.options.construct,
data: {},
id: '',
position: v
});
$item.addClass('OxEmpty').removeClass('OxTarget');
if (v == visibleItems - 1) {
$item.$element.css({
height: lastItemHeight + 'px',
overflowY: 'hidden'
});
}
$item.appendTo(self.$pages[0]);
});
}
}
function findItem(e) {
var $element = $(e.target),
$item = null;
@ -6290,21 +6325,7 @@ requires
self.$items[pos].appendTo(self.$pages[page]);
});
if (self.options.type == 'text' && page == 0) {
var height = that.height() - (that.width() < that.$content.width() ? oxui.scrollbarSize : 0),
visibleItems = Math.ceil(height / self.options.itemHeight);
if (result.data.items.length < visibleItems) {
self.$pages[page].height(height).css({
overflow: 'hidden'
});
$.each(Ox.range(result.data.items.length, visibleItems), function(i, v) {
new Ox.ListItem({
construct: self.options.construct,
data: {},
id: '',
position: v
}).appendTo(self.$pages[page]);
});
}
fillFirstPage();
}
self.$pages[page].appendTo(that.$content);
!Ox.isUndefined(callback) && callback();
@ -6386,24 +6407,6 @@ requires
}
}
function resize() {
if (self.options.orientation == 'both') {
var rowLength = getRowLength(),
pageLength = self.pageLengthByRowLength[rowLength];
if (pageLength != self.pageLength) {
updateQuery();
} else if (rowLength != self.rowLength) {
self.rowLength = rowLength;
self.pageWidth = (self.options.itemWidth + self.itemMargin) * self.rowLength;
$.each(self.$pages, function(i, $page) {
$page.css({
width: self.pageWidth + 'px'
});
});
}
}
}
function scroll() {
var page = self.page;
self.scrollTimeout && clearTimeout(self.scrollTimeout);
@ -6600,7 +6603,7 @@ requires
listHeight: Math.ceil(result.data.items * (self.options.itemHeight + self.itemMargin) / self.rowLength), // fixme: should be listSize
listLength: result.data.items,
pages: Math.ceil(result.data.items / self.pageLength),
pageWidth: self.options.orientation == 'vertical' ? self.options.itemWidth :
pageWidth: self.options.orientation == 'vertical' ? 0 :
(self.options.itemWidth + self.itemMargin) * self.rowLength,
pageHeight: self.options.orientation == 'horizontal' ? 0 :
Math.ceil(self.pageLength * (self.options.itemHeight + self.itemMargin) / self.rowLength)
@ -6644,6 +6647,28 @@ requires
return that;
};
that.resize = function() {
if (self.options.orientation == 'both') {
var rowLength = getRowLength(),
pageLength = self.pageLengthByRowLength[rowLength];
if (pageLength != self.pageLength) {
updateQuery();
} else if (rowLength != self.rowLength) {
self.rowLength = rowLength;
self.pageWidth = (self.options.itemWidth + self.itemMargin) * self.rowLength;
$.each(self.$pages, function(i, $page) {
$page.css({
width: self.pageWidth + 'px'
});
});
}
} else if (self.options.type == 'text') {
Ox.print('that.resize, type==text')
emptyFirstPage();
fillFirstPage();
}
}
that.sortList = function(key, operator) {
if (key != self.options.sort[0].key || operator != self.options.sort[0].operator) {
self.options.sort[0] = {
@ -7111,18 +7136,23 @@ requires
that.$titles[pos].css({
width: (width - 9 - (i == self.selectedColumn ? 16 : 0)) + 'px'
});
that.$body.$content.find('.OxItem').css({ // fixme: can we avoid this lookup?
width: getItemWidth() + 'px'
});
that.$body.$content.css({
width: getItemWidth() + 'px' // fixme: check if scrollbar visible, and listen to resize/toggle event
});
$('.OxCell.OxColumn' + Ox.toTitleCase(self.options.columns[i].id)).css({
width: (width - 9) + 'px'
});
setWidth();
that.$body.clearCache();
}
function setWidth() {
var width = getItemWidth();
that.$body.$content.find('.OxItem').css({ // fixme: can we avoid this lookup?
width: width + 'px'
});
that.$body.$content.css({
width: width + 'px' // fixme: check if scrollbar visible, and listen to resize/toggle event
});
}
function toggleSelected(id) {
var pos = getColumnPositionById(id);
if (pos > -1) {
@ -7157,6 +7187,11 @@ requires
that.$body.closePreview();
};
that.resize = function() {
setWidth();
that.$body.resize();
}
that.resizeColumn = function(id, width) {
resizeColumn(id, width);
return that;