add Ox.Editable

This commit is contained in:
rolux 2011-08-12 23:00:42 +02:00
commit db4b33cf24
6 changed files with 121 additions and 48 deletions

View file

@ -457,6 +457,7 @@ textarea.OxSquare {
-moz-border-radius: 0;
-webkit-border-radius: 0;
}
/*
--------------------------------------------------------------------------------
OxButton
@ -551,24 +552,6 @@ OxButtonGroup
}
/*
--------------------------------------------------------------------------------
OxForm
--------------------------------------------------------------------------------
*/
.OxFormItem {
margin-top: 8px;
}
.OxFormItem:first-child {
margin-top: 0;
}
.OxFormMessage {
//width: 100%;
height: 10px;
margin: 2px 8px 0 0;
text-align: right;
display: none;
}
/*
--------------------------------------------------------------------------------
OxCheckbox
--------------------------------------------------------------------------------
*/
@ -596,6 +579,24 @@ input.OxCheckbox {
}
/*
--------------------------------------------------------------------------------
OxForm
--------------------------------------------------------------------------------
*/
.OxFormItem {
margin-top: 8px;
}
.OxFormItem:first-child {
margin-top: 0;
}
.OxFormMessage {
//width: 100%;
height: 10px;
margin: 2px 8px 0 0;
text-align: right;
display: none;
}
/*
--------------------------------------------------------------------------------
OxInput
--------------------------------------------------------------------------------
*/
@ -624,6 +625,25 @@ input.OxInput {
border-style: solid;
float: left;
}
/*
--------------------------------------------------------------------------------
OxEditable
--------------------------------------------------------------------------------
*/
.OxEditable > .OxValue {
cursor: pointer;
padding: 0 0 0 1px;
}
.OxEditable div.OxInput {
height: 14px;
padding: 0 1px 0 0;
}
.OxEditable input.OxInput {
height: 14px;
padding: 0 1px 0 0;
border: 0;
}
/*
--------------------------------------------------------------------------------
OxInputGroup

View file

@ -47,6 +47,7 @@ Ox.Input <f:Ox.Element> Input Element
//trackStep <n> number, 0 for 'scroll here', positive for step
trackValues <b> boolean
serialize <f> function used to serialize value in submit
style <s> 'rounded' or 'square'
textAlign <s> 'left', 'center' or 'right'
type <s> 'float', 'int', 'password', 'text', 'textarea'
value <s> string
@ -76,6 +77,7 @@ Ox.Input = function(options, self) {
clear: false,
decimals: 0,
disabled: false,
height: 16,
key: '',
min: -Infinity,
max: Infinity,
@ -568,13 +570,16 @@ Ox.Input = function(options, self) {
}
// fixme: for some reason, if options.type is set, no change event fires
// as a workaround, blur sends a value. remove later...
that.triggerEvent('blur', {
!self.cancelled && that.triggerEvent('blur', {
value: self.options.value
});
}
function cancel() {
self.$input.blur();
self.cancelled = true;
self.$input.blur().val(self.originalValue);
self.cancelled = false;
that.triggerEvent('cancel');
}
function change() {
@ -648,6 +653,7 @@ Ox.Input = function(options, self) {
) {
return;
}
self.originalValue = self.options.value;
that.gainFocus();
that.is('.OxError') && that.removeClass('OxError');
self.options.placeholder && setPlaceholder();

View file

@ -183,6 +183,7 @@ Forms
border-bottom: 1px solid rgb(192, 192, 192);
}
.OxThemeClassic .OxFormMessage {
color: rgb(192, 64, 64);
}

View file

@ -28,6 +28,13 @@ Some conventions:
ret return value
v value (of a key/value pair)
val value (of a key/value pair)
Indentation
var a = 1,
b = 2,
c = 3;
Obj.fn1()
.fn2()
.fn3();
*/
// todo: check http://ejohn.org/blog/ecmascript-5-strict-mode-json-and-more/
@ -760,8 +767,8 @@ Ox.max <f> Returns the maximum value of a collection
> Ox.max('123')
3
@*/
Ox.max = function(obj) {
return Math.max.apply(Math, Ox.values(obj));
Ox.max = function(col) {
return Math.max.apply(Math, Ox.values(col));
};
/*@
@ -773,8 +780,8 @@ Ox.min <f> Returns the minimum value of a collection
> Ox.min('123')
1
@*/
Ox.min = function(obj) {
return Math.min.apply(Math, Ox.values(obj));
Ox.min = function(col) {
return Math.min.apply(Math, Ox.values(col));
};
/*@
@ -4594,6 +4601,8 @@ Ox.isEqual <function> Returns true if two values are equal
false
> Ox.isEqual(0, 0)
true
> Ox.isEqual({}, {})
true
> Ox.isEqual({a: 1, b: 2, c: 3}, {c: 3, b: 2, a: 1})
true
> Ox.isEqual({a: 1, b: [2, 3], c: {d: '4'}}, {a: 1, b: [2, 3], c: {d: '4'}})