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

make (almost all of) form demo work again

Browse source
This commit is contained in:
rolux 2011-05-12 06:15:01 +02:00
parent b0e5e906f5
commit c5408a6656
11 changed files with 37 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
demos/form2/css/form.css
View file

@ -8,7 +8,7 @@ body {
right: 0; right: 0;
bottom: 0; bottom: 0;
padding: 4px; padding: 4px;
background: rgb(240, 240, 240); //background: rgb(240, 240, 240);
overflow: auto; overflow: auto;
} }
.margin { .margin {

5
demos/form2/index.html
View file

@ -4,10 +4,7 @@
<title>ox.js form demo</title> <title>ox.js form demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link rel="stylesheet" type="text/css" href="css/form.css"/> <link rel="stylesheet" type="text/css" href="css/form.css"/>
<script type="text/javascript" src="../../build/js/jquery-1.4.2.js"></script> <script type="text/javascript" src="../../build/Ox.js"></script>
<script type="text/javascript" src="../../source/js/_/ox.data.js"></script>
<script type="text/javascript" src="../../build/js/Ox.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="js/form.js"></script> <script type="text/javascript" src="js/form.js"></script>
<!--<script> <!--<script>
$(function() { $(function() {

17
demos/form2/js/form.js
View file

@ -1,4 +1,5 @@
Ox.load('UI', function() { Ox.load('UI', {debug: true}, function() {
Ox.load('Geo', function() {
var $body = $("body"), var $body = $("body"),
$panel = $("<div>") $panel = $("<div>")
@ -608,7 +609,7 @@ Ox.load('UI', function() {
}, },
{ {
options: { options: {
autocomplete: $.map(Ox.getCountries(), function(v, i) { autocomplete: $.map(Ox.COUNTRIES, function(v, i) {
return v.name; return v.name;
}), }),
autocompleteReplace: true, autocompleteReplace: true,
@ -618,7 +619,7 @@ Ox.load('UI', function() {
}, },
{ {
options: { options: {
autocomplete: $.map(Ox.getCountries(), function(v, i) { autocomplete: $.map(Ox.COUNTRIES, function(v, i) {
return v.name; return v.name;
}), }),
autocompleteReplace: true, autocompleteReplace: true,
@ -629,7 +630,7 @@ Ox.load('UI', function() {
}, },
{ {
options: { options: {
autocomplete: $.map(Ox.getCountries(), function(v, i) { autocomplete: $.map(Ox.COUNTRIES, function(v, i) {
return v.name; return v.name;
}), }),
autocompleteSelect: true, autocompleteSelect: true,
@ -640,7 +641,7 @@ Ox.load('UI', function() {
}, },
{ {
options: { options: {
autocomplete: $.map(Ox.getCountries(), function(v, i) { autocomplete: $.map(Ox.COUNTRIES, function(v, i) {
return v.name; return v.name;
}), }),
autocompleteReplace: true, autocompleteReplace: true,
@ -652,7 +653,7 @@ Ox.load('UI', function() {
}, },
{ {
options: { options: {
autocomplete: $.map(Ox.getCountries(), function(v, i) { autocomplete: $.map(Ox.COUNTRIES, function(v, i) {
return v.name; return v.name;
}), }),
autocompleteReplace: true, autocompleteReplace: true,
@ -773,7 +774,8 @@ Ox.load('UI', function() {
separators: [ separators: [
{title: "", width: 0} {title: "", width: 0}
] ]
} },
title: 'foo'
}, },
{ {
options: { options: {
@ -1183,4 +1185,5 @@ Ox.load('UI', function() {
}) })
.appendTo($panel); .appendTo($panel);
});
}); });

8
source/Ox.UI/css/Ox.UI.css
View file

@ -488,12 +488,12 @@ OxButtonGroup
-webkit-border-bottom-right-radius: 2px; -webkit-border-bottom-right-radius: 2px;
} }
.OxButtonGroup > .OxButton.OxTab { .OxButtonGroup > .OxButton.OxTab {
-moz-border-radius-topleft: 4px; -moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 4px; -moz-border-radius-topright: 8px;
-moz-border-radius-bottomleft: 0; -moz-border-radius-bottomleft: 0;
-moz-border-radius-bottomright: 0; -moz-border-radius-bottomright: 0;
-webkit-border-top-left-radius: 4px; -webkit-border-top-left-radius: 8px;
-webkit-border-top-right-radius: 4px; -webkit-border-top-right-radius: 8px;
-webkit-border-bottom-left-radius: 0; -webkit-border-bottom-left-radius: 0;
-webkit-border-bottom-right-radius: 0; -webkit-border-bottom-right-radius: 0;
} }

6
source/Ox.UI/js/Core/Ox.Keyboard.js
View file

@ -60,10 +60,12 @@
key = keyNames.join('_'); key = keyNames.join('_');
if (focused !== null) { if (focused !== null) {
Ox.UI.elements[focused].triggerEvent('key_' + key); Ox.UI.elements[focused].triggerEvent('key_' + key);
// prevent Chrome from going back in history, or scrolling // prevent Chrome fromor scrolling
// fixme: backspace -> history.back, blocking it doesn't work
// when the autocomplete menu of an input element has focus
if ( if (
[ [
'backspace', 'down', 'left', 'right', 'space', 'up' 'down', 'left', 'right', 'space', 'up'
].indexOf(keyBasename) > -1 && ].indexOf(keyBasename) > -1 &&
!Ox.UI.elements[focused].hasClass('OxInput') !Ox.UI.elements[focused].hasClass('OxInput')
) { ) {

4
source/Ox.UI/js/Form/Ox.Input.js
View file

@ -363,8 +363,8 @@ Ox.Input = function(options, self) {
offset: { offset: {
left: 4, left: 4,
top: 0 top: 0
}, }
size: self.options.size //size: self.options.size
}) })
.bindEvent('click', clickMenu); .bindEvent('click', clickMenu);
if (self.options.autocompleteReplace) { if (self.options.autocompleteReplace) {

4
source/Ox.UI/js/Form/Ox.PlacePicker.js
View file

@ -122,10 +122,12 @@ Ox.PlacePicker = function(options, self) {
function showPicker() { function showPicker() {
if (!self.map) { if (!self.map) {
self.$map = new Ox.Map({ self.$map = new Ox.Map({
clickable: true,
id: self.options.id + 'Map', id: self.options.id + 'Map',
places: [self.options.value] //places: [self.options.value]
}) })
.css({ .css({
top: '16px',
width: '256px', width: '256px',
height: '160px' height: '160px'
}) })

4
source/Ox.UI/js/Map/Ox.Map.js
View file

@ -944,10 +944,10 @@ Ox.Map = function(options, self) {
function updateFormElements() { function updateFormElements() {
var width = that.width(); var width = that.width();
self.$zoomInput && constructZoomInput(); self.$zoomInput && constructZoomInput();
self.$placeNameInput.options({ self.$placeNameInput && self.$placeNameInput.options({
width: Math.floor((width - 112) / 2) width: Math.floor((width - 112) / 2)
}); });
self.$placeGeonameInput.options({ self.$placeGeonameInput && self.$placeGeonameInput.options({
width: Math.ceil((width - 112) / 2) width: Math.ceil((width - 112) / 2)
}); });
} }

4
source/Ox.UI/js/Menu/Ox.Menu.js
View file

@ -20,7 +20,7 @@
select_menuId {id, value} item was selected select_menuId {id, value} item was selected
*/ */
Ox.Menu = function(options, self) { Ox.Menu = function(options, self) {
Ox.print(options)
var self = self || {}, var self = self || {},
that = new Ox.Element({}, self) that = new Ox.Element({}, self)
.defaults({ .defaults({
@ -35,7 +35,7 @@ Ox.Menu = function(options, self) {
parent: null, parent: null,
selected: -1, selected: -1,
side: 'bottom', side: 'bottom',
size: 'medium', size: 'medium' // fixme: remove
}) })
.options(options || {}) .options(options || {})
.addClass( .addClass(

7
source/Ox.UI/themes/classic/css/classic.css
View file

@ -133,7 +133,14 @@ Forms
//background: -webkit-gradient(linear, left top, left bottom, from(rgb(128, 128, 128)), color-stop(0.1, rgb(160, 160, 160)), to(rgb(192, 192, 192))); //background: -webkit-gradient(linear, left top, left bottom, from(rgb(128, 128, 128)), color-stop(0.1, rgb(160, 160, 160)), to(rgb(192, 192, 192)));
color: rgb(32, 32, 32); color: rgb(32, 32, 32);
} }
.OxThemeClassic .OxButton.OxTab {
//background: -moz-linear-gradient(top, rgb(160, 160, 160), rgb(192, 192, 192));
//background: -webkit-linear-gradient(top, rgb(160, 160, 160), rgb(192, 192, 192));
}
.OxThemeClassic .OxButton.OxTab.OxSelected { .OxThemeClassic .OxButton.OxTab.OxSelected {
//background: -moz-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192));
//background: -webkit-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192));
border-bottom: 1px solid rgb(192, 192, 192); border-bottom: 1px solid rgb(192, 192, 192);
} }

2
source/Ox.js
View file

@ -4076,7 +4076,7 @@ Ox.toTitleCase = function(str) {
v = v.substr(0, 1).toUpperCase() + low; v = v.substr(0, 1).toUpperCase() + low;
} }
return v; return v;
}).join(" "); }).join(' ');
}; };
/*@ /*@