-
Notifications
You must be signed in to change notification settings - Fork 0
Chains
DmitryAstafyev edited this page Feb 4, 2016
·
9 revisions
Let’s create new module with one method, which add new attribute to node or return value of it.
//Create your class of module
var protofunction = function () { };
protofunction.prototype = function () {
var methods = null;
methods = {
attr : function(node, name, value){
if (node.setAttribute && name){
if (value){
node.setAttribute(name, value);
} else {
return node.getAttribute(name);
}
}
return null;
}
};
return {
attr : methods.attr
};
};
//Attach module to flex modules controller
flex.modules.attach({
//Name of your module
name : 'nodes',
//Link to your module's class
protofunction : protofunction,
});
Now in some other module you can use your [nodes] module
//Create your class of module
var protofunction = function () { };
protofunction.prototype = function () {
var //Link to module
nodes = flex.libraries.nodes.create(),
//Variables
methods = null;
methods = {
init : function(){
var node = document.getElementById('some_node_id'),
value = null;
//Set attribute
nodes.attr(node, 'data-my-attr', 'nothing');
//Read attribute
value = nodes.attr(node, 'data-my-attr');
}
};
return {
init : methods.init
};
};
//Attach module to flex modules controller
flex.modules.attach({
name : 'other_module',
protofunction : protofunction,
reference : function () {
//Define reference
flex.libraries.nodes();
},
});
Flex allows use “chains” to make code simple and clear. You can attach actions to types of data:
- nodes (alias: _node, _nodes ),
- arrays (alias: _array, _arrays ),
- objects (alias: _object, _objects ),
- strings (alias: _string, _strings ),
- numbers (alias: _number, _numbers )
Let’s modify our module [nodes] and add definition for type [node] and [nodes].
//Create your class of module
var protofunction = function () { };
protofunction.prototype = function () {
var methods = null,
attach = null;
methods = {
attr : function(node, name, value){
if (node.setAttribute && name){
if (value){
node.setAttribute(name, value);
} else {
return node.getAttribute(name);
}
}
return null;
}
};
//Attach chains
(function(){
//For single node
flex.callers.define.node(
//Define namespace of chain
'nodes.attr',
//Define handle
function (name, value) {
return methods.attr(this.target, name, value);
}
);
//For several nodes
flex.callers.define.nodes(
//Define namespace of chain
'nodes.attr',
//Define handle
function (name, value) {
Array.prototype.forEach.call(this.target, function (target) {
result.push(methods.attr(target, name, value));
});
return results;
}
);
}());
return {
attr : methods.attr
};
};
//Attach module to flex modules controller
flex.modules.attach({
//Name of your module
name : 'nodes',
//Link to your module's class
protofunction : protofunction,
});
And now we can call method [attr] of your module [nodes] by other way:
//Create your class of module
var protofunction = function () { };
protofunction.prototype = function () {
var //Variables
methods = null;
methods = {
init : function(){
var value = null;
//Set attribute
_node('#some_node_id').nodes().attr('data-my-attr', 'nothing');
//Read attribute
value = _node('#some_node_id').nodes().attr('data-my-attr');
//Or we can change attr of several nodes
_nodes('a').nodes().attr('href', '#');
}
};
return {
init : methods.init
};
};
//Attach module to flex modules controller
flex.modules.attach({
name : 'other_module',
protofunction : protofunction,
reference : function () {
//Define reference
flex.libraries.nodes();
},
});
As you can see now you should not create module to get access to it:
var //Link to module
nodes = flex.libraries.nodes.create();
You just use chain:
//For one single node
_node('#some_node_id').nodes().attr('data-my-attr', 'nothing');
//For several nodes
_nodes('a').nodes().attr('data-my-attr', 'nothing');
To define chain you can use next methods:
//For single node
flex.callers.define.node (..);
//For several nodes
flex.callers.define.nodes (..);
//For single array
flex.callers.define.array (..);
//For several arrays
flex.callers.define.arrays (..);
//For single string
flex.callers.define.string (..);
//For several strings
flex.callers.define.strings(..);
//For single object
flex.callers.define.object (..);
//For several objects
flex.callers.define.objects(..);
//For single number
flex.callers.define.number (..);
//For several numbers
flex.callers.define.numbers(..);
For all callers syntax is same:
flex.callers.define.nodes(
//Define namespace of chain
//You can use any number of parts as you want, for example:
// > nodes.attr
// > nodes.attrs.set
// > nodes.attrs.get and etc.
'attr',
//Define handle
function (name, value) {
//Object [this] will have only one property - [target].
//[this.target] can be some value (or object) if it's single call (node, string, object and etc) or
//it will be array for: nodes, strings, objects and etc.
Array.prototype.forEach.call(this.target, function (target) {
result.push(methods.attr(target, name, value));
});
return results;
}
);
//All parts of chain will be a functions, so to call method of chain you should use next:
_node('selector).attrs(arg);
_node('selector).nodes().attrs(arg);
_node('selector).nodes().attrs().get();
_node('selector).nodes().attrs().set(arg);