sanj/oxjs
1
0
Fork 0
forked from 0x2620/oxjs
Code Pull requests Activity

some documentation

Browse source
This commit is contained in:
j 2011-05-16 10:24:46 +02:00
commit bdb8d98787
45 changed files with 775 additions and 255 deletions
Download patch file Download diff file Expand all files Collapse all files

49
source/Ox.UI/js/Form/Ox.Button.js
View file

@ -1,18 +1,29 @@
// vim: et:ts=4:sw=4:sts=4:ft=js
/*@
Ox.Button <f:Ox.Element> Button Object
() -> <f> Button Object
(options) -> <f> Button Object
(options, self) -> <f> Button Object
options <o> Options object
disabled <b|false> disabled
group <b|false> is part of group
id: <s|''> button id
overlap <s|none> overlap
selectable <b|false> is selecatable
selected <b|false> is selected
size <s|medium> button size
style <s|default> // can be default, checkbox, symbol, or tab
title <s|a|''> title, can be array of titles
tooltip <s|a|''> tooltip if multiple must be same number as titles
type <s|text> button type, text or image, (for image, title must be symbolTitle.svg must be availabe)
width <s|auto> button width
self <o> Shared private variable
click <!> non-selectable button was clicked
deselect <!> selectable button was deselected
select <!> selectable button was selected
@*/
Ox.Button = function(options, self) {
/**
methods:
toggleDisabled enable/disable button
toggleSelected select/unselect button
toggleTitle if more than one title was provided,
toggle to next title.
events:
click non-selectable button was clicked
deselect selectable button was deselected
select selectable button was selected
*/
var self = self || {},
that = new Ox.Element('<input>', self)
.defaults({
@ -137,6 +148,10 @@ Ox.Button = function(options, self) {
}
}
/*@
toggleDisabled <f>
() -> <u> toggle disabled state
@*/
that.toggleDisabled = function() {
that.options({
enabled: !self.options.disabled
@ -144,6 +159,10 @@ Ox.Button = function(options, self) {
//self.options.disabled = !self.options.disabled;
}
/*@
toggleSelected <f>
() -> <u> toggle selected state
@*/
that.toggleSelected = function() {
that.options({
selected: !self.options.selected
@ -151,6 +170,10 @@ Ox.Button = function(options, self) {
//self.options.selected = !self.options.selected;
}
/*@
toggleTitle <f>
() -> <u> toggle through titles
@*/
that.toggleTitle = function() {
self.selectedTitle = 1 - self.selectedTitle;
setTitle(self.titles[self.selectedTitle].title);

27
source/Ox.UI/js/Form/Ox.ButtonGroup.js
View file

@ -1,17 +1,20 @@
// vim: et:ts=4:sw=4:sts=4:ft=js
Ox.ButtonGroup = function(options, self) {
/*@
Ox.ButtonGroup <f:Ox.Element> ButtonGroup Object
() -> <f> ButtonGroup Object
(options) -> <f> ButtonGroup Object
(options, self) -> <f> ButtonGroup Object
options <o> Options object
buttons <a> array of buttons
max <n> integer, maximum number of selected buttons, 0 for all
min <n> integer, minimum number of selected buttons, 0 for none
selectable <b> if true, buttons are selectable
type <s> string, 'image' or 'text'
self <o> Shared private variable
change <!> {id, value} selection within a group changed
@*/
/**
options
buttons array of buttons
max integer, maximum number of selected buttons, 0 for all
min integer, minimum number of selected buttons, 0 for none
selectable if true, buttons are selectable
type string, 'image' or 'text'
methods:
events:
change {id, value} selection within a group changed
*/
Ox.ButtonGroup = function(options, self) {
var self = self || {},
that = new Ox.Element({}, self)

27
source/Ox.UI/js/Form/Ox.CheckboxGroup.js
View file

@ -1,16 +1,21 @@
// vim: et:ts=4:sw=4:sts=4:ft=js
Ox.CheckboxGroup = function(options, self) {
/*@
Ox.CheckboxGroup <f:Ox.Element> CheckboxGroup Object
() -> <f> CheckboxGroup Object
(options) -> <f> CheckboxGroup Object
(options, self) -> <f> CheckboxGroup Object
options <o> Options object
checkboxes <a|[]> array of checkboxes
max <n|1> integer
min <n|1> integer
width <n> integer, width in px
self <o> shared private variable
change <!> triggered when checked property changes
passes {checked, id, title}
@*/
/**
options
checkboxes [] array of checkboxes
max 1 integer
min 1 integer
width integer, width in px
events:
change triggered when checked property changes
passes {checked, id, title}
*/
Ox.CheckboxGroup = function(options, self) {
var self = self || {},
that = new Ox.Element({}, self)

17
source/Ox.UI/js/Form/Ox.Form.js
View file

@ -1,8 +1,19 @@
// vim: et:ts=4:sw=4:sts=4:ft=js
Ox.Form = function(options, self) {
/**
*/
/*@
Ox.Form <f:Ox.Element> Form Object
() -> <f> Form Object
(options) -> <f> Form Object
(options, self) -> <f> Form Object
options <o> Options object
error <s> error
id <s> id
items <a> []
submit <f> null
self <o> shared private variable
@*/
Ox.Form = function(options, self) {
var self = self || {},
that = new Ox.Element({}, self)

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

@ -1,59 +1,62 @@
// vim: et:ts=4:sw=4:sts=4:ft=js
Ox.Input = function(options, self) {
/*@
Ox.Input <f:Ox.Element> Input Element
() -> <f> Input Element
(options) -> <f> Input Element
(options, self) -> <f> Input Element
options <o> Options object
arrows <b> if true, and type is 'float' or 'integer', display arrows
arrowStep <n> step when clicking arrows
autocomplete <a> array of possible values, or
<f> function(key, value, callback), returns one or more values
autocompleteReplace <b> if true, value is replaced
autocompleteReplaceCorrect <b> if true, only valid values can be entered
autocompleteSelect <b> if true, menu is displayed
autocompleteSelectHighlight <b> if true, value in menu is highlighted
autocompleteSelectSubmit <b> if true, submit input on menu selection
autocorrect <s|r|f|null> ('email', 'float', 'integer', 'phone', 'url'), or
<r> regexp(value), or
<f> function(key, value, blur, callback), returns value
autovalidate <f> --remote validation--
clear <b> if true, has clear button
disabled <b> if true, is disabled
height <n> px (for type='textarea' and type='range' with orientation='horizontal')
id <s> element id
key <s> to be passed to autocomplete and autovalidate functions
max <n> max value if type is 'integer' or 'float'
min <n> min value if type is 'integer' or 'float'
name <s> will be displayed by autovalidate function ('invalid ' + name)
overlap <s> '', 'left' or 'right', will cause padding and negative margin
picker <o> picker object
rangeOptions <o> range options
arrows <b>boolean, if true, display arrows
//arrowStep <n> number, step when clicking arrows
//arrowSymbols <a> array of two strings
max <n> number, maximum value
min <n> number, minimum value
orientation <s> 'horizontal' or 'vertical'
step <n> number, step
thumbValue <b> boolean, if true, value is displayed on thumb, or
<a> array of strings per value, or
<f> function(value), returns string
thumbSize <n> integer, px
trackGradient <s> string, css gradient for track
trackImage <s> string, image url, or
<a> array of image urls
//trackStep <n> number, 0 for 'scroll here', positive for step
trackValues <b> boolean
serialize <f> function used to serialize value in submit
textAlign <s> 'left', 'center' or 'right'
type <s> 'float', 'integer', 'password', 'text', 'textarea'
value <s> string
validate <f> remote validation
width <n> px
/**
options
arrows boolearn, if true, and type is 'float' or 'integer', display arrows
arrowStep number, step when clicking arrows
autocomplete array of possible values, or
function(key, value, callback), returns one or more values
autocompleteReplace boolean, if true, value is replaced
autocompleteReplaceCorrect boolean, if true, only valid values can be entered
autocompleteSelect boolean, if true, menu is displayed
autocompleteSelectHighlight boolean, if true, value in menu is highlighted
autocompleteSelectSubmit boolean, if true, submit input on menu selection
autocorrect string ('email', 'float', 'integer', 'phone', 'url'), or
regexp(value), or
function(key, value, blur, callback), returns value
autovalidate --remote validation--
clear boolean, if true, has clear button
disabled boolean, if true, is disabled
height integer, px (for type='textarea' and type='range' with orientation='horizontal')
id string, element id
key string, to be passed to autocomplete and autovalidate functions
max number, max value if type is 'integer' or 'float'
min number, min value if type is 'integer' or 'float'
name string, will be displayed by autovalidate function ('invalid ' + name)
overlap string, '', 'left' or 'right', will cause padding and negative margin
picker
//rangeOptions
arrows boolean, if true, display arrows
//arrowStep number, step when clicking arrows
//arrowSymbols array of two strings
max number, maximum value
min number, minimum value
orientation 'horizontal' or 'vertical'
step number, step
thumbValue boolean, if true, value is displayed on thumb, or
array of strings per value, or
function(value), returns string
thumbSize integer, px
trackGradient string, css gradient for track
trackImage string, image url, or
array of image urls
//trackStep number, 0 for 'scroll here', positive for step
trackValues boolean
serialize
textAlign 'left', 'center' or 'right'
type 'float', 'integer', 'password', 'text', 'textarea'
value string
validate function, remote validation
width integer, px
methods:
events:
change
submit
*/
change <!> input changed event
submit <!> input submit event
@*/
Ox.Input = function(options, self) {
var self = self || {},
that = new Ox.Element({}, self)

22
source/Ox.UI/js/Form/Ox.InputGroup.js
View file

@ -1,13 +1,19 @@
// vim: et:ts=4:sw=4:sts=4:ft=js
/*@
Ox.InputGroup <f:Ox.Element> InputGroup Object
() -> <f> InputGroup Object
(options) -> <f> InputGroup Object
(options, self) -> <f> InputGroup Object
options <o> Options object
id <s|''> id
inputs <a|[]> inputs
separators <a|[]> seperators
width <n|0> width
self <o> shared private variable
@*/
Ox.InputGroup = function(options, self) {
/***
Ox.InputGroup
Options:
Methods:
Events:
***/
var self = self || {},
that = new Ox.Element({}, self)
.defaults({

8
source/Ox.UI/js/Form/Ox.Label.js
View file

@ -1,4 +1,12 @@
// vim: et:ts=4:sw=4:sts=4:ft=js
/*@
Ox.Label <f:Ox.Element> Label Object
() -> <f> Label Object
(options) -> <f> Label Object
(options, self) -> <f> Label Object
options <o> Options object
@*/
Ox.Label = function(options, self) {
var self = self || {},

9
source/Ox.UI/js/Form/Ox.Picker.js
View file

@ -1,4 +1,13 @@
// vim: et:ts=4:sw=4:sts=4:ft=js
/*@
Ox.Picker <f:Ox.Element> Picker Object
() -> <f> Picker Object
(options) -> <f> Picker Object
(options, self) -> <f> Picker Object
options <o> Options object
@*/
Ox.Picker = function(options, self) {
var self = self || {},

41
source/Ox.UI/js/Form/Ox.Range.js
View file

@ -1,26 +1,29 @@
// vim: et:ts=4:sw=4:sts=4:ft=js
/*@
Ox.Range <f:Ox.Element> Range Object
() -> <f> Range Object
(options) -> <f> Range Object
(options, self) -> <f> Range Object
options <o> Options object
arrows <b> if true, show arrows
arrowStep <n> step when clicking arrows
arrowSymbols <a> arrow symbols, like ['minus', 'plus']
max <n> maximum value
min <n> minimum value
orientation <s> 'horizontal' or 'vertical'
step <n> step between values
size <n> width or height, in px
thumbSize <n> minimum width or height of thumb, in px
thumbValue <b> if true, display value on thumb
trackGradient <a> colors
trackImages <s> or array one or multiple track background image URLs
trackStep <n> 0 (scroll here) or step when clicking track
value <n> initial value
valueNames <a> value names to display on thumb
@*/
Ox.Range = function(options, self) {
/**
options
arrows boolean if true, show arrows
arrowStep number step when clicking arrows
arrowSymbols array arrow symbols, like ['minus', 'plus']
max number maximum value
min number minimum value
orientation string 'horizontal' or 'vertical'
step number step between values
size number width or height, in px
thumbSize number minimum width or height of thumb, in px
thumbValue boolean if true, display value on thumb
trackGradient array colors
trackImages string or array one or multiple track background image URLs
trackStep number 0 (scroll here) or step when clicking track
value number initial value
valueNames array value names to display on thumb
*/
var self = self || {},
that = new Ox.Element({}, self)
.defaults({