Added people block

Carlos Purificação
1 parent 36470e94
Showing 5 changed files with 103 additions and 0 deletions Show diff stats
src/app/layout/blocks/people-block/index.ts
src/app/layout/blocks/people-block/people-block.component.spec.ts
src/app/layout/blocks/people-block/people-block.component.ts
src/app/layout/blocks/people-block/people-block.html
src/app/layout/blocks/people-block/people-block.scss
@@ -0,0 +1,2 @@
+/* Module Index Entry - generated using the script npm run generate-index */
+export * from "./people-block.component";
@@ -0,0 +1,53 @@
+import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
+import {Provider, Input, provide, Component} from 'ng-forward';
+
+import {PeopleBlockComponent} from './people-block.component';
+
+const htmlTemplate: string = '<noosfero-people-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-people-block>';
+
+const tcb = new TestComponentBuilder();
+
+describe("Components", () => {
+    describe("People Block Component", () => {
+
+        beforeEach(angular.mock.module("templates"));
+
+        let state = jasmine.createSpyObj("state", ["go"]);
+        let providers = [
+            new Provider('truncateFilter', { useValue: () => { } }),
+            new Provider('stripTagsFilter', { useValue: () => { } }),
+            new Provider('$state', { useValue: state }),
+            new Provider('ProfileService', {
+                useValue: {
+                    getProfileMembers: (profileId: number, filters: any): any => {
+                        return Promise.resolve({ data: { people: [{ identifier: "person1" }] } });
+                    }
+                }
+            }),
+        ];
+        @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [PeopleBlockComponent], providers: providers })
+        class BlockContainerComponent {
+            block = { type: 'Block', settings: {} };
+            owner = { name: 'profile-name' };
+            constructor() {
+            }
+        }
+
+        it("get people of the block owner", done => {
+            tcb.createAsync(BlockContainerComponent).then(fixture => {
+                let block: PeopleBlockComponent = fixture.debugElement.componentViewChildren[0].componentInstance;
+                expect(block.people).toEqual([{ identifier: "person1" }]);
+                done();
+            });
+        });
+
+        it("render the profile image for each person", done => {
+            tcb.createAsync(BlockContainerComponent).then(fixture => {
+                fixture.debugElement.getLocal("$rootScope").$apply();
+                expect(fixture.debugElement.queryAll("noosfero-profile-image").length).toEqual(1);
+                done();
+            });
+        });
+
+    });
+});
 \ No newline at end of file
@@ -0,0 +1,26 @@
+import {Input, Inject, Component} from "ng-forward";
+import {EnvironmentService} from "../../../../lib/ng-noosfero-api/http/environment.service";
+
+@Component({
+    selector: "noosfero-people-block",
+    templateUrl: 'app/layout/blocks/people-block/people-block.html',
+})
+@Inject(EnvironmentService)
+export class PeopleBlockComponent {
+
+    @Input() block: noosfero.Block;
+    @Input() owner: noosfero.Environment;
+
+    people: noosfero.Person[] = [];
+
+    constructor(private environmentService: EnvironmentService) {
+        console.debug("Created PeopleBlockComponent");
+    }
+
+    ngOnInit() {
+        this.environmentService.getEnvironmentPeople({ limit: '6' }).then((people: noosfero.Person[]) => {
+            console.debug("People returned in PeopleBlockComponent: ", people);
+            this.people = people;
+        });
+    }
+}
@@ -0,0 +1,5 @@
+<div class="peoples-block">
+  <a ng-repeat="person in ctrl.people" ui-sref="main.profile.home({profile: person.identifier})" class="person">
+    <noosfero-profile-image [profile]="person"></noosfero-profile-image>
+  </a>
+</div>
@@ -0,0 +1,17 @@
+.members-block {
+  .member {
+    img, i.profile-image {
+      width: 60px;
+    }
+    img {
+      display: inline-block;
+      vertical-align: top;
+    }
+    i.profile-image {
+        text-align: center;
+        background-color: #889DB1;
+        color: #F1F1F1;
+        font-size: 4.5em;
+    }
+  }
+}
@@ -0,0 +1,2 @@		@@ -0,0 +1,2 @@
	1	+/* Module Index Entry - generated using the script npm run generate-index */
	2	+export * from "./people-block.component";
	@@ -0,0 +1,53 @@		@@ -0,0 +1,53 @@
		1	+import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
		2	+import {Provider, Input, provide, Component} from 'ng-forward';
		3	+
		4	+import {PeopleBlockComponent} from './people-block.component';
		5	+
		6	+const htmlTemplate: string = '<noosfero-people-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-people-block>';
		7	+
		8	+const tcb = new TestComponentBuilder();
		9	+
		10	+describe("Components", () => {
		11	+ describe("People Block Component", () => {
		12	+
		13	+ beforeEach(angular.mock.module("templates"));
		14	+
		15	+ let state = jasmine.createSpyObj("state", ["go"]);
		16	+ let providers = [
		17	+ new Provider('truncateFilter', { useValue: () => { } }),
		18	+ new Provider('stripTagsFilter', { useValue: () => { } }),
		19	+ new Provider('$state', { useValue: state }),
		20	+ new Provider('ProfileService', {
		21	+ useValue: {
		22	+ getProfileMembers: (profileId: number, filters: any): any => {
		23	+ return Promise.resolve({ data: { people: [{ identifier: "person1" }] } });
		24	+ }
		25	+ }
		26	+ }),
		27	+ ];
		28	+ @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [PeopleBlockComponent], providers: providers })
		29	+ class BlockContainerComponent {
		30	+ block = { type: 'Block', settings: {} };
		31	+ owner = { name: 'profile-name' };
		32	+ constructor() {
		33	+ }
		34	+ }
		35	+
		36	+ it("get people of the block owner", done => {
		37	+ tcb.createAsync(BlockContainerComponent).then(fixture => {
		38	+ let block: PeopleBlockComponent = fixture.debugElement.componentViewChildren[0].componentInstance;
		39	+ expect(block.people).toEqual([{ identifier: "person1" }]);
		40	+ done();
		41	+ });
		42	+ });
		43	+
		44	+ it("render the profile image for each person", done => {
		45	+ tcb.createAsync(BlockContainerComponent).then(fixture => {
		46	+ fixture.debugElement.getLocal("$rootScope").$apply();
		47	+ expect(fixture.debugElement.queryAll("noosfero-profile-image").length).toEqual(1);
		48	+ done();
		49	+ });
		50	+ });
		51	+
		52	+ });
		53	+});
0	\ No newline at end of file	54	\ No newline at end of file
@@ -0,0 +1,26 @@		@@ -0,0 +1,26 @@
	1	+import {Input, Inject, Component} from "ng-forward";
	2	+import {EnvironmentService} from "../../../../lib/ng-noosfero-api/http/environment.service";
	3	+
	4	+@Component({
	5	+ selector: "noosfero-people-block",
	6	+ templateUrl: 'app/layout/blocks/people-block/people-block.html',
	7	+})
	8	+@Inject(EnvironmentService)
	9	+export class PeopleBlockComponent {
	10	+
	11	+ @Input() block: noosfero.Block;
	12	+ @Input() owner: noosfero.Environment;
	13	+
	14	+ people: noosfero.Person[] = [];
	15	+
	16	+ constructor(private environmentService: EnvironmentService) {
	17	+ console.debug("Created PeopleBlockComponent");
	18	+ }
	19	+
	20	+ ngOnInit() {
	21	+ this.environmentService.getEnvironmentPeople({ limit: '6' }).then((people: noosfero.Person[]) => {
	22	+ console.debug("People returned in PeopleBlockComponent: ", people);
	23	+ this.people = people;
	24	+ });
	25	+ }
	26	+}
@@ -0,0 +1,5 @@		@@ -0,0 +1,5 @@
	1	+<div class="peoples-block">
	2	+ <a ng-repeat="person in ctrl.people" ui-sref="main.profile.home({profile: person.identifier})" class="person">
	3	+ <noosfero-profile-image [profile]="person"></noosfero-profile-image>
	4	+ </a>
	5	+</div>
@@ -0,0 +1,17 @@		@@ -0,0 +1,17 @@
	1	+.members-block {
	2	+ .member {
	3	+ img, i.profile-image {
	4	+ width: 60px;
	5	+ }
	6	+ img {
	7	+ display: inline-block;
	8	+ vertical-align: top;
	9	+ }
	10	+ i.profile-image {
	11	+ text-align: center;
	12	+ background-color: #889DB1;
	13	+ color: #F1F1F1;
	14	+ font-size: 4.5em;
	15	+ }
	16	+ }
	17	+}