Started xosSmartPie component
diff --git a/views/ngXosLib/bower.json b/views/ngXosLib/bower.json
index 56fed7f..bc9c23a 100644
--- a/views/ngXosLib/bower.json
+++ b/views/ngXosLib/bower.json
@@ -20,7 +20,8 @@
"ng-lodash": "0.3.0",
"angular-cookies": "1.4.7",
"angular-animate": "1.4.7",
- "lodash": "~4.11.1"
+ "lodash": "~4.11.1",
+ "angular-chart.js": "~0.10.2"
},
"devDependencies": {
"angular-mocks": "1.4.7",
diff --git a/views/ngXosLib/generator-xos/app/templates/bower.json b/views/ngXosLib/generator-xos/app/templates/bower.json
index 9336a98..bbddc5b 100644
--- a/views/ngXosLib/generator-xos/app/templates/bower.json
+++ b/views/ngXosLib/generator-xos/app/templates/bower.json
@@ -25,6 +25,7 @@
"angular-animate": "1.4.7",
"angular-resource": "1.4.7",
"lodash": "~4.11.1",
- "bootstrap-css": "3.3.6"
+ "bootstrap-css": "3.3.6",
+ "angular-chart.js": "~0.10.2"
}
}
diff --git a/views/ngXosLib/xosHelpers/spec/ui/smart-pie.test.js b/views/ngXosLib/xosHelpers/spec/ui/smart-pie.test.js
new file mode 100644
index 0000000..a679c66
--- /dev/null
+++ b/views/ngXosLib/xosHelpers/spec/ui/smart-pie.test.js
@@ -0,0 +1,91 @@
+/**
+ * © OpenCORD
+ *
+ * Created by teone on 3/24/16.
+ */
+
+(function () {
+ 'use strict';
+
+ let mockData;
+
+ describe('The xos.helper module', function(){
+ describe('The xos-smart-pie component', () => {
+
+ var spy, scope, isolatedScope, element;
+
+ beforeEach(module('xos.helpers'));
+
+ beforeEach(function() {
+
+ // set mockData
+ mockData = [
+ {
+ id: 1,
+ first_name: 'Jon',
+ last_name: 'Snow',
+ category: 1
+ },
+ {
+ id: 2,
+ first_name: 'Danaerys',
+ last_name: 'Targaryen',
+ category: 2
+ },
+ {
+ id: 3,
+ first_name: 'Aria',
+ last_name: 'Stark',
+ category: 1
+ }
+ ]
+
+ });
+
+ // mock the service
+ beforeEach(function(){
+ module(function($provide){
+ $provide.service('MockResource', function(){
+ return {
+ query: ''
+ }
+ });
+ });
+ })
+
+ beforeEach(inject(function ($compile, $rootScope, $q, MockResource) {
+ scope = $rootScope.$new();
+
+ scope.config = {
+ resource: 'MockResource',
+ groupBy: 'category',
+ classes: 'my-test-class'
+ };
+
+ spy = MockResource;
+
+ spyOn(MockResource, 'query').and.callFake(function() {
+ var deferred = $q.defer();
+ deferred.resolve(mockData);
+ return {$promise: deferred.promise};
+ });
+
+ element = angular.element('<xos-smart-pie config="config"></xos-smart-pie>');
+ $compile(element)(scope);
+ scope.$digest();
+ isolatedScope = element.isolateScope().vm;
+ }));
+
+ it('should attach provided classes', () => {
+ expect($(element).find('canvas')).toHaveClass('my-test-class');
+ });
+
+ it('should group elements', () => {
+ let groupedData = [2, 1];
+ expect(spy.query).toHaveBeenCalled();
+ expect(isolatedScope.data).toEqual(groupedData);
+ });
+
+ });
+ });
+})();
\ No newline at end of file
diff --git a/views/ngXosLib/xosHelpers/src/ui_components/smartComponents/smartPie/smartPie.component.js b/views/ngXosLib/xosHelpers/src/ui_components/smartComponents/smartPie/smartPie.component.js
new file mode 100644
index 0000000..0468644
--- /dev/null
+++ b/views/ngXosLib/xosHelpers/src/ui_components/smartComponents/smartPie/smartPie.component.js
@@ -0,0 +1,69 @@
+/**
+ * © OpenCORD
+ *
+ * Visit http://guide.xosproject.org/devguide/addview/ for more information
+ *
+ * Created by teone on 3/24/16.
+ */
+
+(function () {
+ 'use strict';
+
+ angular.module('xos.uiComponents')
+ /**
+ * @ngdoc directive
+ * @name xos.uiComponents.directive:xosSmartPie
+ * @restrict E
+ * @description The xos-table directive
+ * @param {Object} config The configuration for the component,
+ * it is composed by the name of an angular [$resource](https://docs.angularjs.org/api/ngResource/service/$resource)
+ * and a field name that is used to group the data.
+ * ```
+ * {
+ resource: 'Users',
+ groupBy: 'fieldName',
+ classes: 'my-custom-class',
+ }
+ * ```
+ * @scope
+ * @example
+ */
+ .directive('xosSmartPie', function(){
+ return {
+ restrict: 'E',
+ scope: {
+ config: '='
+ },
+ template: `
+ <canvas
+ class="chart chart-pie {{vm.config.classes}}"
+ chart-data="vm.data" chart-labels="vm.labels">
+ </canvas>
+ `,
+ bindToController: true,
+ controllerAs: 'vm',
+ controller: function($injector, _){
+ this.Resource = $injector.get(this.config.resource);
+
+ const getData = () => {
+ this.Resource.query().$promise
+ .then((res) => {
+
+ if(!res[0]){
+ return;
+ }
+
+ // group data
+ let grouped = _.groupBy(res, this.config.groupBy);
+ this.data = _.reduce(Object.keys(grouped), (data, group) => data.concat(grouped[group].length), []);
+
+ // create labels
+ this.labels = Object.keys(grouped);
+ });
+ }
+
+ getData();
+ }
+ };
+ });
+})();
diff --git a/views/ngXosLib/xosHelpers/src/ui_components/smartComponents/smartTable/smartTable.component.js b/views/ngXosLib/xosHelpers/src/ui_components/smartComponents/smartTable/smartTable.component.js
index 8cbe0af..74226cc 100644
--- a/views/ngXosLib/xosHelpers/src/ui_components/smartComponents/smartTable/smartTable.component.js
+++ b/views/ngXosLib/xosHelpers/src/ui_components/smartComponents/smartTable/smartTable.component.js
@@ -140,7 +140,6 @@
label: 'delete',
icon: 'remove',
cb: (item) => {
- console.log(item);
this.Resource.delete({id: item.id}).$promise
.then(() => {
_.remove(this.data, (d) => d.id === item.id);
diff --git a/views/ngXosLib/xosHelpers/src/ui_components/ui-components.module.js b/views/ngXosLib/xosHelpers/src/ui_components/ui-components.module.js
index 03d6308..ad3dc49 100644
--- a/views/ngXosLib/xosHelpers/src/ui_components/ui-components.module.js
+++ b/views/ngXosLib/xosHelpers/src/ui_components/ui-components.module.js
@@ -24,5 +24,6 @@
**/
angular.module('xos.uiComponents', [
+ 'chart.js'
])
})();