Merge branch 'ngforward' of softwarepublico.gov.br:noosfero-themes/angular-theme into ngforward

Victor Costa
2 parents f5a45d92 a3e051be
Showing 261 changed files with 3984 additions and 3345 deletions Show diff stats
.vscode/settings.json
dev-scripts/fix-jqlite.ts
package.json
src/app/admin/index.ts
src/app/article/article-default-view-component.spec.ts
src/app/article/article-default-view.component.ts
src/app/article/article.html
src/app/article/article.scss
src/app/article/basic-editor.component.spec.ts
src/app/article/basic-editor.component.ts
src/app/article/basic-editor.html
src/app/article/content-viewer/content-viewer-actions.component.spec.ts
src/app/article/content-viewer/content-viewer-actions.component.ts
src/app/article/content-viewer/content-viewer.component.spec.ts
src/app/article/content-viewer/content-viewer.component.ts
src/app/article/content-viewer/index.ts
src/app/article/content-viewer/navbar-actions.html
src/app/article/content-viewer/page.html
src/app/article/index.ts
src/app/article/types/blog/blog.component.spec.ts
@@ -3,7 +3,9 @@
     "files.exclude": {
         "**/.git": true,
         "**/.DS_Store": true,
-        "src/app/*.js": false
+        "src/**/*.js": true,
+        "src/**/*.js.map": true,
+        "coverage": true
     },
     "editor.fontSize": 14,
     "typescript.useCodeSnippetsOnMethodSuggest": true
@@ -0,0 +1,13 @@
+let replace = require("replace");
+
+import * as path from "path";
+
+let wrong_jqlite_d_ts_file = path.join(__dirname, "../node_modules/ng-forward/cjs/util/jqlite-extensions.d.ts");
+
+replace({
+    regex: /import JQuery from \".\/\";/,
+    replacement: "",
+    paths: [wrong_jqlite_d_ts_file],
+    sillent: false
+});
+
@@ -4,21 +4,23 @@
   "dependencies": {
     "angular": "^1.5.0",
     "angular-mock": "^1.0.0",
-    "moment": "^2.11.2"    
+    "moment": "^2.11.2",
+    "ng-forward": "0.0.1-alpha.12"
   },
   "scripts": {
     "build": "webpack; gulp build",
     "webpack": "webpack",
+    "karma": "concurrently \"webpack -w\" \"karma start\"",
     "docs": "gulp ngdocs; static-server docs",
-    "karma": "karma",
     "coverage": "karma start --single-run; npm run remap-coverage",
     "remap-coverage": "ts-node --project ./dev-scripts ./dev-scripts/remapCoverage.ts",
     "test-single": "karma start --single-run",
     "test-and-coverage": "karma start & npm run remap-coverage",
     "test": "webpack -w --test",
-    "postinstall": "npm install -g bower && bower install && typings install && cd dev-scripts && typings install",
+    "postinstall": "npm install -g bower; bower install; typings install; npm run fix-jqlite; cd dev-scripts; typings install",
     "start": "concurrently \"webpack -w\" \"gulp serve\"",
-    "generate-indexes": "ts-node --project ./dev-scripts ./dev-scripts/generate-index-modules.ts"
+    "generate-indexes": "ts-node --project ./dev-scripts ./dev-scripts/generate-index-modules.ts",
+    "fix-jqlite": "ts-node --project ./dev-scripts dev-scripts/fix-jqlite.ts"
   },
   "devDependencies": {
     "browser-sync": "~2.9.11",
@@ -71,7 +73,6 @@
     "karma-webpack": "^1.7.0",
     "lodash": "~3.10.1",
     "main-bower-files": "~2.9.0",
-    "ng-forward": "0.0.1-alpha.12",
     "on-build-webpack": "^0.1.0",
     "phantomjs": "~1.9.18",
     "phantomjs-polyfill": "0.0.2",
@@ -0,0 +1 @@
+/* Module Index Entry - generated using the script npm run generate-index */
@@ -0,0 +1,108 @@
+
+import {Input, provide, Component} from 'ng-forward';
+import {ArticleViewComponent, ArticleDefaultViewComponent} from './article-default-view.component';
+
+import {createComponentFromClass, quickCreateComponent} from "../../spec/helpers";
+
+// this htmlTemplate will be re-used between the container components in this spec file 
+const htmlTemplate: string = '<noosfero-article [article]="ctrl.article" [profile]="ctrl.profile"></noosfero-article>';
+
+
+describe("Components", () => {
+
+    describe("ArticleView 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 Noosfero ArtileView will be load on our tests
+        beforeEach(angular.mock.module("templates"));
+
+        it("renders the default component when no specific component is found", (done: Function) => {
+            // Creating a container component (ArticleContainerComponent) to include 
+            // the component under test (ArticleView)  
+            @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [ArticleViewComponent] })
+            class ArticleContainerComponent {
+                article = { type: 'anyArticleType' };
+                profile = { name: 'profile-name' };
+                constructor() {
+                }
+            }
+
+            createComponentFromClass(ArticleContainerComponent).then((fixture) => {
+                // and here we can inspect and run the test assertions
+
+                // gets the children component of ArticleContainerComponent 
+                let articleView: ArticleViewComponent = fixture.debugElement.componentViewChildren[0].componentInstance;
+
+                // and checks if the article View rendered was the Default Article View
+                expect(articleView.constructor.prototype).toEqual(ArticleDefaultViewComponent.prototype);
+
+                // done needs to be called (it isn't really needed, as we can read in
+                // here (https://github.com/ngUpgraders/ng-forward/blob/master/API.md#createasync)
+                // because createAsync in ng-forward is not really async, but as the intention 
+                // here is write tests in angular 2 ways, this is recommended
+                done();
+            });
+
+        });
+
+        it("receives the article and profile as inputs", (done: Function) => {
+
+            // Creating a container component (ArticleContainerComponent) to include 
+            // the component under test (ArticleView)  
+            @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [ArticleViewComponent] })
+            class ArticleContainerComponent {
+                article = { type: 'anyArticleType' };
+                profile = { name: 'profile-name' };
+                constructor() {
+                }
+            }
+
+            // uses the TestComponentBuilder instance to initialize the component
+            createComponentFromClass(ArticleContainerComponent).then((fixture) => {
+                // and here we can inspect and run the test assertions 
+                let articleView: ArticleViewComponent = fixture.debugElement.componentViewChildren[0].componentInstance;
+
+                // assure the article object inside the ArticleView matches
+                // the provided through the parent component
+                expect(articleView.article.type).toEqual("anyArticleType");
+                expect(articleView.profile.name).toEqual("profile-name");
+
+                // done needs to be called (it isn't really needed, as we can read in
+                // here (https://github.com/ngUpgraders/ng-forward/blob/master/API.md#createasync)
+                // because createAsync in ng-forward is not really async, but as the intention 
+                // here is write tests in angular 2 ways, this is recommended
+                done();
+            });
+        });
+
+
+        it("renders a article view which matches to the article type", done => {
+            // NoosferoTinyMceArticle component created to check if it will be used
+            // when a article with type 'TinyMceArticle' is provided to the noosfero-article (ArticleView)
+            // *** Important *** - the selector is what ng-forward uses to define the name of the directive provider
+            @Component({ selector: 'noosfero-tiny-mce-article', template: "<h1>TinyMceArticle</h1>" })
+            class TinyMceArticleView {
+                @Input() article: any;
+                @Input() profile: any;
+            }
+
+            // Creating a container component (ArticleContainerComponent) to include our NoosferoTinyMceArticle
+            @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [ArticleViewComponent, TinyMceArticleView] })
+            class CustomArticleType {
+                article = { type: 'TinyMceArticle' };
+                profile = { name: 'profile-name' };
+                constructor() {
+                }
+            }
+            createComponentFromClass(CustomArticleType).then(fixture => {
+                let myComponent: CustomArticleType = fixture.componentInstance;
+                expect(myComponent.article.type).toEqual("TinyMceArticle");
+                expect(fixture.debugElement.componentViewChildren[0].text()).toEqual("TinyMceArticle");
+                done();
+            });
+        });
+
+    });
+});
 \ No newline at end of file
@@ -0,0 +1,57 @@
+import { bundle, Input, Inject, Component, Directive } from 'ng-forward';
+import {ArticleBlogComponent} from "./types/blog/blog.component";
+
+/**
+ * @ngdoc controller
+ * @name ArticleDefaultView
+ * @description
+ *  A default view for Noosfero Articles. If the specific article view is
+ * not implemented, then this view is used.
+ */
+@Component({
+    selector: 'noosfero-default-article',
+    templateUrl: 'app/article/article.html'
+})
+export class ArticleDefaultViewComponent {
+
+    @Input() article: noosfero.Article;
+    @Input() profile: noosfero.Profile;
+
+}
+
+/**
+ * @ngdoc controller
+ * @name ArticleView
+ * @description
+ *  A dynamic view for articles. It uses the article type to replace
+ * the default template with the custom article directive.
+ */
+@Component({
+    selector: 'noosfero-article',
+    template: 'not-used',
+    directives: [ArticleDefaultViewComponent, ArticleBlogComponent]
+})
+@Inject("$element", "$scope", "$injector", "$compile")
+export class ArticleViewComponent {
+
+    @Input() article: noosfero.Article;
+    @Input() profile: noosfero.Profile;
+    directiveName: string;
+
+    ngOnInit() {
+        let specificDirective = 'noosfero' + this.article.type;
+        this.directiveName = "noosfero-default-article";
+        if (this.$injector.has(specificDirective + 'Directive')) {
+            this.directiveName = specificDirective.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
+        }
+        this.$element.replaceWith(this.$compile('<' + this.directiveName + ' [article]="ctrl.article" [profile]="ctrl.profile"></' + this.directiveName + '>')(this.$scope));
+    }
+
+    constructor(
+        private $element: any,
+        private $scope: ng.IScope,
+        private $injector: ng.auto.IInjectorService,
+        private $compile: ng.ICompileService) {
+
+    }
+}
@@ -0,0 +1,23 @@
+<div class="article">
+  <div class="page-header">
+    <h3 ng-bind="ctrl.article.title"></h3>
+  </div>
+
+  <div class="sub-header clearfix">
+    <div class="page-info pull-right small text-muted">
+      <span class="time">
+        <i class="fa fa-clock-o"></i> <span am-time-ago="ctrl.article.created_at | dateFormat"></span>
+      </span>
+      <span class="author" ng-if="ctrl.article.author">
+        <i class="fa fa-user"></i>
+        <a ui-sref="main.profile.home({profile: ctrl.article.author.identifier})">
+          <span class="author-name" ng-bind="ctrl.article.author.name"></span>
+        </a>
+      </span>
+    </div>
+  </div>
+
+  <div class="page-body">
+    <div ng-bind-html="ctrl.article.body"></div>
+  </div>
+</div>
@@ -0,0 +1,17 @@
+.article {
+  .page-info {
+    .author {
+      a {
+        color: #b4bcc2;
+      }
+    }
+  }
+
+  .page-header {
+      margin-bottom: 5px;
+  }
+
+  .sub-header {
+    margin-bottom: 20px;
+  }
+}
@@ -0,0 +1,55 @@
+import {quickCreateComponent} from "../../spec/helpers";
+import {BasicEditorComponent} from "./basic-editor.component";
+
+
+describe("Article BasicEditor", () => {
+
+    let $rootScope: ng.IRootScopeService;
+    let $q: ng.IQService;
+    let articleServiceMock: any;
+    let profileServiceMock: any;
+    let $state: any;
+    let profile = { id: 1 };
+    let notification: any;
+
+
+    beforeEach(inject((_$rootScope_: ng.IRootScopeService, _$q_: ng.IQService) => {
+        $rootScope = _$rootScope_;
+        $q = _$q_;
+    }));
+
+    beforeEach(() => {
+        $state = jasmine.createSpyObj("$state", ["transitionTo"]);
+        notification = jasmine.createSpyObj("notification", ["success"]);
+        profileServiceMock = jasmine.createSpyObj("profileServiceMock", ["getCurrentProfile"]);
+        articleServiceMock = jasmine.createSpyObj("articleServiceMock", ["createInProfile"]);
+
+        let getCurrentProfileResponse = $q.defer();
+        getCurrentProfileResponse.resolve(profile);
+
+        let articleCreate = $q.defer();
+        articleCreate.resolve({ data: { path: "path", profile: { identifier: "profile" } } });
+
+        profileServiceMock.getCurrentProfile = jasmine.createSpy("getCurrentProfile").and.returnValue(getCurrentProfileResponse.promise);
+        articleServiceMock.createInProfile = jasmine.createSpy("createInProfile").and.returnValue(articleCreate.promise);
+    });
+
+    it("create an article in the current profile when save", done => {
+        let component: BasicEditorComponent = new BasicEditorComponent(articleServiceMock, profileServiceMock, $state, notification);
+        component.save();
+        $rootScope.$apply();
+        expect(profileServiceMock.getCurrentProfile).toHaveBeenCalled();
+        expect(articleServiceMock.createInProfile).toHaveBeenCalledWith(profile, component.article);
+        done();
+    });
+
+    it("got to the new article page and display an alert when saving sucessfully", done => {
+        let component: BasicEditorComponent = new BasicEditorComponent(articleServiceMock, profileServiceMock, $state, notification);
+        component.save();
+        $rootScope.$apply();
+        expect($state.transitionTo).toHaveBeenCalledWith("main.profile.page", { page: "path", profile: "profile" });
+        expect(notification.success).toHaveBeenCalled();
+        done();
+    });
+
+});
@@ -0,0 +1,35 @@
+import {StateConfig, Component, Inject, provide} from 'ng-forward';
+import {ArticleService} from "../../lib/ng-noosfero-api/http/article.service";
+import {ProfileService} from "../../lib/ng-noosfero-api/http/profile.service";
+import {NotificationService} from "../shared/services/notification.service.ts";
+
+@Component({
+    selector: 'article-basic-editor',
+    templateUrl: "app/article/basic-editor.html",
+    providers: [
+        provide('articleService', { useClass: ArticleService }),
+        provide('profileService', { useClass: ProfileService }),
+        provide('notification', { useClass: NotificationService })
+    ]
+})
+@Inject(ArticleService, ProfileService, "$state", NotificationService)
+export class BasicEditorComponent {
+
+    article: noosfero.Article = <noosfero.Article>{};
+
+    constructor(private articleService: ArticleService,
+        private profileService: ProfileService,
+        private $state: ng.ui.IStateService,
+        private notification: NotificationService) { }
+
+    save() {
+        this.profileService.getCurrentProfile().then((profile: noosfero.Profile) => {
+            return this.articleService.createInProfile(profile, this.article);
+        }).then((response: noosfero.RestResult<noosfero.Article>) => {
+            let article = (<noosfero.Article>response.data);
+            this.$state.transitionTo('main.profile.page', { page: article.path, profile: article.profile.identifier });
+            this.notification.success("Good job!", "Article saved!");
+        });
+    }
+
+}
@@ -0,0 +1,11 @@
+<form>
+  <div class="form-group">
+    <label for="titleInput">Title</label>
+    <input type="text" class="form-control" id="titleInput" placeholder="title" ng-model="vm.article.name">
+  </div>
+  <div class="form-group">
+    <label for="bodyInput">Text</label>
+    <textarea class="form-control" id="bodyInput" rows="10" ng-model="vm.article.body"></textarea>
+  </div>
+  <button type="submit" class="btn btn-default" ng-click="vm.save()">Save</button>
+</form>
@@ -0,0 +1,67 @@
+import {providers} from 'ng-forward/cjs/testing/providers';
+
+import {Input, Component, provide} from 'ng-forward';
+
+import * as helpers from "../../../spec/helpers";
+
+import {ComponentFixture} from 'ng-forward/cjs/testing/test-component-builder';
+import {ContentViewerActions} from './content-viewer-actions.component';
+
+// this htmlTemplate will be re-used between the container components in this spec file
+const htmlTemplate: string = '<content-viewer-actions [article]="ctrl.article" [profile]="ctrl.profile"></content-viewer-actions>';
+
+describe('Content Viewer Actions Component', () => {
+
+    beforeEach(() => {
+
+        angular.mock.module("templates");
+
+        providers((provide: any) => {
+            return <any>[
+                provide('ProfileService', {
+                    useValue: helpers.mocks.profileService
+                })
+            ];
+        });
+    });
+
+    let buildComponent = (): Promise<ComponentFixture> => {
+        return helpers.quickCreateComponent({
+            providers: [
+                helpers.provideEmptyObjects('Restangular'),
+                helpers.provideFilters('translateFilter')
+            ],
+            directives: [ContentViewerActions],
+            template: htmlTemplate
+        });
+    };
+
+    it('renders content viewer actions directive', (done: Function) => {
+        buildComponent().then((fixture: ComponentFixture) => {
+            expect(fixture.debugElement.query('content-viewer-actions').length).toEqual(1);
+
+            done();
+        });
+    });
+
+    it('check if profile was loaded', (done: Function) => {
+        let profile: any = {
+            id: 1,
+            identifier: 'the-profile-test',
+            type: 'Person'
+        };
+
+        helpers.mocks.profileService.getCurrentProfile = () => {
+            return helpers.mocks.promiseResultTemplate(profile);
+        };
+
+        buildComponent().then((fixture: ComponentFixture) => {
+            let contentViewerComp: ContentViewerActions = fixture.debugElement.componentViewChildren[0].componentInstance;
+
+            expect(contentViewerComp.profile).toEqual(jasmine.objectContaining(profile));
+
+            done();
+        });
+    });
+
+});
@@ -0,0 +1,20 @@
+import {Component, Inject, provide} from "ng-forward";
+import {ProfileService} from "../../../lib/ng-noosfero-api/http/profile.service";
+
+@Component({
+    selector: "content-viewer-actions",
+    templateUrl: "app/article/content-viewer/navbar-actions.html",
+    providers: [provide('profileService', { useClass: ProfileService })]
+})
+@Inject(ProfileService)
+export class ContentViewerActions {
+
+    article: noosfero.Article;
+    profile: noosfero.Profile;
+
+    constructor(profileService: ProfileService) {
+        profileService.getCurrentProfile().then((profile: noosfero.Profile) => {
+            this.profile = profile;
+        });
+    }
+}
@@ -0,0 +1,88 @@
+import {providers} from 'ng-forward/cjs/testing/providers';
+
+import {Input, Component, provide} from 'ng-forward';
+
+import * as helpers from "../../../spec/helpers";
+
+import {ComponentFixture} from 'ng-forward/cjs/testing/test-component-builder';
+import {ContentViewerComponent} from './content-viewer.component';
+
+// this htmlTemplate will be re-used between the container components in this spec file
+const htmlTemplate: string = '<content-viewer [article]="ctrl.article" [profile]="ctrl.profile"></content-viewer>';
+
+describe('Content Viewer Component', () => {
+
+    let stateParamsService: any;
+
+    // loading the templates
+    beforeEach(() => {
+        angular.mock.module("templates");
+
+        stateParamsService = { page: 1 };
+
+        providers((provide: any) => {
+            return <any>[
+                provide('ArticleService', {
+                    useValue: helpers.mocks.articleService
+                }),
+                provide('ProfileService', {
+                    useValue: helpers.mocks.profileService
+                }),
+                // TODO: Como criar um mock do atributo "page" de stateParams
+                provide('$stateParams', {
+                    useValue: stateParamsService
+                })
+            ];
+        });
+    });
+
+    let buildComponent = (): Promise<ComponentFixture> => {
+        return helpers.quickCreateComponent({
+            providers: [
+                helpers.provideEmptyObjects('Restangular')
+            ],
+            directives: [ContentViewerComponent],
+            template: htmlTemplate
+        });
+    };
+
+    it('renders content viewer directive', (done: Function) => {
+        buildComponent().then((fixture: ComponentFixture) => {
+            expect(fixture.debugElement.query('content-viewer').length).toEqual(1);
+
+            done();
+        });
+    });
+
+    it('check if article was loaded', (done: Function) => {
+        let article: any = {
+            id: 1,
+            title: 'The article test'
+        };
+        let profile: any = {
+            id: 1,
+            identifier: 'the-profile-test',
+            type: 'Person'
+        };
+
+        helpers.mocks.profileService.getCurrentProfile = () => {
+            return helpers.mocks.promiseResultTemplate(profile);
+        };
+
+        helpers.mocks.articleService.getArticleByProfileAndPath = (profile: noosfero.Profile, path: string) => {
+            return helpers.mocks.promiseResultTemplate({
+                data:  article
+            });
+        };
+
+
+        buildComponent().then((fixture: ComponentFixture) => {
+            let contentViewerComp: ContentViewerComponent = fixture.debugElement.componentViewChildren[0].componentInstance;
+
+            expect(contentViewerComp.profile).toEqual(profile);
+            expect(contentViewerComp.article).toEqual(article);
+
+            done();
+        });
+    });
+});
@@ -0,0 +1,38 @@
+import {ArticleViewComponent} from "./../article-default-view.component";
+import {Input, Component, StateConfig, Inject, provide} from "ng-forward";
+
+import {ArticleBlogComponent} from "./../types/blog/blog.component";
+import {ArticleService} from "../../../lib/ng-noosfero-api/http/article.service";
+import {ProfileService} from "../../../lib/ng-noosfero-api/http/profile.service";
+
+@Component({
+    selector: "content-viewer",
+    templateUrl: "app/article/content-viewer/page.html",
+    directives: [ArticleBlogComponent, ArticleViewComponent],
+    providers: [
+        provide('articleService', { useClass: ArticleService }),
+        provide('profileService', { useClass: ProfileService })
+    ]
+})
+@Inject(ArticleService, ProfileService, "$log", "$stateParams")
+export class ContentViewerComponent {
+
+    @Input()
+    article: noosfero.Article = null;
+
+    @Input()
+    profile: noosfero.Profile = null;
+
+    constructor(private articleService: ArticleService, private profileService: ProfileService, private $log: ng.ILogService, private $stateParams: angular.ui.IStateParamsService) {
+        this.activate();
+    }
+
+    activate() {
+       this.profileService.getCurrentProfile().then((profile: noosfero.Profile) => {
+            this.profile = profile;
+            return this.articleService.getArticleByProfileAndPath(this.profile, this.$stateParams["page"]);
+        }).then((result: noosfero.RestResult<any>) => {
+            this.article = <noosfero.Article>result.data;
+        });
+    }
+}
@@ -0,0 +1,3 @@
+/* Module Index Entry - generated using the script npm run generate-index */
+export * from "./content-viewer-actions.component";
+export * from "./content-viewer.component";
@@ -0,0 +1,7 @@
+<ul class="nav navbar-nav">
+  <li ng-show="vm.profile">
+    <a href="#" role="button" ui-sref="main.profile.cms({profile: vm.profile.identifier})">
+      <i class="fa fa-file fa-fw fa-lg"></i> {{"navbar.content_viewer_actions.new_post" | translate}}
+    </a>
+  </li>
+</ul>
@@ -0,0 +1 @@
+<noosfero-article ng-if="vm.article" [article]="vm.article" [profile]="vm.profile"></noosfero-article>
@@ -0,0 +1,3 @@
+/* Module Index Entry - generated using the script npm run generate-index */
+export * from "./article-default-view.component";
+export * from "./basic-editor.component";
@@ -0,0 +1,129 @@
+import {
+providers
+} from 'ng-forward/cjs/testing/providers';
+
+import {
+Input,
+Component
+} from 'ng-forward';
+import {
+ArticleBlogComponent
+} from './blog.component';
+
+import {
+createComponentFromClass,
+quickCreateComponent,
+provideEmptyObjects,
+createProviderToValue,
+provideFilters
+} from "../../../../spec/helpers.ts";
+
+// this htmlTemplate will be re-used between the container components in this spec file
+const htmlTemplate: string = '<noosfero-blog [article]="ctrl.article" [profile]="ctrl.profile"></noosfero-blog>';
+
+describe("Blog Component", () => {
+
+    function promiseResultTemplate(response?: {}) {
+        let thenFuncEmpty = (func: Function) => {
+            // does nothing
+        };
+        if (response) {
+            return {
+                then: (func: (response: any) => void) => {
+                    func(response);
+                }
+            };
+        } else {
+            return {
+                then: (func: (response: any) => void) => {
+                    // does nothing
+                }
+            };
+        }
+    }
+
+    let articleService = {
+        getChildren: (article_id: number, filters: {}) => {
+            return promiseResultTemplate(null);
+        }
+    };
+
+    @Component({
+        selector: 'test-container-component',
+        template: htmlTemplate,
+        directives: [ArticleBlogComponent],
+        providers: [
+            provideEmptyObjects('Restangular'),
+            createProviderToValue('ArticleService', articleService),
+            provideFilters('truncateFilter')
+        ]
+    })
+    class BlogContainerComponent {
+        article = {
+            type: 'anyArticleType'
+        };
+        profile = {
+            name: 'profile-name'
+        };
+    }
+
+    beforeEach(() => {
+
+        // 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 Noosfero ArtileView will be load on our tests
+        angular.mock.module("templates");
+
+        providers((provide: any) => {
+            return <any>[
+                provide('ArticleService', {
+                    useValue: articleService
+                })
+            ];
+        });
+    });
+
+    it("renders the blog content", (done: Function) => {
+
+        createComponentFromClass(BlogContainerComponent).then((fixture) => {
+
+            expect(fixture.debugElement.query('div.blog').length).toEqual(1);
+
+            done();
+        });
+    });
+
+    it("verify the blog data", (done: Function) => {
+
+        let articles = [{
+            id: 1,
+            title: 'The article test'
+        }];
+
+        let result = { data: articles, headers: (name: string) => { return 1; } };
+
+        // defining a mock result to articleService.getChildren method
+        articleService.getChildren = (article_id: number, filters: {}) => {
+            return promiseResultTemplate(result);
+        };
+
+        createComponentFromClass(BlogContainerComponent).then((fixture) => {
+
+            // gets the children component of BlogContainerComponent
+            let articleBlog: BlogContainerComponent = fixture.debugElement.componentViewChildren[0].componentInstance;
+
+            // check if the component property are the provided by the mocked articleService
+            let post = {
+                id: 1,
+                title: 'The article test'
+            };
+            expect((<any>articleBlog)["posts"][0]).toEqual(jasmine.objectContaining(post));
+            expect((<any>articleBlog)["totalPosts"]).toEqual(1);
+
+            done();
+        });
+
+    });
+
+});
 \ No newline at end of file
@@ -0,0 +1,47 @@
+import {Component, Input, Inject} from "ng-forward";
+
+import {ArticleService} from "../../../../lib/ng-noosfero-api/http/article.service";
+
+/**
+ * @ngdoc controller
+ * @name ArticleBlog
+ * @description
+ *  An specific {@link ArticleView} for Blog articles.
+ */
+@Component({
+    selector: "noosfero-blog",
+    templateUrl: "app/article/types/blog/blog.html"
+})
+@Inject(ArticleService)
+export class ArticleBlogComponent {
+
+    @Input() article: noosfero.Article;
+    @Input() profile: noosfero.Profile;
+
+    private posts: noosfero.Article[];
+    private perPage: number = 3;
+    private currentPage: number;
+    private totalPosts: number = 0;
+
+    constructor(private articleService: ArticleService) { }
+
+    ngOnInit() {
+        this.loadPage();
+    }
+
+    loadPage() {
+        let filters = {
+            content_type: "TinyMceArticle",
+            per_page: this.perPage,
+            page: this.currentPage
+        };
+
+        this.articleService
+            .getChildren(this.article, filters)
+            .then((result: noosfero.RestResult<noosfero.Article[]>) => {
+                this.totalPosts = <number>result.headers("total");
+                this.posts = result.data;
+            });
+    }
+
+}
@@ -0,0 +1,24 @@
+<div class="blog">
+  <div class="blog-cover" ng-show="ctrl.article.image">
+    <img ng-src="{{ctrl.article.image.url}}" class="img-responsive">
+    <h3 ng-bind="ctrl.article.title"></h3>
+  </div>
+
+  <div class="page-header" ng-show="!ctrl.article.image">
+    <h3 ng-bind="ctrl.article.title"></h3>
+  </div>
+
+  <div>
+    <div ng-repeat="child in ctrl.posts | orderBy: 'created_at':true">
+      <div class="page-header">
+        <a class="title" ui-sref="main.profile.page({profile: ctrl.profile.identifier, page: child.path})"><h4 ng-bind="child.title"></h4></a>
+        <div class="post-lead" ng-bind-html="child.body | truncate: 500: '...': true"></div>
+      </div>
+    </div>
+  </div>
+
+  <pagination ng-model="ctrl.currentPage" total-items="ctrl.totalPosts" class="pagination-sm center-block"
+    boundary-links="true" items-per-page="ctrl.perPage" ng-change="ctrl.loadPage()"
+    first-text="«" last-text="»" previous-text="‹" next-text="›">
+  </pagination>
+</div>
@@ -0,0 +1,15 @@
+.blog {
+  .blog-cover {
+    margin: -15px;
+    position: relative;
+    h3 {
+      position: absolute;
+      bottom: 0;
+      background-color: rgba(0, 0, 0, 0.4);
+      color: white;
+      padding: 10px 15px;
+      margin: 0;
+      width: 100%;
+    }
+  }
+}
@@ -0,0 +1,2 @@
+/* Module Index Entry - generated using the script npm run generate-index */
+export * from "./blog.component";
@@ -0,0 +1 @@
+/* Module Index Entry - generated using the script npm run generate-index */
@@ -1,54 +0,0 @@
-import {quickCreateComponent} from "../../spec/helpers";
-import {Cms} from "./cms.component";
-
-describe("Components", () => {
-    describe("Cms Component", () => {
-
-        let $rootScope: ng.IRootScopeService;
-        let $q: ng.IQService;
-        let articleServiceMock: any;
-        let profileServiceMock: any;
-        let $state: any;
-        let notification: any;
-
-        beforeEach(inject((_$rootScope_: ng.IRootScopeService, _$q_: ng.IQService) => {
-            $rootScope = _$rootScope_;
-            $q = _$q_;
-        }));
-
-        beforeEach(() => {
-            $state = jasmine.createSpyObj("$state", ["transitionTo"]);
-            notification = jasmine.createSpyObj("notification", ["success"]);
-            profileServiceMock = jasmine.createSpyObj("profileServiceMock", ["getCurrentProfile"]);
-            articleServiceMock = jasmine.createSpyObj("articleServiceMock", ["create"]);
-
-            let getCurrentProfileResponse = $q.defer();
-            getCurrentProfileResponse.resolve({ id: 1 });
-
-            let articleCreate = $q.defer();
-            articleCreate.resolve({ data: { article: { path: "path", profile: { identifier: "profile" } } } });
-
-            profileServiceMock.getCurrentProfile = jasmine.createSpy("getCurrentProfile").and.returnValue(getCurrentProfileResponse.promise);
-            articleServiceMock.create = jasmine.createSpy("create").and.returnValue(articleCreate.promise);
-        });
-
-        it("create an article in the current profile when save", done => {
-            let component: Cms = new Cms(articleServiceMock, profileServiceMock, $state, notification);
-            component.save();
-            $rootScope.$apply();
-            expect(profileServiceMock.getCurrentProfile).toHaveBeenCalled();
-            expect(articleServiceMock.create).toHaveBeenCalledWith(1, component.article);
-            done();
-        });
-
-        it("got to the new article page and display an alert when saving sucessfully", done => {
-            let component: Cms = new Cms(articleServiceMock, profileServiceMock, $state, notification);
-            component.save();
-            $rootScope.$apply();
-            expect($state.transitionTo).toHaveBeenCalledWith("main.profile.page", { page: "path", profile: "profile" });
-            expect(notification.success).toHaveBeenCalled();
-            done();
-        });
-
-    });
-});
@@ -1,35 +0,0 @@
-import {StateConfig, Component, Inject, provide} from 'ng-forward';
-import {Profile} from "./../models/interfaces";
-import {ArticleService} from "../../lib/ng-noosfero-api/http/article.service";
-import {ProfileService} from "../../lib/ng-noosfero-api/http/profile.service";
-import {Notification} from "../components/notification/notification.component";
-
-@Component({
-    selector: 'cms',
-    templateUrl: "app/cms/cms.html",
-    providers: [
-        provide('articleService', { useClass: ArticleService }),
-        provide('profileService', { useClass: ProfileService }),
-        provide('notification', { useClass: Notification })
-    ]
-})
-@Inject(ArticleService, ProfileService, "$state", Notification)
-export class Cms {
-
-    article: any = {};
-
-    constructor(private articleService: ArticleService,
-        private profileService: ProfileService,
-        private $state: ng.ui.IStateService,
-        private notification: Notification) { }
-
-    save() {
-        this.profileService.getCurrentProfile().then((profile: Profile) => {
-            return this.articleService.create(profile.id, this.article);
-        }).then((response: restangular.IResponse) => {
-            this.$state.transitionTo('main.profile.page', { page: response.data.article.path, profile: response.data.article.profile.identifier });
-            this.notification.success("Good job!", "Article saved!");
-        });
-    }
-
-}
@@ -1,11 +0,0 @@
-<form>
-  <div class="form-group">
-    <label for="titleInput">Title</label>
-    <input type="text" class="form-control" id="titleInput" placeholder="title" ng-model="vm.article.name">
-  </div>
-  <div class="form-group">
-    <label for="bodyInput">Text</label>
-    <textarea class="form-control" id="bodyInput" rows="10" ng-model="vm.article.body"></textarea>
-  </div>
-  <button type="submit" class="btn btn-default" ng-click="vm.save()">Save</button>
-</form>
@@ -1,2 +0,0 @@
-/* Module Index Entry - generated using the script npm run generate-index */
-export * from "./cms.component";
@@ -1,33 +0,0 @@
-import {AuthController} from "./auth_controller";
-import {AuthService} from "./auth_service";
-
-describe("Controllers", () => {
-
-
-    describe("AuthController", () => {
-
-        it("calls authenticate on AuthService when login called", () => {
-
-            // creating a Mock AuthService
-            let AuthServiceMock: AuthService = jasmine.createSpyObj("AuthService", ["login"]);
-
-            // pass AuthServiceMock into the constructor
-            let authController = new AuthController(null, null, AuthServiceMock);
-
-            // setup of authController -> set the credentials instance property
-            let credentials = { username: "username", password: "password" };
-
-            authController.credentials = credentials;
-
-            // calls the authController login method
-            authController.login();
-
-            // checks if the method login of the injected AuthService has been called
-            expect(AuthServiceMock.login).toHaveBeenCalledWith(credentials);
-
-        });
-
-
-
-    });
-});
@@ -1,21 +0,0 @@
-import {Credentials} from "./../../models/interfaces";
-import {AuthService} from "./auth_service";
-
-export class AuthController {
-
-    static $inject = ["$log", "$stateParams", "AuthService"];
-
-    constructor(
-        private $log: ng.ILogService,
-        private $stateParams: any,
-        private AuthService: AuthService
-    ) {
-
-    }
-
-    credentials: Credentials;
-
-    login() {
-        this.AuthService.login(this.credentials);
-    }
-}
@@ -1,11 +0,0 @@
-export interface IAuthEvents {
-    loginSuccess: string;
-    loginFailed: string;
-    logoutSuccess: string;
-}
-
-export const AUTH_EVENTS: IAuthEvents = {
-    loginSuccess: "auth-login-success",
-    loginFailed: "auth-login-failed",
-    logoutSuccess: "auth-logout-success"
-};
 \ No newline at end of file
@@ -1,82 +0,0 @@
-
-
-import {AuthService, AUTH_EVENTS} from "./";
-import {User, Credentials} from "./../../models/interfaces";
-
-describe("Services", () => {
-
-
-    describe("Auth Service", () => {
-
-        let $httpBackend: ng.IHttpBackendService;
-        let authService: AuthService;
-        let credentials: Credentials;
-        let $rootScope: ng.IRootScopeService;
-        let user: User;
-
-        beforeEach(angular.mock.module("noosferoApp", ($translateProvider: angular.translate.ITranslateProvider) => {
-            $translateProvider.translations('en', {});
-        }));
-
-        beforeEach(inject((_$httpBackend_: ng.IHttpBackendService, _$rootScope_: ng.IRootScopeService, _AuthService_: AuthService) => {
-            $httpBackend = _$httpBackend_;
-            authService = _AuthService_;
-            $rootScope = _$rootScope_;
-
-            user = <User>{
-                id: 1,
-                login: "user"
-            };
-        }));
-
-
-        describe("Succesffull login", () => {
-
-            beforeEach(() => {
-                credentials = { username: "user", password: "password" };
-
-                $httpBackend.expectPOST("/api/v1/login", "login=user&password=password").respond(200, { user: user });
-            });
-
-            it("should return loggedUser", (done) => {
-                authService.login(credentials).then((loggedUser) => {
-                    expect(loggedUser).toBeDefined();
-                    done();
-                });
-                $httpBackend.flush();
-                expect($httpBackend.verifyNoOutstandingRequest());
-            });
-
-
-            it("should emit event loggin successful with user logged data", () => {
-
-                authService.login(credentials);
-
-                let eventEmmited: boolean = false;
-                $rootScope.$on(AUTH_EVENTS.loginSuccess, (event: ng.IAngularEvent, userThroughEvent: User) => {
-                    eventEmmited = true;
-                    expect(userThroughEvent).toEqual(user)
-                });
-
-                $httpBackend.flush();
-
-                expect(eventEmmited).toBeTruthy(AUTH_EVENTS.loginSuccess + " was not emmited!");
-            });
-
-            it("should return the current logged in user", () => {
-                authService.login(credentials);
-                $httpBackend.flush();
-                let actual: User = authService.currentUser();
-                expect(actual).toEqual(user, "The returned user must be present");
-            });
-
-            it("should not return the current user after logout", () => {
-                authService.logout();
-                let actual: any = authService.currentUser();
-                expect(actual).toEqual(undefined, "The returned user must not be defined");
-            });
-        });
-
-
-    });
-});
@@ -1,69 +0,0 @@
-import {Injectable, Inject} from "ng-forward";
-
-import {Credentials, NoosferoRootScope, User, UserResponse} from "./../../models/interfaces";
-import {Session} from "./session";
-
-import {AUTH_EVENTS, IAuthEvents} from "./auth_events";
-
-@Injectable()
-@Inject("$q", "$http", "$rootScope", "Session", "$log", "AUTH_EVENTS")
-export class AuthService {
-
-    constructor(private $q: ng.IQService,
-        private $http: ng.IHttpService,
-        private $rootScope: NoosferoRootScope,
-        private session: Session,
-        private $log: ng.ILogService,
-        private auth_events: IAuthEvents) {
-
-    }
-
-    loginFromCookie() {
-        let url: string = '/api/v1/login_from_cookie';
-        return this.$http.post(url, null).then(this.loginSuccessCallback.bind(this), this.loginFailedCallback.bind(this));
-    }
-
-
-    private loginSuccessCallback(response: ng.IHttpPromiseCallbackArg<UserResponse>) {
-        this.$log.debug('AuthService.login [SUCCESS] response', response);
-        let currentUser: User = this.session.create(response.data);
-        this.$rootScope.currentUser = currentUser;
-        this.$rootScope.$broadcast(this.auth_events.loginSuccess, currentUser);
-        return currentUser;
-    }
-
-    login(credentials: Credentials): ng.IPromise<User> {
-        let url = '/api/v1/login';
-        let encodedData = 'login=' + credentials.username + '&password=' + credentials.password;
-        return this.$http.post(url, encodedData).then(this.loginSuccessCallback.bind(this), this.loginFailedCallback.bind(this));
-    }
-
-    private loginFailedCallback(response: ng.IHttpPromiseCallbackArg<any>): any {
-        this.$log.debug('AuthService.login [FAIL] response', response);
-        this.$rootScope.$broadcast(this.auth_events.loginFailed);
-        // return $q.reject(response);
-        return null;
-    }
-
-    public logout() {
-        this.session.destroy();
-        this.$rootScope.currentUser = undefined;
-        this.$rootScope.$broadcast(this.auth_events.logoutSuccess);
-        this.$http.jsonp('/account/logout'); // FIXME logout from noosfero to sync login state
-    }
-
-    public isAuthenticated() {
-        return !!this.session.currentUser();
-    }
-
-    public currentUser(): User {
-        return this.session.currentUser();
-    }
-
-    public isAuthorized(authorizedRoles: string | string[]) {
-        if (!angular.isArray(authorizedRoles)) {
-            authorizedRoles = [<string>authorizedRoles];
-        }
-        return (this.isAuthenticated() && authorizedRoles.indexOf(this.session.currentUser().userRole) !== -1);
-    }
-}
 \ No newline at end of file
@@ -1,5 +0,0 @@
-/* Module Index Entry - generated using the script npm run generate-index */
-export * from "./auth_controller";
-export * from "./auth_events";
-export * from "./auth_service";
-export * from "./session";
@@ -1,16 +0,0 @@
-<div class="modal-header">
-  <h3 class="modal-title">{{"auth.title" | translate}}</h3>
-</div>
-<div class="modal-body">
-  <form>
-    <div class="form-group">
-      <label for="exampleInputEmail1">{{"auth.form.login" | translate}}</label>
-      <input type="text" class="form-control" id="exampleInputEmail1" placeholder="Login / Email" ng-model="vm.credentials.username">
-    </div>
-    <div class="form-group">
-      <label for="exampleInputPassword1">{{"auth.form.password" | translate}}</label>
-      <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password" ng-model="vm.credentials.password">
-    </div>
-    <button type="submit" class="btn btn-default" ng-click="vm.login()">{{"auth.form.login_button" | translate}}</button>
-  </form>
-</div>
@@ -1,27 +0,0 @@
-import {Injectable, Inject} from "ng-forward";
-import {UserResponse, User, INoosferoLocalStorage} from "./../../models/interfaces";
-
-@Injectable()
-@Inject("$localStorage", "$log")
-export class Session {
-
-    constructor(private $localStorage: INoosferoLocalStorage, private $log: ng.ILogService) {
-
-    }
-
-    create(data: UserResponse): User {
-        this.$localStorage.currentUser = data.user;
-        this.$log.debug('User session created.', this.$localStorage.currentUser);
-        return this.$localStorage.currentUser;
-    };
-
-    destroy() {
-        delete this.$localStorage.currentUser;
-        this.$log.debug('User session destroyed.');
-    };
-
-    currentUser(): User {
-        return this.$localStorage.currentUser;
-    };
-
-}
 \ No newline at end of file
@@ -1,49 +0,0 @@
-import {Component} from "ng-forward";
-import {Session} from "./";
-import {fixtures, createComponentFromClass, createProviderToValue} from "./../../../spec/helpers";
-import {UserResponse, User, INoosferoLocalStorage} from "./../../models/interfaces";
-
-
-describe("Services", () => {
-
-
-    describe("Session Service", () => {
-
-        let $localStorage: INoosferoLocalStorage = null;
-        let $log: any;
-
-        beforeEach(() => {
-            $localStorage = <INoosferoLocalStorage>{ currentUser: null };
-            $log = jasmine.createSpyObj('$log', ['debug']);
-        });
-
-        it("method 'create()' saves the current user on $localstorage service", () => {
-            let session = new Session($localStorage, $log);
-            let userResponse = <UserResponse>{
-                user: fixtures.user
-            };
-            session.create(userResponse);
-            expect($localStorage.currentUser).toEqual(userResponse.user);
-        });
-
-        it("method 'destroy()' clean the currentUser on $localstorage", () => {
-            let session = new Session($localStorage, $log);
-            let userResponse = <UserResponse>{
-                user: fixtures.user
-            };
-            $localStorage.currentUser = fixtures.user;
-            session.destroy();
-            expect($localStorage.currentUser).toBeUndefined();
-        });
-
-        it("method 'currentUser()' returns the user recorded on $localstorage service", () => {
-            let session = new Session($localStorage, $log);
-            let userResponse = <UserResponse>{
-                user: fixtures.user
-            };
-            $localStorage.currentUser = fixtures.user;
-            expect(session.currentUser()).toEqual($localStorage.currentUser);
-        });
-    });
-
-});
 \ No newline at end of file
@@ -1 +0,0 @@
-/* Module Index Entry - generated using the script npm run generate-index */
@@ -1,46 +0,0 @@
-import {ComponentFixture} from 'ng-forward/cjs/testing/test-component-builder';
-import {provide} from 'ng-forward';
-
-import {LanguageSelector} from './language-selector.component';
-
-import * as helpers from "../../../spec/helpers";
-
-describe("Components", () => {
-
-    describe("Language Selector Component", () => {
-
-        beforeEach(angular.mock.module("templates"));
-
-        let translatorService: any;
-
-        let buildComponent = (): Promise<ComponentFixture> => {
-            translatorService = jasmine.createSpyObj("translatorService", ["availableLanguages", "currentLanguage"])
-            return helpers.quickCreateComponent({
-                template: "<language-selector></language-selector>",
-                directives: [LanguageSelector],
-                providers: [
-                    provide('TranslatorService', {
-                        useValue: translatorService
-                    })
-                ].concat(helpers.provideFilters("translateFilter"))
-            });
-        }
-
-        it("display language options", (done) => {
-            buildComponent().then(fixture => {
-                fixture.debugElement.getLocal("$rootScope").$apply();
-                expect(fixture.debugElement.queryAll('li.language').length).toEqual(2);
-                done();
-            });
-        });
-
-        it("call the translator service when change the language", (done) => {
-            let translatorService = jasmine.createSpyObj("translatorService", ["changeLanguage"]);
-            let languageSelector = new LanguageSelector(<any>translatorService);
-            languageSelector.changeLanguage("en");
-            expect(translatorService.changeLanguage).toHaveBeenCalledWith("en");
-            done();
-        });
-
-    });
-});
@@ -1,24 +0,0 @@
-import {Component, Inject} from "ng-forward";
-import {TranslatorService} from "../translator/translator.service";
-
-@Component({
-    selector: "language-selector",
-    templateUrl: "app/components/language-selector/language-selector.html"
-})
-@Inject(TranslatorService)
-export class LanguageSelector {
-
-    constructor(private translatorService: TranslatorService) { }
-
-    currentLanguage() {
-        return this.translatorService.currentLanguage();
-    }
-
-    changeLanguage(language: string) {
-        this.translatorService.changeLanguage(language);
-    }
-
-    availableLanguages() {
-        return this.translatorService.availableLanguages;
-    }
-}
@@ -1,13 +0,0 @@
-<li class="dropdown profile-menu" dropdown>
-  <a href="#" class="dropdown-toggle" aria-expanded="false" dropdown-toggle>
-    <span>{{"language.selector" | translate}}</span> <b class="caret"></b>
-  </a>
-  <ul class="dropdown-menu" dropdown-menu>
-    <li ng-repeat="(language, description) in ctrl.availableLanguages()"
-      class="language language-{{language}}" ng-class="{'active': language==ctrl.currentLanguage()}">
-      <a href="#" ng-click="ctrl.changeLanguage(language)">
-        {{description}}
-      </a>
-    </li>
-  </ul>
-</li>
@@ -1,2 +0,0 @@
-/* Module Index Entry - generated using the script npm run generate-index */
-export * from "./navbar";
@@ -1,45 +0,0 @@
-(function() {
-  'use strict';
-
-  describe('directive navbar', function() {
-    var vm;
-    var el;
-    var AUTH_EVENTS;
-    var $state;
-
-    beforeEach(module('angular'));
-    beforeEach(inject(function($compile, $rootScope, $httpBackend, _AUTH_EVENTS_, _$state_) {
-      $state = _$state_;
-      AUTH_EVENTS = _AUTH_EVENTS_;
-      $httpBackend.when('POST','/api/v1/login_from_cookie').respond({});
-
-      el = angular.element('<acme-navbar></acme-navbar>');
-
-      $compile(el)($rootScope.$new());
-      $rootScope.$digest();
-      vm = el.isolateScope().vm;
-    }));
-
-    it('should be compiled', function() {
-      expect(el.html()).not.toEqual(null);
-    });
-
-    it('should have isolate scope object with instanciate members', function() {
-      expect(vm).toEqual(jasmine.any(Object));
-      expect(vm.currentUser).toEqual(undefined);
-    });
-
-    it('should reload current state after login', function() {
-      spyOn($state, 'go');
-      el.isolateScope().$broadcast(AUTH_EVENTS.loginSuccess, {});
-      expect($state.go).toHaveBeenCalled();
-    });
-
-    it('should open login when not logged in', function() {
-      spyOn(vm, 'openLogin');
-      vm.activate();
-      expect(vm.openLogin).toHaveBeenCalled();
-    });
-
-  });
-})();
@@ -1,49 +0,0 @@
-<nav class="navbar navbar-static-top navbar-inverse">
-  <div class="container-fluid">
-    <div class="navbar-header">
-      <button type="button" class="navbar-toggle collapsed" ng-click="isCollapsed = !isCollapsed">
-        <span class="sr-only">{{"navbar.toggle_menu" | translate}}</span>
-        <span class="icon-bar"></span>
-        <span class="icon-bar"></span>
-        <span class="icon-bar"></span>
-      </button>
-      <a class="navbar-brand" ui-sref="main">
-        <span class="noosfero-logo"><img src="assets/images/logo-noosfero.png"></span> {{"noosfero.name" | translate}}
-      </a>
-    </div>
-
-    <div class="collapse navbar-collapse" id="navbar-collapse" collapse="isCollapsed">
-      <ul class="nav navbar-nav">
-      </ul>
-
-      <ul class="nav navbar-nav navbar-right">
-        <li ng-show="!ctrl.currentUser">
-          <a ng-href="#" ng-click="ctrl.openLogin()">{{"navbar.login" | translate}}</a>
-        </li>
-
-        <li class="dropdown profile-menu" ng-show="ctrl.currentUser" dropdown>
-          <a href="#" class="dropdown-toggle" aria-expanded="false" dropdown-toggle>
-            <noosfero-profile-image [profile]="ctrl.currentUser.person" class="profile-image"></noosfero-profile-image>
-            <span ng-bind="ctrl.currentUser.person.name"></span> <b class="caret"></b>
-          </a>
-          <ul class="dropdown-menu" dropdown-menu>
-              <li>
-                  <a ui-sref="main.profile.info({profile: ctrl.currentUser.person.identifier})"><i class="fa fa-fw fa-user"></i> {{"navbar.profile" | translate}}</a>
-              </li>
-              <li>
-                  <a target="_self" ui-sref="main.profile.settings({profile: ctrl.currentUser.person.identifier})"><i class="fa fa-fw fa-gear"></i> {{"navbar.settings" | translate}}</a>
-              </li>
-              <li class="divider"></li>
-              <li>
-                  <a href="#" ng-click="ctrl.logout()"><i class="fa fa-fw fa-power-off"></i> {{"navbar.logout" | translate}}</a>
-              </li>
-          </ul>
-        </li>
-      </ul>
-      <ul class="nav navbar-nav navbar-right">
-        <language-selector class="nav navbar-nav navbar-right"></language-selector>
-      </ul>
-      <div ui-view="actions"></div>
-    </div>
-  </div>
-</nav>
@@ -1,31 +0,0 @@
-.navbar {
-
-  .container-fluid {
-    padding-right: 12%;
-    padding-left: 12%;
-    @media (max-width: 978px) {
-      padding-right: 2%;
-      padding-left: 2%;
-    }
-
-    .navbar-brand {
-      .noosfero-logo img {
-        height: 35px;
-      }
-    }
-
-    .navbar-nav {
-      .profile-menu .profile-image {
-        img {
-          height: 30px;
-          width: 30px;
-          display: inline-block;
-          @extend .img-circle;
-        }
-        i {
-          font-size: 1.7em;
-        }
-      }
-    }
-  }
-}
@@ -1,188 +0,0 @@
-import * as helpers from "./../../../spec/helpers";
-import {Navbar} from "./navbar";
-import {AUTH_EVENTS} from "./../auth";
-import {User} from "./../../models/interfaces";
-import {Injectable, Provider, provide} from "ng-forward";
-
-import {ComponentFixture} from 'ng-forward/cjs/testing/test-component-builder';
-
-import {Session, AuthService, AuthController, IAuthEvents} from "./../auth";
-
-
-describe("Components", () => {
-
-    describe("Navbar Component", () => {
-
-        let user: User = null;
-        let scope: any;
-        let $rootScope: ng.IRootScopeService;
-
-        let modalInstance: any;
-        let $modal: any;
-        let authService: any;
-        let stateService: any;
-        let sessionService: Session;
-
-        let provideFunc = provide;
-
-        // before Each -> loading mocks on locals variables 
-        beforeEach(() => {
-            user = <User>{
-                id: 1,
-                login: "user"
-            };
-            scope = helpers.mocks.scopeWithEvents;
-            modalInstance = helpers.mocks.modalInstance;
-            $modal = helpers.mocks.$modal;
-            authService = helpers.mocks.authService;
-            stateService = jasmine.createSpyObj("$state", ["go"]);
-            sessionService = <any>helpers.mocks.sessionWithCurrentUser(user);
-        });
-
-
-        // loading the templates
-        beforeEach(angular.mock.module("templates"));
-
-
-        // this function allow build the fixture of the container component
-        // and is reused in each test
-        // The main idea behing not prebuild it on a general beforeEach block is
-        // to allow tests configure the mock services accordilly their own needs   
-        let buildComponent = (): Promise<ComponentFixture> => {
-            return helpers.quickCreateComponent({
-                providers: [
-                    provide('$modal', {
-                        useValue: $modal
-                    }),
-                    provide('AuthService', {
-                        useValue: authService
-                    }),
-                    helpers.provideEmptyObjects('moment'),
-                    provide('$state', {
-                        useValue: stateService
-                    }),
-                    provide("$scope", {
-                        useValue: scope
-                    }),
-                    provide('Session', {
-                        useValue: sessionService
-                    }),
-                    provide('AUTH_EVENTS', {
-                        useValue: {
-                            AUTH_EVENTS
-                        }
-                    }),
-                    provide('TranslatorService', {
-                        useValue: helpers.mocks.translatorService
-                    })
-                ].concat(helpers.provideFilters("translateFilter")),
-                directives: [Navbar],
-                template: '<acme-navbar></acme-navbar>'
-            });
-        }
-
-
-        it('should get the loggedIn user', (done: Function) => {
-            buildComponent().then((fixture: ComponentFixture) => {
-                let navbarInstance: Navbar = fixture.debugElement.componentViewChildren[0].componentInstance;
-                expect(navbarInstance).toBeDefined();
-                expect(navbarInstance["currentUser"]).toEqual(user);
-                done();
-            });
-        });
-
-        it('should open on click', (done: Function) => {
-            spyOn($modal, "open");
-            buildComponent().then((fixture: ComponentFixture) => {
-                let navbarComp: Navbar = <Navbar>fixture.debugElement.componentViewChildren[0].componentInstance;
-                navbarComp.openLogin();
-                expect($modal.open).toHaveBeenCalled();
-                expect($modal.open).toHaveBeenCalledWith({
-                    templateUrl: 'app/components/auth/login.html',
-                    controller: AuthController,
-                    controllerAs: 'vm',
-                    bindToController: true
-                });
-                done();
-            });
-        });
-
-        it('should logout', (done: Function) => {
-            buildComponent().then((fixture: ComponentFixture) => {
-                let navbarComp: Navbar = <Navbar>fixture.debugElement.componentViewChildren[0].componentInstance;
-                spyOn(authService, "logout");
-                try {
-                    navbarComp.logout();
-                    expect(authService.logout).toHaveBeenCalled();
-                    done();
-                } catch (e) {
-                    console.error(e);
-                    fail(e.message);
-                    done();
-                }
-            });
-        });
-
-
-        it('should not activate user when logged in', (done: Function) => {
-            buildComponent().then((fixture: ComponentFixture) => {
-                let navbarComp: Navbar = <Navbar>fixture.debugElement.componentViewChildren[0].componentInstance;
-                spyOn(navbarComp, "openLogin");
-                navbarComp.activate();
-                expect((<any>navbarComp.openLogin).calls.count()).toBe(0);
-                done();
-            });
-        });
-
-        it('should activate when user not logged in', (done: Function) => {
-            spyOn(sessionService, 'currentUser').and.returnValue(null);
-            buildComponent().then((fixture: ComponentFixture) => {
-                let navbarComp: Navbar = <Navbar>fixture.debugElement.componentViewChildren[0].componentInstance;
-                spyOn(navbarComp, "openLogin");
-                navbarComp.activate();
-                expect(navbarComp.openLogin).toHaveBeenCalled();
-                done();
-            });
-        });
-
-
-        it('closes the modal after login', (done: Function) => {
-            modalInstance = jasmine.createSpyObj("modalInstance", ["close"]);
-            modalInstance.close = jasmine.createSpy("close");
-
-            $modal.open = () => {
-                return modalInstance;
-            };
-
-            buildComponent().then((fixture: ComponentFixture) => {
-                let navbarComp: Navbar = <Navbar>fixture.debugElement.componentViewChildren[0].componentInstance;
-                let localScope: ng.IScope = navbarComp["$scope"];
-
-                navbarComp.openLogin();
-                localScope.$emit(AUTH_EVENTS.loginSuccess);
-                expect(modalInstance.close).toHaveBeenCalled();
-                done();
-            });
-        });
-
-        it('updates current user on logout', (done: Function) => {
-            buildComponent().then((fixture: ComponentFixture) => {
-                let navbarComp: Navbar = <Navbar>fixture.debugElement.componentViewChildren[0].componentInstance;
-                let localScope: ng.IScope = navbarComp["$scope"];
-
-                // init navbar  currentUser with some user
-                navbarComp["currentUser"] = user;
-
-                // changes the current User to return null,
-                // and emmit the 'logoutSuccess' event
-                // just what happens when user logsout
-                sessionService.currentUser = () => { return null; };
-                localScope.$emit(AUTH_EVENTS.logoutSuccess);
-                expect(navbarComp["currentUser"]).toBeNull();
-                done();
-            });
-        });
-
-
-    });
-});
@@ -1,67 +0,0 @@
-import {Component, Inject} from "ng-forward";
-import {LanguageSelector} from "../language-selector/language-selector.component";
-
-
-import {Session, AuthService, AuthController, IAuthEvents, AUTH_EVENTS} from "./../auth";
-import {User} from "./../../models/interfaces";
-
-@Component({
-    selector: "acme-navbar",
-    templateUrl: "app/components/navbar/navbar.html",
-    directives: [LanguageSelector],
-    providers: [AuthService, Session]
-})
-@Inject("$modal", AuthService, "Session", "$scope", "$state")
-export class Navbar {
-
-    private currentUser: User;
-    private modalInstance: any = null;
-    /**
-     *
-     */
-    constructor(
-        private $modal: any,
-        private authService: AuthService,
-        private session: Session,
-        private $scope: ng.IScope,
-        private $state: ng.ui.IStateService
-    ) {
-        this.currentUser = this.session.currentUser();
-
-        this.$scope.$on(AUTH_EVENTS.loginSuccess, () => {
-            if (this.modalInstance) {
-                this.modalInstance.close();
-                this.modalInstance = null;
-            }
-
-            this.$state.go(this.$state.current, {}, { reload: true }); // TODO move to auth
-        });
-
-        this.$scope.$on(AUTH_EVENTS.logoutSuccess, () => {
-            this.currentUser = this.session.currentUser();
-        });
-    }
-
-    openLogin() {
-        this.modalInstance = this.$modal.open({
-            templateUrl: 'app/components/auth/login.html',
-            controller: AuthController,
-            controllerAs: 'vm',
-            bindToController: true
-        });
-    };
-
-    logout() {
-        this.authService.logout();
-        this.$state.go(this.$state.current, {}, { reload: true });  // TODO move to auth
-    };
-
-
-
-    activate() {
-        if (!this.currentUser) {
-            this.openLogin();
-        }
-    }
-
-}
@@ -1,36 +0,0 @@
-import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
-import {Pipe, Input, provide, Component} from 'ng-forward';
-import {provideFilters} from '../../../spec/helpers';
-
-import {NoosferoActivities} from './activities.component';
-
-const tcb = new TestComponentBuilder();
-
-const htmlTemplate: string = '<noosfero-activities [activities]="ctrl.activities"></noosfero-activities>';
-
-
-describe("Components", () => {
-
-    describe("Noosfero Activities", () => {
-
-        beforeEach(angular.mock.module("templates"));
-
-        @Component({
-            selector: 'test-container-component',
-            template: htmlTemplate,
-            directives: [NoosferoActivities],
-            providers: provideFilters("truncateFilter", "stripTagsFilter", "translateFilter")
-        })
-        class BlockContainerComponent {
-            activities = [{ name: "activity1", verb: "create_article" }, { name: "activity2", verb: "create_article" }];
-        }
-
-        it("render a noosfero activity tag for each activity", done => {
-            tcb.createAsync(BlockContainerComponent).then(fixture => {
-                expect(fixture.debugElement.queryAll("noosfero-activity").length).toEqual(2);
-                done();
-            });
-        });
-    });
-
-});
@@ -1,27 +0,0 @@
-import {Component, Input} from "ng-forward";
-import {NoosferoActivity} from "./activity/activity.component";
-import {Activity} from "../../models/interfaces";
-
-/**
- * @ngdoc controller
- * @name NoosferoActivities
- * @description
- *  The controller responsible to retreive profile activities.
- */
-
-@Component({
-    selector: "noosfero-activities",
-    templateUrl: 'app/components/noosfero-activities/activities.html',
-    directives: [NoosferoActivity]
-})
-export class NoosferoActivities {
-
-    /**
-     * @ngdoc property
-     * @propertyOf NoosferoActivities
-     * @name activities
-     * @returns {Activity[]} An array of {@link Activity}.
-     */
-    @Input() activities: Activity[];
-
-}
@@ -1,5 +0,0 @@
-<timeline>
-  <timeline-event ng-repeat="activity in ctrl.activities | orderBy: 'created_at':true">
-    <noosfero-activity [activity]="activity"></noosfero-activity>
-  </timeline-event>
-</timeline>
@@ -1,11 +0,0 @@
-.comma-separated {
-  .separated-item {
-    &:after {
-      content: ", ";
-      margin-left: -3px;
-    }
-    &:last-child:after {
-      content: "";
-    }
-  }
-}
@@ -1,38 +0,0 @@
-import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
-import {Pipe, Input, provide, Component} from 'ng-forward';
-import {provideFilters} from '../../../../spec/helpers';
-
-import {NoosferoActivity} from './activity.component';
-
-const tcb = new TestComponentBuilder();
-
-const htmlTemplate: string = '<noosfero-activity [activity]="ctrl.activity"></noosfero-activity>';
-
-
-describe("Components", () => {
-
-    describe("Noosfero Activity", () => {
-
-        beforeEach(angular.mock.module("templates"));
-
-        @Component({
-            selector: 'test-container-component',
-            template: htmlTemplate,
-            directives: [NoosferoActivity],
-            providers: provideFilters("truncateFilter", "stripTagsFilter", "translateFilter")
-        })
-        class BlockContainerComponent {
-            activity = { name: "activity1", verb: "create_article" };
-        }
-
-        it("render the specific template for an activity verb", done => {
-            tcb.createAsync(BlockContainerComponent).then(fixture => {
-                let component: NoosferoActivity = fixture.debugElement.componentViewChildren[0].componentInstance;
-                expect(component.getActivityTemplate()).toEqual('app/components/noosfero-activities/activity/create_article.html');
-                expect(fixture.debugElement.queryAll(".activity.create_article").length).toEqual(1);
-                done();
-            });
-        });
-    });
-
-});
@@ -1,16 +0,0 @@
-import {Component, Input} from "ng-forward";
-import {Activity} from "../../../models/interfaces";
-
-@Component({
-    selector: "noosfero-activity",
-    templateUrl: 'app/components/noosfero-activities/activity/activity.html'
-})
-export class NoosferoActivity {
-
-    @Input() activity: Activity;
-
-    getActivityTemplate() {
-        return 'app/components/noosfero-activities/activity/' + this.activity.verb + '.html';
-    }
-
-}
@@ -1,3 +0,0 @@
-<div class="activity {{ctrl.activity.verb}}">
-  <ng-include src="ctrl.getActivityTemplate()"></ng-include>
-</div>
@@ -1,13 +0,0 @@
-<timeline-badge class="info">
-  <i class="fa fa-user-plus"></i>
-</timeline-badge>
-<timeline-panel>
-  <timeline-heading>
-    <h4 class="timeline-title">
-      <a ui-sref="main.profile.info({profile: ctrl.activity.user.identifier})"><strong ng-bind="ctrl.activity.user.name"></strong></a>
-      <span> {{"activities.add_member_in_community.description" | translate}}</span>
-    </h4>
-    <p><small class="text-muted"><i class="fa fa-clock-o"></i> <span am-time-ago="ctrl.activity.created_at | dateFormat"></span></small></p>
-  </timeline-heading>
-  <div class="timeline-body"></div>
-</timeline-panel>
@@ -1,26 +0,0 @@
-<timeline-badge class="success">
-  <i class="fa fa-file-text"></i>
-</timeline-badge>
-<timeline-panel>
-  <timeline-heading>
-    <h4 class="timeline-title">
-      <a ui-sref="main.profile.info({profile: ctrl.activity.user.identifier})"><strong ng-bind="ctrl.activity.user.name"></strong></a>
-      <span> {{"activities.create_article.description" | translate}} </span>
-      <a ui-sref="main.profile.info({profile: ctrl.activity.target.article.profile.identifier})">
-        <strong ng-bind="ctrl.activity.target.article.profile.name"></strong></span>
-      </a>
-    </h4>
-    <p><small class="text-muted"><i class="fa fa-clock-o"></i> <span am-time-ago="ctrl.activity.created_at | dateFormat"></span></small></p>
-  </timeline-heading>
-  <div class="timeline-body">
-    <div class="article">
-      <div class="title">
-        <a ui-sref="main.profile.page({profile: ctrl.activity.target.article.profile.identifier, page: ctrl.activity.target.article.path})"
-           ng-bind="ctrl.activity.target.article.title"></a>
-      </div>
-      <div class="lead small">
-        <div ng-bind-html="ctrl.activity.target.article.body | stripTags | truncate: 100 : '...': true"></div>
-      </div>
-    </div>
-  </div>
-</timeline-panel>
@@ -1 +0,0 @@
-/* Module Index Entry - generated using the script npm run generate-index */
@@ -1,18 +0,0 @@
-<timeline-badge class="info">
-  <i class="fa fa-user-plus"></i>
-</timeline-badge>
-<timeline-panel>
-  <timeline-heading>
-    <h4 class="timeline-title">
-      <a ui-sref="main.profile.info({profile: ctrl.activity.user.identifier})"><strong ng-bind="ctrl.activity.user.name"></strong></a>
-      <span> {{"activities.new_friendship.description" | translate:{friends: ctrl.activity.params.friend_name.length}:"messageformat" }} </span>
-      <span class="comma-separated">
-        <a class="separated-item" ui-sref="main.profile.info({profile: ctrl.activity.params.friend_url[$index].profile})" ng-repeat="friend in ctrl.activity.params.friend_name">
-          <strong ng-bind="friend"></strong>
-        </a>
-      </span>
-    </h4>
-    <p><small class="text-muted"><i class="fa fa-clock-o"></i> <span am-time-ago="ctrl.activity.created_at | dateFormat"></span></small></p>
-  </timeline-heading>
-  <div class="timeline-body"></div>
-</timeline-panel>
@@ -1 +0,0 @@
-/* Module Index Entry - generated using the script npm run generate-index */
@@ -1,23 +0,0 @@
-<div class="article">
-  <div class="page-header">
-    <h3 ng-bind="ctrl.article.title"></h3>
-  </div>
-
-  <div class="sub-header clearfix">
-    <div class="page-info pull-right small text-muted">
-      <span class="time">
-        <i class="fa fa-clock-o"></i> <span am-time-ago="ctrl.article.created_at | dateFormat"></span>
-      </span>
-      <span class="author" ng-if="ctrl.article.author">
-        <i class="fa fa-user"></i>
-        <a ui-sref="main.profile.home({profile: ctrl.article.author.identifier})">
-          <span class="author-name" ng-bind="ctrl.article.author.name"></span>
-        </a>
-      </span>
-    </div>
-  </div>
-
-  <div class="page-body">
-    <div ng-bind-html="ctrl.article.body"></div>
-  </div>
-</div>
@@ -1,17 +0,0 @@
-.article {
-  .page-info {
-    .author {
-      a {
-        color: #b4bcc2;
-      }
-    }
-  }
-
-  .page-header {
-      margin-bottom: 5px;
-  }
-
-  .sub-header {
-    margin-bottom: 20px;
-  }
-}
@@ -1,108 +0,0 @@
-
-import {Input, provide, Component} from 'ng-forward';
-import {ArticleView, ArticleDefaultView} from './article_view';
-
-import {createComponentFromClass, quickCreateComponent} from "../../../../spec/helpers";
-
-// this htmlTemplate will be re-used between the container components in this spec file 
-const htmlTemplate: string = '<noosfero-article [article]="ctrl.article" [profile]="ctrl.profile"></noosfero-article>';
-
-
-describe("Components", () => {
-
-    describe("ArticleView 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 Noosfero ArtileView will be load on our tests
-        beforeEach(angular.mock.module("templates"));
-
-        it("renders the default component when no specific component is found", (done: Function) => {
-            // Creating a container component (ArticleContainerComponent) to include 
-            // the component under test (ArticleView)  
-            @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [ArticleView] })
-            class ArticleContainerComponent {
-                article = { type: 'anyArticleType' };
-                profile = { name: 'profile-name' };
-                constructor() {
-                }
-            }
-
-            createComponentFromClass(ArticleContainerComponent).then((fixture) => {
-                // and here we can inspect and run the test assertions
-
-                // gets the children component of ArticleContainerComponent 
-                let articleView: ArticleView = fixture.debugElement.componentViewChildren[0].componentInstance;
-
-                // and checks if the article View rendered was the Default Article View
-                expect(articleView.constructor.prototype).toEqual(ArticleDefaultView.prototype);
-
-                // done needs to be called (it isn't really needed, as we can read in
-                // here (https://github.com/ngUpgraders/ng-forward/blob/master/API.md#createasync)
-                // because createAsync in ng-forward is not really async, but as the intention 
-                // here is write tests in angular 2 ways, this is recommended
-                done();
-            });
-
-        });
-
-        it("receives the article and profile as inputs", (done: Function) => {
-
-            // Creating a container component (ArticleContainerComponent) to include 
-            // the component under test (ArticleView)  
-            @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [ArticleView] })
-            class ArticleContainerComponent {
-                article = { type: 'anyArticleType' };
-                profile = { name: 'profile-name' };
-                constructor() {
-                }
-            }
-
-            // uses the TestComponentBuilder instance to initialize the component
-            createComponentFromClass(ArticleContainerComponent).then((fixture) => {
-                // and here we can inspect and run the test assertions 
-                let articleView: ArticleView = fixture.debugElement.componentViewChildren[0].componentInstance;
-
-                // assure the article object inside the ArticleView matches
-                // the provided through the parent component
-                expect(articleView.article.type).toEqual("anyArticleType");
-                expect(articleView.profile.name).toEqual("profile-name");
-
-                // done needs to be called (it isn't really needed, as we can read in
-                // here (https://github.com/ngUpgraders/ng-forward/blob/master/API.md#createasync)
-                // because createAsync in ng-forward is not really async, but as the intention 
-                // here is write tests in angular 2 ways, this is recommended
-                done();
-            });
-        });
-
-
-        it("renders a article view which matches to the article type", done => {
-            // NoosferoTinyMceArticle component created to check if it will be used
-            // when a article with type 'TinyMceArticle' is provided to the noosfero-article (ArticleView)
-            // *** Important *** - the selector is what ng-forward uses to define the name of the directive provider
-            @Component({ selector: 'noosfero-tiny-mce-article', template: "<h1>TinyMceArticle</h1>" })
-            class TinyMceArticleView {
-                @Input() article: any;
-                @Input() profile: any;
-            }
-
-            // Creating a container component (ArticleContainerComponent) to include our NoosferoTinyMceArticle
-            @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [ArticleView, TinyMceArticleView] })
-            class CustomArticleType {
-                article = { type: 'TinyMceArticle' };
-                profile = { name: 'profile-name' };
-                constructor() {
-                }
-            }
-            createComponentFromClass(CustomArticleType).then(fixture => {
-                let myComponent: CustomArticleType = fixture.componentInstance;
-                expect(myComponent.article.type).toEqual("TinyMceArticle");
-                expect(fixture.debugElement.componentViewChildren[0].text()).toEqual("TinyMceArticle");
-                done();
-            });
-        });
-
-    });
-});
 \ No newline at end of file
@@ -1,57 +0,0 @@
-import { bundle, Input, Inject, Component, Directive } from 'ng-forward';
-import {ArticleBlog} from "../blog/blog.component";
-
-/**
- * @ngdoc controller
- * @name ArticleDefaultView
- * @description
- *  A default view for Noosfero Articles. If the specific article view is
- * not implemented, then this view is used.
- */
-@Component({
-    selector: 'noosfero-default-article',
-    templateUrl: 'app/components/noosfero-articles/article/article.html'
-})
-export class ArticleDefaultView {
-
-    @Input() article: any;
-    @Input() profile: any;
-
-}
-
-/**
- * @ngdoc controller
- * @name ArticleView
- * @description
- *  A dynamic view for articles. It uses the article type to replace
- * the default template with the custom article directive.
- */
-@Component({
-    selector: 'noosfero-article',
-    template: 'not-used',
-    directives: [ArticleDefaultView, ArticleBlog]
-})
-@Inject("$element", "$scope", "$injector", "$compile")
-export class ArticleView {
-
-    @Input() article: any;
-    @Input() profile: any;
-    directiveName: string;
-
-    ngOnInit() {
-        let specificDirective = 'noosfero' + this.article.type;
-        this.directiveName = "noosfero-default-article";
-        if (this.$injector.has(specificDirective + 'Directive')) {
-            this.directiveName = specificDirective.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
-        }
-        this.$element.replaceWith(this.$compile('<' + this.directiveName + ' [article]="ctrl.article" [profile]="ctrl.profile"></' + this.directiveName + '>')(this.$scope));
-    }
-
-    constructor(
-        private $element: any,
-        private $scope: ng.IScope,
-        private $injector: ng.auto.IInjectorService,
-        private $compile: ng.ICompileService) {
-
-    }
-}
@@ -1,2 +0,0 @@
-/* Module Index Entry - generated using the script npm run generate-index */
-export * from "./article_view";
@@ -1,132 +0,0 @@
-import {
-    providers
-} from 'ng-forward/cjs/testing/providers';
-
-import {
-    Input,
-    Component
-} from 'ng-forward';
-import {
-    ArticleBlog
-} from './blog.component';
-
-import {
-    createComponentFromClass,
-    quickCreateComponent,
-    provideEmptyObjects,
-    createProviderToValue,
-    provideFilters
-} from "../../../../spec/helpers.ts";
-
-// this htmlTemplate will be re-used between the container components in this spec file
-const htmlTemplate: string = '<noosfero-blog [article]="ctrl.article" [profile]="ctrl.profile"></noosfero-blog>';
-
-describe("Blog Component", () => {
-
-    function promiseResultTemplate(response ? : {}) {
-        let thenFuncEmpty = (func: Function) => {
-            // does nothing
-        };
-        if (response) {
-            return {
-                then: (func: (response: any) => void) => {
-                    func(response);
-                }
-            };
-        } else {
-            return {
-                then: (func: (response: any) => void) => {
-                    // does nothing
-                }
-            };
-        }
-    }
-
-    let articleService = {
-        getChildren: (article_id: number, filters: {}) => {
-            return promiseResultTemplate(null);
-        }
-    };
-
-    @Component({
-        selector: 'test-container-component',
-        template: htmlTemplate,
-        directives: [ArticleBlog],
-        providers: [
-            provideEmptyObjects('Restangular'),
-            createProviderToValue('ArticleService', articleService),
-            provideFilters('truncateFilter')
-        ]
-    })
-    class BlogContainerComponent {
-        article = {
-            type: 'anyArticleType'
-        };
-        profile = {
-            name: 'profile-name'
-        };
-    }
-
-    beforeEach(() => {
-
-        // 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 Noosfero ArtileView will be load on our tests
-        angular.mock.module("templates")
-
-        providers((provide: any) => {
-            return <any > [
-                provide('ArticleService', {
-                    useValue: articleService
-                })
-            ]
-        });
-    });
-
-    it("renders the blog content", (done: Function) => {
-
-        createComponentFromClass(BlogContainerComponent).then((fixture) => {
-
-            expect(fixture.debugElement.query('div.blog').length).toEqual(1);
-
-            done();
-        });
-    });
-
-    it("verify the blog data", (done: Function) => {
-
-        // defining a mock result to articleService.getChildren method
-        articleService.getChildren = (article_id: number, filters: {}) => {
-            return promiseResultTemplate({
-                headers: (headerName: string) => {
-                    return 1;
-                },
-                data: < any > {
-                    articles: [{
-                        id: 1,
-                        title: 'The article test'
-                    }]
-                }
-            });
-        };
-
-        createComponentFromClass(BlogContainerComponent).then((fixture) => {
-
-            // gets the children component of BlogContainerComponent
-            let articleBlog: BlogContainerComponent = fixture.debugElement.componentViewChildren[0].componentInstance;
-
-            // check if the component property are the provided by the mocked articleService
-            let post = {
-                id: 1,
-                title: 'The article test'
-            };
-            expect(( < any > articleBlog)["posts"][0]).toEqual(jasmine.objectContaining(post));
-            expect(( < any > articleBlog)["totalPosts"]).toEqual(1);
-
-            done();
-        });
-
-    });
-
-});
 \ No newline at end of file
@@ -1,48 +0,0 @@
-import {Component, Input, Inject} from "ng-forward";
-
-import {Article, Profile} from "./../../../models/interfaces";
-import {ArticleService} from "../../../../lib/ng-noosfero-api/http/article.service";
-
-/**
- * @ngdoc controller
- * @name ArticleBlog
- * @description
- *  An specific {@link ArticleView} for Blog articles.
- */
-@Component({
-    selector: "noosfero-blog",
-    templateUrl: "app/components/noosfero-articles/blog/blog.html"
-})
-@Inject(ArticleService)
-export class ArticleBlog {
-
-    @Input() article: Article;
-    @Input() profile: Profile;
-
-    private posts: any[];
-    private perPage: number = 3;
-    private currentPage: number;
-    private totalPosts: number = 0;
-
-    constructor(private articleService: ArticleService) { }
-
-    ngOnInit() {
-        this.loadPage();
-    }
-
-    loadPage() {
-        let filters = {
-            content_type: "TinyMceArticle",
-            per_page: this.perPage,
-            page: this.currentPage
-        };
-
-        this.articleService
-            .getChildren(this.article.id, filters)
-            .then((response: restangular.IResponse) => {
-                this.totalPosts = <number>(<any>response.headers("total"));
-                this.posts = response.data.articles;
-            });
-    }
-
-}
@@ -1,24 +0,0 @@
-<div class="blog">
-  <div class="blog-cover" ng-show="ctrl.article.image">
-    <img ng-src="{{ctrl.article.image.url}}" class="img-responsive">
-    <h3 ng-bind="ctrl.article.title"></h3>
-  </div>
-
-  <div class="page-header" ng-show="!ctrl.article.image">
-    <h3 ng-bind="ctrl.article.title"></h3>
-  </div>
-
-  <div>
-    <div ng-repeat="child in ctrl.posts | orderBy: 'created_at':true">
-      <div class="page-header">
-        <a class="title" ui-sref="main.profile.page({profile: ctrl.profile.identifier, page: child.path})"><h4 ng-bind="child.title"></h4></a>
-        <div class="post-lead" ng-bind-html="child.body | truncate: 500: '...': true"></div>
-      </div>
-    </div>
-  </div>
-
-  <pagination ng-model="ctrl.currentPage" total-items="ctrl.totalPosts" class="pagination-sm center-block"
-    boundary-links="true" items-per-page="ctrl.perPage" ng-change="ctrl.loadPage()"
-    first-text="«" last-text="»" previous-text="‹" next-text="›">
-  </pagination>
-</div>
@@ -1,15 +0,0 @@
-.blog {
-  .blog-cover {
-    margin: -15px;
-    position: relative;
-    h3 {
-      position: absolute;
-      bottom: 0;
-      background-color: rgba(0, 0, 0, 0.4);
-      color: white;
-      padding: 10px 15px;
-      margin: 0;
-      width: 100%;
-    }
-  }
-}
@@ -1,2 +0,0 @@
-/* Module Index Entry - generated using the script npm run generate-index */
-export * from "./blog.component";
@@ -1 +0,0 @@
-/* Module Index Entry - generated using the script npm run generate-index */
@@ -1,91 +0,0 @@
-import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
-import {Input, provide, Component} from 'ng-forward';
-
-import {Block} 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: [Block] })
-            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: Block = 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: [Block, 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: [Block] })
-            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 Block {
-
-    @Input() block: any;
-    @Input() owner: any;
-
-    ngOnInit() {
-        let blockName = (this.block && this.block.type) ? this.block.type.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,10 +0,0 @@
-.block {
-  .panel-title {
-    font-size: 15px;
-    font-weight: bold;
-  }
-  .panel-heading {
-    background-color: transparent;
-    border: 0;
-  }
-}
@@ -1,2 +0,0 @@
-/* Module Index Entry - generated using the script npm run generate-index */
-export * from "./block.component";
@@ -1,2 +0,0 @@
-/* Module Index Entry - generated using the script npm run generate-index */
-export * from "./link-list.component";
@@ -1,65 +0,0 @@
-import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
-import {Pipe, Input, provide, Component} from 'ng-forward';
-import {provideFilters} from '../../../../spec/helpers';
-
-import {LinkListBlock} from './link-list.component';
-
-const tcb = new TestComponentBuilder();
-
-const htmlTemplate: string = '<noosfero-link-list-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-link-list-block>';
-
-
-describe("Components", () => {
-
-    describe("Link List Block Component", () => {
-
-        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: [LinkListBlock] })
-            class BlockContainerComponent {
-                block = { type: 'Block' };
-                owner = { name: 'profile-name' };
-                constructor() {
-                }
-            }
-
-            // uses the TestComponentBuilder instance to initialize the component
-            //.overrideView(LinkListBlock, { template: 'asdasdasd', pipes: [NoosferoTemplate] })
-            tcb.createAsync(BlockContainerComponent).then(fixture => {
-                // and here we can inspect and run the test assertions
-                let myComponent: LinkListBlock = 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("display links stored in block settings", done => {
-
-            @Component({
-                selector: 'test-container-component',
-                template: htmlTemplate,
-                directives: [LinkListBlock],
-                providers: provideFilters("noosferoTemplateFilter")
-            })
-            class CustomBlockType {
-                block: any = { settings: { links: [{ name: 'link1', address: 'address1' }, { name: 'link2', address: 'address2' }] } };
-                owner: any = { name: 'profile-name' };
-            }
-            tcb.createAsync(CustomBlockType).then(fixture => {
-                expect(fixture.debugElement.queryAll(".link-list-block a").length).toEqual(2);
-                done();
-            });
-        });
-
-    });
-
-});
 \ No newline at end of file
@@ -1,20 +0,0 @@
-import {Component, Input} from "ng-forward";
-
-@Component({
-    selector: "noosfero-link-list-block",
-    templateUrl: "app/components/noosfero-blocks/link-list/link-list.html"
-})
-export class LinkListBlock {
-
-    @Input() block: any;
-    @Input() owner: any;
-
-    links: any;
-
-    ngOnInit() {
-        if (this.block && this.block.settings) {
-            this.links = this.block.settings.links;
-        }
-    }
-
-}
@@ -1,7 +0,0 @@
-<div class="link-list-block">
-  <div ng-repeat="link in ctrl.links">
-    <a ng-href="{{link.address | noosferoTemplate:{profile: ctrl.owner.identifier} }}">
-      <i class="fa fa-fw icon-{{link.icon}}"></i> <span>{{link.name}}</span>
-    </a>
-  </div>
-</div>
@@ -1,34 +0,0 @@
-.icon-event {
-  @extend .fa-calendar;
-}
-.icon-photos {
-  @extend .fa-photo;
-}
-.icon-edit {
-  @extend .fa-edit;
-}
-.icon-ok {
-  @extend .fa-check;
-}
-.icon-send {
-  @extend .fa-send-o;
-}
-.icon-menu-people {
-  @extend .fa-user;
-}
-.icon-forum {
-  @extend .fa-users;
-}
-.icon-new {
-  @extend .fa-file-o;
-}
-.icon-save {
-  @extend .fa-save;
-}
-
-.link-list-block {
-  a i {
-    line-height: 25px;
-    color: #949494;
-  }
-}
@@ -1 +0,0 @@
-/* Module Index Entry - generated using the script npm run generate-index */
@@ -1,41 +0,0 @@
-import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
-import {Input, provide, Component, StateConfig} from 'ng-forward';
-
-import {MainBlock} from './main-block.component';
-import {NoosferoApp} from '../../../index.module';
-
-const tcb = new TestComponentBuilder();
-
-const htmlTemplate: string = '<noosfero-main-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-main-block>';
-
-describe("Components", () => {
-    describe("Main 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("check if the main block has a tag with ui-view attribute", done => {
-
-            // Creating a container component (BlockContainerComponent) to include
-            // the component under test (Block)
-            @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [MainBlock] })
-            class BlockContainerComponent {
-            }
-
-            // 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: MainBlock = fixture.componentInstance;
-
-                // assure the block object inside the Block matches
-                // the provided through the parent component
-                expect(fixture.debugElement.queryAll('[ui-view="mainBlockContent"]').length).toEqual(1)
-                done();
-            });
-        });
-        
-    });
-});
 \ No newline at end of file
@@ -1,10 +0,0 @@
-import {Component, Input} from 'ng-forward'
-import {Block} from '../block.component';
-
-@Component({
-    selector: 'noosfero-main-block',
-    templateUrl: 'app/components/noosfero-blocks/main-block/main-block.html'
-})
-export class MainBlock {
-
-}
@@ -1 +0,0 @@
-<div ui-view="mainBlockContent" autoscroll></div>
@@ -1 +0,0 @@
-/* Module Index Entry - generated using the script npm run generate-index */
@@ -1,53 +0,0 @@
-import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
-import {Provider, Input, provide, Component} from 'ng-forward';
-
-import {MembersBlock} from './members-block.component';
-
-const htmlTemplate: string = '<noosfero-members-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-members-block>';
-
-const tcb = new TestComponentBuilder();
-
-describe("Components", () => {
-    describe("Members 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: [MembersBlock], providers: providers })
-        class BlockContainerComponent {
-            block = { type: 'Block', settings: {} };
-            owner = { name: 'profile-name' };
-            constructor() {
-            }
-        }
-
-        it("get members of the block owner", done => {
-            tcb.createAsync(BlockContainerComponent).then(fixture => {
-                let block: MembersBlock = fixture.debugElement.componentViewChildren[0].componentInstance;
-                expect(block.members).toEqual([{ identifier: "person1" }]);
-                done();
-            });
-        });
-
-        it("render the profile image for each member", 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
@@ -1,25 +0,0 @@
-import {Input, Inject, Component} from "ng-forward";
-import {ProfileService} from "../../../../lib/ng-noosfero-api/http/profile.service";
-
-@Component({
-    selector: "noosfero-members-block",
-    templateUrl: 'app/components/noosfero-blocks/members-block/members-block.html',
-})
-@Inject(ProfileService)
-export class MembersBlock {
-
-    @Input() block: any;
-    @Input() owner: any;
-
-    members: any = [];
-
-    constructor(private profileService: ProfileService) {
-
-    }
-
-    ngOnInit() {
-        this.profileService.getProfileMembers(this.owner.id, { per_page: 6 }).then((response: any) => {
-            this.members = response.data.people;
-        });
-    }
-}
@@ -1,5 +0,0 @@
-<div class="members-block">
-  <a ng-repeat="member in ctrl.members" ui-sref="main.profile.home({profile: member.identifier})" class="member">
-    <noosfero-profile-image [profile]="member"></noosfero-profile-image>
-  </a>
-</div>
@@ -1,17 +0,0 @@
-.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;
-    }
-  }
-}
@@ -1,46 +0,0 @@
-import {TestComponentBuilder, ComponentFixture} from 'ng-forward/cjs/testing/test-component-builder';
-import {Pipe, Input, provide, Component} from 'ng-forward';
-
-import {ProfileImageBlock} from './profile-image-block.component';
-
-import * as helpers from "./../../../../spec/helpers";
-
-const tcb = new TestComponentBuilder();
-
-const htmlTemplate: string = '<noosfero-profile-image-block  [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-profile-image-block>';
-
-describe("Components", () => {
-
-    describe("Profile Image Block Component", () => {
-
-        beforeEach(angular.mock.module("templates"));
-
-        @Component({
-            selector: 'test-container-component',
-            template: htmlTemplate,
-            directives: [ProfileImageBlock],
-            providers: helpers.provideFilters("translateFilter")
-        })
-        class BlockContainerComponent {
-            block = { type: 'Block' };
-            owner = { name: 'profile-name' };
-            constructor() {
-            }
-        }
-
-        it("show image if present", () => {
-            helpers.tcb.createAsync(BlockContainerComponent).then(fixture => {
-                var elProfile = fixture.debugElement.componentViewChildren[0];
-                expect(elProfile.query('div.profile-image-block').length).toEqual(1);
-            });
-        });
-
-        it("has link to the profile", () => {
-            helpers.tcb.createAsync(BlockContainerComponent).then(fixture => {
-                var elProfile = fixture.debugElement.componentViewChildren[0];
-                expect(elProfile.query('a.settings-link').length).toEqual(1);
-            });
-        });
-
-    });
-});
@@ -1,14 +0,0 @@
-import {Inject, Input, Component} from "ng-forward";
-import {ProfileImage} from "./../../../components/noosfero/profile-image/profile-image.component";
-
-@Component({
-    selector: "noosfero-profile-image-block",
-    templateUrl: 'app/components/noosfero-blocks/profile-image-block/profile-image-block.html',
-    directives: [ProfileImage]
-})
-export class ProfileImageBlock {
-
-    @Input() block: any;
-    @Input() owner: any;
-    
-}
@@ -1,6 +0,0 @@
-<div class="center-block text-center profile-image-block">
-  <a ui-sref="main.profile.info({profile: ctrl.owner.identifier})">
-    <noosfero-profile-image [profile]="ctrl.owner"></noosfero-profile-image>
-  </a>
-  <a class="settings-link" target="_self" ui-sref="main.profile.settings({profile: ctrl.owner.identifier})">{{"blocks.profile_image.control_panel" | translate}}</a>
-</div>
@@ -1,5 +0,0 @@
-.profile-image-block {
-  .settings-link {
-    display: block;
-  }
-}
@@ -1,36 +0,0 @@
-import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
-import {Component} from 'ng-forward';
-
-import {RawHTMLBlock} from './raw-html.component';
-
-const tcb = new TestComponentBuilder();
-
-const htmlTemplate: string = '<noosfero-raw-htmlblock [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-raw-htmlblock>';
-
-describe("Components", () => {
-
-    describe("Raw Html Block Component", () => {
-
-        beforeEach(angular.mock.module("templates"));
-        beforeEach(angular.mock.module("ngSanitize"));
-
-        it("display html stored in block settings", done => {
-
-            @Component({
-                selector: 'test-container-component',
-                template: htmlTemplate,
-                directives: [RawHTMLBlock],
-            })
-            class CustomBlockType {
-                block: any = { settings: { html: '<em>block content</em>' } };
-                owner: any = { name: 'profile-name' };
-            }
-            tcb.createAsync(CustomBlockType).then(fixture => {
-                expect(fixture.debugElement.query(".raw-html-block em").text().trim()).toEqual('block content');
-                done();
-            });
-        });
-
-    });
-
-});
@@ -1,18 +0,0 @@
-import {Component, Input} from "ng-forward";
-
-@Component({
-    selector: "noosfero-raw-htmlblock",
-    templateUrl: 'app/components/noosfero-blocks/raw-html/raw-html.html'
-})
-
-export class RawHTMLBlock {
-
-    @Input() block: any;
-    @Input() owner: any;
-
-    html: string;
-
-    ngOnInit() {
-        this.html = this.block.settings.html;
-    }
-}
@@ -1,2 +0,0 @@
-<div class="raw-html-block" ng-bind-html="ctrl.html">
-</div>
@@ -1 +0,0 @@
-/* Module Index Entry - generated using the script npm run generate-index */
@@ -1,53 +0,0 @@
-import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
-import {Provider, Input, provide, Component} from 'ng-forward';
-import {provideFilters} from '../../../../spec/helpers';
-import {RecentDocumentsBlock} from './recent-documents.component';
-
-const htmlTemplate: string = '<noosfero-recent-documents-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-recent-documents-block>';
-
-const tcb = new TestComponentBuilder();
-
-describe("Components", () => {
-    describe("Recent Documents Block Component", () => {
-
-        beforeEach(angular.mock.module("templates"));
-
-        let state = jasmine.createSpyObj("state", ["go"]);
-        let providers = [
-            new Provider('$state', { useValue: state }),
-            new Provider('ArticleService', {
-                useValue: {
-                    getByProfile: (profileId: number, filters: any): any => {
-                        return Promise.resolve({ data: { articles: [{ name: "article1" }] } });
-                    }
-                }
-            }),
-        ].concat(provideFilters("truncateFilter", "stripTagsFilter"));
-
-        @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [RecentDocumentsBlock], providers: providers })
-        class BlockContainerComponent {
-            block = { type: 'Block', settings: {} };
-            owner = { name: 'profile-name' };
-            constructor() {
-            }
-        }
-
-        it("get recent documents from the article service", done => {
-            tcb.createAsync(BlockContainerComponent).then(fixture => {
-                let recentDocumentsBlock: RecentDocumentsBlock = fixture.debugElement.componentViewChildren[0].componentInstance;
-                expect(recentDocumentsBlock.documents).toEqual([{ name: "article1" }]);
-                done();
-            });
-        });
-
-        it("go to article page when open a document", done => {
-            tcb.createAsync(BlockContainerComponent).then(fixture => {
-                let recentDocumentsBlock: RecentDocumentsBlock = fixture.debugElement.componentViewChildren[0].componentInstance;
-                recentDocumentsBlock.openDocument({ path: "path", profile: { identifier: "identifier" } });
-                expect(state.go).toHaveBeenCalledWith("main.profile.page", { page: "path", profile: "identifier" });
-                done();
-            });
-        });
-
-    });
-});
 \ No newline at end of file
@@ -1,38 +0,0 @@
-import {Component, Inject, Input} from "ng-forward";
-import {ArticleService} from "../../../../lib/ng-noosfero-api/http/article.service";
-
-@Component({
-    selector: "noosfero-recent-documents-block",
-    templateUrl: 'app/components/noosfero-blocks/recent-documents/recent-documents.html'
-})
-@Inject(ArticleService, "$state")
-export class RecentDocumentsBlock {
-
-    @Input() block: any;
-    @Input() owner: any;
-
-    profile: any;
-    documents: any;
-
-    documentsLoaded: boolean = false;
-
-    constructor(private articleService: ArticleService, private $state: any) {
-    }
-
-    ngOnInit() {
-        this.profile = this.owner;
-        this.documents = [];
-
-        var limit = (this.block && this.block.settings) ? this.block.settings.limit : null || 5;
-        //FIXME get all text articles
-        this.articleService.getByProfile(this.profile.id, { content_type: 'TinyMceArticle', per_page: limit }).then((response: any) => {
-            this.documents = response.data.articles;
-            this.documentsLoaded = true;
-        });
-    }
-
-    openDocument(article: any) {
-        this.$state.go("main.profile.page", { page: article.path, profile: article.profile.identifier });
-    }
-
-}
@@ -1,18 +0,0 @@
-<div deckgrid source="ctrl.documents" class="deckgrid">
-  <div class="a-card panel media" ng-click="mother.ctrl.openDocument(card);">
-      <div class="author media-left" ng-show="card.author.image">
-        <img ng-src="{{card.author.image.url}}" class="img-circle">
-      </div>
-      <div class="header media-body">
-        <h5 class="title media-heading" ng-bind="card.title"></h5>
-
-        <div class="subheader">
-          <span class="time">
-            <i class="fa fa-clock-o"></i> <span am-time-ago="card.created_at | dateFormat"></span>
-          </span>
-        </div>
-      </div>
-      <img ng-show="card.image" ng-src="{{card.image.url}}" class="img-responsive article-image">
-      <div class="post-lead" ng-bind-html="card.body | stripTags | truncate: 100: '...': true"></div>
-  </div>
-</div>
...	...	@@ -3,7 +3,9 @@
3	3	"files.exclude": {
4	4	"**/.git": true,
5	5	"**/.DS_Store": true,
6		- "src/app/*.js": false
	6	+ "src/*/.js": true,
	7	+ "src/*/.js.map": true,
	8	+ "coverage": true
7	9	},
8	10	"editor.fontSize": 14,
9	11	"typescript.useCodeSnippetsOnMethodSuggest": true
...	...
...	...	@@ -0,0 +1,13 @@
	1	+let replace = require("replace");
	2	+
	3	+import * as path from "path";
	4	+
	5	+let wrong_jqlite_d_ts_file = path.join(__dirname, "../node_modules/ng-forward/cjs/util/jqlite-extensions.d.ts");
	6	+
	7	+replace({
	8	+ regex: /import JQuery from \".\/\";/,
	9	+ replacement: "",
	10	+ paths: [wrong_jqlite_d_ts_file],
	11	+ sillent: false
	12	+});
	13	+
...	...
...	...	@@ -4,21 +4,23 @@
4	4	"dependencies": {
5	5	"angular": "^1.5.0",
6	6	"angular-mock": "^1.0.0",
7		- "moment": "^2.11.2"
	7	+ "moment": "^2.11.2",
	8	+ "ng-forward": "0.0.1-alpha.12"
8	9	},
9	10	"scripts": {
10	11	"build": "webpack; gulp build",
11	12	"webpack": "webpack",
	13	+ "karma": "concurrently \"webpack -w\" \"karma start\"",
12	14	"docs": "gulp ngdocs; static-server docs",
13		- "karma": "karma",
14	15	"coverage": "karma start --single-run; npm run remap-coverage",
15	16	"remap-coverage": "ts-node --project ./dev-scripts ./dev-scripts/remapCoverage.ts",
16	17	"test-single": "karma start --single-run",
17	18	"test-and-coverage": "karma start & npm run remap-coverage",
18	19	"test": "webpack -w --test",
19		- "postinstall": "npm install -g bower && bower install && typings install && cd dev-scripts && typings install",
	20	+ "postinstall": "npm install -g bower; bower install; typings install; npm run fix-jqlite; cd dev-scripts; typings install",
20	21	"start": "concurrently \"webpack -w\" \"gulp serve\"",
21		- "generate-indexes": "ts-node --project ./dev-scripts ./dev-scripts/generate-index-modules.ts"
	22	+ "generate-indexes": "ts-node --project ./dev-scripts ./dev-scripts/generate-index-modules.ts",
	23	+ "fix-jqlite": "ts-node --project ./dev-scripts dev-scripts/fix-jqlite.ts"
22	24	},
23	25	"devDependencies": {
24	26	"browser-sync": "~2.9.11",
...	...	@@ -71,7 +73,6 @@
71	73	"karma-webpack": "^1.7.0",
72	74	"lodash": "~3.10.1",
73	75	"main-bower-files": "~2.9.0",
74		- "ng-forward": "0.0.1-alpha.12",
75	76	"on-build-webpack": "^0.1.0",
76	77	"phantomjs": "~1.9.18",
77	78	"phantomjs-polyfill": "0.0.2",
...	...
...	...	@@ -0,0 +1 @@
	1	+/* Module Index Entry - generated using the script npm run generate-index */
...	...
...	...	@@ -0,0 +1,108 @@
	1	+
	2	+import {Input, provide, Component} from 'ng-forward';
	3	+import {ArticleViewComponent, ArticleDefaultViewComponent} from './article-default-view.component';
	4	+
	5	+import {createComponentFromClass, quickCreateComponent} from "../../spec/helpers";
	6	+
	7	+// this htmlTemplate will be re-used between the container components in this spec file
	8	+const htmlTemplate: string = '<noosfero-article [article]="ctrl.article" [profile]="ctrl.profile"></noosfero-article>';
	9	+
	10	+
	11	+describe("Components", () => {
	12	+
	13	+ describe("ArticleView Component", () => {
	14	+
	15	+ // the karma preprocessor html2js transform the templates html into js files which put
	16	+ // the templates to the templateCache into the module templates
	17	+ // we need to load the module templates here as the template for the
	18	+ // component Noosfero ArtileView will be load on our tests
	19	+ beforeEach(angular.mock.module("templates"));
	20	+
	21	+ it("renders the default component when no specific component is found", (done: Function) => {
	22	+ // Creating a container component (ArticleContainerComponent) to include
	23	+ // the component under test (ArticleView)
	24	+ @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [ArticleViewComponent] })
	25	+ class ArticleContainerComponent {
	26	+ article = { type: 'anyArticleType' };
	27	+ profile = { name: 'profile-name' };
	28	+ constructor() {
	29	+ }
	30	+ }
	31	+
	32	+ createComponentFromClass(ArticleContainerComponent).then((fixture) => {
	33	+ // and here we can inspect and run the test assertions
	34	+
	35	+ // gets the children component of ArticleContainerComponent
	36	+ let articleView: ArticleViewComponent = fixture.debugElement.componentViewChildren[0].componentInstance;
	37	+
	38	+ // and checks if the article View rendered was the Default Article View
	39	+ expect(articleView.constructor.prototype).toEqual(ArticleDefaultViewComponent.prototype);
	40	+
	41	+ // done needs to be called (it isn't really needed, as we can read in
	42	+ // here (https://github.com/ngUpgraders/ng-forward/blob/master/API.md#createasync)
	43	+ // because createAsync in ng-forward is not really async, but as the intention
	44	+ // here is write tests in angular 2 ways, this is recommended
	45	+ done();
	46	+ });
	47	+
	48	+ });
	49	+
	50	+ it("receives the article and profile as inputs", (done: Function) => {
	51	+
	52	+ // Creating a container component (ArticleContainerComponent) to include
	53	+ // the component under test (ArticleView)
	54	+ @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [ArticleViewComponent] })
	55	+ class ArticleContainerComponent {
	56	+ article = { type: 'anyArticleType' };
	57	+ profile = { name: 'profile-name' };
	58	+ constructor() {
	59	+ }
	60	+ }
	61	+
	62	+ // uses the TestComponentBuilder instance to initialize the component
	63	+ createComponentFromClass(ArticleContainerComponent).then((fixture) => {
	64	+ // and here we can inspect and run the test assertions
	65	+ let articleView: ArticleViewComponent = fixture.debugElement.componentViewChildren[0].componentInstance;
	66	+
	67	+ // assure the article object inside the ArticleView matches
	68	+ // the provided through the parent component
	69	+ expect(articleView.article.type).toEqual("anyArticleType");
	70	+ expect(articleView.profile.name).toEqual("profile-name");
	71	+
	72	+ // done needs to be called (it isn't really needed, as we can read in
	73	+ // here (https://github.com/ngUpgraders/ng-forward/blob/master/API.md#createasync)
	74	+ // because createAsync in ng-forward is not really async, but as the intention
	75	+ // here is write tests in angular 2 ways, this is recommended
	76	+ done();
	77	+ });
	78	+ });
	79	+
	80	+
	81	+ it("renders a article view which matches to the article type", done => {
	82	+ // NoosferoTinyMceArticle component created to check if it will be used
	83	+ // when a article with type 'TinyMceArticle' is provided to the noosfero-article (ArticleView)
	84	+ // * Important * - the selector is what ng-forward uses to define the name of the directive provider
	85	+ @Component({ selector: 'noosfero-tiny-mce-article', template: "<h1>TinyMceArticle</h1>" })
	86	+ class TinyMceArticleView {
	87	+ @Input() article: any;
	88	+ @Input() profile: any;
	89	+ }
	90	+
	91	+ // Creating a container component (ArticleContainerComponent) to include our NoosferoTinyMceArticle
	92	+ @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [ArticleViewComponent, TinyMceArticleView] })
	93	+ class CustomArticleType {
	94	+ article = { type: 'TinyMceArticle' };
	95	+ profile = { name: 'profile-name' };
	96	+ constructor() {
	97	+ }
	98	+ }
	99	+ createComponentFromClass(CustomArticleType).then(fixture => {
	100	+ let myComponent: CustomArticleType = fixture.componentInstance;
	101	+ expect(myComponent.article.type).toEqual("TinyMceArticle");
	102	+ expect(fixture.debugElement.componentViewChildren[0].text()).toEqual("TinyMceArticle");
	103	+ done();
	104	+ });
	105	+ });
	106	+
	107	+ });
	108	+});
0	109	\ No newline at end of file
...	...
...	...	@@ -0,0 +1,57 @@
	1	+import { bundle, Input, Inject, Component, Directive } from 'ng-forward';
	2	+import {ArticleBlogComponent} from "./types/blog/blog.component";
	3	+
	4	+/**
	5	+ * @ngdoc controller
	6	+ * @name ArticleDefaultView
	7	+ * @description
	8	+ * A default view for Noosfero Articles. If the specific article view is
	9	+ * not implemented, then this view is used.
	10	+ */
	11	+@Component({
	12	+ selector: 'noosfero-default-article',
	13	+ templateUrl: 'app/article/article.html'
	14	+})
	15	+export class ArticleDefaultViewComponent {
	16	+
	17	+ @Input() article: noosfero.Article;
	18	+ @Input() profile: noosfero.Profile;
	19	+
	20	+}
	21	+
	22	+/**
	23	+ * @ngdoc controller
	24	+ * @name ArticleView
	25	+ * @description
	26	+ * A dynamic view for articles. It uses the article type to replace
	27	+ * the default template with the custom article directive.
	28	+ */
	29	+@Component({
	30	+ selector: 'noosfero-article',
	31	+ template: 'not-used',
	32	+ directives: [ArticleDefaultViewComponent, ArticleBlogComponent]
	33	+})
	34	+@Inject("$element", "$scope", "$injector", "$compile")
	35	+export class ArticleViewComponent {
	36	+
	37	+ @Input() article: noosfero.Article;
	38	+ @Input() profile: noosfero.Profile;
	39	+ directiveName: string;
	40	+
	41	+ ngOnInit() {
	42	+ let specificDirective = 'noosfero' + this.article.type;
	43	+ this.directiveName = "noosfero-default-article";
	44	+ if (this.$injector.has(specificDirective + 'Directive')) {
	45	+ this.directiveName = specificDirective.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
	46	+ }
	47	+ this.$element.replaceWith(this.$compile('<' + this.directiveName + ' [article]="ctrl.article" [profile]="ctrl.profile"></' + this.directiveName + '>')(this.$scope));
	48	+ }
	49	+
	50	+ constructor(
	51	+ private $element: any,
	52	+ private $scope: ng.IScope,
	53	+ private $injector: ng.auto.IInjectorService,
	54	+ private $compile: ng.ICompileService) {
	55	+
	56	+ }
	57	+}
...	...
...	...	@@ -0,0 +1,23 @@
	1	+<div class="article">
	2	+ <div class="page-header">
	3	+ <h3 ng-bind="ctrl.article.title"></h3>
	4	+ </div>
	5	+
	6	+ <div class="sub-header clearfix">
	7	+ <div class="page-info pull-right small text-muted">
	8	+ <span class="time">
	9	+ <i class="fa fa-clock-o"></i> <span am-time-ago="ctrl.article.created_at \| dateFormat"></span>
	10	+ </span>
	11	+ <span class="author" ng-if="ctrl.article.author">
	12	+ <i class="fa fa-user"></i>
	13	+ <a ui-sref="main.profile.home({profile: ctrl.article.author.identifier})">
	14	+ <span class="author-name" ng-bind="ctrl.article.author.name"></span>
	15	+ </a>
	16	+ </span>
	17	+ </div>
	18	+ </div>
	19	+
	20	+ <div class="page-body">
	21	+ <div ng-bind-html="ctrl.article.body"></div>
	22	+ </div>
	23	+</div>
...	...
...	...	@@ -0,0 +1,17 @@
	1	+.article {
	2	+ .page-info {
	3	+ .author {
	4	+ a {
	5	+ color: #b4bcc2;
	6	+ }
	7	+ }
	8	+ }
	9	+
	10	+ .page-header {
	11	+ margin-bottom: 5px;
	12	+ }
	13	+
	14	+ .sub-header {
	15	+ margin-bottom: 20px;
	16	+ }
	17	+}
...	...
...	...	@@ -0,0 +1,55 @@
	1	+import {quickCreateComponent} from "../../spec/helpers";
	2	+import {BasicEditorComponent} from "./basic-editor.component";
	3	+
	4	+
	5	+describe("Article BasicEditor", () => {
	6	+
	7	+ let $rootScope: ng.IRootScopeService;
	8	+ let $q: ng.IQService;
	9	+ let articleServiceMock: any;
	10	+ let profileServiceMock: any;
	11	+ let $state: any;
	12	+ let profile = { id: 1 };
	13	+ let notification: any;
	14	+
	15	+
	16	+ beforeEach(inject((_$rootScope_: ng.IRootScopeService, _$q_: ng.IQService) => {
	17	+ $rootScope = _$rootScope_;
	18	+ $q = _$q_;
	19	+ }));
	20	+
	21	+ beforeEach(() => {
	22	+ $state = jasmine.createSpyObj("$state", ["transitionTo"]);
	23	+ notification = jasmine.createSpyObj("notification", ["success"]);
	24	+ profileServiceMock = jasmine.createSpyObj("profileServiceMock", ["getCurrentProfile"]);
	25	+ articleServiceMock = jasmine.createSpyObj("articleServiceMock", ["createInProfile"]);
	26	+
	27	+ let getCurrentProfileResponse = $q.defer();
	28	+ getCurrentProfileResponse.resolve(profile);
	29	+
	30	+ let articleCreate = $q.defer();
	31	+ articleCreate.resolve({ data: { path: "path", profile: { identifier: "profile" } } });
	32	+
	33	+ profileServiceMock.getCurrentProfile = jasmine.createSpy("getCurrentProfile").and.returnValue(getCurrentProfileResponse.promise);
	34	+ articleServiceMock.createInProfile = jasmine.createSpy("createInProfile").and.returnValue(articleCreate.promise);
	35	+ });
	36	+
	37	+ it("create an article in the current profile when save", done => {
	38	+ let component: BasicEditorComponent = new BasicEditorComponent(articleServiceMock, profileServiceMock, $state, notification);
	39	+ component.save();
	40	+ $rootScope.$apply();
	41	+ expect(profileServiceMock.getCurrentProfile).toHaveBeenCalled();
	42	+ expect(articleServiceMock.createInProfile).toHaveBeenCalledWith(profile, component.article);
	43	+ done();
	44	+ });
	45	+
	46	+ it("got to the new article page and display an alert when saving sucessfully", done => {
	47	+ let component: BasicEditorComponent = new BasicEditorComponent(articleServiceMock, profileServiceMock, $state, notification);
	48	+ component.save();
	49	+ $rootScope.$apply();
	50	+ expect($state.transitionTo).toHaveBeenCalledWith("main.profile.page", { page: "path", profile: "profile" });
	51	+ expect(notification.success).toHaveBeenCalled();
	52	+ done();
	53	+ });
	54	+
	55	+});
...	...
...	...	@@ -0,0 +1,35 @@
	1	+import {StateConfig, Component, Inject, provide} from 'ng-forward';
	2	+import {ArticleService} from "../../lib/ng-noosfero-api/http/article.service";
	3	+import {ProfileService} from "../../lib/ng-noosfero-api/http/profile.service";
	4	+import {NotificationService} from "../shared/services/notification.service.ts";
	5	+
	6	+@Component({
	7	+ selector: 'article-basic-editor',
	8	+ templateUrl: "app/article/basic-editor.html",
	9	+ providers: [
	10	+ provide('articleService', { useClass: ArticleService }),
	11	+ provide('profileService', { useClass: ProfileService }),
	12	+ provide('notification', { useClass: NotificationService })
	13	+ ]
	14	+})
	15	+@Inject(ArticleService, ProfileService, "$state", NotificationService)
	16	+export class BasicEditorComponent {
	17	+
	18	+ article: noosfero.Article = <noosfero.Article>{};
	19	+
	20	+ constructor(private articleService: ArticleService,
	21	+ private profileService: ProfileService,
	22	+ private $state: ng.ui.IStateService,
	23	+ private notification: NotificationService) { }
	24	+
	25	+ save() {
	26	+ this.profileService.getCurrentProfile().then((profile: noosfero.Profile) => {
	27	+ return this.articleService.createInProfile(profile, this.article);
	28	+ }).then((response: noosfero.RestResult<noosfero.Article>) => {
	29	+ let article = (<noosfero.Article>response.data);
	30	+ this.$state.transitionTo('main.profile.page', { page: article.path, profile: article.profile.identifier });
	31	+ this.notification.success("Good job!", "Article saved!");
	32	+ });
	33	+ }
	34	+
	35	+}
...	...