├── .gitattributes
├── app
├── .buildignore
└── scripts
│ └── calHeatmap.js
├── example
├── app.js
└── index.html
├── .bowerrc
├── .gitignore
├── .travis.yml
├── test
├── runner.html
├── spec
│ └── controllers
│ │ └── main.js
└── .jshintrc
├── .editorconfig
├── .jshintrc
├── dist
├── 1.1.0
│ └── calHeatmap.min.js
└── 1.3.0
│ └── calHeatmap.min.js
├── Gruntfile.js
├── bower.json
├── package.json
├── karma.conf.js
├── karma-e2e.conf.js
└── README.md
/.gitattributes:
--------------------------------------------------------------------------------
1 | * text=auto
--------------------------------------------------------------------------------
/app/.buildignore:
--------------------------------------------------------------------------------
1 | *.coffee
--------------------------------------------------------------------------------
/example/app.js:
--------------------------------------------------------------------------------
1 | angular.module('myapp',['calHeatmap']);
--------------------------------------------------------------------------------
/.bowerrc:
--------------------------------------------------------------------------------
1 | {
2 | "directory": "app/bower_components"
3 | }
4 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules
2 | bower_components
3 | .tmp
4 | .sass-cache
5 | app/bower_components
6 |
--------------------------------------------------------------------------------
/.travis.yml:
--------------------------------------------------------------------------------
1 | language: node_js
2 | node_js:
3 | - '0.8'
4 | - '0.10'
5 | before_script:
6 | - 'npm install -g bower grunt-cli'
7 | - 'bower install'
8 |
--------------------------------------------------------------------------------
/test/runner.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | End2end Test Runner
5 |
6 |
7 |
8 |
9 |
10 |
--------------------------------------------------------------------------------
/.editorconfig:
--------------------------------------------------------------------------------
1 | # EditorConfig helps developers define and maintain consistent
2 | # coding styles between different editors and IDEs
3 | # editorconfig.org
4 |
5 | root = true
6 |
7 |
8 | [*]
9 |
10 | # Change these settings to your own preference
11 | indent_style = space
12 | indent_size = 2
13 |
14 | # We recommend you to keep these unchanged
15 | end_of_line = lf
16 | charset = utf-8
17 | trim_trailing_whitespace = true
18 | insert_final_newline = true
19 |
20 | [*.md]
21 | trim_trailing_whitespace = false
22 |
--------------------------------------------------------------------------------
/.jshintrc:
--------------------------------------------------------------------------------
1 | {
2 | "node": true,
3 | "browser": true,
4 | "esnext": true,
5 | "bitwise": true,
6 | "camelcase": true,
7 | "curly": true,
8 | "eqeqeq": true,
9 | "immed": true,
10 | "indent": 2,
11 | "latedef": true,
12 | "newcap": true,
13 | "noarg": true,
14 | "quotmark": "single",
15 | "regexp": true,
16 | "undef": true,
17 | "unused": true,
18 | "strict": true,
19 | "trailing": true,
20 | "smarttabs": true,
21 | "globals": {
22 | "angular": false
23 | },
24 | "predef":[
25 | "angular",
26 | "CalHeatMap"
27 | ]
28 | }
29 |
--------------------------------------------------------------------------------
/dist/1.1.0/calHeatmap.min.js:
--------------------------------------------------------------------------------
1 | "use strict";angular.module("calHeatmap").directive("calHeatmap",function(){function a(a,b){var c=a.config,d=b[0],e=new CalHeatMap;e.init({itemSelector:d,domain:c.domain?c.domain:"month",subDomain:c.subDomain?c.subDomain:"day",subDomainTextFormat:c.subDomainTextFormat?c.subDomainTextFormat:"%d",data:c.data?c.data:"",start:c.start?c.start:new Date,cellSize:c.cellSize?c.cellSize:25,range:c.range?c.range:3,domainGutter:c.domainGutter?c.domainGutter:10,legend:c.legend?c.legend:[2,4,6,8,10],itemName:c.itemName?c.itemName:"item"})}return{template:'',restrict:"E",link:a,scope:{config:"="}}});
--------------------------------------------------------------------------------
/test/spec/controllers/main.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | describe('Controller: MainCtrl', function () {
4 |
5 | // load the controller's module
6 | beforeEach(module('angularCalHeatmapDirectiveApp'));
7 |
8 | var MainCtrl,
9 | scope;
10 |
11 | // Initialize the controller and a mock scope
12 | beforeEach(inject(function ($controller, $rootScope) {
13 | scope = $rootScope.$new();
14 | MainCtrl = $controller('MainCtrl', {
15 | $scope: scope
16 | });
17 | }));
18 |
19 | it('should attach a list of awesomeThings to the scope', function () {
20 | expect(scope.awesomeThings.length).toBe(3);
21 | });
22 | });
23 |
--------------------------------------------------------------------------------
/Gruntfile.js:
--------------------------------------------------------------------------------
1 | module.exports = function(grunt) {
2 | var component = require('./bower.json'),
3 | version = component.version;
4 |
5 | // configurable paths
6 | var yeomanConfig = {
7 | app: 'app',
8 | dist: 'dist',
9 | appVersion: version
10 | };
11 |
12 |
13 | grunt.initConfig({
14 | yeoman: yeomanConfig,
15 | uglify: {
16 | build: {
17 | src: ['app/scripts/calHeatmap.js'],
18 | dest: '<%= yeoman.dist %>/<%= yeoman.appVersion %>/calHeatmap.min.js'
19 | }
20 | }
21 |
22 | });
23 |
24 | grunt.loadNpmTasks('grunt-contrib-uglify');
25 |
26 | grunt.registerTask('default', ['uglify']);
27 | };
--------------------------------------------------------------------------------
/dist/1.3.0/calHeatmap.min.js:
--------------------------------------------------------------------------------
1 | "use strict";angular.module("calHeatmap",[]).directive("calHeatmap",function(){function a(a,b){var c=a.config,d=b[0],e=new CalHeatMap;e.init({itemSelector:d,domain:c&&c.domain?c.domain:"month",subDomain:c&&c.subDomain?c.subDomain:"day",subDomainTextFormat:c&&c.subDomainTextFormat?c.subDomainTextFormat:"%d",data:c&&c.data?c.data:"",start:c&&c.start?c.start:new Date,cellSize:c&&c.cellSize?c.cellSize:25,range:c&&c.range?c.range:3,domainGutter:c&&c.domainGutter?c.domainGutter:10,legend:c&&c.legend?c.legend:[2,4,6,8,10],itemName:c&&c.itemName?c.itemName:"item"})}return{template:'',restrict:"E",link:a,scope:{config:"="}}});
--------------------------------------------------------------------------------
/test/.jshintrc:
--------------------------------------------------------------------------------
1 | {
2 | "node": true,
3 | "browser": true,
4 | "esnext": true,
5 | "bitwise": true,
6 | "camelcase": true,
7 | "curly": true,
8 | "eqeqeq": true,
9 | "immed": true,
10 | "indent": 2,
11 | "latedef": true,
12 | "newcap": true,
13 | "noarg": true,
14 | "quotmark": "single",
15 | "regexp": true,
16 | "undef": true,
17 | "unused": true,
18 | "strict": true,
19 | "trailing": true,
20 | "smarttabs": true,
21 | "globals": {
22 | "after": false,
23 | "afterEach": false,
24 | "angular": false,
25 | "before": false,
26 | "beforeEach": false,
27 | "browser": false,
28 | "describe": false,
29 | "expect": false,
30 | "inject": false,
31 | "it": false,
32 | "spyOn": false
33 | }
34 | }
35 |
36 |
--------------------------------------------------------------------------------
/example/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Angular Cal Heatmap directive
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/bower.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "angular-cal-heatmap-directive",
3 | "version": "1.3.0",
4 | "dependencies": {
5 | "angular": "~1.2.0",
6 | "cal-heatmap": "~3.4.0"
7 | },
8 | "devDependencies": {
9 | "angular-mocks": "~1.2.0",
10 | "angular-scenario": "~1.2.0"
11 | },
12 | "homepage":"https://github.com/shekhargulati/angular-cal-heatmap-directive",
13 | "authors": [
14 | "Shekhar Gulati (shekhargulati84@gmail.com)"
15 | ],
16 | "description": "Angularjs directive to render cal-heatmap",
17 | "main": "app/scripts/calHeatmap.js",
18 | "keywords": [
19 | "cal-heatmap",
20 | "directive",
21 | "angularjs"
22 | ],
23 | "license": "MIT",
24 | "ignore": [
25 | "**/.*",
26 | "node_modules",
27 | "bower_components",
28 | "test/components",
29 | "test",
30 | "tests"
31 | ]
32 | }
33 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "angularcalheatmapdirective",
3 | "version": "0.0.0",
4 | "dependencies": {},
5 | "devDependencies": {
6 | "grunt": "~0.4.1",
7 | "grunt-autoprefixer": "~0.4.0",
8 | "grunt-concurrent": "~0.4.1",
9 | "grunt-contrib-clean": "~0.5.0",
10 | "grunt-contrib-coffee": "~0.7.0",
11 | "grunt-contrib-compass": "~0.6.0",
12 | "grunt-contrib-concat": "~0.3.0",
13 | "grunt-contrib-connect": "~0.5.0",
14 | "grunt-contrib-copy": "~0.4.1",
15 | "grunt-contrib-cssmin": "~0.7.0",
16 | "grunt-contrib-htmlmin": "~0.1.3",
17 | "grunt-contrib-imagemin": "~0.3.0",
18 | "grunt-contrib-jshint": "~0.7.1",
19 | "grunt-contrib-uglify": "~0.2.0",
20 | "grunt-contrib-watch": "~0.5.2",
21 | "grunt-google-cdn": "~0.2.0",
22 | "grunt-ngmin": "~0.0.2",
23 | "grunt-rev": "~0.1.0",
24 | "grunt-svgmin": "~0.2.0",
25 | "grunt-usemin": "~2.0.0",
26 | "jshint-stylish": "~0.1.3",
27 | "load-grunt-tasks": "~0.2.0",
28 | "time-grunt": "~0.2.0"
29 | },
30 | "engines": {
31 | "node": ">=0.8.0"
32 | },
33 | "scripts": {
34 | "test": "grunt test"
35 | }
36 | }
--------------------------------------------------------------------------------
/karma.conf.js:
--------------------------------------------------------------------------------
1 | // Karma configuration
2 | // http://karma-runner.github.io/0.10/config/configuration-file.html
3 |
4 | module.exports = function(config) {
5 | config.set({
6 | // base path, that will be used to resolve files and exclude
7 | basePath: '',
8 |
9 | // testing framework to use (jasmine/mocha/qunit/...)
10 | frameworks: ['jasmine'],
11 |
12 | // list of files / patterns to load in the browser
13 | files: [
14 | 'app/bower_components/angular/angular.js',
15 | 'app/bower_components/angular-mocks/angular-mocks.js',
16 | 'app/scripts/*.js',
17 | 'app/scripts/**/*.js',
18 | 'test/mock/**/*.js',
19 | 'test/spec/**/*.js'
20 | ],
21 |
22 | // list of files / patterns to exclude
23 | exclude: [],
24 |
25 | // web server port
26 | port: 8080,
27 |
28 | // level of logging
29 | // possible values: LOG_DISABLE || LOG_ERROR || LOG_WARN || LOG_INFO || LOG_DEBUG
30 | logLevel: config.LOG_INFO,
31 |
32 |
33 | // enable / disable watching file and executing tests whenever any file changes
34 | autoWatch: false,
35 |
36 |
37 | // Start these browsers, currently available:
38 | // - Chrome
39 | // - ChromeCanary
40 | // - Firefox
41 | // - Opera
42 | // - Safari (only Mac)
43 | // - PhantomJS
44 | // - IE (only Windows)
45 | browsers: ['Chrome'],
46 |
47 |
48 | // Continuous Integration mode
49 | // if true, it capture browsers, run tests and exit
50 | singleRun: false
51 | });
52 | };
53 |
--------------------------------------------------------------------------------
/karma-e2e.conf.js:
--------------------------------------------------------------------------------
1 | // Karma configuration
2 | // http://karma-runner.github.io/0.10/config/configuration-file.html
3 |
4 | module.exports = function(config) {
5 | config.set({
6 | // base path, that will be used to resolve files and exclude
7 | basePath: '',
8 |
9 | // testing framework to use (jasmine/mocha/qunit/...)
10 | frameworks: ['ng-scenario'],
11 |
12 | // list of files / patterns to load in the browser
13 | files: [
14 | 'test/e2e/**/*.js'
15 | ],
16 |
17 | // list of files / patterns to exclude
18 | exclude: [],
19 |
20 | // web server port
21 | port: 8080,
22 |
23 | // level of logging
24 | // possible values: LOG_DISABLE || LOG_ERROR || LOG_WARN || LOG_INFO || LOG_DEBUG
25 | logLevel: config.LOG_INFO,
26 |
27 |
28 | // enable / disable watching file and executing tests whenever any file changes
29 | autoWatch: false,
30 |
31 |
32 | // Start these browsers, currently available:
33 | // - Chrome
34 | // - ChromeCanary
35 | // - Firefox
36 | // - Opera
37 | // - Safari (only Mac)
38 | // - PhantomJS
39 | // - IE (only Windows)
40 | browsers: ['Chrome'],
41 |
42 |
43 | // Continuous Integration mode
44 | // if true, it capture browsers, run tests and exit
45 | singleRun: false
46 |
47 | // Uncomment the following lines if you are using grunt's server to run the tests
48 | // proxies: {
49 | // '/': 'http://localhost:9000/'
50 | // },
51 | // URL root prevent conflicts with the site root
52 | // urlRoot: '_karma_'
53 | });
54 | };
55 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | #Cal Heatmap AngularJS Directive#
2 |
3 | This is an AngularJS directive for cal-heatmap http://kamisama.github.io/cal-heatmap/
4 |
5 | ##How to use it##
6 |
7 | Use bower to install the library
8 | ```
9 | $ bower install angular-cal-heatmap-directive
10 | ```
11 |
12 | Create an index.html as shown below.
13 | ```
14 |
15 |
16 |
17 | Angular Cal Heatmap directive
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 | ```
33 |
34 | The app.js is the application Angualar app. Add the dependency to the calHeatmap directive in the app.js as shown below.
35 | ```
36 | angular.module('myapp',['calHeatmap']);
37 | ```
38 | This will generate a default Cal Heatmap as shown below.
39 | 
40 |
41 | To add your own configuration, you can use config attribute as shown below.
42 |
43 | ```
44 |
45 |
46 |
47 | Angular Cal Heatmap directive
48 |
49 |
50 |
51 |
52 |
53 |
54 |
55 |
56 |
57 |
58 |
59 |
60 |
61 |
62 | ```
63 |
64 | This will produce the heatmap as shown below.
65 | 
66 |
67 | This directive supports most of the options supported by cal-heatmap library http://kamisama.github.io/cal-heatmap/#options
68 |
69 |
--------------------------------------------------------------------------------
/app/scripts/calHeatmap.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | angular.module('calHeatmap', [])
4 | .directive('calHeatmap', function() {
5 | function link(scope, el) {
6 | var config = scope.config;
7 | var element = el[0];
8 | var cal = new CalHeatMap();
9 | cal.init({
10 | itemSelector: element,
11 | domain: !config ? 'month' : config.domain ? config.domain : 'month',
12 | subDomain: !config ? 'day' : config.subDomain ? config.subDomain : 'day',
13 | subDomainTextFormat: !config ? '%d' : config.subDomainTextFormat ? config.subDomainTextFormat : '%d',
14 | data: !config ? '' : config.data ? config.data : '',
15 | start: !config ? new Date() : config.start ? config.start : new Date(),
16 | cellSize: !config ? 25 : config.cellSize ? config.cellSize : 25,
17 | range: !config ? 3 : config.range ? config.range : 3,
18 | domainGutter: !config ? 10 : config.domainGutter ? config.domainGutter : 10,
19 | legend: !config ? [10, 20, 30, 40] : config.legend ? config.legend : [10, 20, 30, 40],
20 | displayLegend: !config ? true : config.displayLegend || true,
21 | legendCellSize: !config ? 10 : config.legendCellSize || 10,
22 | legendCellPadding: !config ? 2 : config.legendCellPadding || 2,
23 | legendMargin: !config ? [10, 0, 0, 0] : config.legendMargin || [10, 0, 0, 0],
24 | legendVerticalPosition: !config ? 'bottom' : config.legendVerticalPosition || 'bottom',
25 | legendHorizontalPosition: !config ? 'left' : config.legendHorizontalPosition || 'left',
26 | legendOrientation: !config ? 'horizontal' : config.legendOrientation || 'horizontal',
27 | legendColors: !config ? null : config.legendColors || null,
28 | itemName: !config ? 'item' : config.itemName ? config.itemName : 'item'
29 | });
30 |
31 | scope.$watch("config.displayLegend", function(newValue, oldValue) {
32 | if (newValue) {
33 | cal.setLegend();
34 | } else {
35 | cal.removeLegend();
36 | }
37 | }, true);
38 |
39 | scope.$watch("config.data", function(newValue, oldValue) {
40 | cal.update(newValue);
41 | });
42 |
43 | }
44 |
45 | return {
46 | template: '',
47 | restrict: 'E',
48 | link: link,
49 | scope: {
50 | config: '='
51 | }
52 | };
53 | });
54 |
--------------------------------------------------------------------------------