Download as
Browse Code »

Commit 4b876c39b7875cc308c6f4d2f99caa810d100f5b

Authored by Victor Costa
1 parent a944f06a
Exists in master and in 28 other branches activities_block, btn-new-post, cosmetic_changes_people_and_communities_block, edit-blocks, edit-header-footer, env-tags-block, forgot_password, header_and_footer, layout_support, list_articles_on_blog, loading-indicator-component, login_modal, login_modal_improve, person_info_block, profile-article-resolvers, profile-blocks-sass, profile_description_block_component, profile_page_improvements, recent-activities, remove-article-confirmation, signup_page, skin-small-change, staging, tags-block, theme-skin-yellow, translations, updated_signup_page, users_profile_page

Improve layout of post comment component

Showing 8 changed files with 53 additions and 11 deletions   Show diff stats
src/app/article/article-default-view-component.spec.ts
  Diff comments   View file @4b876c3
@@ -27,7 +27,8 @@ describe("Components", () => { @@ -27,7 +27,8 @@ describe("Components", () => {
27 providers: [ 27 providers: [
28 helpers.createProviderToValue('CommentService', helpers.mocks.commentService), 28 helpers.createProviderToValue('CommentService', helpers.mocks.commentService),
29 helpers.provideFilters("translateFilter"), 29 helpers.provideFilters("translateFilter"),
30 - helpers.createProviderToValue('NotificationService', helpers.mocks.notificationService) 30 + helpers.createProviderToValue('NotificationService', helpers.mocks.notificationService),
  31 + helpers.createProviderToValue('SessionService', helpers.mocks.sessionWithCurrentUser({}))
31 ] 32 ]
32 }) 33 })
33 class ArticleContainerComponent { 34 class ArticleContainerComponent {
@@ -64,7 +65,8 @@ describe("Components", () => { @@ -64,7 +65,8 @@ describe("Components", () => {
64 providers: [ 65 providers: [
65 helpers.createProviderToValue('CommentService', helpers.mocks.commentService), 66 helpers.createProviderToValue('CommentService', helpers.mocks.commentService),
66 helpers.provideFilters("translateFilter"), 67 helpers.provideFilters("translateFilter"),
67 - helpers.createProviderToValue('NotificationService', helpers.mocks.notificationService) 68 + helpers.createProviderToValue('NotificationService', helpers.mocks.notificationService),
  69 + helpers.createProviderToValue('SessionService', helpers.mocks.sessionWithCurrentUser({}))
68 ] 70 ]
69 }) 71 })
70 class ArticleContainerComponent { 72 class ArticleContainerComponent {
src/app/article/comment/comments.component.spec.ts
  Diff comments   View file @4b876c3
@@ -18,11 +18,12 @@ describe("Components", () => { @@ -18,11 +18,12 @@ describe("Components", () => {
18 .and.returnValue(helpers.mocks.promiseResultTemplate({ data: comments })); 18 .and.returnValue(helpers.mocks.promiseResultTemplate({ data: comments }));
19 19
20 let providers = [ 20 let providers = [
21 - new Provider('CommentService', { useValue: commentService }),  
22 - new Provider('NotificationService', { useValue: helpers.mocks.notificationService }) 21 + helpers.createProviderToValue('CommentService', commentService),
  22 + helpers.createProviderToValue('NotificationService', helpers.mocks.notificationService),
  23 + helpers.createProviderToValue('SessionService', helpers.mocks.sessionWithCurrentUser({}))
23 ].concat(helpers.provideFilters("translateFilter")); 24 ].concat(helpers.provideFilters("translateFilter"));
24 25
25 - let properties = { article: { id: 1 }, parent: null }; 26 + let properties = { article: { id: 1 }, parent: <any>null };
26 function createComponent() { 27 function createComponent() {
27 return helpers.quickCreateComponent({ 28 return helpers.quickCreateComponent({
28 providers: providers, 29 providers: providers,
src/app/article/comment/post-comment/post-comment.component.spec.ts
  Diff comments   View file @4b876c3
@@ -11,9 +11,11 @@ describe(&quot;Components&quot;, () =&gt; { @@ -11,9 +11,11 @@ describe(&quot;Components&quot;, () =&gt; {
11 beforeEach(angular.mock.module("templates")); 11 beforeEach(angular.mock.module("templates"));
12 12
13 let commentService = jasmine.createSpyObj("commentService", ["createInArticle"]); 13 let commentService = jasmine.createSpyObj("commentService", ["createInArticle"]);
  14 + let user = {};
14 let providers = [ 15 let providers = [
15 new Provider('CommentService', { useValue: commentService }), 16 new Provider('CommentService', { useValue: commentService }),
16 - new Provider('NotificationService', { useValue: helpers.mocks.notificationService }) 17 + new Provider('NotificationService', { useValue: helpers.mocks.notificationService }),
  18 + new Provider('SessionService', { useValue: helpers.mocks.sessionWithCurrentUser(user) })
17 ].concat(helpers.provideFilters("translateFilter")); 19 ].concat(helpers.provideFilters("translateFilter"));
18 20
19 @Component({ selector: 'test-container-component', directives: [PostCommentComponent], template: htmlTemplate, providers: providers }) 21 @Component({ selector: 'test-container-component', directives: [PostCommentComponent], template: htmlTemplate, providers: providers })
src/app/article/comment/post-comment/post-comment.component.ts
  Diff comments   View file @4b876c3
1 import { Inject, Input, Component } from 'ng-forward'; 1 import { Inject, Input, Component } from 'ng-forward';
2 import { CommentService } from "../../../../lib/ng-noosfero-api/http/comment.service"; 2 import { CommentService } from "../../../../lib/ng-noosfero-api/http/comment.service";
3 import { NotificationService } from "../../../shared/services/notification.service"; 3 import { NotificationService } from "../../../shared/services/notification.service";
  4 +import { SessionService } from "../../../login";
4 5
5 @Component({ 6 @Component({
6 selector: 'noosfero-post-comment', 7 selector: 'noosfero-post-comment',
7 templateUrl: 'app/article/comment/post-comment/post-comment.html' 8 templateUrl: 'app/article/comment/post-comment/post-comment.html'
8 }) 9 })
9 -@Inject(CommentService, NotificationService, "$scope") 10 +@Inject(CommentService, NotificationService, "$scope", SessionService)
10 export class PostCommentComponent { 11 export class PostCommentComponent {
11 12
12 public static EVENT_COMMENT_RECEIVED = "comment.received"; 13 public static EVENT_COMMENT_RECEIVED = "comment.received";
@@ -15,8 +16,11 @@ export class PostCommentComponent { @@ -15,8 +16,11 @@ export class PostCommentComponent {
15 @Input() parent: noosfero.Comment; 16 @Input() parent: noosfero.Comment;
16 17
17 comment = <noosfero.Comment>{}; 18 comment = <noosfero.Comment>{};
  19 + private currentUser: noosfero.User;
18 20
19 - constructor(private commentService: CommentService, private notificationService: NotificationService, private $scope: ng.IScope) { } 21 + constructor(private commentService: CommentService, private notificationService: NotificationService, private $scope: ng.IScope, private session: SessionService) {
  22 + this.currentUser = this.session.currentUser();
  23 + }
20 24
21 save() { 25 save() {
22 if (this.parent && this.comment) { 26 if (this.parent && this.comment) {
src/app/article/comment/post-comment/post-comment.html
  Diff comments   View file @4b876c3
1 -<form> 1 +<form class="clearfix post-comment">
2 <div class="form-group"> 2 <div class="form-group">
3 - <textarea class="form-control custom-control" rows="3" ng-model="ctrl.comment.body"></textarea> 3 + <div class="comment media">
  4 + <div class="media-left">
  5 + <a ui-sref="main.profile.home({profile: ctrl.currentUser.person.identifier})">
  6 + <noosfero-profile-image [profile]="ctrl.currentUser.person"></noosfero-profile-image>
  7 + </a>
  8 + </div>
  9 + <div class="media-body">
  10 + <textarea class="form-control custom-control" rows="1" ng-model="ctrl.comment.body" placeholder="{{'comment.post.placeholder' | translate}}"></textarea>
  11 + <button ng-show="ctrl.comment.body" type="submit" class="btn btn-default pull-right ng-hide" ng-click="ctrl.save()">{{"comment.post" | translate}}</button>
  12 + </div>
  13 + </div>
4 </div> 14 </div>
5 - <button type="submit" class="btn btn-default" ng-click="ctrl.save()">{{"comment.post" | translate}}</button>  
6 </form> 15 </form>
src/app/article/comment/post-comment/post-comment.scss 0 → 100644
  Diff comments   View file @4b876c3
@@ -0,0 +1,22 @@ @@ -0,0 +1,22 @@
  1 +.comments {
  2 + .post-comment {
  3 + .media {
  4 + border-top: 2px solid #F3F3F3;
  5 + .media-left {
  6 + padding: 10px 0;
  7 + }
  8 + .media-body {
  9 + background-color: transparent;
  10 + }
  11 + button {
  12 + margin-top: 10px;
  13 + &.ng-hide-add {
  14 + animation: 0.5s lightSpeedOut ease;
  15 + }
  16 + &.ng-hide-remove {
  17 + animation: 0.5s lightSpeedIn ease;
  18 + }
  19 + }
  20 + }
  21 + }
  22 +}
src/languages/en.json
  Diff comments   View file @4b876c3
@@ -31,5 +31,6 @@ @@ -31,5 +31,6 @@
31 "notification.http_error.401.message": "Unauthorized", 31 "notification.http_error.401.message": "Unauthorized",
32 "notification.http_error.500.message": "Server error", 32 "notification.http_error.500.message": "Server error",
33 "comment.post": "Post a comment", 33 "comment.post": "Post a comment",
  34 + "comment.post.placeholder": "Join the discussion...",
34 "comment.reply": "reply" 35 "comment.reply": "reply"
35 } 36 }
src/languages/pt.json
  Diff comments   View file @4b876c3
@@ -31,5 +31,6 @@ @@ -31,5 +31,6 @@
31 "notification.http_error.401.message": "Não autorizado", 31 "notification.http_error.401.message": "Não autorizado",
32 "notification.http_error.500.message": "Erro no servidor", 32 "notification.http_error.500.message": "Erro no servidor",
33 "comment.post": "Commentar", 33 "comment.post": "Commentar",
  34 + "comment.post.placeholder": "Participe da discussão...",
34 "comment.reply": "responder" 35 "comment.reply": "responder"
35 } 36 }