README.md

Angular.js - UI Contributions

---

Usage

The repository comes with the modules pre-built and compressed into the build directory.

1. Include the javascript files - angular-ui.js or angular-ui.min.js
2. Add a dependency to one or more ui modules onto your angular application module:

angular.module('myApp', ['ui']); // to include everything  
angular.module('myApp), ['ui.directives']); // to include all the directives only  
angular.module('myApp'), ['ui.directives.date']); // to include only a single module

The modules can be found in the Directives and Filters folders. Check out the readme file associated with each module for specific module usage information.

Building

You do not need to build the project to use it - see above - but if you are hacking on it then this is what you need to know.

Requirements

Install UglifyJS & LESS:

$ [sudo] npm install uglify-js -g  
$ [sudo] npm install less -g  
$ [sudo] npm install coffee-script -g

Build/Compress

$ make build

Testing

The modules come with unit tests that should be run on any changes and certainly before commiting changes to the project. The unit tests should also provide further insight into the usage of the modules.

Requirements

The project is configured to use the marvellous Testacular test runner from AngularJS developer Vojta. It is a nodeJS app. You simply install it from NPM:

$ [sudo] npm install testacular -g

The test configuration is in test/test-config.js. You pass this in when you run the test server:

$ testacular test/test-config.js

Capture your testing browsers by browsing to http://localhost:8080 (in this case) on all the different flavours of browser you wish to test.

Then whenever you make a change either run

$ make build
$ testacular-run

Or even quicker

$ make test

Template

/**
 * Directive Description
 * @param expression {type} description
 * @example code demo (if possible)
 */
angular.module('ui.directives').directive('uiMYDIRECTIVE', ['ui.config', function(uiConfig) {
  return function(scope, elm, attrs) {
  };
}]);