update example

This commit is contained in:
rlx 2012-05-28 16:15:16 +00:00
parent 2323525e25
commit d05a4d0849

View file

@ -45,7 +45,11 @@ Ox.load('UI', function() {
color: [128, 128, 128],
size: 128
})
.options(options || {});
.options(options || {})
.update({
color: setColor,
size: setSize
});
/*
Ox.Element, and every widget that inherits from it, has a private
@ -55,13 +59,6 @@ Ox.load('UI', function() {
`self.setOption` untouched. In this case though, we want to update color
and size, so we just overwrite `self.setOption`.
*/
self.setOption = function(key, value) {
if (key == 'color') {
setColor();
} else if (key == 'size') {
setSize();
}
};
/*
The following part of the "constructor" function can be thought of as
@ -141,7 +138,37 @@ Ox.load('UI', function() {
`Ox.My.Box({size: 256}).appendTo(Ox.$body).showOptions()`
*/
Ox.My.RoundedBox = function(options, self) {
self = self || {};
var that = Ox.My.Box({}, self);
that.defaults(Ox.extend(that.defaults(), {
radius: 16
}))
.options(options || {})
.update(function(key, value) {
if (key == 'radius') {
setRadius();
}
});
setRadius();
function setRadius() {
that.css({
MozBorderRadius: self.options.radius + 'px',
OBorderRadius: self.options.radius + 'px',
WebkitBorderRadius: self.options.radius + 'px'
});
}
return that;
};
window.myBox = Ox.My.Box().appendTo(Ox.$body);
window.myRoundedBox = Ox.My.RoundedBox().appendTo(Ox.$body);
return;
Ox.My.Box = function(options, self) {