Scripting
Default Order of Precedence:
runJSOnceBefore > runOnceBefore > runJSBefore > runBefore > Mode Handler > runDuring > runJSOnceAfter > runOnceAfter > runJSAfter > runAfter
-
▼runJSOnceBefore[]
-
The "runJSOnceBefore" array is used to execute one or more external JavaScript files once before an AccDC Object opens.
-
Syntax
$A([
{
runJSOnceBefore: [
'js/ready.js',
'http://whatsock.com/js/demo.js'
],
...
}
]);
// Or
$A.reg.myObj.runJSOnceBefore.push('js/helpers.js');
Important
-
Set the "ranJSOnceBefore" property to False to reset.
dc.ranJSOnceBefore = false;
// Or
$A.reg.myObj.ranJSOnceBefore = false;
-
▼.runOnceBefore()
-
The "runOnceBefore()" script is executed once before an AccDC Object opens.
-
Syntax
$A([
{
runOnceBefore: function(dc){
// Do something
},
...
}
]);
// Or
$A.reg.myObj.runOnceBefore = function(dc){
// Do something
};
Important
-
Set the "ranJSOnceBefore" property to False to reset.
dc.ranJSOnceBefore = false;
// Or
$A.reg.myObj.ranJSOnceBefore = false;
-
▼.runJSBefore[]
-
The "runJSBefore" array is used to execute one or more external JavaScript files before an AccDC Object opens. (Every time)
-
Syntax
$A([
{
runJSBefore: [
'js/demo/chat/js/init.js'
],
...
}
]);
// Or
$A.reg.myObj.runJSBefore.push('js/demo/chat/js/init.js');
-
▼.runBefore()
-
The "runBefore()" script is executed before an AccDC Object opens. (Every time)
-
Syntax
$A([
{
runBefore: function(dc){
// Do something
},
...
}
]);
// Or
$A.reg.myObj.runBefore = function(dc){
// Do something
};
-
▼.runDuring()
-
The "runDuring()" script is executed while an AccDC Object is opening.
-
Syntax
$A([
{
runDuring: function(dc){
// Do something
},
...
}
]);
// Or
$A.reg.myObj.runDuring = function(dc){
// Do something
};
-
▼.runJSOnceAfter
-
The "runJSOnceAfter" array is used to execute one or more external JavaScript files once after an AccDC Object opens.
-
Syntax
$A([
{
runJSOnceAfter: [
'js/helpers.js',
'http://whatsock.com/js/ready.js'
],
...
}
]);
// Or
$A.reg.myObj.runJSOnceAfter.push('js/demo.js');
Important
-
Set the "ranJSOnceAfter" property to False to reset.
dc.ranJSOnceAfter = false;
// Or
$A.reg.myObj.ranJSOnceAfter = false;
-
▼.runOnceAfter()
-
The "runOnceAfter()" script is executed once after an AccDC Object opens.
-
Syntax
$A([
{
runOnceAfter: function(dc){
// Do something
},
...
}
]);
// Or
$A.reg.myObj.runOnceAfter = function(dc){
// Do something
};
Important
-
Set the "ranJSOnceAfter" property to False to reset.
dc.ranJSOnceAfter = false;
// Or
$A.reg.myObj.ranJSOnceAfter = false;
-
▼.runJSAfter
-
The "runJSAfter" array is used to execute one or more external JavaScript files after an AccDC Object opens. (Every time)
-
Syntax
$A([
{
runJSAfter: [
'http://whatsock.com/js/helpers.js',
'js/demo.js'
],
...
}
]);
// Or
$A.reg.myObj.runJSAfter.push('files/demo/chat/js/init.js');
-
▼.runAfter()
-
The "runAfter()" script is executed after an AccDC Object opens. (Every time)
-
Syntax
$A([
{
runAfter: function(dc){
// Do something
},
...
}
]);
// Or
$A.reg.myObj.runAfter = function(dc){
// Do something
};
-
▼.reverseJSOrder
-
The "reverseJSOrder" property changes the order of precedence for script execution.
-
Syntax
$A([
{
reverseJSOrder: true,
// Or
runBefore: function(dc){
dc.reverseJSOrder = false;
},
// Or
runDuring: function(dc){
dc.reverseJSOrder = false;
},
...
}
// Or
$A.reg.myObj.reverseJSOrder = false;
Important
-
The following order of precedence is used when "reverseJSOrder" is set to True:
runOnceBefore >
runJSOnceBefore >
runBefore >
runJSBefore >
Mode Handler >
runDuring >
runOnceAfter >
runJSOnceAfter >
runAfter >
runJSAfter
-
▼.runBeforeClose()
-
The "runBeforeClose()" script is executed before an AccDC Object closes. (Every time)
-
Syntax
$A([
{
runBeforeClose: function(dc){
// Do something
},
...
}
]);
// Or
$A.reg.myObj.runBeforeClose = function(dc){
// Do something
};
-
▼.runAfterClose()
-
The "runAfterClose()" script is executed after an AccDC Object closes. (Every time)
-
Syntax
$A([
{
runAfterClose: function(dc){
// Do something
},
...
}
]);
// Or
$A.reg.myObj.runAfterClose = function(dc){
// Do something
};
-
▼.allowCascade
-
The "allowCascade" property determines whether stacked script methods will be executed in succession.
-
Syntax
$A([
{
// Enable cascading for one object
allowCascade: true,
runAfter: function(dc){
// Execute the 'runAfter' script after the AccDC Object opens,
// including the 'runAfter' script within the overrides object if present,
// as well as the 'runAfter' script within the 'globalDC' object if present.
},
...
}
], {
// Or apply cascading to all sibling AccDC Objects using the overrides object
allowCascade: true
});
// Or enable cascading for all AccDC Objects
$A.fn.globalDC.allowCascade = true;
// Or turn off cascading for a specific AccDC Object
$A.reg.myObj.allowCascade = false;
Applicable Methods
-
runJSOnceBefore, runOnceBefore, runJSBefore, runBefore, runDuring, runJSOnceAfter, runOnceAfter, runJSAfter, runAfter, runBeforeClose, runAfterClose
-
"allowCascade" is False by default.
-
View the "globalDC" object documented within the Extensions section for additional details regarding prototype declarations.
CSS
-
▼.className
-
The "className" property assigns one or more class names to an AccDC Object.
-
Syntax
$A([
{
className: 'dialog',
...
}
]);
// Or
$A.reg.myObj.className = 'wizard dialog';
-
▼.closeClassName
-
The "closeClassName" property binds an AccDC Object's close event handlers with all matching elements in the object.
-
Default: "accDCCloseCls"
Syntax
$A([
{
// Matches an IMG tag within the AccDC Object with class="close"
closeClassName: 'close',
...
}
]);
// Or
$A.reg.myObj.closeClassName = 'close';
-
▼.cssObj
-
The "cssObj" property assigns inline styles to an AccDC Object.
-
Default: {}
Syntax
$A([
{
cssObj: {
width: '500px',
height: '300px',
fontSize: '1.1em',
overflow: 'auto',
border: 'solid thin black'
},
...
}
]);
// Or
$A.reg.myObj.cssObj = {
color: 'black'
};
// Or
$A.reg.myObj.cssObj.position = 'static';
Important
-
When "cssObj" properties are changed programmatically, the new changes will take affect the next time the AccDC Object opens.
-
Use the ".css()" method to programmatically change "cssObj" properties and apply them at runtime.
-
▼.css()
-
The ".css()" method adds/changes/removes/fetches styling properties from an AccDC Object.
-
Syntax
// Format: .css(property, value, persist)
$A([
{
runOnceAfter: function(dc){
// Fetch a property value
var fs = dc.css('fontSize');
// Change/add one property value
dc.css('marginTop', '30px');
// Change/add one property value and merge the value with "cssObj"
dc.css('marginBottom', '30px', true);
// Change/add multiple property values
dc.css({
background: 'url(img/planets/stars.jpg) black no-repeat',
color: 'white'
});
// Change/add multiple property values and merge the values with "cssObj"
dc.css({
height: '300px',
width: '400px'
}, true);
},
...
}
]);
// Or
$A.reg.myObj.css('overflow', 'auto', true);
-
▼$A.css()
-
The "$A.css()" method gets or sets CSS properties on one or more DOM nodes.
-
Syntax
// Fetch a property value
var fs = $A.css(donNode, 'fontSize');
// Change/add one property value
$A.css(domNode, 'marginTop', '30px');
// Change/add one property value within multiple DOM nodes
$A.css([domNode1, domNode2], 'marginBottom', '30px');
// Change/add multiple property values
$A.css(domNode, {
background: 'url(img/planets/stars.jpg) black no-repeat',
color: 'white'
});
-
▼.autoPosition
-
The "autoPosition" property automatically positions an AccDC Object relative to its triggering element or a target object via "posAnchor".
-
Default: 0
Options
-
0: Disabled
-
1: Above/Center/Left Edge Aligned
-
2: Above/Right/Right Edge Aligned
-
3: Level/Right/Right Edge Aligned
-
4: Below/Right/Right Edge Aligned
-
5: Below/Center/Left Edge Aligned
-
6: Below/Left/Left Edge Aligned
-
7: Level/Left/Left Edge Aligned
-
8: Above/Left/Left Edge Aligned
-
9: Level/Center/Left Edge Aligned
-
10: Above/Center/Right Edge Aligned
-
11: Level/Center/Right Edge Aligned
-
12: Below/Center/Right Edge Aligned
Syntax
$A([
{
autoPosition: 5,
...
}
]);
// Or
$A.reg.myObj.autoPosition = 3;
Required:
-
The position for the AccDC Object must be set to either "absolute", "relative", or "fixed"
-
▼.posAnchor
-
The "posAnchor" property assigns an anchor object to be used with the "autoPosition" calculation, which overrides the automatic use of the triggering element for this purpose.
-
Values: CSS Selector or DOM node
Syntax
$A([
{
posAnchor: 'img.helpIcon',
...
}
]);
// Or
$A.reg.myObj.posAnchor = document.getElementById('formId');
Required: One or the other must be true:
-
"autoPosition" must be greater than 0
-
The "setPosition()" method must be invoked.
-
▼.setPosition()
-
The ".setPosition()" method manually sets the rendered position of an AccDC Object relative to the location of a specific DOM node.
-
All arguments are optional.
Syntax
// Format: .setPosition(CSS_Or_DOMNode, autoPositionValue, persist)
$A([
{
runAfter: function(dc){
// Invoke setPosition using preconfigured values
dc.setPosition();
// Or setPosition using a custom object and a preconfigured "autoPosition" value
dc.setPosition('div.help');
// Or setPosition using a custom object and a custom "autoPosition" value
dc.setPosition(document.getElementById('helper'), 3);
// Or setPosition using a preconfigured object and a custom "autoPosition" value and save the change
dc.setPosition(5, true);
},
...
}
]);
// Or
$A.reg.myObj.setPosition('div.helpIcon', 10, true);
Important
-
When "persist" is True, related arguments will be saved as "posAnchor" and "autoPosition" values in the current AccDC Object instance.
-
▼.autoFix
-
The "autoFix" property sets the rendered position of an AccDC Object to a fixed location in the viewport.
-
Default: 0
Options
-
0: Disabled
-
1: Top/Center
-
2: Top/Right
-
3: Right/Middle
-
4: Right/Bottom
-
5: Bottom/Center
-
6: Bottom/Left
-
7: Left/Middle
-
8: Left/Top
-
9: Center/Middle
Syntax
$A([
{
autoFix: 5,
...
}
]);
// Or
$A.reg.myObj.autoFix = 9;
-
▼.applyFix()
-
The ".applyFix()" method manually calculates a new fixed position using the current "autoFix" property value, or applies a new "autoFix" value.
-
Syntax
$A([
{
runAfter: function(dc){
// Apply a fixed position using the current "autoFix" value
dc.applyFix();
// Or apply a fixed position using a newly assigned "autoFix" value
dc.applyFix(5); // 5 is automatically saved in dc.autoFix
},
...
}
]);
// Or
$A.reg.myObj.applyFix(3);
-
▼.offsetTop / .offsetLeft
-
The "offsetTop" and "offsetLeft" properties apply a positive or negative offset when "autoPosition" or "autoFix" is calculated.
-
Defaults: 0
Syntax
$A([
{
offsetTop: 20,
offsetLeft: -30,
...
}
]);
// Or
$A.reg.myObj.offsetTop = -25;
Required:
-
"autoPosition" or "autoFix" must be greater than 0
-
▼.importCSS
-
The "importCSS" property dynamically adds an external CSS file to the AccDC Object.
-
Syntax
$A([
{
importCSS: 'css/dialog.css',
...
}
]);
// Or
$A.reg.myObj.importCSS = 'http://whatsock.com/css/global.css';
-
▼.shadow
-
The "shadow" property applies a drop-shadow affect on an AccDC Object.
-
Defaults: {
horizontal: '0px', vertical: '0px', blur: '0px', color: ''
}
Options
-
horizontal (Optional)
-
Determines the shadow size on the left or right of an AccDC Object;
A negative pixel value will display the shadow on the left,
a positive pixel value will display the shadow on the right.
-
vertical (Optional)
-
Determines the shadow size on the top or bottom of an AccDC Object;
A negative pixel value will display the shadow on the top,
a positive pixel value will display the shadow on the bottom.
-
blur (Optional)
-
Determines the shadow blur size for an AccDC Object;
A negative pixel value will decrease the shadow size,
a positive pixel value will increase the blur size.
-
color (Optional)
-
Determines the color of the drop-shadow.
Syntax
$A([
{
shadow: {
horizontal: '7px',
vertical: '10px',
blur: '10px',
color: '#000000'
},
...
}
]);
// Or
$A.reg.myObj.shadow = {
horizontal: '-7px',
vertical: '-7px'
};
// Or
$A.reg.myObj.shadow.vertical = '10px';
-
▼.setShadow()
-
The ".setShadow()" method manually applies "shadow" to an AccDC Object.
-
All arguments are optional.
Syntax
$A([
{
runAfter: function(dc){
// SetShadow using the current dc.shadow object
dc.setShadow();
// Or setShadow using custom values that will automatically be saved in dc.shadow
dc.setShadow({
color: 'black'
});
},
...
}
]);
// Or
$A.reg.myObj.setShadow({
horizontal: '-7px',
vertical: '5px',
blur: '7px',
color: '#d3d3d3'
});
-
▼$A.hasClass()
-
The "$A.hasClass()" method returns True if one, or the total of a series of class names are contained within a DOM node.
-
Syntax
var isIncluded = $A.hasClass(domNode, 'myClass');
// Or
var areAllIncluded = $A.hasClass(domNode, 'myClass1 myClass2 myClass3');
-
▼$A.remClass()
-
The "$A.remClass()" method removes one or more class names from a DOM node, or an array of DOM nodes.
-
Syntax
$A.remClass(domNode, 'myClass');
// Or
$A.remClass([domNode1, domNode2], 'myClass1 myClass2 myClass3');
-
▼$A.addClass()
-
The "$A.addClass()" method adds one or more class names to a DOM node, or an array of DOM nodes.
-
Syntax
$A.addClass(domNode, 'myClass');
// Or
$A.addClass([domNode1, domNode2], 'myClass1 myClass2 myClass3');
-
▼.displayInline
-
The ".displayInline" property specifies that an AccDC Object will have it's surrounding Div tags rendered as inline elements in order to suppress block formatting.
-
Syntax
$A([
{
displayInline: true,
...
}
]);
// Or
$A.reg.myObj.displayInline = false;