Commit a59844945f5bb5de2378a5c4d362cac10cdc443e

Authored by Victor Costa
1 parent 2259690d

Move basic editor to its own folder

src/app/article/basic-editor.component.spec.ts
... ... @@ -1,57 +0,0 @@
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 $stateParams: any;
13   - let profile = { id: 1 };
14   - let notification: any;
15   -
16   -
17   - beforeEach(inject((_$rootScope_: ng.IRootScopeService, _$q_: ng.IQService) => {
18   - $rootScope = _$rootScope_;
19   - $q = _$q_;
20   - }));
21   -
22   - beforeEach(() => {
23   - $state = jasmine.createSpyObj("$state", ["transitionTo"]);
24   - $stateParams = jasmine.createSpyObj("$stateParams", ["parent_id"]);
25   - notification = jasmine.createSpyObj("notification", ["success"]);
26   - profileServiceMock = jasmine.createSpyObj("profileServiceMock", ["getCurrentProfile"]);
27   - articleServiceMock = jasmine.createSpyObj("articleServiceMock", ["createInParent"]);
28   -
29   - let getCurrentProfileResponse = $q.defer();
30   - getCurrentProfileResponse.resolve(profile);
31   -
32   - let articleCreate = $q.defer();
33   - articleCreate.resolve({ data: { path: "path", profile: { identifier: "profile" } } });
34   -
35   - profileServiceMock.getCurrentProfile = jasmine.createSpy("getCurrentProfile").and.returnValue(getCurrentProfileResponse.promise);
36   - articleServiceMock.createInParent = jasmine.createSpy("createInParent").and.returnValue(articleCreate.promise);
37   - });
38   -
39   - it("create an article in the current profile when save", done => {
40   - let component: BasicEditorComponent = new BasicEditorComponent(articleServiceMock, profileServiceMock, $state, notification, $stateParams);
41   - component.save();
42   - $rootScope.$apply();
43   - expect(profileServiceMock.getCurrentProfile).toHaveBeenCalled();
44   - expect(articleServiceMock.createInParent).toHaveBeenCalledWith($stateParams.parent_id, component.article);
45   - done();
46   - });
47   -
48   - it("got to the new article page and display an alert when saving sucessfully", done => {
49   - let component: BasicEditorComponent = new BasicEditorComponent(articleServiceMock, profileServiceMock, $state, notification, $stateParams);
50   - component.save();
51   - $rootScope.$apply();
52   - expect($state.transitionTo).toHaveBeenCalledWith("main.profile.page", { page: "path", profile: "profile" });
53   - expect(notification.success).toHaveBeenCalled();
54   - done();
55   - });
56   -
57   -});
src/app/article/basic-editor.component.ts
... ... @@ -1,41 +0,0 @@
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, "$stateParams")
16   -export class BasicEditorComponent {
17   -
18   - article: noosfero.Article = <noosfero.Article>{};
19   - parentId: number;
20   -
21   - editorOptions = {};
22   -
23   - constructor(private articleService: ArticleService,
24   - private profileService: ProfileService,
25   - private $state: ng.ui.IStateService,
26   - private notification: NotificationService,
27   - private $stateParams: ng.ui.IStateParamsService) {
28   - this.parentId = this.$stateParams['parent_id'];
29   - }
30   -
31   - save() {
32   - this.profileService.getCurrentProfile().then((profile: noosfero.Profile) => {
33   - return this.articleService.createInParent(this.parentId, this.article);
34   - }).then((response: noosfero.RestResult<noosfero.Article>) => {
35   - let article = (<noosfero.Article>response.data);
36   - this.$state.transitionTo('main.profile.page', { page: article.path, profile: article.profile.identifier });
37   - this.notification.success({ title: "Good job!", message: "Article saved!" });
38   - });
39   - }
40   -
41   -}
src/app/article/basic-editor.html
... ... @@ -1,11 +0,0 @@
1   -<form>
2   - <div class="form-group">
3   - <label for="titleInput">Title</label>
4   - <input type="text" class="form-control" id="titleInput" placeholder="title" ng-model="vm.article.name">
5   - </div>
6   - <div class="form-group">
7   - <label for="bodyInput">Text</label>
8   - <textarea ckeditor="vm.editorOptions" class="form-control" id="bodyInput" rows="10" ng-model="vm.article.body"></textarea>
9   - </div>
10   - <button type="submit" class="btn btn-default" ng-click="vm.save()">Save</button>
11   -</form>
src/app/article/basic-editor/basic-editor.component.spec.ts 0 → 100644
... ... @@ -0,0 +1,57 @@
  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 $stateParams: any;
  13 + let profile = { id: 1 };
  14 + let notification: any;
  15 +
  16 +
  17 + beforeEach(inject((_$rootScope_: ng.IRootScopeService, _$q_: ng.IQService) => {
  18 + $rootScope = _$rootScope_;
1
  • Me
    Michel Felipe @mfdeveloper

    Did you try use the AngularServiceFactory.getService() method, created by @abner to retrieve core angular services? I think this is better than use angular 1.x functions directly.

    Choose File ...   File name...
    Cancel
  19 + $q = _$q_;
  20 + }));
  21 +
  22 + beforeEach(() => {
  23 + $state = jasmine.createSpyObj("$state", ["transitionTo"]);
  24 + $stateParams = jasmine.createSpyObj("$stateParams", ["parent_id"]);
  25 + notification = jasmine.createSpyObj("notification", ["success"]);
  26 + profileServiceMock = jasmine.createSpyObj("profileServiceMock", ["setCurrentProfileByIdentifier"]);
  27 + articleServiceMock = jasmine.createSpyObj("articleServiceMock", ["createInParent"]);
  28 +
  29 + let setCurrentProfileByIdentifierResponse = $q.defer();
  30 + setCurrentProfileByIdentifierResponse.resolve(profile);
  31 +
  32 + let articleCreate = $q.defer();
  33 + articleCreate.resolve({ data: { path: "path", profile: { identifier: "profile" } } });
  34 +
  35 + profileServiceMock.setCurrentProfileByIdentifier = jasmine.createSpy("setCurrentProfileByIdentifier").and.returnValue(setCurrentProfileByIdentifierResponse.promise);
  36 + articleServiceMock.createInParent = jasmine.createSpy("createInParent").and.returnValue(articleCreate.promise);
  37 + });
  38 +
  39 + it("create an article in the current profile when save", done => {
  40 + let component: BasicEditorComponent = new BasicEditorComponent(articleServiceMock, profileServiceMock, $state, notification, $stateParams);
  41 + component.save();
  42 + $rootScope.$apply();
2
  • Me
    Michel Felipe @mfdeveloper

    Why did you use $rootScope in this case? Did you try use detectChanges() ng-forward method?

    Choose File ...   File name...
    Cancel
  • 4a20548511a65cfccc863520b70c3ee9?s=40&d=identicon
    Victor Costa @vfcosta

    It's a legacy code, I just move this file to another folder. I'll refactor it and apply your considerations.

    Choose File ...   File name...
    Cancel
  43 + expect(profileServiceMock.setCurrentProfileByIdentifier).toHaveBeenCalled();
  44 + expect(articleServiceMock.createInParent).toHaveBeenCalledWith($stateParams.parent_id, component.article);
  45 + done();
  46 + });
  47 +
  48 + it("got to the new article page and display an alert when saving sucessfully", done => {
  49 + let component: BasicEditorComponent = new BasicEditorComponent(articleServiceMock, profileServiceMock, $state, notification, $stateParams);
  50 + component.save();
  51 + $rootScope.$apply();
  52 + expect($state.transitionTo).toHaveBeenCalledWith("main.profile.page", { page: "path", profile: "profile" });
  53 + expect(notification.success).toHaveBeenCalled();
  54 + done();
  55 + });
  56 +
  57 +});
... ...
src/app/article/basic-editor/basic-editor.component.ts 0 → 100644
... ... @@ -0,0 +1,41 @@
  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/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, "$stateParams")
  16 +export class BasicEditorComponent {
  17 +
  18 + article: noosfero.Article = <noosfero.Article>{};
  19 + parentId: number;
  20 +
  21 + editorOptions = {};
  22 +
  23 + constructor(private articleService: ArticleService,
  24 + private profileService: ProfileService,
  25 + private $state: ng.ui.IStateService,
  26 + private notification: NotificationService,
  27 + private $stateParams: ng.ui.IStateParamsService) {
  28 + this.parentId = this.$stateParams['parent_id'];
  29 + }
  30 +
  31 + save() {
  32 + this.profileService.setCurrentProfileByIdentifier(this.$stateParams["profile"]).then((profile: noosfero.Profile) => {
  33 + return this.articleService.createInParent(this.parentId, this.article);
  34 + }).then((response: noosfero.RestResult<noosfero.Article>) => {
  35 + let article = (<noosfero.Article>response.data);
  36 + this.$state.transitionTo('main.profile.page', { page: article.path, profile: article.profile.identifier });
  37 + this.notification.success({ title: "Good job!", message: "Article saved!" });
  38 + });
  39 + }
  40 +
  41 +}
... ...
src/app/article/basic-editor/basic-editor.html 0 → 100644
... ... @@ -0,0 +1,17 @@
  1 +<div class="basic-editor row">
  2 + <div class="col-md-2"></div>
  3 + <div class="col-md-8">
  4 + <form>
  5 + <div class="form-group">
  6 + <label for="titleInput">Title</label>
  7 + <input type="text" class="form-control" id="titleInput" placeholder="title" ng-model="vm.article.name">
  8 + </div>
  9 + <div class="form-group">
  10 + <label for="bodyInput">Text</label>
  11 + <textarea ckeditor="vm.editorOptions" class="form-control" id="bodyInput" rows="10" ng-model="vm.article.body"></textarea>
  12 + </div>
  13 + <button type="submit" class="btn btn-default" ng-click="vm.save()">Save</button>
  14 + </form>
  15 + </div>
  16 + <div class="col-md-2"></div>
  17 +</div>
... ...
src/app/article/basic-editor/basic-editor.scss 0 → 100644
... ... @@ -0,0 +1,4 @@
  1 +.basic-editor {
  2 + @extend .container-fluid;
  3 + padding: 0 1%;
  4 +}
... ...
src/app/article/content-viewer/navbar-actions.html
1 1 <ul class="nav navbar-nav">
2 2 <li ng-show="vm.profile">
3   - <a ng-show="vm.parentId" href="#" role="button" ui-sref="main.profile.cms({profile: vm.profile.identifier, parent_id: vm.parentId})">
  3 + <a ng-show="vm.parentId" href="#" role="button" ui-sref="main.cms({profile: vm.profile.identifier, parent_id: vm.parentId})">
4 4 <i class="fa fa-file fa-fw fa-lg"></i> {{"navbar.content_viewer_actions.new_post" | translate}}
5 5 </a>
6 6 </li>
... ...
src/app/article/index.ts
1 1 /* Module Index Entry - generated using the script npm run generate-index */
2 2 export * from "./article-default-view.component";
3   -export * from "./basic-editor.component";
... ...
src/app/profile/profile.component.ts
1 1 import {StateConfig, Component, Inject, provide} from 'ng-forward';
2 2 import {ProfileInfoComponent} from './info/profile-info.component';
3 3 import {ProfileHomeComponent} from './profile-home.component';
4   -import {BasicEditorComponent} from '../article/basic-editor.component';
  4 +import {BasicEditorComponent} from '../article/basic-editor/basic-editor.component';
5 5 import {ContentViewerComponent} from "../article/content-viewer/content-viewer.component";
6 6 import {ContentViewerActionsComponent} from "../article/content-viewer/content-viewer-actions.component";
7 7 import {ActivitiesComponent} from "./activities/activities.component";
... ... @@ -45,12 +45,12 @@ import {MyProfileComponent} from &quot;./myprofile.component&quot;;
45 45 component: MyProfileComponent
46 46 },
47 47 {
48   - name: 'main.profile.cms',
  48 + name: 'main.cms',
49 49 url: "^/myprofile/:profile/cms?parent_id",
50 50 component: BasicEditorComponent,
51 51 views: {
52   - "mainBlockContent": {
53   - templateUrl: "app/article/basic-editor.html",
  52 + "content": {
  53 + templateUrl: "app/article/basic-editor/basic-editor.html",
54 54 controller: BasicEditorComponent,
55 55 controllerAs: "vm"
56 56 }
... ...