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

use themed mode colors for table list column head images

Browse source
This commit is contained in:
rolux 2012-12-28 18:02:50 +01:00
parent 77905dc4ea
commit 2c2b680284
1 changed files with 22 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
source/Ox.UI/js/List/TableList.js
View file

@ -409,6 +409,7 @@ Ox.TableList = function(options, self) {
var pos; var pos;
self.$heads = []; self.$heads = [];
self.$titles = []; self.$titles = [];
self.$titleImages = [];
self.$orderButtons = []; self.$orderButtons = [];
self.visibleColumns.forEach(function(column, i) { self.visibleColumns.forEach(function(column, i) {
var $resize; var $resize;
@ -449,19 +450,23 @@ Ox.TableList = function(options, self) {
}) })
.appendTo(self.$heads[i]); .appendTo(self.$heads[i]);
if (column.titleImage) { if (column.titleImage) {
self.$titles[i].append( self.$titleImages[i] = $('<img>').
$('<img>').attr({ attr({
src: Ox.UI.getImageURL('symbol' + Ox.toTitleCase(column.titleImage)) src: Ox.UI.getImageURL(
'symbol' + Ox.toTitleCase(column.titleImage)
)
}) })
); .appendTo(self.$titles[i]);
} else { } else {
self.$titles[i].html(column.title); self.$titles[i].html(column.title);
} }
if (column.operator) { if (column.operator) {
self.$orderButtons[i] = Ox.Button({ self.$orderButtons[i] = Ox.Button({
selectable: true,
style: 'symbol', style: 'symbol',
title: column.operator == '+' ? 'up' : 'down', title: column.operator == '+' ? 'up' : 'down',
type: 'image' type: 'image',
value: true
}) })
.addClass('OxOrder') .addClass('OxOrder')
.css({marginTop: (column.operator == '+' ? 1 : -1) + 'px'}) .css({marginTop: (column.operator == '+' ? 1 : -1) + 'px'})
@ -862,17 +867,27 @@ Ox.TableList = function(options, self) {
} }
function toggleSelected(id) { function toggleSelected(id) {
var pos = getColumnPositionById(id); var isSelected,
pos = getColumnPositionById(id);
if (pos > -1) { if (pos > -1) {
updateOrder(id); updateOrder(id);
pos > 0 && self.$heads[pos].prev().children().eq(2).toggleClass('OxSelected'); pos > 0 && self.$heads[pos].prev().children().eq(2).toggleClass('OxSelected');
self.$heads[pos].toggleClass('OxSelected'); self.$heads[pos].toggleClass('OxSelected');
self.$heads[pos].next().children().eq(0).toggleClass('OxSelected'); self.$heads[pos].next().children().eq(0).toggleClass('OxSelected');
isSelected = self.$heads[pos].hasClass('OxSelected');
self.$titles[pos].css({ self.$titles[pos].css({
width: self.$titles[pos].width() width: self.$titles[pos].width()
+ (self.$heads[pos].hasClass('OxSelected') ? -16 : 16) + (isSelected ? -16 : 16)
+ 'px' + 'px'
}); });
if (self.visibleColumns[pos].titleImage) {
self.$titleImages[pos].attr({
src: Ox.UI.getImageURL(
'symbol' + Ox.toTitleCase(self.visibleColumns[pos].titleImage),
isSelected ? 'selected' : ''
)
});
}
} }
} }