vegui. std.jsSummary | | | | | holds pointers to all VegUIElement Constructor functions by their type | | | | | | Mouse and keyboard eventtypes that help you identify what event you’re dealing with | | Url needed for xmlhttprequest to work, can leave blank if working on a local server | | | | Bitmask flags that can be set on the flags property of each VegUIElement individually | | Resizes body to manager canvas size, this is to fix text selection and onmouseout in internet explorer | | Maximum element index possible, 90000 by default, increase if you need to spawn more than 90000 elements at the same time | | | | | | | | holds browser name in its name property | | | | Makes a vegUI module accessable by the manager. | | Internet explorer 6 leaks memory in closures, in order to fix that iesucks is called when the page is unloaded if the browser is ie6 | | Creates a new instance of a javascript object | | Attempt to append the properties of trgObj to srcObj | | | | checks if Node is the child of Parent somewhere up the parent chain | | | | Wrapper for document.createElement with the option to append the created node to another html node right away | | Wrapper for document.createElement to create an image node with the option to define proportions and image source right away | | Wrapper for document.createTextNode | | | | Handles a certain keyboard or mouse event type that gets triggered by the VegUIElement the VegUIMouseState belongs to | | | | | | | | (VegUIElement) VegUI element that owns this mouse state | | (int) holds the type of mouse or keyboard event this state handles | | | | (Array) properties that will be copied over to the element that owns this mouse state if the event that is handled by this mouse state is triggered | | The most basic VegUI Element. | | | | | | | | These properties are only set after certain mouse or keyboard events have been handled by this element | | Template properties are properties that will get turned into real properties when the node is built. | | | | | | | | | | | | Creates a VegUI element as a child of this element. | | Adds an existing VegUI Element to this element as a child | | Wrapper function to add a new vegui element to this element as a child with the ability to set the most common template properties | | (Re)Aligns all child elements of this element to their margins | | Attaches another VegUI element to this node. | | build a HTML node from the template properties of this element. | | This function triggers the ondock event on this element and all its child elements recursivly | | See if this element or any of its child elements has focus. | | Removes all child HTML nodes from the HTML node that is controlled by this element | | | | Clones the children and properties of a template element to this element | | clone multiple children that are of the same type from the same template | | Takes control over an existing HTML node | | Detaches an attached element that was attached to this element via attach_node. | | | | Appends the HTML node controlled by this element to another HTMLnode | | Adds a function to be executed to a vegui element event | | | | Add function to event listener of the node controlled by this element | | Find the first common vegui Parent that this element and Obj share | | | | | | toggles this element to be invisible or visible | | Checks if the HTML node controlled by this element is hidden or visible | | Check if a vegui element is the parent element of this element somewhere down the parent chain | | Removes the HTMLnode controlled by this element and/or destroys the element it self. | | Takes focus away from this element, the first parent that can have focus set on it will gain passive focus. | | moves the HTML node controlled by this element to new coordinates | | | | | | | | varies from element to element | | | | triggered when element gains focus | | triggered when element loses focus | | triggered after element was built | | | | Checks if this element overlaps with another element. | | resizes the HTML node controlled by this element | | Gives focus to the element. | | sets the height of the HTML node controlled by this element | | | | | | sets the CSS position of the HTML node controlled by this element | | Set the CSS transparency of the HTML node that is controlled by this element. | | sets the width of the HTML node controlled by this element | | repositions the HTML node controlled by this element on the x axis | | repositions the HTML node controlled by this element on the y axis | | Sticks the element to another element at a certain offset | | | | Removes the HTML node controlled by this element from its current parentNode. | | | | | | | | | | | | Spawns and keeps track of all vegUI elements | | | | | | | | | | | | | | | | Attempts the prevention of the default browser action for a certain keyboard key code | | | | builds multiple vegUI elements, if the last argument submitted to the function is a HTML node then the element’s will be built as children of that node | | | | clone multiple elements of the same template | | evals some javascript code | | Wrapper functions to create a new vegui element and clone it | | | | Creates a new VegUIElement | | Includes javascript code from a file and executes is | | initializes common VegUIBridge object that can be accessed by all spawned VegUIElements by accessing it over their Manager property | | initializes common VegUIFXManager object that can be accessed by all spawned VegUIElements by accessing it over their Manager attribute | | Check if a keycode has been blocked with <block_key> | | | | Removes a keycode block set by <block_key> method | | Bounding box for elements, limits where an element can be moved to. | | | | | | | | | | checks if the element is within the boundin box’s border, if not the element will be moved to be within the bounding box’s border | | | | Validates the position of the element that the bounding box belongs to | | Allows to have a function with dynamic content | | | | | | | | | | Adds a function to the stack | | Executes all the functions in the stack | | Free a unique function id effectivly removing the function linked to it from the stack |
VEGUIOBJholds pointers to all VegUIElement Constructor functions by their type
Mouse and keyboard event typesMouse and keyboard eventtypes that help you identify what event you’re dealing with | VUI_MOUSE_DOWN | mouse button clicked on the vegUI element | | VUI_MOUSE_UP | mouse button released on the vegUI element | | VUI_MOUSE_OVER | mouse button entered the vegUI element | | VUI_MOUSE_OUT | mouse button leaves the vegUI element | | VUI_MOUSE_MOVE | mouse moved within the borders of vegUI element | | VUI_MOUSE_WHEEL | mouse wheel used | | VUI_KEY_DOWN | keyboard key pressed | | VUI_KEY_UP | keyboard key released | | VUI_FORM_BLUR | onblur event in form elements | | VUI_FORM_FOCUS | onfocus event in form elements | | VUI_MOUSE_DBL_LICK | dbclick event |
VUI_URLUrl needed for xmlhttprequest to work, can leave blank if working on a local server
Generic directions| VUI_UP | up | | VUI_DOWN | down | | VUI_LEFT | left | | VUI_RIGHT | right | | VUI_BACK | back | | VUI_FRONT | front |
Flags, CommonBitmask flags that can be set on the flags property of each VegUIElement individually | VUI_HMOUSE_UP | enable event handling for VUI_MOUSE_UP | | VUI_HMOUSE_DOWN | enable event handling for VUI_MOUSE_DOWN | | VUI_HMOUSE_OVER | enable event handling for VUI_MOUSE_OVER | | VUI_HMOUSE_OUT | enable event handling for VUI_MOUSE_OUT | | VUI_HMOUSE_MOVE | enable event handling for VUI_MOUSE_MOVE | | VUI_HMOUSE_WHEEL | enable event handling for VUI_MOUSE_WHEEL | | VUI_HMOUSE_DBL_CLICK | enable envent handling for VUI_MOUSE_DBL_CLICK | | VUI_HKEY_DOWN | enable event handling for VUI_KEY_DOWN | | VUI_HKEY_UP | enable event handling for VUI_KE_UP | | VUI_TEMPLATE | flag VegUIElement as template prohibting it from being built | | VUI_DISABLED | flag VegUIElement as being disabled, prohibiting any event handling |
ADJUST_BODY_SIZEResizes body to manager canvas size, this is to fix text selection and onmouseout in internet explorer
ELEMENT_MAX_INDEXMaximum element index possible, 90000 by default, increase if you need to spawn more than 90000 elements at the same time
Focus types| VUI_FOCUS_PASSIVE | passive focus | | VUI_FOCUS_ACTIVE | active focus |
Mouse coordinates| mouseX | absolute x coordinate of the mouse pointer | | mouseY | absolute y coordinate of the mouse pointer |
VUI_BROWSER_INFOholds browser name in its name property
vui_module_add| function vui_module_add( | type, | | module, | | filename | ) |
|
Makes a vegUI module accessable by the manager. When developing addons for vegUI make sure you initialize your module using this function instead of adding it’s type directly to the VEGUIOBJ array. If there are colliding types an error message will be displayed and the script is halted Added in2.0.6 Parameters| int type | unique type id of the module | | func module | constructor function of the module | | string filename | filename that the function was called in |
Returns| bool | true on success | | bool | false on error |
Examplevui_module_add(VUI_NODE, VegUINode, 'vegui.std.js');
iesucks| var browser_str = navigator.userAgent.toLowerCase( | | ); function iesucks(Node) |
|
Internet explorer 6 leaks memory in closures, in order to fix that iesucks is called when the page is unloaded if the browser is ie6 Parameters| Node | HTML Node that needs to have events reset recursivly |
CloneCreates a new instance of a javascript object Parameters| Object Obj | object to be cloned |
ExampleIn this example newObj will be an exact clone of Obj var newObj = new Clone(Obj);
merge| function merge( | srcObj, | | trgObj | ) |
|
Attempt to append the properties of trgObj to srcObj Parameters| Object trgObj | Javascript Object | | Object srcObj | Javascript Object |
ExampleAny non-existing properties of Obj2 will be copied to Obj1, existing properties will be overwritten merge(Obj1, Obj2);
cloneArrayclones an array Parameters| Array Arr | Array to be cloned |
ReturnsExamplenewArr will be an exact copy of oldArr var newArrr = cloneArray(oldArr);
has_parent| function has_parent( | Node, | | Parent | ) |
|
checks if Node is the child of Parent somewhere up the parent chain Parameters| HTMLNode Node | HTML Node | | HTMLNode Parent | HTML Node |
Returns| bool | true if Parent is the parent node of Node directly or indirectly | | bool | false if Parent is not the parent node of Node directly or indirectly |
Examplevar node1 = document.createElement('div'); var node2 = document.createElement('div'); var node3 = document.createElement('div'); node1.appendChild(node2); node2.appendChild(node3);
return has_parent(node2, node1);
return has_parent(node3, node1);
get_mouseget mouse pointer location, sets mouseX and mouseY ParametersExamplenode.onmousemove = function(e) { get_mouse((e ? e : event)); alert(mouseX+','+mouseY); }
htmlnode| function htmlnode( | nodeName, | | parentNode | ) |
|
Wrapper for document.createElement with the option to append the created node to another html node right away Paramters| string nodeName | html name of the node (ie. ‘div’) | | <HTMLNode parentNode> | created html node will be appended to this node |
Returns
imgnode| function imgnode( | src, | | w, | | h, | | parentNode | ) |
|
Wrapper for document.createElement to create an image node with the option to define proportions and image source right away Parameters| string src | path of the image | | int w | width of the image (pixels) | | int h | height of the image (pixels) | | <HTMLNode parentNode> | created image node will be appened to this node |
Returns
txtnodeWrapper for document.createTextNode Parameters| string txt | text string to be created |
Returns
vui_rand| function vui_rand( | min, | | max | ) |
|
generate a random number Parameters| int min | minimum number | | int max | maximum number |
Returns| int | the generated number (int) |
Examplevar n = vui_rand(1,30);
VegUIMouseStateHandles a certain keyboard or mouse event type that gets triggered by the VegUIElement the VegUIMouseState belongs to Summary | | | | | | | (VegUIElement) VegUI element that owns this mouse state | | (int) holds the type of mouse or keyboard event this state handles | | | | (Array) properties that will be copied over to the element that owns this mouse state if the event that is handled by this mouse state is triggered |
VegUIMouseState| function VegUIMouseState( | eventType, | | Parent | ) |
|
Parameters
Parent(VegUIElement) VegUI element that owns this mouse state
type(int) holds the type of mouse or keyboard event this state handles
Properties(Array) properties that will be copied over to the element that owns this mouse state if the event that is handled by this mouse state is triggered
VegUINodeThe most basic VegUI Element. The VegUINode is the base element for every other vegUI element. Summary | | | | | | | These properties are only set after certain mouse or keyboard events have been handled by this element | | Template properties are properties that will get turned into real properties when the node is built. | | | | | | | | | | | | Creates a VegUI element as a child of this element. | | Adds an existing VegUI Element to this element as a child | | Wrapper function to add a new vegui element to this element as a child with the ability to set the most common template properties | | (Re)Aligns all child elements of this element to their margins | | Attaches another VegUI element to this node. | | build a HTML node from the template properties of this element. | | This function triggers the ondock event on this element and all its child elements recursivly | | See if this element or any of its child elements has focus. | | Removes all child HTML nodes from the HTML node that is controlled by this element | | | | Clones the children and properties of a template element to this element | | clone multiple children that are of the same type from the same template | | Takes control over an existing HTML node | | Detaches an attached element that was attached to this element via attach_node. | | | | Appends the HTML node controlled by this element to another HTMLnode | | Adds a function to be executed to a vegui element event | | | | Add function to event listener of the node controlled by this element | | Find the first common vegui Parent that this element and Obj share | | | | | | toggles this element to be invisible or visible | | Checks if the HTML node controlled by this element is hidden or visible | | Check if a vegui element is the parent element of this element somewhere down the parent chain | | Removes the HTMLnode controlled by this element and/or destroys the element it self. | | Takes focus away from this element, the first parent that can have focus set on it will gain passive focus. | | moves the HTML node controlled by this element to new coordinates | | | | | | | | varies from element to element | | | | triggered when element gains focus | | triggered when element loses focus | | triggered after element was built | | | | Checks if this element overlaps with another element. | | resizes the HTML node controlled by this element | | Gives focus to the element. | | sets the height of the HTML node controlled by this element | | | | | | sets the CSS position of the HTML node controlled by this element | | Set the CSS transparency of the HTML node that is controlled by this element. | | sets the width of the HTML node controlled by this element | | repositions the HTML node controlled by this element on the x axis | | repositions the HTML node controlled by this element on the y axis | | Sticks the element to another element at a certain offset | | | | Removes the HTML node controlled by this element from its current parentNode. | | | | | | | | | | |
Object Properties| refName | string, name of the object | | Parent | VegUIElement, Parent element of this element | | Manager | VegUIElement, Manager element that spawned this element | | type | int, element type VUI_NODE | | C | Alias for Childs | | Childs | Object, Holds all child elements of this type by their element index | | T | Alias for Template | | Template | Object, Holds template properties | | Base | HTMLNode, Holds the HTML node that is controlled by the element | | Css | DOMNode, Holds the style property of the HTML node that is controlled by this element | | hasFocus | int, Holds the focus type of the node | | flags | int, Bitmask | | BBox | VegUIBBox, Holds the Bounding Box object of this element | | transparency | int, Holds the transparency value of this element (0-100) | | States | Array, Holds mouse/keyboard event states, one state for each event type | | nodeId | string, Holds the id of the HTML node that is controlled | | noAutoShow | bool, prevents the element from being flagged visible recursivly | | childName | string, child name of the node | | lockFocus | bool, if true focus can never be taken away from this node | | Attached | object, object holding vegui elements that were attached to this element via attach_node |
Event Specific Object PropertiesThese properties are only set after certain mouse or keyboard events have been handled by this element | mEvent | Event, Holds the javascript event object for the last mouse or key event handled by this node | | delta | int, Mousewheel delta, is set whenever the mousewheel event is handled by this element | | aKey | int, character code of the last key down or key up event handled by this element | | aKeyChar | char, character of the last key down or key up event handled by this element | | toE | HTMLNode, relatedTarget / toElement from the last mouse event handled by this element | | keyShift | bool, if true then shift key was held down when the last keyboard event was handled by this element | | keyAlt | bool, if true then the alt key was held down when the last keyboard event was handled by this element | | keyCtrl | bool, if true then the ctrl key was held down when the last keyboard event was handled by this element |
Template PropertiesTemplate properties are properties that will get turned into real properties when the node is built. They are stored in the Template property of the element | T.nodeType | string, node type of the htmli node to be built (ie ‘div’) | | T.x | int, node position on the x axis (pixels) | | T.y | int, node position on the y axis (pixels) | | T.w | int, node width (pixels) | | T.h | int, node height (pixels) | | T.rmarg | int, right margin | | T.bmarg | int, bottom margin | | T.rmarg_nr | int, right margin, no resize | | T.bmarg_nr | int, bottom margin, no resize | | T.micon | string, mouse cursor to use when the mouse enters the element (CSS cursor attribute) | | T.blockIETransparency | bool, if true any transparency effects will be ignored if the browser is internet explorer | | T.img_src | string, will set the HTML node’s src attribute | | T.Css | Object, any properties in T.Css will be copied to the HTML node’s style property | | T.innerHtml | string, The HTML Node’s innerHTML attribute will be set to this, if set | | T.type | string, The HTML Node’s type attribute will be set to this if set | | T.className | string, The HTML node will be using this CSS class if set |
VegUINode| function VegUINode( | refName, | | Parent, | | Manager | ) |
|
Parameters| string refName | name of the object | | VegUIElement Parent | Parent element of this element | | VegUIElement Manager | Manager element that spawned this element |
abs_middle| this.abs_middle = function( | stopAt | ) |
|
Parameters| <HTMLNode stopAt> | if submitted, the absolute position will be returned relative to the submitted node |
Returns| Array | array holding x and y coordinates of the abolute middle of the HTML node controlled by this element |
See alsoabs_x, abs_y, x, y
abs_x| this.abs_x = function( | stopAt | ) |
|
Parameters| <HTMLNode stopAt> | if submitted, the absolute position will be returned relative to the submitted node |
Returns| int | the absolute position of the HTML node controlled by this element on the x axis | | null | if no HTML node is controlled by this element |
See alsoabs_y, abs_middle, x, y
abs_y| this.abs_y = function( | stopAt | ) |
|
| <HTMLNode stopAt> | if submitted, the absolute position will be returned relative to the submitted node |
Returns| int | the absolute position of the HTML node controlled by this element on the y axis | | null | if no HTML node is controlled by this element |
See alsoabs_x, abs_middle, x, y
add_child| this.add_child = function( | name, | | type, | | nodeName, | | pos | ) |
|
Creates a VegUI element as a child of this element. Childs can be accessed over the Child or C property of this element by their unique child name Parameters| string name | unique child name | | int type | <VegUI element types> | | <string nodeName> | if set the childs T.nodeType property will be set to this | | <string pos> | if set the childs T.pos property will be set to this (Css position value, ie ‘absolute’) |
Returns| VegUIElement | the created element |
See alsoadd_skin, add_child_o Examplevar c = myNode.add_child('mychild', VUI_NODE, 'div', 'absolute');
add_child_o| this.add_child_o = function( | name, | | Obj | ) |
|
Adds an existing VegUI Element to this element as a child Parameters| string name | unique child name | | VegUIElement Obj | element to add as a child |
See alsoadd_child, add_skin Examplevar node1 = Manager.get_new(VUI_NODE); var node2 = Manager.get_new(VUI_NODE); node2.add_child_o(node1);
add_skin| this.add_skin = function( | n, | | w, | | h, | | x, | | y, | | c, | | rm, | | bm, | | rm_nr, | | bm_nr, | | nN, | | i | ) |
|
Wrapper function to add a new vegui element to this element as a child with the ability to set the most common template properties Parameters| string n | node name (ie ‘div’) | | int w | width (pixels) | | int h | height (pixels) | | int x | position on x axis (pixels) | | int y | position on y axis (pixels) | | string className | sets the T.className property (css class to use) | | int rm | right margin (pixels) | | int bm | bottom margin (pixels) | | int rm_nr | right margin no resize (pixels) | | int bm_nr | bottom margin no resize (pixels) | | string nN | node name ie ‘div’ | | string i | image source (file path) |
Returns| VegUIElement | the created element |
See alsoadd_child, add_child_o
align_childs| this.align_childs = function( | Child | ) |
|
(Re)Aligns all child elements of this element to their margins Parameters| VegUIElement <Child> | if submitted only this child will be realigned |
See alsoset_marg
attach_node| this.attach = this.attach_node = function( | Element, | | offsetX, | | offsetY, | | |
|
|