fixed text issue with place card

when the title was too long it would offset everything else

src/_text-styles.scss

@@ -135,3 +135,11 @@
 	color: $primary;
 	margin-left: 50.5px;
 }
+.place-title {
+	font-family: Nunito-Medium;
+	font-size: 21px;
+	color: #354052;
+	line-height: 22px;
+	// margin: 15px auto 5px auto;
+	text-align: center;
+}
\ No newline at end of file

src/app/app.module.ts

@@ -19,6 +19,7 @@ import { FeedbackDialogComponent } from './place-window/area/place-card/feedback
 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';
 
 @NgModule({
 	declarations: [
@@ -35,7 +36,8 @@ import { SrctLogoComponent } from './nav-bar/srct-logo/srct-logo.component';
 		ShowHideArrowComponent,
 		FeedbackDialogComponent,
 		SearchBarComponent,
-		SrctLogoComponent
+		SrctLogoComponent,
+		RemoveBracketsPipe
 	],
 	imports: [
 		BrowserModule,

src/app/data-provider.service.ts

@@ -105,7 +105,7 @@ export class DataProviderService {
 				const schedule = new SpecialSchedule(jsonSchedule.valid_start, jsonSchedule.valid_end, open_times);
 				special_schedules.push(Object.freeze(schedule));
 			}
-			console.log(special_schedules);
+			// console.log(special_schedules);
 			places.push(new Place(
 				main_schedule_times,
 				special_schedules,

src/app/place-window/area/place-card/place-card.component.html

@@ -11,13 +11,16 @@
         <div class="place-location">{{place.location}}</div>
     </div>-->
 <div (click)="openInContext()" class="place-card">
+    <div class="closed-shader"></div>
     <img [src]="url" class="place-picture">
-    <div class="place-title">IndAroma</div>
+    <div class="title-container">
+    <div class="place-title">{{place.name | removeBrackets}}</div>
+        </div>    
     <div class="place-open-badge">
         <div class="place-status">OPEN</div>
         <div class="place-divider"></div>
-        <div class="place-time-remaining">~13Hrs</div>
+        <div class="place-time-remaining">~{{place.openFor().hour}}Hrs</div>
     </div>
-    <div class="place-location">The Johnson Center</div>
+    <div class="place-location">{{place.location }}</div>
     <div class="place-error-feedback">See an error?</div>
 </div>

src/app/place-window/area/place-card/place-card.component.scss

 @import '../../../../global-styles';
 .place-card {
+	position: relative;
 	width: 210px;
 	height: 240px;
 	background-color: white;
@@ -19,18 +20,20 @@
 	// background-color: grey;
 	// image-rendering: crisp-edges;
 }
-
-.place-title {
-	font-family: Nunito-Medium;
-	font-size: 25px;
-	color: #354052;
-	margin: 18px auto 0px auto;
+.title-container{
+	margin:8px 0px 8px 0px;
+	height:32px;
+	width: 100%;
+	display: flex;
+	justify-content: center;
+	align-items: center;
 }
 
 .place-open-badge {
+	min-height: 20px;
 	width: 88px;
 	height: 20px;
-	margin: 3px auto 0px auto;
+	margin: 0px auto 0px auto;
 	background-color: #3ac550;
 	border-radius: 100px;
 	display: flex;
@@ -72,10 +75,20 @@
 
 .place-error-feedback {
 	/* error: */
+	position:absolute;
+	bottom:0px;
+	right:5px;
+	z-index: 1000;
 	font-family: NunitoSans-Regular;
 	font-size: 9px;
 	color: #7F8FA4;
 	letter-spacing: -0.22px;
 	line-height: 13px;
-	margin: 18px 4px 0px auto;
 }
+.closed-shader{
+	position: absolute;
+	width:100%;
+	height: 100%;
+	opacity: .3;
+	background-color: black;
+}
\ No newline at end of file

src/app/place-window/area/place-card/place-card.component.ts

@@ -15,7 +15,7 @@ export class PlaceCardComponent implements OnInit {
 	@Input() private place: Place;
 	private status: string;
 	private week: string[] = ["MON", "TUE", "WED", "THU", "FRI", "SAT", "SUN"];
-	private url;
+	private url; 
 	constructor(private dataProvider: DataProviderService, public dialog: MdDialog,private sanitizer: DomSanitizer) { }
 	ngOnInit() {
 		this.url = this.sanitizer.bypassSecurityTrustUrl('https://unsplash.it/200/300?image='+Math.floor((Math.random()*999+1)));

src/app/place.ts

@@ -34,7 +34,7 @@ export class Place {
 			schedule = this.special_schedules[useSpecialSchedule].openTimes;
 		}
 		for (let i = 0; i < schedule.length; i++) {
-			const day = this.main_schedule_times[i];
+			const day = schedule[i];
 			// change the order of if statements at some point
 			if (day.start_day !== day.end_day) {
 				if (day.end_day === dayOfWeek) {
@@ -60,12 +60,21 @@ export class Place {
 		const today = currTime.getDay() - 1;
 		const inSeconds = currTime.getHours() * 60 * 60 + currTime.getMinutes() * 60 + currTime.getSeconds();
 		const dayOfWeek = currTime.getDay() - 1;
+		const useSpecialSchedule = this.useSpecial();
+
 		let timeTilClose = new Time();
 		let sumSeconds = 0;
+
+		let schedule;
+		if(useSpecialSchedule === -1){
+			schedule = this.main_schedule_times;
+		}else{
+			schedule = this.special_schedules[useSpecialSchedule].openTimes;
+		}
 		// clean up if statements later
 		if (this.isOpen()) {
-			for (let i = 0; i < this.main_schedule_times.length; i++) {
-				const day = this.main_schedule_times[i];
+			for (let i = 0; i < schedule.length; i++) {
+				const day = schedule[i];
 				if (day.end_day !== day.start_day) {
 					if (dayOfWeek === day.end_day) {
 						sumSeconds = day.end_time.inSeconds() - inSeconds - 86400;
@@ -82,6 +91,7 @@ export class Place {
 			return timeTilClose;
 		}
 	}
+
 	useSpecial(): number {
 		const todaysDate = new Date();
 		for (let i = 0; i < this.special_schedules.length; i++) {

src/app/remove-brackets.pipe.spec.ts

+import { RemoveBracketsPipe } from './remove-brackets.pipe';
+
+describe('RemoveBracketsPipe', () => {
+  it('create an instance', () => {
+    const pipe = new RemoveBracketsPipe();
+    expect(pipe).toBeTruthy();
+  });
+});

src/app/remove-brackets.pipe.ts

+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+  name: 'removeBrackets'
+})
+export class RemoveBracketsPipe implements PipeTransform {
+
+  transform(value: string): string {
+    console.log(value.substr(0, value.indexOf('[')));
+    const index = value.indexOf('[');
+    if (index === -1) {
+      return value;
+    }
+    return value.substr(0, value.indexOf('['));
+  }
+
+}