Rename BlockComponent to BlockContentComponent

Victor Costa
1 parent 63a0a102
Showing 8 changed files with 115 additions and 116 deletions Show diff stats
src/app/layout/blocks/block-content.component.spec.ts
src/app/layout/blocks/block-content.component.ts
src/app/layout/blocks/block.component.spec.ts
src/app/layout/blocks/block.component.ts
src/app/layout/blocks/index.ts
src/app/layout/blocks/main/main-block.component.ts
src/app/layout/boxes/box.html
src/app/main/main.component.ts
@@ -0,0 +1,91 @@
+import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
+import {Input, provide, Component} from 'ng-forward';
+
+import {BlockContentComponent} from './block-content.component';
+
+const tcb = new TestComponentBuilder();
+
+const htmlTemplate: string = '<noosfero-block-content [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-block-content>';
+
+describe("Components", () => {
+    describe("Block Component", () => {
+
+        // the karma preprocessor html2js transform the templates html into js files which put
+        // the templates to the templateCache into the module templates
+        // we need to load the module templates here as the template for the
+        // component Block will be load on our tests
+        beforeEach(angular.mock.module("templates"));
+
+        it("receives the block and the owner as inputs", done => {
+
+            // Creating a container component (BlockContainerComponent) to include
+            // the component under test (Block)
+            @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [BlockContentComponent] })
+            class BlockContainerComponent {
+                block = { type: 'Block' };
+                owner = { name: 'profile-name' };
+                constructor() {
+                }
+            }
+
+            // uses the TestComponentBuilder instance to initialize the component
+            tcb
+                .createAsync(BlockContainerComponent).then(fixture => {
+                    // and here we can inspect and run the test assertions
+                    let myComponent: BlockContentComponent = fixture.componentInstance;
+
+                    // assure the block object inside the Block matches
+                    // the provided through the parent component
+                    expect(myComponent.block.type).toEqual("Block");
+                    expect(myComponent.owner.name).toEqual("profile-name");
+                    done();
+                });
+        });
+
+
+        it("renders a component which matches to the block type", done => {
+            // CustomBlock component created to check if it will be used
+            // when a block with type 'CustomBlock' is provided to the noosfero-block (Block)
+            // *** Important *** - the selector is what ng-forward uses to define the name of the directive provider
+            @Component({ selector: 'noosfero-custom-block', template: "<h1>My Custom Block</h1>" })
+            class CustomBlock {
+                @Input() block: any;
+                @Input() owner: any;
+            }
+
+            @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [BlockContentComponent, CustomBlock] })
+            class CustomBlockType {
+                block = { type: 'CustomBlock' };
+                owner = { name: 'profile-name' };
+                constructor() {
+                }
+            }
+            tcb
+                .createAsync(CustomBlockType).then(fixture => {
+                    let myComponent: CustomBlockType = fixture.componentInstance;
+                    expect(myComponent.block.type).toEqual("CustomBlock");
+                    expect(fixture.debugElement.componentViewChildren[0].text()).toEqual("My Custom Block");
+                    done();
+                });
+        });
+
+
+        it("renders the default block when hasn't defined a block type", done => {
+            @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [BlockContentComponent] })
+            class CustomBlockType {
+                block: any = { type: null };
+                owner: any = { name: 'profile-name' };
+                constructor() {
+                }
+            }
+            tcb
+                .createAsync(CustomBlockType).then(fixture => {
+                    let myComponent: CustomBlockType = fixture.componentInstance;
+                    expect(myComponent.block.type).toBeNull();
+                    expect(!!fixture.debugElement.nativeElement.querySelector("noosfero-default-block")).toBeTruthy();
+                    done();
+                });
+        });
+
+    });
+});
@@ -0,0 +1,20 @@
+import { Input, Inject, Component } from 'ng-forward';
+
+@Component({
+    selector: 'noosfero-block-content',
+    template: '<div></div>'
+})
+@Inject("$element", "$scope", "$injector", "$compile")
+export class BlockContentComponent {
+
+    @Input() block: any;
+    @Input() owner: any;
+
+    ngOnInit() {
+        let blockName = (this.block && this.block.type) ? this.block.type.replace(/::/, '').replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase() : "default-block";
+        this.$element.replaceWith(this.$compile('<noosfero-' + blockName + ' [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-' + blockName + '>')(this.$scope));
+    }
+
+    constructor(private $element: any, private $scope: ng.IScope, private $injector: ng.auto.IInjectorService, private $compile: ng.ICompileService) {
+    }
+}
@@ -1,91 +0,0 @@
-import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
-import {Input, provide, Component} from 'ng-forward';
-
-import {BlockComponent} from './block.component';
-
-const tcb = new TestComponentBuilder();
-
-const htmlTemplate: string = '<noosfero-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-block>';
-
-describe("Components", () => {
-    describe("Block Component", () => {
-
-        // the karma preprocessor html2js transform the templates html into js files which put
-        // the templates to the templateCache into the module templates
-        // we need to load the module templates here as the template for the 
-        // component Block will be load on our tests
-        beforeEach(angular.mock.module("templates"));
-
-        it("receives the block and the owner as inputs", done => {
-
-            // Creating a container component (BlockContainerComponent) to include 
-            // the component under test (Block)  
-            @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [BlockComponent] })
-            class BlockContainerComponent {
-                block = { type: 'Block' };
-                owner = { name: 'profile-name' };
-                constructor() {
-                }
-            }
-
-            // uses the TestComponentBuilder instance to initialize the component
-            tcb
-                .createAsync(BlockContainerComponent).then(fixture => {
-                    // and here we can inspect and run the test assertions 
-                    let myComponent: BlockComponent = fixture.componentInstance;
-
-                    // assure the block object inside the Block matches
-                    // the provided through the parent component
-                    expect(myComponent.block.type).toEqual("Block");
-                    expect(myComponent.owner.name).toEqual("profile-name");
-                    done();
-                });
-        });
-
-
-        it("renders a component which matches to the block type", done => {
-            // CustomBlock component created to check if it will be used
-            // when a block with type 'CustomBlock' is provided to the noosfero-block (Block)
-            // *** Important *** - the selector is what ng-forward uses to define the name of the directive provider
-            @Component({ selector: 'noosfero-custom-block', template: "<h1>My Custom Block</h1>" })
-            class CustomBlock {
-                @Input() block: any;
-                @Input() owner: any;
-            }
-
-            @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [BlockComponent, CustomBlock] })
-            class CustomBlockType {
-                block = { type: 'CustomBlock' };
-                owner = { name: 'profile-name' };
-                constructor() {
-                }
-            }
-            tcb
-                .createAsync(CustomBlockType).then(fixture => {
-                    let myComponent: CustomBlockType = fixture.componentInstance;
-                    expect(myComponent.block.type).toEqual("CustomBlock");
-                    expect(fixture.debugElement.componentViewChildren[0].text()).toEqual("My Custom Block");
-                    done();
-                });
-        });
-
-
-        it("renders the default block when hasn't defined a block type", done => {
-            @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [BlockComponent] })
-            class CustomBlockType {
-                block: any = { type: null };
-                owner: any = { name: 'profile-name' };
-                constructor() {
-                }
-            }
-            tcb
-                .createAsync(CustomBlockType).then(fixture => {
-                    let myComponent: CustomBlockType = fixture.componentInstance;
-                    expect(myComponent.block.type).toBeNull();
-                    expect(!!fixture.debugElement.nativeElement.querySelector("noosfero-default-block")).toBeTruthy();
-                    done();
-                });
-        });
-
-    });
-});
 \ No newline at end of file
@@ -1,20 +0,0 @@
-import { Input, Inject, Component } from 'ng-forward';
-
-@Component({
-    selector: 'noosfero-block',
-    template: '<div></div>'
-})
-@Inject("$element", "$scope", "$injector", "$compile")
-export class BlockComponent {
-
-    @Input() block: any;
-    @Input() owner: any;
-
-    ngOnInit() {
-        let blockName = (this.block && this.block.type) ? this.block.type.replace(/::/, '').replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase() : "default-block";
-        this.$element.replaceWith(this.$compile('<noosfero-' + blockName + ' [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-' + blockName + '>')(this.$scope));
-    }
-
-    constructor(private $element: any, private $scope: ng.IScope, private $injector: ng.auto.IInjectorService, private $compile: ng.ICompileService) {
-    }
-}
 /* Module Index Entry - generated using the script npm run generate-index */
-export * from "./block.component";
+export * from "./block-content.component";
 import {Component, Input} from 'ng-forward';
-import {BlockComponent} from '../block.component';
 @Component({
     selector: 'noosfero-main-block',
@@ -4,7 +4,7 @@
       <h3 class="panel-title">{{block.title}}</h3>
     </div>
     <div class="panel-body {{block.type | lowercase}}" >
-      <noosfero-block [block]="block" [owner]="ctrl.owner"></noosfero-block>
+      <noosfero-block-content [block]="block" [owner]="ctrl.owner"></noosfero-block-content>
     </div>
   </div>
 </div>
@@ -6,7 +6,7 @@ import {ArticleViewComponent} from &quot;./../article/article-default-view.component&quot;
 import {ProfileComponent} from "../profile/profile.component";
 import {BoxesComponent} from "../layout/boxes/boxes.component";
-import {BlockComponent} from "../layout/blocks/block.component";
+import {BlockContentComponent} from "../layout/blocks/block-content.component";
 import {EnvironmentComponent} from "../environment/environment.component";
 import {EnvironmentHomeComponent} from "../environment/environment-home.component";
 import {PeopleBlockComponent} from "../layout/blocks/people/people-block.component";
@@ -95,7 +95,7 @@ export class EnvironmentContent {
     selector: 'main',
     template: '<ui-view></ui-view>',
     directives: [
-        ArticleBlogComponent, ArticleViewComponent, BoxesComponent, BlockComponent,
+        ArticleBlogComponent, ArticleViewComponent, BoxesComponent, BlockContentComponent,
         EnvironmentComponent, PeopleBlockComponent, DisplayContentBlockComponent,
         LinkListBlockComponent, CommunitiesBlockComponent, HtmlEditorComponent, ProfileComponent,
         MainBlockComponent, RecentDocumentsBlockComponent, Navbar, SidebarComponent, ProfileImageBlockComponent,
@@ -0,0 +1,91 @@		@@ -0,0 +1,91 @@
	1	+import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
	2	+import {Input, provide, Component} from 'ng-forward';
	3	+
	4	+import {BlockContentComponent} from './block-content.component';
	5	+
	6	+const tcb = new TestComponentBuilder();
	7	+
	8	+const htmlTemplate: string = '<noosfero-block-content [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-block-content>';
	9	+
	10	+describe("Components", () => {
	11	+ describe("Block Component", () => {
	12	+
	13	+ // the karma preprocessor html2js transform the templates html into js files which put
	14	+ // the templates to the templateCache into the module templates
	15	+ // we need to load the module templates here as the template for the
	16	+ // component Block will be load on our tests
	17	+ beforeEach(angular.mock.module("templates"));
	18	+
	19	+ it("receives the block and the owner as inputs", done => {
	20	+
	21	+ // Creating a container component (BlockContainerComponent) to include
	22	+ // the component under test (Block)
	23	+ @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [BlockContentComponent] })
	24	+ class BlockContainerComponent {
	25	+ block = { type: 'Block' };
	26	+ owner = { name: 'profile-name' };
	27	+ constructor() {
	28	+ }
	29	+ }
	30	+
	31	+ // uses the TestComponentBuilder instance to initialize the component
	32	+ tcb
	33	+ .createAsync(BlockContainerComponent).then(fixture => {
	34	+ // and here we can inspect and run the test assertions
	35	+ let myComponent: BlockContentComponent = fixture.componentInstance;
	36	+
	37	+ // assure the block object inside the Block matches
	38	+ // the provided through the parent component
	39	+ expect(myComponent.block.type).toEqual("Block");
	40	+ expect(myComponent.owner.name).toEqual("profile-name");
	41	+ done();
	42	+ });
	43	+ });
	44	+
	45	+
	46	+ it("renders a component which matches to the block type", done => {
	47	+ // CustomBlock component created to check if it will be used
	48	+ // when a block with type 'CustomBlock' is provided to the noosfero-block (Block)
	49	+ // * Important * - the selector is what ng-forward uses to define the name of the directive provider
	50	+ @Component({ selector: 'noosfero-custom-block', template: "<h1>My Custom Block</h1>" })
	51	+ class CustomBlock {
	52	+ @Input() block: any;
	53	+ @Input() owner: any;
	54	+ }
	55	+
	56	+ @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [BlockContentComponent, CustomBlock] })
	57	+ class CustomBlockType {
	58	+ block = { type: 'CustomBlock' };
	59	+ owner = { name: 'profile-name' };
	60	+ constructor() {
	61	+ }
	62	+ }
	63	+ tcb
	64	+ .createAsync(CustomBlockType).then(fixture => {
	65	+ let myComponent: CustomBlockType = fixture.componentInstance;
	66	+ expect(myComponent.block.type).toEqual("CustomBlock");
	67	+ expect(fixture.debugElement.componentViewChildren[0].text()).toEqual("My Custom Block");
	68	+ done();
	69	+ });
	70	+ });
	71	+
	72	+
	73	+ it("renders the default block when hasn't defined a block type", done => {
	74	+ @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [BlockContentComponent] })
	75	+ class CustomBlockType {
	76	+ block: any = { type: null };
	77	+ owner: any = { name: 'profile-name' };
	78	+ constructor() {
	79	+ }
	80	+ }
	81	+ tcb
	82	+ .createAsync(CustomBlockType).then(fixture => {
	83	+ let myComponent: CustomBlockType = fixture.componentInstance;
	84	+ expect(myComponent.block.type).toBeNull();
	85	+ expect(!!fixture.debugElement.nativeElement.querySelector("noosfero-default-block")).toBeTruthy();
	86	+ done();
	87	+ });
	88	+ });
	89	+
	90	+ });
	91	+});
@@ -0,0 +1,20 @@		@@ -0,0 +1,20 @@
	1	+import { Input, Inject, Component } from 'ng-forward';
	2	+
	3	+@Component({
	4	+ selector: 'noosfero-block-content',
	5	+ template: '<div></div>'
	6	+})
	7	+@Inject("$element", "$scope", "$injector", "$compile")
	8	+export class BlockContentComponent {
	9	+
	10	+ @Input() block: any;
	11	+ @Input() owner: any;
	12	+
	13	+ ngOnInit() {
	14	+ let blockName = (this.block && this.block.type) ? this.block.type.replace(/::/, '').replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase() : "default-block";
	15	+ this.$element.replaceWith(this.$compile('<noosfero-' + blockName + ' [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-' + blockName + '>')(this.$scope));
	16	+ }
	17	+
	18	+ constructor(private $element: any, private $scope: ng.IScope, private $injector: ng.auto.IInjectorService, private $compile: ng.ICompileService) {
	19	+ }
	20	+}
	@@ -1,91 +0,0 @@		@@ -1,91 +0,0 @@
1	-import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
2	-import {Input, provide, Component} from 'ng-forward';
3	-
4	-import {BlockComponent} from './block.component';
5	-
6	-const tcb = new TestComponentBuilder();
7	-
8	-const htmlTemplate: string = '<noosfero-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-block>';
9	-
10	-describe("Components", () => {
11	- describe("Block Component", () => {
12	-
13	- // the karma preprocessor html2js transform the templates html into js files which put
14	- // the templates to the templateCache into the module templates
15	- // we need to load the module templates here as the template for the
16	- // component Block will be load on our tests
17	- beforeEach(angular.mock.module("templates"));
18	-
19	- it("receives the block and the owner as inputs", done => {
20	-
21	- // Creating a container component (BlockContainerComponent) to include
22	- // the component under test (Block)
23	- @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [BlockComponent] })
24	- class BlockContainerComponent {
25	- block = { type: 'Block' };
26	- owner = { name: 'profile-name' };
27	- constructor() {
28	- }
29	- }
30	-
31	- // uses the TestComponentBuilder instance to initialize the component
32	- tcb
33	- .createAsync(BlockContainerComponent).then(fixture => {
34	- // and here we can inspect and run the test assertions
35	- let myComponent: BlockComponent = fixture.componentInstance;
36	-
37	- // assure the block object inside the Block matches
38	- // the provided through the parent component
39	- expect(myComponent.block.type).toEqual("Block");
40	- expect(myComponent.owner.name).toEqual("profile-name");
41	- done();
42	- });
43	- });
44	-
45	-
46	- it("renders a component which matches to the block type", done => {
47	- // CustomBlock component created to check if it will be used
48	- // when a block with type 'CustomBlock' is provided to the noosfero-block (Block)
49	- // * Important * - the selector is what ng-forward uses to define the name of the directive provider
50	- @Component({ selector: 'noosfero-custom-block', template: "<h1>My Custom Block</h1>" })
51	- class CustomBlock {
52	- @Input() block: any;
53	- @Input() owner: any;
54	- }
55	-
56	- @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [BlockComponent, CustomBlock] })
57	- class CustomBlockType {
58	- block = { type: 'CustomBlock' };
59	- owner = { name: 'profile-name' };
60	- constructor() {
61	- }
62	- }
63	- tcb
64	- .createAsync(CustomBlockType).then(fixture => {
65	- let myComponent: CustomBlockType = fixture.componentInstance;
66	- expect(myComponent.block.type).toEqual("CustomBlock");
67	- expect(fixture.debugElement.componentViewChildren[0].text()).toEqual("My Custom Block");
68	- done();
69	- });
70	- });
71	-
72	-
73	- it("renders the default block when hasn't defined a block type", done => {
74	- @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [BlockComponent] })
75	- class CustomBlockType {
76	- block: any = { type: null };
77	- owner: any = { name: 'profile-name' };
78	- constructor() {
79	- }
80	- }
81	- tcb
82	- .createAsync(CustomBlockType).then(fixture => {
83	- let myComponent: CustomBlockType = fixture.componentInstance;
84	- expect(myComponent.block.type).toBeNull();
85	- expect(!!fixture.debugElement.nativeElement.querySelector("noosfero-default-block")).toBeTruthy();
86	- done();
87	- });
88	- });
89	-
90	- });
91	-});
92	\ No newline at end of file	0	\ No newline at end of file
	@@ -1,20 +0,0 @@	@@ -1,20 +0,0 @@
1	-import { Input, Inject, Component } from 'ng-forward';
2	-
3	-@Component({
4	- selector: 'noosfero-block',
5	- template: '<div></div>'
6	-})
7	-@Inject("$element", "$scope", "$injector", "$compile")
8	-export class BlockComponent {
9	-
10	- @Input() block: any;
11	- @Input() owner: any;
12	-
13	- ngOnInit() {
14	- let blockName = (this.block && this.block.type) ? this.block.type.replace(/::/, '').replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase() : "default-block";
15	- this.$element.replaceWith(this.$compile('<noosfero-' + blockName + ' [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-' + blockName + '>')(this.$scope));
16	- }
17	-
18	- constructor(private $element: any, private $scope: ng.IScope, private $injector: ng.auto.IInjectorService, private $compile: ng.ICompileService) {
19	- }
20	-}
1	/* Module Index Entry - generated using the script npm run generate-index */	1	/* Module Index Entry - generated using the script npm run generate-index */
2	-export * from "./block.component";	2	+export * from "./block-content.component";
1	import {Component, Input} from 'ng-forward';	1	import {Component, Input} from 'ng-forward';
2	-import {BlockComponent} from '../block.component';
3		2
4	@Component({	3	@Component({
5	selector: 'noosfero-main-block',	4	selector: 'noosfero-main-block',
	@@ -4,7 +4,7 @@		@@ -4,7 +4,7 @@
4	<h3 class="panel-title">{{block.title}}</h3>	4	<h3 class="panel-title">{{block.title}}</h3>
5	</div>	5	</div>
6	<div class="panel-body {{block.type \| lowercase}}" >	6	<div class="panel-body {{block.type \| lowercase}}" >
7	- <noosfero-block [block]="block" [owner]="ctrl.owner"></noosfero-block>	7	+ <noosfero-block-content [block]="block" [owner]="ctrl.owner"></noosfero-block-content>
8	</div>	8	</div>
9	</div>	9	</div>
10	</div>	10	</div>
	@@ -6,7 +6,7 @@ import {ArticleViewComponent} from "./../article/article-default-view.component"		@@ -6,7 +6,7 @@ import {ArticleViewComponent} from "./../article/article-default-view.component"
6		6
7	import {ProfileComponent} from "../profile/profile.component";	7	import {ProfileComponent} from "../profile/profile.component";
8	import {BoxesComponent} from "../layout/boxes/boxes.component";	8	import {BoxesComponent} from "../layout/boxes/boxes.component";
9	-import {BlockComponent} from "../layout/blocks/block.component";	9	+import {BlockContentComponent} from "../layout/blocks/block-content.component";
10	import {EnvironmentComponent} from "../environment/environment.component";	10	import {EnvironmentComponent} from "../environment/environment.component";
11	import {EnvironmentHomeComponent} from "../environment/environment-home.component";	11	import {EnvironmentHomeComponent} from "../environment/environment-home.component";
12	import {PeopleBlockComponent} from "../layout/blocks/people/people-block.component";	12	import {PeopleBlockComponent} from "../layout/blocks/people/people-block.component";
	@@ -95,7 +95,7 @@ export class EnvironmentContent {		@@ -95,7 +95,7 @@ export class EnvironmentContent {
95	selector: 'main',	95	selector: 'main',
96	template: '<ui-view></ui-view>',	96	template: '<ui-view></ui-view>',
97	directives: [	97	directives: [
98	- ArticleBlogComponent, ArticleViewComponent, BoxesComponent, BlockComponent,	98	+ ArticleBlogComponent, ArticleViewComponent, BoxesComponent, BlockContentComponent,
99	EnvironmentComponent, PeopleBlockComponent, DisplayContentBlockComponent,	99	EnvironmentComponent, PeopleBlockComponent, DisplayContentBlockComponent,
100	LinkListBlockComponent, CommunitiesBlockComponent, HtmlEditorComponent, ProfileComponent,	100	LinkListBlockComponent, CommunitiesBlockComponent, HtmlEditorComponent, ProfileComponent,
101	MainBlockComponent, RecentDocumentsBlockComponent, Navbar, SidebarComponent, ProfileImageBlockComponent,	101	MainBlockComponent, RecentDocumentsBlockComponent, Navbar, SidebarComponent, ProfileImageBlockComponent,