Commit 6e818728 authored by mdsecurity's avatar mdsecurity
Browse files

search by name or location

parent 07b74347
......@@ -110,9 +110,10 @@
.search-bar-text {
font-family: NunitoSans-Regular;
font-size: 18px;
color: rgba(53, 64, 82, 0.15);
font-size: 16px;
// color: rgba(53, 64, 82, 0.15);
letter-spacing: -0.45px;
}
.area-title {
......
import { Component } from '@angular/core';
import { DataProviderService } from './data-provider.service';
import { Place } from './place';
import { SearchService } from './search.service';
import {
trigger,
state,
......@@ -13,7 +14,7 @@ import {
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss'],
providers: [DataProviderService],
providers: [DataProviderService, SearchService],
animations: [
trigger('nav-bar-state', [
state('expanded', style({
......
......@@ -20,6 +20,7 @@ import { SearchBarComponent } from './search-bar/search-bar.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { SrctLogoComponent } from './nav-bar/srct-logo/srct-logo.component';
import { RemoveBracketsPipe } from './remove-brackets.pipe';
import { SearchPipe } from './search.pipe';
@NgModule({
declarations: [
......@@ -37,7 +38,8 @@ import { RemoveBracketsPipe } from './remove-brackets.pipe';
FeedbackDialogComponent,
SearchBarComponent,
SrctLogoComponent,
RemoveBracketsPipe
RemoveBracketsPipe,
SearchPipe
],
imports: [
BrowserModule,
......
......@@ -12,7 +12,7 @@
</div>
<ng-template #showCards>
<div *ngFor="let place of places; let i = index;">
<div *ngFor="let place of places | search:searchTerm; let i = index;">
<app-place-card [place]="place"></app-place-card>
</div>
</ng-template>
......
import { Component, OnInit } from '@angular/core';
import { DataProviderService } from '../../data-provider.service';
import { Place } from '../../place';
import {SearchService} from '../../search.service';
@Component({
selector: 'app-area',
templateUrl: './area.component.html',
......@@ -10,7 +11,8 @@ export class AreaComponent implements OnInit {
private places: Place[] = [];
private placee: Place = new Place();
private show = false;
constructor(private dataProvider: DataProviderService) { }
private searchTerm:string = "";
constructor(private dataProvider: DataProviderService, private search:SearchService) { }
ngOnInit() {
this.dataProvider.getFacilities().subscribe(
......@@ -21,6 +23,14 @@ export class AreaComponent implements OnInit {
},
(error) => { console.log(error); }
)
this.search.$seachArg.subscribe(
(term) =>{
this.searchTerm = term;
},
(error)=>{
console.log(error);
}
)
}
......
......@@ -8,6 +8,7 @@ import { Place } from '../place';
export class PlaceWindowComponent implements OnInit {
constructor() { }
ngOnInit() {
// this.search.newTerm('he');
}
}
<div class="search-bar shadows">
<input class="search-input search-bar-text" placeholder="names,locations,anything">
<form class="search-bar-text search-select ">
<md-select class="search-bar-text " [(ngModel)]="selectedValue" name="food">
<md-option class="search-bar-text" *ngFor="let choice of choices" [value]="choice.value">
<input class="search-input search-bar-text"(keyup)="onKey($event)" placeholder="names, locations, anything">
<!--<form class="search-bar-text search-select ">
<md-select class="search-select" [(ngModel)]="selectedValue" name="food">
<md-option class="search-select" *ngFor="let choice of choices" [value]="choice.value">
{{choice.viewValue}}
</md-option>
</md-select>
</form>
</form>-->
</div>
import { Component, OnInit } from '@angular/core';
import {SearchService} from '../search.service';
@Component({
selector: 'app-search-bar',
templateUrl: './search-bar.component.html',
styleUrls: ['./search-bar.component.scss']
styleUrls: ['./search-bar.component.scss'],
})
export class SearchBarComponent implements OnInit {
choices = [
......@@ -11,9 +11,12 @@ export class SearchBarComponent implements OnInit {
{ value: "arlington", viewValue: "Arlingron Campus" },
{ value: "princeWilliam", viewValue: "Prince William Campus" }
];
constructor() { }
constructor(private search:SearchService) { }
ngOnInit() {
}
onKey(event){
this.search.newTerm(event.target.value);
}
}
import { Pipe, PipeTransform } from '@angular/core';
import { Place } from './place';
@Pipe({
name: 'search'
})
export class SearchPipe implements PipeTransform {
transform(value: Place[], arg: string): any {
let newOrder = [];
for (let i = 0; i < value.length; i++) {
if (value[i].isOpen()) {
newOrder.unshift(value[i]);
} else {
newOrder.push(value[i]);
}
}
if (arg !== "") {
return value.filter((place) => {
if (place.name.match(new RegExp(arg,'i')) !== null){
return true;
}
if(place.location.match(new RegExp(arg,'i')) !== null){
return true;
}
return false;
});
} else {
return newOrder;
}
}
}
import { TestBed, inject } from '@angular/core/testing';
import { SearchService } from './search.service';
describe('SearchProviderService', () => {
beforeEach(() => {
TestBed.configureTestingModule({
providers: [SearchService]
});
});
it('should ...', inject([SearchService], (service: SearchService) => {
expect(service).toBeTruthy();
}));
});
import { Injectable, EventEmitter } from '@angular/core';
import { Subject } from 'rxjs/Subject';
@Injectable()
export class SearchService {
private searchArg = new Subject<string>();
$seachArg = this.searchArg.asObservable();
constructor() { }
newTerm(term){
this.searchArg.next(term);
}
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment