Component to search for articles in the environment

Victor Costa
1 parent aa54e8a5
Showing 16 changed files with 256 additions and 32 deletions Show diff stats
src/app/environment/environment.component.ts
src/app/layout/navbar/navbar.html
src/app/layout/navbar/navbar.scss
src/app/layout/scss/skins/_whbl.scss
src/app/main/main.component.ts
src/app/search/search-form/search-form.component.spec.ts
src/app/search/search-form/search-form.component.ts
src/app/search/search-form/search-form.html
src/app/search/search.component.spec.ts
src/app/search/search.component.ts
src/app/search/search.html
src/app/search/search.scss
src/languages/en.json
src/languages/pt.json
src/lib/ng-noosfero-api/http/article.service.spec.ts
src/lib/ng-noosfero-api/http/article.service.ts
@@ -2,6 +2,7 @@ import {StateConfig, Component, Inject, provide} from &#39;ng-forward&#39;;
 import {EnvironmentService} from "../../lib/ng-noosfero-api/http/environment.service";
 import {NotificationService} from "../shared/services/notification.service";
 import {EnvironmentHomeComponent} from "./environment-home.component";
+import {SearchComponent} from "../search/search.component";
 /**
  * @ngdoc controller
@@ -29,6 +30,18 @@ import {EnvironmentHomeComponent} from &quot;./environment-home.component&quot;;
                 controllerAs: "vm"
             }
         }
+    },
+    {
+        url: '^/search?query',
+        component: SearchComponent,
+        name: 'main.environment.search',
+        views: {
+            "mainBlockContent": {
+                templateUrl: "app/search/search.html",
+                controller: SearchComponent,
+                controllerAs: "ctrl"
+            }
+        }
     }
 ])
 @Inject(EnvironmentService, "$state", "currentEnvironment")
@@ -43,6 +43,9 @@
         <language-selector class="nav navbar-nav navbar-right"></language-selector>
       </ul>
       <div ui-view="actions"></div>
+      <div class="nav navbar-nav search navbar-right">
+        <search-form></search-form>
+      </div>
     </div>
   </div>
 </nav>
@@ -34,6 +34,16 @@
       text-align: center;
   	}
+    .search {
+      .search-input {
+        height: 45px;
+        margin-top: 10px;
+      }
+      .input-group-btn {
+        padding-top: 10px;
+      }
+    }
+
     @media (max-width: $break-sm-max) {
     	.navbar-toggle .fa-bars{
     		font-size: 14pt;
@@ -180,27 +180,19 @@ $whbl-font-color: #16191c;
 	}
 	.pagination {
 		> li {
-			> a,
-			> span,
-			> a:hover,
-			> span:hover,
-			> a:focus,
-			> span:focus,
-			> a:active,
-			> span:active {
-				color: $whbl-primary-color;
+			&.active {
+				a {
+					background-color: $whbl-primary-color;
+					color: #FFF;
+				}
 			}
-		}
-		> .active {
-			> a,
-			> span,
-			> a:hover,
-			> span:hover,
-			> a:focus,
-			> span:focus {
-				background-color: $whbl-primary-color;
-				border-color: $whbl-primary-color;
-				color: #fff;
+			> a {
+				&:hover {
+					background-color: $whbl-primary-color;
+					color: #FFF;
+				}
+				background-color: #FFF;
+				color: $whbl-primary-color;
 			}
 		}
 	}
@@ -40,6 +40,8 @@ import {SidebarComponent} from &quot;../layout/sidebar/sidebar.component&quot;;
 import {MainBlockComponent} from "../layout/blocks/main/main-block.component";
 import {HtmlEditorComponent} from "../shared/components/html-editor/html-editor.component";
 import {PermissionDirective} from "../shared/components/permission/permission.directive";
+import {SearchComponent} from "../search/search.component";
+import {SearchFormComponent} from "../search/search-form/search-form.component";
 /**
  * @ngdoc controller
@@ -100,7 +102,7 @@ export class EnvironmentContent {
         LinkListBlockComponent, CommunitiesBlockComponent, HtmlEditorComponent, ProfileComponent,
         MainBlockComponent, RecentDocumentsBlockComponent, Navbar, SidebarComponent, ProfileImageBlockComponent,
         MembersBlockComponent, NoosferoTemplate, DateFormat, RawHTMLBlockComponent, StatisticsBlockComponent,
-        LoginBlockComponent, CustomContentComponent, PermissionDirective
+        LoginBlockComponent, CustomContentComponent, PermissionDirective, SearchFormComponent, SearchComponent
     ].concat(plugins.mainComponents).concat(plugins.hotspots),
     providers: [AuthService, SessionService, NotificationService, BodyStateClassesService,
         "ngAnimate", "ngCookies", "ngStorage", "ngTouch",
@@ -0,0 +1,34 @@
+import {ComponentTestHelper, createClass} from "../../../spec/component-test-helper";
+import {SearchFormComponent} from "./search-form.component";
+import * as helpers from "../../../spec/helpers";
+
+const htmlTemplate: string = '<search-form></search-form>';
+
+describe("Components", () => {
+    describe("Search Form Component", () => {
+
+        let helper: ComponentTestHelper<SearchFormComponent>;
+        let stateMock = jasmine.createSpyObj("$state", ["go"]);
+
+        beforeEach(angular.mock.module("templates"));
+
+        beforeEach((done) => {
+            let cls = createClass({
+                template: htmlTemplate,
+                directives: [SearchFormComponent],
+                providers: [helpers.createProviderToValue("$state", stateMock)]
+            });
+            helper = new ComponentTestHelper<SearchFormComponent>(cls, done);
+        });
+
+        it("render a input for search query", () => {
+            expect(helper.find(".search-input").length).toEqual(1);
+        });
+
+        it("go to search page when click on search button", () => {
+            helper.component.query = 'query';
+            helper.component.search();
+            expect(stateMock.go).toHaveBeenCalledWith('main.environment.search', { query: 'query' });
+        });
+    });
+});
@@ -0,0 +1,17 @@
+import {Component, Inject} from "ng-forward";
+
+@Component({
+    selector: 'search-form',
+    templateUrl: 'app/search/search-form/search-form.html'
+})
+@Inject("$state")
+export class SearchFormComponent {
+
+    query: string;
+
+    constructor(private $state: ng.ui.IStateService) { }
+
+    search() {
+        this.$state.go('main.environment.search', { query: this.query });
+    }
+}
@@ -0,0 +1,8 @@
+<form class="navbar-form search-form" role="search">
+  <div class="input-group">
+    <input type="text" class="search-input form-control" placeholder="Search" name="q" ng-model="ctrl.query">
+    <div class="input-group-btn">
+      <button class="btn btn-default" type="submit" (click)="ctrl.search()"><i class="fa fa-search fa-fw"></i></button>
+    </div>
+  </div>
+</form>
@@ -0,0 +1,38 @@
+import {ComponentTestHelper, createClass} from "../../spec/component-test-helper";
+import {SearchComponent} from "./search.component";
+import * as helpers from "../../spec/helpers";
+
+const htmlTemplate: string = '<search></search>';
+
+describe("Components", () => {
+    describe("Search Component", () => {
+
+        let helper: ComponentTestHelper<SearchComponent>;
+        let stateParams = { query: 'query' };
+        let articleService = jasmine.createSpyObj("ArticleService", ["search"]);
+        let result = Promise.resolve({ data: [{ id: 1 }], headers: (param: string) => { return 1; } });
+        articleService.search = jasmine.createSpy("search").and.returnValue(result);
+
+        beforeEach(angular.mock.module("templates"));
+
+        beforeEach((done) => {
+            let cls = createClass({
+                template: htmlTemplate,
+                directives: [SearchComponent],
+                providers: [
+                    helpers.createProviderToValue("$stateParams", stateParams),
+                    helpers.createProviderToValue("ArticleService", articleService)
+                ].concat(helpers.provideFilters("truncateFilter", "stripTagsFilter"))
+            });
+            helper = new ComponentTestHelper<SearchComponent>(cls, done);
+        });
+
+        it("load first page with search results", () => {
+            expect(articleService.search).toHaveBeenCalledWith({ query: 'query', per_page: 10, page: 0 });
+        });
+
+        it("display search results", () => {
+            expect(helper.all(".result").length).toEqual(1);
+        });
+    });
+});
@@ -0,0 +1,33 @@
+import {Component, Inject} from "ng-forward";
+import {ArticleService} from "./../../lib/ng-noosfero-api/http/article.service";
+
+@Component({
+    selector: 'search',
+    templateUrl: 'app/search/search.html'
+})
+@Inject(ArticleService, "$stateParams")
+export class SearchComponent {
+
+    articles: noosfero.Article[];
+    query: string;
+    totalResults = 0;
+    perPage = 10;
+    currentPage: number = 0;
+
+    constructor(private articleService: ArticleService, private $stateParams: ng.ui.IStateParamsService) {
+        this.query = this.$stateParams['query'];
+        this.loadPage();
+    }
+
+    loadPage() {
+        let filters = {
+            query: this.query,
+            per_page: this.perPage,
+            page: this.currentPage
+        };
+        this.articleService.search(filters).then((result: noosfero.RestResult<noosfero.Article[]>) => {
+            this.totalResults = <number>result.headers("total");
+            this.articles = result.data;
+        });
+    }
+}
@@ -0,0 +1,26 @@
+<h2>Search</h2>
+
+<div class="search-results">
+  <div class="summary">
+    {{"search.results.summary" | translate:{results: ctrl.totalResults}:"messageformat"}}
+  </div>
+  <div ng-repeat="article in ctrl.articles | orderBy: 'created_at':true" class="result">
+    <a class="title" ui-sref="main.profile.page({profile: article.profile.identifier, page: article.path})">
+      <h4 ng-bind="article.title"></h4>
+    </a>
+    <div class="info">
+      <a class="profile" ui-sref="main.profile.home({profile: article.profile.identifier})">
+        {{article.profile.name}}
+      </a>
+      <span class="bullet-separator">•</span>
+      <span class="time">
+        <span am-time-ago="article.created_at | dateFormat"></span>
+      </span>
+    </div>
+    <div class="post-lead" ng-bind-html="article.body | stripTags | truncate: 250: '...': true"></div>
+  </div>
+  <uib-pagination ng-model="ctrl.currentPage" total-items="ctrl.totalResults" 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="›">
+  </uib-pagination>
+</div>
@@ -0,0 +1,30 @@
+.search-results {
+  .summary {
+    color: #bbbbbb;
+    font-size: 13px;
+    border-top: 1px solid #ececec;
+  }
+  .result {
+    margin: 25px 0;
+    
+    .title {
+      h4 {
+        margin: 0;
+      }
+    }
+    .info {
+      .profile {
+        color: #6e9e7b;
+      }
+      .time {
+        color: #6e9e7b;
+        font-size: 12px;
+      }
+      .bullet-separator {
+        margin: 0 2px;
+        font-size: 10px;
+        color: #afd6ba;
+      }
+    }    
+  }
+}
@@ -74,5 +74,6 @@
   "profile.content.success.message": "Profile saved!",
   "custom_content.title": "Edit content",
   "profile.custom_header.label": "Header",
-  "profile.custom_footer.label": "Footer"
+  "profile.custom_footer.label": "Footer",
+  "search.results.summary": "{results, plural, one{result} other{# results}}"
 }
@@ -74,5 +74,6 @@
   "profile.content.success.message": "Perfil salvo!",
   "custom_content.title": "Editar conteúdo",
   "profile.custom_header.label": "Cabeçalho",
-  "profile.custom_footer.label": "Rodapé"
+  "profile.custom_footer.label": "Rodapé",
+  "search.results.summary": "{results, plural, one{result} other{# resultados}}"
 }
@@ -23,7 +23,7 @@ describe(&quot;Services&quot;, () =&gt; {
             it("should remove article", (done) => {
                 let articleId = 1;
                 $httpBackend.expectDELETE(`/api/v1/articles/${articleId}`).respond(200, { success: "true" });
-                articleService.remove(<noosfero.Article>{id: articleId});
+                articleService.remove(<noosfero.Article>{ id: articleId });
                 $httpBackend.flush();
                 $httpBackend.verifyNoOutstandingExpectation();
                 done();
@@ -32,7 +32,7 @@ describe(&quot;Services&quot;, () =&gt; {
             it("should return article children", (done) => {
                 let articleId = 1;
                 $httpBackend.expectGET(`/api/v1/articles/${articleId}/children`).respond(200, { articles: [{ name: "article1" }] });
-                articleService.getChildren(<noosfero.Article>{id: articleId}).then((result: noosfero.RestResult<noosfero.Article[]>) => {
+                articleService.getChildren(<noosfero.Article>{ id: articleId }).then((result: noosfero.RestResult<noosfero.Article[]>) => {
                     expect(result.data).toEqual([{ name: "article1" }]);
                     done();
                 });
@@ -42,7 +42,7 @@ describe(&quot;Services&quot;, () =&gt; {
             it("should get articles by profile", (done) => {
                 let profileId = 1;
                 $httpBackend.expectGET(`/api/v1/profiles/${profileId}/articles`).respond(200, { articles: [{ name: "article1" }] });
-                articleService.getByProfile(<noosfero.Profile>{id: profileId}).then((result: noosfero.RestResult<noosfero.Article[]>) => {
+                articleService.getByProfile(<noosfero.Profile>{ id: profileId }).then((result: noosfero.RestResult<noosfero.Article[]>) => {
                     expect(result.data).toEqual([{ name: "article1" }]);
                     done();
                 });
@@ -52,7 +52,7 @@ describe(&quot;Services&quot;, () =&gt; {
             it("should get articles by profile with additional filters", (done) => {
                 let profileId = 1;
                 $httpBackend.expectGET(`/api/v1/profiles/${profileId}/articles?path=test`).respond(200, { articles: [{ name: "article1" }] });
-                articleService.getByProfile(<noosfero.Profile>{id: profileId}, { path: 'test' }).then((result: noosfero.RestResult<noosfero.Article[]>) => {
+                articleService.getByProfile(<noosfero.Profile>{ id: profileId }, { path: 'test' }).then((result: noosfero.RestResult<noosfero.Article[]>) => {
                     expect(result.data).toEqual([{ name: "article1" }]);
                     done();
                 });
@@ -62,7 +62,7 @@ describe(&quot;Services&quot;, () =&gt; {
             it("should get article children with additional filters", (done) => {
                 let articleId = 1;
                 $httpBackend.expectGET(`/api/v1/articles/${articleId}/children?path=test`).respond(200, { articles: [{ name: "article1" }] });
-                articleService.getChildren(<noosfero.Article>{id: articleId}, { path: 'test' }).then((result: noosfero.RestResult<noosfero.Article[]>) => {
+                articleService.getChildren(<noosfero.Article>{ id: articleId }, { path: 'test' }).then((result: noosfero.RestResult<noosfero.Article[]>) => {
                     expect(result.data).toEqual([{ name: "article1" }]);
                     done();
                 });
@@ -71,14 +71,25 @@ describe(&quot;Services&quot;, () =&gt; {
             it("should create an article in a profile", (done) => {
                 let profileId = 1;
-                let article: noosfero.Article = <any>{ id: null};
-                $httpBackend.expectPOST(`/api/v1/profiles/${profileId}/articles`, { article: article }).respond(200, {article: {  id: 2  }});
-                articleService.createInProfile(<noosfero.Profile>{id:  profileId}, article).then((result: noosfero.RestResult<noosfero.Article>) => {
+                let article: noosfero.Article = <any>{ id: null };
+                $httpBackend.expectPOST(`/api/v1/profiles/${profileId}/articles`, { article: article }).respond(200, { article: { id: 2 } });
+                articleService.createInProfile(<noosfero.Profile>{ id: profileId }, article).then((result: noosfero.RestResult<noosfero.Article>) => {
                     expect(result.data).toEqual({ id: 2 });
                     done();
                 });
                 $httpBackend.flush();
             });
+
+            it("should search for articles in environment", (done) => {
+                let profileId = 1;
+                let article: noosfero.Article = <any>{ id: null };
+                $httpBackend.expectGET(`/api/v1/search/article?query=query`).respond(200, { articles: [{ id: 2 }] });
+                articleService.search({ query: 'query' }).then((result: noosfero.RestResult<noosfero.Article[]>) => {
+                    expect(result.data).toEqual([{ id: 2 }]);
+                    done();
+                });
+                $httpBackend.flush();
+            });
         });
@@ -118,6 +118,11 @@ export class ArticleService extends RestangularService&lt;noosfero.Article&gt; {
         return this.listSubElements(<noosfero.Article>articleElement, "children", params);
     }
+    search(params: any): ng.IPromise<noosfero.RestResult<noosfero.Article[]>> {
+        let deferred = this.$q.defer<noosfero.RestResult<noosfero.Article[]>>();
+        let restRequest = this.restangularService.all("search").customGET('article', params);
+        restRequest.then(this.getHandleSuccessFunction(deferred)).catch(this.getHandleErrorFunction(deferred));
+        return deferred.promise;
+    }
 }
-
	@@ -2,6 +2,7 @@ import {StateConfig, Component, Inject, provide} from 'ng-forward';		@@ -2,6 +2,7 @@ import {StateConfig, Component, Inject, provide} from 'ng-forward';
2	import {EnvironmentService} from "../../lib/ng-noosfero-api/http/environment.service";	2	import {EnvironmentService} from "../../lib/ng-noosfero-api/http/environment.service";
3	import {NotificationService} from "../shared/services/notification.service";	3	import {NotificationService} from "../shared/services/notification.service";
4	import {EnvironmentHomeComponent} from "./environment-home.component";	4	import {EnvironmentHomeComponent} from "./environment-home.component";
		5	+import {SearchComponent} from "../search/search.component";
5		6
6	/**	7	/**
7	* @ngdoc controller	8	* @ngdoc controller
	@@ -29,6 +30,18 @@ import {EnvironmentHomeComponent} from "./environment-home.component";		@@ -29,6 +30,18 @@ import {EnvironmentHomeComponent} from "./environment-home.component";
29	controllerAs: "vm"	30	controllerAs: "vm"
30	}	31	}
31	}	32	}
		33	+ },
		34	+ {
		35	+ url: '^/search?query',
		36	+ component: SearchComponent,
		37	+ name: 'main.environment.search',
		38	+ views: {
		39	+ "mainBlockContent": {
		40	+ templateUrl: "app/search/search.html",
		41	+ controller: SearchComponent,
		42	+ controllerAs: "ctrl"
		43	+ }
		44	+ }
32	}	45	}
33	])	46	])
34	@Inject(EnvironmentService, "$state", "currentEnvironment")	47	@Inject(EnvironmentService, "$state", "currentEnvironment")
	@@ -34,6 +34,16 @@		@@ -34,6 +34,16 @@
34	text-align: center;	34	text-align: center;
35	}	35	}
36		36
		37	+ .search {
		38	+ .search-input {
		39	+ height: 45px;
		40	+ margin-top: 10px;
		41	+ }
		42	+ .input-group-btn {
		43	+ padding-top: 10px;
		44	+ }
		45	+ }
		46	+
37	@media (max-width: $break-sm-max) {	47	@media (max-width: $break-sm-max) {
38	.navbar-toggle .fa-bars{	48	.navbar-toggle .fa-bars{
39	font-size: 14pt;	49	font-size: 14pt;
@@ -0,0 +1,34 @@		@@ -0,0 +1,34 @@
	1	+import {ComponentTestHelper, createClass} from "../../../spec/component-test-helper";
	2	+import {SearchFormComponent} from "./search-form.component";
	3	+import * as helpers from "../../../spec/helpers";
	4	+
	5	+const htmlTemplate: string = '<search-form></search-form>';
	6	+
	7	+describe("Components", () => {
	8	+ describe("Search Form Component", () => {
	9	+
	10	+ let helper: ComponentTestHelper<SearchFormComponent>;
	11	+ let stateMock = jasmine.createSpyObj("$state", ["go"]);
	12	+
	13	+ beforeEach(angular.mock.module("templates"));
	14	+
	15	+ beforeEach((done) => {
	16	+ let cls = createClass({
	17	+ template: htmlTemplate,
	18	+ directives: [SearchFormComponent],
	19	+ providers: [helpers.createProviderToValue("$state", stateMock)]
	20	+ });
	21	+ helper = new ComponentTestHelper<SearchFormComponent>(cls, done);
	22	+ });
	23	+
	24	+ it("render a input for search query", () => {
	25	+ expect(helper.find(".search-input").length).toEqual(1);
	26	+ });
	27	+
	28	+ it("go to search page when click on search button", () => {
	29	+ helper.component.query = 'query';
	30	+ helper.component.search();
	31	+ expect(stateMock.go).toHaveBeenCalledWith('main.environment.search', { query: 'query' });
	32	+ });
	33	+ });
	34	+});
@@ -0,0 +1,17 @@		@@ -0,0 +1,17 @@
	1	+import {Component, Inject} from "ng-forward";
	2	+
	3	+@Component({
	4	+ selector: 'search-form',
	5	+ templateUrl: 'app/search/search-form/search-form.html'
	6	+})
	7	+@Inject("$state")
	8	+export class SearchFormComponent {
	9	+
	10	+ query: string;
	11	+
	12	+ constructor(private $state: ng.ui.IStateService) { }
	13	+
	14	+ search() {
	15	+ this.$state.go('main.environment.search', { query: this.query });
	16	+ }
	17	+}
@@ -0,0 +1,8 @@		@@ -0,0 +1,8 @@
	1	+<form class="navbar-form search-form" role="search">
	2	+ <div class="input-group">
	3	+ <input type="text" class="search-input form-control" placeholder="Search" name="q" ng-model="ctrl.query">
	4	+ <div class="input-group-btn">
	5	+ <button class="btn btn-default" type="submit" (click)="ctrl.search()"><i class="fa fa-search fa-fw"></i></button>
	6	+ </div>
	7	+ </div>
	8	+</form>
@@ -0,0 +1,38 @@		@@ -0,0 +1,38 @@
	1	+import {ComponentTestHelper, createClass} from "../../spec/component-test-helper";
	2	+import {SearchComponent} from "./search.component";
	3	+import * as helpers from "../../spec/helpers";
	4	+
	5	+const htmlTemplate: string = '<search></search>';
	6	+
	7	+describe("Components", () => {
	8	+ describe("Search Component", () => {
	9	+
	10	+ let helper: ComponentTestHelper<SearchComponent>;
	11	+ let stateParams = { query: 'query' };
	12	+ let articleService = jasmine.createSpyObj("ArticleService", ["search"]);
	13	+ let result = Promise.resolve({ data: [{ id: 1 }], headers: (param: string) => { return 1; } });
	14	+ articleService.search = jasmine.createSpy("search").and.returnValue(result);
	15	+
	16	+ beforeEach(angular.mock.module("templates"));
	17	+
	18	+ beforeEach((done) => {
	19	+ let cls = createClass({
	20	+ template: htmlTemplate,
	21	+ directives: [SearchComponent],
	22	+ providers: [
	23	+ helpers.createProviderToValue("$stateParams", stateParams),
	24	+ helpers.createProviderToValue("ArticleService", articleService)
	25	+ ].concat(helpers.provideFilters("truncateFilter", "stripTagsFilter"))
	26	+ });
	27	+ helper = new ComponentTestHelper<SearchComponent>(cls, done);
	28	+ });
	29	+
	30	+ it("load first page with search results", () => {
	31	+ expect(articleService.search).toHaveBeenCalledWith({ query: 'query', per_page: 10, page: 0 });
	32	+ });
	33	+
	34	+ it("display search results", () => {
	35	+ expect(helper.all(".result").length).toEqual(1);
	36	+ });
	37	+ });
	38	+});
@@ -0,0 +1,33 @@		@@ -0,0 +1,33 @@
	1	+import {Component, Inject} from "ng-forward";
	2	+import {ArticleService} from "./../../lib/ng-noosfero-api/http/article.service";
	3	+
	4	+@Component({
	5	+ selector: 'search',
	6	+ templateUrl: 'app/search/search.html'
	7	+})
	8	+@Inject(ArticleService, "$stateParams")
	9	+export class SearchComponent {
	10	+
	11	+ articles: noosfero.Article[];
	12	+ query: string;
	13	+ totalResults = 0;
	14	+ perPage = 10;
	15	+ currentPage: number = 0;
	16	+
	17	+ constructor(private articleService: ArticleService, private $stateParams: ng.ui.IStateParamsService) {
	18	+ this.query = this.$stateParams['query'];
	19	+ this.loadPage();
	20	+ }
	21	+
	22	+ loadPage() {
	23	+ let filters = {
	24	+ query: this.query,
	25	+ per_page: this.perPage,
	26	+ page: this.currentPage
	27	+ };
	28	+ this.articleService.search(filters).then((result: noosfero.RestResult<noosfero.Article[]>) => {
	29	+ this.totalResults = <number>result.headers("total");
	30	+ this.articles = result.data;
	31	+ });
	32	+ }
	33	+}
@@ -0,0 +1,26 @@		@@ -0,0 +1,26 @@
	1	+<h2>Search</h2>
	2	+
	3	+<div class="search-results">
	4	+ <div class="summary">
	5	+ {{"search.results.summary" \| translate:{results: ctrl.totalResults}:"messageformat"}}
	6	+ </div>
	7	+ <div ng-repeat="article in ctrl.articles \| orderBy: 'created_at':true" class="result">
	8	+ <a class="title" ui-sref="main.profile.page({profile: article.profile.identifier, page: article.path})">
	9	+ <h4 ng-bind="article.title"></h4>
	10	+ </a>
	11	+ <div class="info">
	12	+ <a class="profile" ui-sref="main.profile.home({profile: article.profile.identifier})">
	13	+ {{article.profile.name}}
	14	+ </a>
	15	+ <span class="bullet-separator">•</span>
	16	+ <span class="time">
	17	+ <span am-time-ago="article.created_at \| dateFormat"></span>
	18	+ </span>
	19	+ </div>
	20	+ <div class="post-lead" ng-bind-html="article.body \| stripTags \| truncate: 250: '...': true"></div>
	21	+ </div>
	22	+ <uib-pagination ng-model="ctrl.currentPage" total-items="ctrl.totalResults" class="pagination-sm center-block"
	23	+ boundary-links="true" items-per-page="ctrl.perPage" ng-change="ctrl.loadPage()"
	24	+ first-text="«" last-text="»" previous-text="‹" next-text="›">
	25	+ </uib-pagination>
	26	+</div>
@@ -0,0 +1,30 @@		@@ -0,0 +1,30 @@
	1	+.search-results {
	2	+ .summary {
	3	+ color: #bbbbbb;
	4	+ font-size: 13px;
	5	+ border-top: 1px solid #ececec;
	6	+ }
	7	+ .result {
	8	+ margin: 25px 0;
	9	+
	10	+ .title {
	11	+ h4 {
	12	+ margin: 0;
	13	+ }
	14	+ }
	15	+ .info {
	16	+ .profile {
	17	+ color: #6e9e7b;
	18	+ }
	19	+ .time {
	20	+ color: #6e9e7b;
	21	+ font-size: 12px;
	22	+ }
	23	+ .bullet-separator {
	24	+ margin: 0 2px;
	25	+ font-size: 10px;
	26	+ color: #afd6ba;
	27	+ }
	28	+ }
	29	+ }
	30	+}
	@@ -74,5 +74,6 @@		@@ -74,5 +74,6 @@
74	"profile.content.success.message": "Profile saved!",	74	"profile.content.success.message": "Profile saved!",
75	"custom_content.title": "Edit content",	75	"custom_content.title": "Edit content",
76	"profile.custom_header.label": "Header",	76	"profile.custom_header.label": "Header",
77	- "profile.custom_footer.label": "Footer"	77	+ "profile.custom_footer.label": "Footer",
		78	+ "search.results.summary": "{results, plural, one{result} other{# results}}"
78	}	79	}