1
0
Fork 0
forked from 0x2620/oxjs

update css for classic theme

This commit is contained in:
Rolux 2010-07-05 09:09:34 +02:00
commit 9eb96ea54c
8 changed files with 417 additions and 47 deletions

View file

@ -2321,8 +2321,8 @@ requires
})
.options(options)
.addClass("OxSelect Ox" + Ox.toTitleCase(self.options.size));
self.buttonId = self.options.id + "_button"
self.groupId = self.options.id + "_group"
self.buttonId = self.options.id + "_button";
self.groupId = self.options.id; // + "_group"
self.menuId = self.options.id + "_menu",
$.each(self.options.items, function(i, item) {
@ -2398,6 +2398,177 @@ requires
============================================================================
*/
Ox.IconList = function(options, self) {
var self = self || {},
that = new Ox.Element({}, self)
.defaults({
id: "",
item: function() {},
keys: [],
orientation: "both",
request: function() {},
size: 128,
sort: [],
})
.options(options || {});
$.extend(self, {
itemHeight: self.options.size * 1.5,
itemWidth: self.options.size
});
that.$element = new Ox.List({
construct: constructItem,
itemHeight: self.itemHeight,
itemWidth: self.itemWidth,
keys: $,
orientation: "both",
request: function() {},
rowLength: 1,
size: 128,
type: "icon",
}, self)
.click(click)
.dblclick(dblclick)
.scroll(scroll);
function click() {
}
function constructItem(data) {
var data = self.options.item(data, self.options.sort);
return new Ox.IconItem($.extend(data, {
size: self.options.size
}));
}
function dblclick() {
}
function scroll() {
}
return that;
};
Ox.IconItem = function(options, self) {
var self = self || {}
that = new Ox.Element({}, self)
.defaults({
height: 0,
id: "",
info: "",
size: 128,
title: "",
width: 0,
url: ""
})
.options(options || {});
$.extend(self, {
height: self.options.size * 1.5,
url: oxui.path + "/png/ox.ui." + Ox.theme() + "/icon.png",
width: self.options.size + 4
});
that.css({
width: self.width + "px",
height: self.height + "px"
});
that.$icon = $("<div>")
.addClass("OxIcon")
.css({
top: self.options.size == 64 ? -70 : -128,
width: self.options.size + "px",
height: self.options.size + "px"
});
that.$iconImage = $("<img>")
.attr({
src: self.url
})
.css({
width: iconWidth + "px",
height: iconHeight + "px"
})
.mouseenter(mouseenter)
.mouseleave(mouseleave)
.one("load", function() {
that.$iconImage.attr({
src: self.options.url
});
});
that.$textBox = $("<div>")
.addClass("OxText")
.css({
top: (self.options.size / 2 + 2) + "px",
width: self.width + "px",
height: (self.options.size == 64 ? 38 : 58) + "px"
})
that.$text = $("<div>")
.html(self.options.title + "<br/><span class=\"OxInfo\">" + self.options.info + "</span>")
.mouseenter(mouseenter)
.mouseleave(mouseleave)
that.$reflection = $("<div>")
.addClass("OxReflection")
.css({
top: (self.options.size + 2) + "px",
width: self.options.size + "px",
height: (self.options.size / 2) + "px"
});
that.$reflectionImage = $("<img>")
.addClass("OxReflection")
.attr({
src: self.url
})
.css({
width: self.options.width + "px",
height: self.options.height + "px"
})
.one("load", function() {
that.$reflectionImage.attr({
src: self.options.url
});
});
that.$gradient = $("<div>")
.addClass("OxGradient")
.css({
top: (-self.options.size - 2) + "px"
});
that.append(
that.$reflection.append(
that.$reflectionImage
).append(
that.$gradientImage
)
).append(
that.$textBox.append(
that.$text
)
).append(
that.$icon.append(
that.$iconImage
)
);
function mouseenter() {
that.addClass("OxHover");
}
function mouseleave() {
that.removeClass("OxHover");
}
return that;
};
Ox.List = function(options, self) {
var self = self || {},
@ -2925,6 +3096,7 @@ requires
});
that.$element = self.options.construct(self.options.data)
.addClass("OxItem")
.attr({
id: self.options.id
})
@ -3114,7 +3286,6 @@ requires
function constructItem(data) {
var $item = $("<div>")
.addClass("OxItem")
.css({
width: Math.max(Ox.sum(self.columnWidths), that.$element.width() - oxui.scrollbarSize) + "px"
});
@ -3139,6 +3310,9 @@ requires
positions = $.map(self.visibleColumns, function(v, i) {
return self.columnPositions[i] - self.columnPositions[startPos]
});
$(".OxColumn" + Ox.toTitleCase(id)).css({
opacity: 0.1
});
that.$titles[startPos].addClass("OxDrag").css({ // fixme: why does the class not work?
cursor: "move"
});
@ -3176,6 +3350,9 @@ requires
self.visibleColumns.splice(stopPos, 0, column);
self.columnWidths.splice(stopPos, 0, width);
Ox.print("s.vC", self.visibleColumns)
$(".OxColumn" + Ox.toTitleCase(id)).css({
opacity: 1
});
that.$titles[stopPos].removeClass("OxDrag").css({
cursor: "pointer"
});
@ -4329,7 +4506,7 @@ requires
})
.options(options || {})
.attr({
src: oxui.path + "/png/ox.ui." + Ox.theme() + "/loading.png"
src: oxui.path + "/png/ox.ui." + Ox.theme() + "/loading.png" // fixme: oxui.themePath needed?
})
.addClass(
"OxLoadingIcon Ox" + Ox.toTitleCase(self.options.size)