diff --git a/source/Ox.UI/css/Ox.UI.css b/source/Ox.UI/css/Ox.UI.css index 9116b6d0..6ec83b5c 100644 --- a/source/Ox.UI/css/Ox.UI.css +++ b/source/Ox.UI/css/Ox.UI.css @@ -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 diff --git a/source/Ox.UI/js/Form/Ox.Input.js b/source/Ox.UI/js/Form/Ox.Input.js index 76bdb6dd..918e5180 100644 --- a/source/Ox.UI/js/Form/Ox.Input.js +++ b/source/Ox.UI/js/Form/Ox.Input.js @@ -47,6 +47,7 @@ Ox.Input Input Element //trackStep number, 0 for 'scroll here', positive for step trackValues boolean serialize function used to serialize value in submit + style 'rounded' or 'square' textAlign 'left', 'center' or 'right' type 'float', 'int', 'password', 'text', 'textarea' value 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(); diff --git a/source/Ox.UI/themes/classic/css/classic.css b/source/Ox.UI/themes/classic/css/classic.css index eae423ac..b4211077 100644 --- a/source/Ox.UI/themes/classic/css/classic.css +++ b/source/Ox.UI/themes/classic/css/classic.css @@ -183,6 +183,7 @@ Forms border-bottom: 1px solid rgb(192, 192, 192); } + .OxThemeClassic .OxFormMessage { color: rgb(192, 64, 64); } diff --git a/source/Ox.js b/source/Ox.js index 0dbc5d54..0011cad3 100644 --- a/source/Ox.js +++ b/source/Ox.js @@ -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 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 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 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'}}) diff --git a/tests/index.html b/tests/index.html index 82b07bc6..2cf3514d 100644 --- a/tests/index.html +++ b/tests/index.html @@ -4,7 +4,7 @@ Ox.js Tests - + diff --git a/tests/tests.js b/tests/tests.js index a2b2c23b..1fe69f9e 100644 --- a/tests/tests.js +++ b/tests/tests.js @@ -14,27 +14,75 @@ Ox.load('UI', function() { fontSize: '16px', fontWeight: 'bold' }) - .appendTo($('body')); + .appendTo($body); colors = [ ['255, 64, 64', '224, 32, 32', '240, 16, 16'], ['64, 192, 64', '32, 160, 32', '40, 176, 48'], ['96, 96, 255', '64, 64, 224', '80, 80, 240'] - ], - gradients = [ - '-moz-linear-gradient(', - '-webkit-gradient(linear, ' ]; setBackground($tests, true); - tests(['../build/js/Ox.js'/*, '../build/js/ox.data.js'*/]); + tests(['../build/Ox.js'/*, '../build/js/ox.data.js'*/]); function tests() { var succeeded = 0, failed = 0, lines, spaces, command, expected, result, success, replace = ['', ''], fns = [], $test Ox.forEach(Ox.isArray(arguments[0]) ? arguments[0] : arguments, function(script, i) { - Ox.print(script, Ox) + Ox.test(script, function(results) { + var tests = {}; + results.forEach(function(result) { + tests[result.section] = tests[result.section] || {}; + tests[result.section][result.name] = tests[result.section][result.name] || []; + tests[result.section][result.name].push(result); + }); + Ox.print('tests', tests) + Ox.forEach(tests, function(functions, section) { + Ox.Bar({size: 14}) + .css({padding: '1px 0 1px 4px'}) + .html(Ox.basename(script) + ' ' + section) + .appendTo($body); + Ox.forEach(functions, function(arr, fn) { + var $test = Ox.CollapsePanel({ + collapsed: true, + title: fn + '()' + }) + .appendTo($body); + setBackground($test.find('.OxBar'), true); + arr.forEach(function(test) { + succeeded += test.success; + failed += !test.success; + $tests.html( + (succeeded + failed) + ' tests, ' + + succeeded + ' succeeded, ' + failed + ' failed' + ); + if (!test.success) { + setBackground($tests, false); + setBackground($test.find('.OxBar'), false); + } + Ox.Element() + .css({ + padding: '2px 0 2px 4px', + background: 'rgb(' + colors[+test.success][2] + ')' + }) + .html( + '' + + Ox.encodeHTML(test.statement) + ' ' + + (test.success ? '=' : '!') + '=> ' + + Ox.encodeHTML(test.expected) + + (test.success ? '' : ' ==> ' + Ox.encodeHTML(test.actual)) + + '' + ) + .appendTo($test.$content); + }); + $test.$content.css({ + marginTop: -$test.$content.height() + 'px' + }); + }); + }); + }) + /* $.get(script, function(data) { Ox.print(script, Ox) new Ox.Bar({size: 17}) @@ -62,10 +110,8 @@ Ox.load('UI', function() { result = eval(command); if (fn) { fn = fn[fn.length - 1]; - /* success = typeof expected == 'object' ? expected.toString() == result.toString() : expected === result; - */ Ox.print('command:', command, 'expected:', expected, 'result:', result) success = Ox.isEqual(expected, result); succeeded += success; @@ -84,7 +130,6 @@ Ox.load('UI', function() { .appendTo($body); setBackground($test.find('.OxBar'), true); } - ///* new Ox.Bar({size:17}) // fixme: Ox.Object() used to work .css({ //padding: '2px 0 2px 8px', @@ -97,36 +142,28 @@ Ox.load('UI', function() { (success ? '' : ' ==> ' + Ox.encodeHTML(JSON.stringify(result))) + '' ) .appendTo($test.$content); - //*/ - // to be fixed in ui: - // /* $test.$content .css({ marginTop: -$test.$content.height() + 'px' }); - //*/ - // /* - if (!success) { - setBackground($test.find('.OxBar'), success); - } - //*/ } else { replace = command.split(' = ') } } }); }, 'html'); + */ }); } //}); function setBackground($element, success) { - $.each(gradients, function(i, v) { + ['-moz-linear-gradient', '-webkit-linear-gradient'].forEach(function(v) { $element.css({ - background: v + 'left top, left bottom, from(rgb(' + - colors[+success][0] + ')), to(rgb(' + - colors[+success][1] + ')))' + background: v + '(top, rgb(' + + colors[+success][0] + '), rgb(' + + colors[+success][1] + '))' }); }); }