Hydra.js is a module manager oriented system.
Hydra.js is the library that will help you to scale your app. Hydra.js is a framework that gives you the tools to write your application using modules or widgets and make easy to work with them.
Hydra.js uses a decoupled architecture that:
Install with Bower
bower install hydrajs
Install with Component
component install hydrajs
Install with NPM
npm install hydra.js
Insert in your html code:
Hydra.module.setVars({
gaq: _gaq,
list: document.getElementById( "list" )
});
Setting the variables in this way will make the variables accessible as the last argument in the init module method. If needed you can also access these variables using getVars (See 'Getting variables')
Tip. This method not only sets variables, if the object has been set before the new variables will be merged with the previous object.
var oVars = Hydra.module.getVars();
Returns the object with the private variables set using setVars (See 'Setting variables')
The module creator function gets four arguments:
function( Bus, Module, ErrorHandler, Api )
{
return {
init: function ( oData ) {}
};
}
Hydra.module.register( 'moduleId', function( Bus, Module, ErrorHandler, Api )
{
return {
init: function ( oData ) {}
};
});
Hydra.module.register( 'moduleId', ['$api', '$bus'], function ( Api, Bus )
{
return {
init: function ( oData ) {}
};
});
The following are available for dependency injection:
To use dependency injection, pass an array of strings containing any of the variables listed above as the second parameter when registering a module. Hydra will pass them in the order specified to your function.
To extend a module you will need to register the base module before extends it.
Hydra.module.extend( 'moduleId', function( Bus, Module, ErrorHandler, Api )
{
return {
init: function ( oData ) {}
};
});
To extend a module you will need to register the base module before extends it.
Hydra.module.extend( 'moduleId', 'newModuleId', function( Bus, Module, ErrorHandler, Api )
{
return {
init: function ( oData ) {}
};
});
This extension allows access the parent methods as classical inheritance.
Register base module:
Hydra.module.register( 'moduleId', function( Bus, Module, ErrorHandler, Api )
{
return {
init: function ( oData ) {},
changeTitle: function( sTitle ){
document.title = sTitle;
}
};
});
Create the new module using "extend":
Hydra.module.extend( 'moduleId', 'newModuleId', function( Bus, Module, ErrorHandler, Api )
{
return {
init: function ( oData ) {},
changeTitle: function( sTitle ){
sTitle += " " + new Date().getTime();
// This is the way of access parent methods.
this.__super__.call( "changeTitle", [sTitle] );
}
};
});
Sometimes is better to decorate our modules instead of extending them. I recommend to use decorate instead of extend modules.
Hydra.module.decorate( 'baseModuleId', 'decoratedModuleId', function( Bus, baseModule, Module, ErrorHandler, Api )
{
return {
init: function ()
{
//do something on start a module
baseModule.init();
},
onDestroy: function ()
{
//do something on stop a module
baseModule.onDestroy();
}
};
});
Hydra.module.register( 'moduleId', function( Bus, Module, ErrorHandler, Api )
{
return {
events : {
'channel': {
'item:action1': function ( oData ) {}
}
},
init: function ( oData ) {
/* The subscribing of events is done by Hydra inside the core.
* Bus.subscribe( this );
*/
}
};
});
To use the action manager you have accessible using "Bus".
The publish method expect three arguments, but only the first two are mandatory, the channel name and the event name
Hydra.bus.publish( 'channel_name', 'event_name', data );
Tip: 'global' channel is created by default to use it if you want to communicate with other modules that are not related with a specific channel.
Hydra.module.register( 'moduleId', function( Bus, Module, ErrorHandler, Api )
{
return {
events : {
'channel': {
'item:action1': function ( oData ) {}
}
},
init: function ( oData ) {
$( "#button" ).click( function(){
Bus.publish( 'channel', 'item:action1', {} );
});
}
};
});
If you need compatibility with the previous event manager called Action, you can add it in your code to maintain compatibility with previous version's code. You can download it from: Action
Hydra.js is licensed under the MIT license.
Hydra was inspired by Nicholas Zakas presentation.