Commit 5af8017d525310c9e9dcfaa67a27850cd6a192c3

Authored by Leandro Santos
1 parent c73e431e

Adding counters to statistics block

src/app/layout/blocks/statistics/statistics-block.component.spec.ts
1   -import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
2   -import {Component} from 'ng-forward';
3   -
  1 +import {ComponentTestHelper, createClass} from './../../../../spec/component-test-helper';
4 2 import {StatisticsBlockComponent} from './statistics-block.component';
5   -
6   -const tcb = new TestComponentBuilder();
  3 +import * as helpers from "../../../../spec/helpers";
7 4  
8 5 const htmlTemplate: string = '<noosfero-statistics-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-statistics-block>';
9 6  
10 7 describe("Components", () => {
11 8  
12 9 describe("Statistics Block Component", () => {
13   -
  10 + let helper: ComponentTestHelper<StatisticsBlockComponent>;
14 11 beforeEach(angular.mock.module("templates"));
15   - beforeEach(angular.mock.module("ngSanitize"));
16   -
17   - it("display title stored in block attribute", done => {
18 12  
19   - @Component({
20   - selector: 'test-container-component',
  13 + beforeEach((done) => {
  14 + let cls = createClass({
21 15 template: htmlTemplate,
22 16 directives: [StatisticsBlockComponent],
23   - })
24   - class CustomBlockType {
25   - block: any = { settings: { user_counter: '<em>block content</em>' } };
26   - owner: any = { name: 'profile-name' };
27   - }
28   - tcb.createAsync(CustomBlockType).then(fixture => {
29   - expect(fixture.debugElement.query(".statistics-block").text().trim()).toEqual('block content');
30   - done();
  17 + providers: helpers.provideFilters("translateFilter"),
  18 + properties: {
  19 + block: {
  20 + user_counter: 1, users: 10, enterprise_counter: 1, enterprises: 20,
  21 + product_counter: 1, products: 30, community_counter: 1, communities: 40,
  22 + category_counter: 1, categories: 50, tag_counter: 1, tags: 60,
  23 + comment_counter: 1, comments: 70, hit_counter: 1, hits: 80
  24 + }
  25 + }
  26 + // this.counters.push({ 'should_display': this.block.enterprise_counter, 'value': this.block.enterprises, 'name': 'enterprises' })
  27 + // this.counters.push({ 'should_display': this.block.product_counter, 'value': this.block.products, 'name': 'products' })
  28 + // this.counters.push({ 'should_display': this.block.community_counter, 'value': this.block.communities, 'name': 'communities' })
  29 + // this.counters.push({ 'should_display': this.block.category_counter, 'value': this.block.categories, 'name': 'categories' })
  30 + // this.counters.push({ 'should_display': this.block.tag_counter, 'value': this.block.tags, 'name': 'tags' })
  31 + // this.counters.push({ 'should_display': this.block.comment_counter, 'value': this.block.comments, 'name': 'comments' })
  32 + // this.counters.push({ 'should_display': this.block.hit_counter, 'value': this.block.hits, 'name': 'hits' })
31 33 });
  34 + helper = new ComponentTestHelper<StatisticsBlockComponent>(cls, done);
32 35 });
33 36  
34   - });
  37 + it("get user counter information in array", () => {
  38 + helper.component.counters.forEach((obj: any) => { delete obj.$$hashKey; });
  39 + expect(helper.component.counters).toContain({ 'should_display': 1, 'value': 10, 'name': 'users' });
  40 + });
  41 +
  42 + it("get user enterprise information in array", () => {
  43 + helper.component.counters.forEach((obj: any) => { delete obj.$$hashKey; });
  44 + expect(helper.component.counters).toContain({ 'should_display': 1, 'value': 20, 'name': 'enterprises' });
  45 + });
  46 +
  47 + it("get product counter information in array", () => {
  48 + helper.component.counters.forEach((obj: any) => { delete obj.$$hashKey; });
  49 + expect(helper.component.counters).toContain({ 'should_display': 1, 'value': 30, 'name': 'products' });
  50 + });
  51 +
  52 + it("get community counter information in array", () => {
  53 + helper.component.counters.forEach((obj: any) => { delete obj.$$hashKey; });
  54 + expect(helper.component.counters).toContain({ 'should_display': 1, 'value': 40, 'name': 'communities' });
  55 + });
  56 +
  57 + it("get category counter information in array", () => {
  58 + helper.component.counters.forEach((obj: any) => { delete obj.$$hashKey; });
  59 + expect(helper.component.counters).toContain({ 'should_display': 1, 'value': 50, 'name': 'categories' });
  60 + });
35 61  
  62 + it("get tag counter information in array", () => {
  63 + helper.component.counters.forEach((obj: any) => { delete obj.$$hashKey; });
  64 + expect(helper.component.counters).toContain({ 'should_display': 1, 'value': 60, 'name': 'tags' });
  65 + });
  66 +
  67 + it("get comment counter information in array", () => {
  68 + helper.component.counters.forEach((obj: any) => { delete obj.$$hashKey; });
  69 + expect(helper.component.counters).toContain({ 'should_display': 1, 'value': 70, 'name': 'comments' });
  70 + });
  71 +
  72 + it("get hit counter information in array", () => {
  73 + helper.component.counters.forEach((obj: any) => { delete obj.$$hashKey; });
  74 + expect(helper.component.counters).toContain({ 'should_display': 1, 'value': 80, 'name': 'hits' });
  75 + });
  76 +
  77 + it("should render the user count information", () => {
  78 + expect(helper.find('.list-group-item.users').length).toEqual(1, "The statistics-block should have a list item with users class");
  79 + });
  80 +
  81 +
  82 + // it("should not render user count information if has no configuration on block", () => {
  83 + // helper.component.counters.forEach((obj: any) => { delete obj.$$hashKey });
  84 + // expect(helper.component.counters).toContain({ 'should_display': 1, 'value': 30, 'name': 'enterprises' });
  85 + // });
  86 +
  87 + // this.counters.push({ 'should_display': this.block.enterprise_counter, 'value': this.block.enterprises, 'name': 'enterprises' })
  88 + // this.counters.push({ 'should_display': this.block.product_counter, 'value': this.block.products, 'name': 'products' })
  89 + // this.counters.push({ 'should_display': this.block.community_counter, 'value': this.block.communities, 'name': 'communities' })
  90 + // this.counters.push({ 'should_display': this.block.category_counter, 'value': this.block.categories, 'name': 'categories' })
  91 + // this.counters.push({ 'should_display': this.block.tag_counter, 'value': this.block.tags, 'name': 'tags' })
  92 + // this.counters.push({ 'should_display': this.block.comment_counter, 'value': this.block.comments, 'name': 'comments' })
  93 + // this.counters.push({ 'should_display': this.block.hit_counter, 'value': this.block.hits, 'name': 'hits' })
  94 +
  95 + /**
  96 + * There are helper functions to access the JQuery DOM like this.
  97 + */
  98 + // it("render the profile image for each person", () => {
  99 + // expect(helper.all("list-group-item").length).toEqual(3);
  100 + // });
  101 +
  102 + /**
  103 + * The main debugElement element is also available
  104 + */
  105 + // it("render the main noosfero people block", () => {
  106 + // expect(helper.debugElement.children().length).toEqual(1, "The people-block should have a div children");
  107 + // });
  108 +
  109 + /**
  110 + * Just another example of a JQuery DOM helper function
  111 + */
  112 + // it("render the noosfero people block div", () => {
  113 + // let div = helper.findChildren("noosfero-people-block", "div");
  114 + // expect(div.className).toBe('people-block', "The class should be people-block");
  115 + // });
  116 + });
36 117 });
... ...
src/app/layout/blocks/statistics/statistics-block.component.ts
1   -import {Component, Input} from "ng-forward";
  1 +import {Input, Inject, Component} from "ng-forward";
2 2  
3 3 @Component({
4 4 selector: "noosfero-statistics-block",
... ... @@ -7,12 +7,20 @@ import {Component, Input} from &quot;ng-forward&quot;;
7 7  
8 8 export class StatisticsBlockComponent {
9 9  
10   - @Input() block: any;
  10 + @Input() block: noosfero.StatisticsBlock;
11 11 @Input() owner: any;
12 12  
13   - html: string;
  13 + counters: any = [];
14 14  
15 15 ngOnInit() {
16   - this.html = this.block.settings.user_counter;
  16 + this.counters.push({ 'should_display': this.block.user_counter, 'value': this.block.users, 'name': 'users' });
  17 + this.counters.push({ 'should_display': this.block.enterprise_counter, 'value': this.block.enterprises, 'name': 'enterprises' });
  18 + this.counters.push({ 'should_display': this.block.product_counter, 'value': this.block.products, 'name': 'products' });
  19 + this.counters.push({ 'should_display': this.block.community_counter, 'value': this.block.communities, 'name': 'communities' });
  20 + this.counters.push({ 'should_display': this.block.category_counter, 'value': this.block.categories, 'name': 'categories' });
  21 + this.counters.push({ 'should_display': this.block.tag_counter, 'value': this.block.tags, 'name': 'tags' });
  22 + this.counters.push({ 'should_display': this.block.comment_counter, 'value': this.block.comments, 'name': 'comments' });
  23 + this.counters.push({ 'should_display': this.block.hit_counter, 'value': this.block.hits, 'name': 'hits' });
  24 +
17 25 }
18 26 }
... ...
src/app/layout/blocks/statistics/statistics-block.html
1   -<div class="statistics-block" ng-bind-html="ctrl.html">
  1 +<div class="statistics-block">
  2 + <ul class="list-group">
  3 + <li ng-repeat="counter in ctrl.counters" class="list-group-item {{counter.name}}" ng-show="counter.should_display" >
  4 + <span class="badge {{counter.name}}">{{counter.value}}</span>
  5 + {{"statistics." + counter.name | translate}}
  6 + </li>
  7 +
  8 + </ul>
2 9 </div>
... ...
src/app/layout/blocks/statistics/statistics.scss 0 → 100644
... ... @@ -0,0 +1,3 @@
  1 +.statistics-block {
  2 + background-color: blue;
  3 +}
... ...
src/languages/en.json
... ... @@ -46,5 +46,13 @@
46 46 "article.basic_editor.success.message": "Article saved!",
47 47 "article.basic_editor.visibility": "Visibility",
48 48 "article.basic_editor.visibility.public": "Public",
49   - "article.basic_editor.visibility.private": "Private"
  49 + "article.basic_editor.visibility.private": "Private",
  50 + "statistics.users": "Users",
  51 + "statistics.enterprises": "Enterprises",
  52 + "statistics.products": "Products",
  53 + "statistics.communities": "Communities",
  54 + "statistics.categories": "Categories",
  55 + "statistics.tags": "Tags",
  56 + "statistics.comments": "Comments",
  57 + "statistics.hits": "Hits"
50 58 }
... ...
src/languages/pt.json
... ... @@ -46,5 +46,13 @@
46 46 "article.basic_editor.success.message": "Artigo salvo com sucesso!",
47 47 "article.basic_editor.visibility": "Visibilidade",
48 48 "article.basic_editor.visibility.public": "Público",
49   - "article.basic_editor.visibility.private": "Privado"
  49 + "article.basic_editor.visibility.private": "Privado",
  50 + "statistics.users": "Usuários",
  51 + "statistics.enterprises": "Empreendimentos",
  52 + "statistics.products": "Produtos",
  53 + "statistics.communities": "Comunidades",
  54 + "statistics.categories": "Categorias",
  55 + "statistics.tags": "Tags",
  56 + "statistics.comments": "Comentários",
  57 + "statistics.hits": "Acessos"
50 58 }
... ...
src/lib/ng-noosfero-api/interfaces/statistics_block.ts 0 → 100644
... ... @@ -0,0 +1,20 @@
  1 +namespace noosfero {
  2 + export interface StatisticsBlock extends Block {
  3 + user_counter: boolean;
  4 + users: number;
  5 + enterprise_counter: boolean;
  6 + enterprises: number;
  7 + product_counter: boolean;
  8 + products: number;
  9 + community_counter: boolean;
  10 + communities: number;
  11 + category_counter: boolean;
  12 + categories: number;
  13 + tag_counter: boolean;
  14 + tags: number;
  15 + comment_counter: boolean;
  16 + comments: number;
  17 + hit_counter: boolean;
  18 + hits: number;
  19 + }
  20 +}
... ...