\n ![\"Dancing](\"assets/SheRimp.GIF\")
\n \n \n \n \n \n
\n\n \n \n \n \n \n\n
\n ","import { Component, OnInit } from '@angular/core';\n\n@Component({\n selector: 'app-myspace',\n templateUrl: './myspace.component.html',\n styleUrls: ['./myspace.component.css']\n})\nexport class MyspaceComponent implements OnInit {\n profileName: string = \"Ol' Liz\";\n\n friends = [\n { name: 'Scena', image: '/assets/TopFriends_Scena.PNG' },\n { name: 'Ryan', image: '/assets/TopFriends_Ryan.PNG' },\n { name: 'Seth', image: '/assets/TopFriends_Seth.PNG' },\n { name: 'Dearest Media', image: '/assets/TopFriends_DM.PNG' },\n ]\n\n constructor() { }\n\n ngOnInit(): void {\n document.getElementById('copyLink').addEventListener('click', function(event) {\n // Prevent default link behavior\n event.preventDefault();\n \n // Get the text to copy\n var textToCopy = this.textContent || this.innerText;\n \n // Create a temporary textarea element\n var textarea = document.createElement('textarea');\n textarea.value = textToCopy;\n \n // Make sure the textarea is not displayed\n textarea.style.position = 'fixed';\n textarea.style.left = '-9999px';\n \n // Append the textarea to the document\n document.body.appendChild(textarea);\n \n // Select and copy the text\n textarea.select();\n document.execCommand('copy');\n \n // Remove the textarea from the document\n document.body.removeChild(textarea);\n \n // Optionally, provide some feedback to the user\n alert('Text copied to clipboard: ' + textToCopy);\n });\n }\n\n}\n","import { Component, OnInit, HostListener, NgZone, ChangeDetectorRef } from '@angular/core';\nimport { PageStateService } from '../page-state.service';\nimport { ScoreService } from '../score.service';\nimport { windowToggle } from 'rxjs/operators';\n\n@Component({\n selector: 'app-score',\n templateUrl: './score.component.html',\n styleUrls: ['./score.component.css']\n})\nexport class ScoreComponent implements OnInit {\n\n scoreStyle: any;\n\n constructor(public score: ScoreService, private state: PageStateService, private ngZone: NgZone, private cdr: ChangeDetectorRef) { }\n\n setScoreStyle() {\n var textShadow = window.innerWidth * 0.65/512;\n this.scoreStyle.left = window.innerWidth * 210/512 + \"px\";\n this.scoreStyle.top = window.innerWidth * 225/512 + \"px\";\n this.scoreStyle.fontSize = window.innerWidth * 9/512 + \"px\";\n\n if (window.innerWidth/window.innerHeight < 0.65) {\n let isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) || (navigator.userAgent.includes(\"Macintosh\") && navigator.maxTouchPoints > 1);\n\n if (isMobile) {\n this.scoreStyle.left = window.innerWidth * 185/306 + \"px\";\n this.scoreStyle.top = window.innerWidth * 370/306*(1 + 0.2*(306*window.innerHeight/window.innerWidth - 322)/340) - this.state.getCounterTopCutoff() + \"px\";\n this.scoreStyle.fontSize = window.innerWidth * 10/306 + \"px\";\n textShadow = window.innerWidth * 0.65/306;\n }\n } else if (window.innerWidth/window.innerHeight < 0.95) {\n this.scoreStyle.left = window.innerWidth * 65/512 + \"px\";\n this.scoreStyle.top = window.innerWidth * 357/306*(1 + 0.2*(306*window.innerHeight/window.innerWidth - 322)/340) - this.state.getCounterTopCutoff() + \"px\";\n this.scoreStyle.fontSize = window.innerWidth * 10/306 + \"px\";\n textShadow = window.innerWidth * 0.65/306;\n\n } else if (window.innerWidth/window.innerHeight < 1.12) {\n this.scoreStyle.left = window.innerWidth * 90/512 + \"px\";\n this.scoreStyle.top = window.innerHeight * 225/320 + \"px\";\n this.scoreStyle.fontSize = window.innerHeight * 9/320 + \"px\";\n textShadow = window.innerHeight * 0.65/320;\n } else if (window.innerWidth/window.innerHeight < 1.44) {\n this.scoreStyle.left = window.innerWidth * 175/512 - this.state.getLeftCutoff() + \"px\";\n this.scoreStyle.top = window.innerHeight * 225/320 + \"px\";\n this.scoreStyle.fontSize = window.innerHeight * 9/320 + \"px\";\n textShadow = window.innerHeight * 0.65/320;\n } else if (this.state.isNarrow()) {\n this.scoreStyle.left = window.innerHeight * 210/320 - this.state.getLeftCutoff() + \"px\";\n this.scoreStyle.top = window.innerHeight * 225/320 + \"px\";\n this.scoreStyle.fontSize = window.innerHeight * 9/320 + \"px\";\n textShadow = window.innerHeight * 0.65/320;\n }\n\n\n this.scoreStyle.textShadow = '-' + textShadow + 'px -' + textShadow + 'px 0 #000, ' + textShadow + 'px -' + textShadow + 'px 0 #000, -' + textShadow + 'px ' + textShadow + 'px 0 #000, ' + textShadow + 'px ' + textShadow + 'px 0 #000';\n }\n\n getScore() {\n this.cdr.detectChanges();\n this.ngZone.runOutsideAngular(() => requestAnimationFrame(() => this.getScore()));\n }\n\n @HostListener('window:resize', ['$event'])\n onResize(event) {\n this.setScoreStyle();\n }\n\n ngOnInit(): void {\n this.scoreStyle = {};\n\n this.setScoreStyle();\n this.getScore();\n }\n\n}\n","\n","\n\n
\n\t\n
\n \n \n ![\"Profile](\"/assets/Liz.PNG\")
\n
\n {{ profileName }}
\n\n Mood: hungry
\n\n
\n She/Rimp
\n30 years old
\nPhiladelphia
\nUnited States
\n\n
\n Contact {{ profileName }}
\nEmail: BossHog@ScampiPhilly.com
\nInstagram: @Scampi_Philly
\nFunsite: lizlaugh.love
\n \n\n
\n\n
\n \n {{ profileName }} is {{ profileName }}
\n\n
\n\n {{ profileName }}'s Blurbs:
\nAbout Me:
\nOwner and head chef of Couch Cafe.
Running on caffeine and the bit.
I got two shrimps inside me...
and they won't stop COOKIN'
Who I'd Like to Meet:
\nMatty Matheson
\n\n
\n \n
\n {{ profileName }}'s Top Friends:
\n\n
\n \n ![\"{{]()
\n
\n {{ friend.name }}
\n\n \n
\n","import { Component, ElementRef, HostListener, Input, OnInit, Renderer2, ViewChild } from '@angular/core';\nimport { GridService } from '../grid.service';\n\nenum ButtonType {\n Empty,\n Table,\n ChairAvailable,\n ChairReserved,\n Disabled\n}\n\n@Component({\n selector: 'app-table-design-grid',\n templateUrl: './table-design-grid.component.html',\n styleUrls: ['./table-design-grid.component.css']\n})\nexport class TableDesignGridComponent implements OnInit {\n @Input() grid: ButtonType[][] = [];\n numRows: number;\n numCols: number;\n chairCount = 0;\n selectedOption: ButtonType = ButtonType.Empty;\n gridContainerStyle: any;\n gridStyle: any;\n buttonStyle: any;\n optionStyle: any;\n optionButtonStyle: any;\n @Input() date: Date;\n\n constructor(private gridService: GridService) { \n this.numRows = this.gridService.numRows;\n this.numCols = this.gridService.numCols;\n this.gridContainerStyle = {};\n this.gridStyle = {};\n this.buttonStyle = {};\n this.optionStyle = {};\n this.optionButtonStyle = {};\n }\n\n ngOnInit(): void {\n this.initializeGrid();\n }\n\n initializeGrid() {\n this.getGridContainerStyles();\n this.getGridStyles();\n this.getButtonStyles();\n this.getOptionStyles();\n this.getOptionButtonStyles();\n if (this.grid.length === 0) {\n for (let i = 0; i < this.numRows; i++) {\n this.grid[i] = [];\n for (let j = 0; j < this.numCols; j++) {\n if (i > 1 || j < 2) {\n this.grid[i][j] = ButtonType.Empty;\n } else {\n this.grid[i][j] = ButtonType.Disabled;\n }\n }\n }\n } \n }\n\n onButtonClick(row: number, col: number) {\n if (this.selectedOption === ButtonType.ChairReserved || this.selectedOption === ButtonType.ChairAvailable) {\n this.chairCount++;\n }\n if (this.grid[row][col] === ButtonType.ChairReserved || this.grid[row][col] === ButtonType.ChairAvailable) {\n this.chairCount--;\n }\n if (this.grid[row][col] !== ButtonType.Disabled) {\n this.grid[row][col] = this.selectedOption;\n }\n \n }\n\n selectOption(selection: number) {\n switch (selection) {\n case 1:\n this.selectedOption = ButtonType.Empty;\n break;\n case 2:\n this.selectedOption = ButtonType.Table;\n break;\n case 3:\n this.selectedOption = ButtonType.ChairReserved;\n break;\n case 4:\n this.selectedOption = ButtonType.ChairAvailable;\n break;\n default:\n this.selectedOption = ButtonType.Empty;\n }\n }\n\n isOptionSelected(button: number) {\n switch (button) {\n case 1:\n return this.selectedOption === ButtonType.Empty;\n case 2:\n return this.selectedOption === ButtonType.Table;\n case 3:\n return this.selectedOption === ButtonType.ChairReserved;\n case 4:\n return this.selectedOption === ButtonType.ChairAvailable;\n default:\n return false;\n }\n }\n\n getButtonClass(button: ButtonType): string {\n switch (button) {\n case ButtonType.Empty:\n return 'empty';\n case ButtonType.Table:\n return 'table';\n case ButtonType.ChairAvailable:\n case ButtonType.ChairReserved:\n return 'chair';\n case ButtonType.Disabled:\n return 'disabled';\n default:\n return '';\n }\n }\n\n getButtonText(button: ButtonType): string {\n // switch (button) {\n // case ButtonType.Empty:\n // return 'E';\n // case ButtonType.Table:\n // return 'T';\n // case ButtonType.Chair:\n // return 'C';\n // default:\n // return '';\n // }\n return '';\n }\n\n getGridContainerStyles() {\n this.gridContainerStyle.width = window.innerWidth * 262/512 + \"px\";\n this.gridContainerStyle.height = window.innerWidth * 202/512 + \"px\";\n this.gridContainerStyle.left = window.innerWidth * 30/512 + \"px\";\n }\n\n getGridStyles() {\n this.gridStyle.width = window.innerWidth * 180/512 + \"px\";\n this.gridStyle.left = window.innerWidth * 81/512 + \"px\";\n this.gridStyle.top = window.innerWidth * 1/512 + \"px\";\n }\n\n getButtonStyles() {\n this.buttonStyle.width = window.innerWidth * 20/512 + \"px\";\n this.buttonStyle.height = window.innerWidth * 20/512 + \"px\";\n }\n\n getButtonImage(row: number, col: number) {\n let buttonStyleImage = this.buttonStyle;\n if (this.grid[row][col] === ButtonType.ChairAvailable) {\n if (row > 0 && this.grid[row - 1][col] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairAvailable_Up.PNG)`;\n } else if (row < this.numRows - 1 && this.grid[row + 1][col] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairAvailable_Down.PNG)`;\n } else if (col > 0 && this.grid[row][col - 1] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairAvailable_Left.PNG)`;\n } else if (col < this.numCols - 1 && this.grid[row][col + 1] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairAvailable_Right.PNG)`;\n } else { \n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairAvailable_Left.PNG)`;\n }\n } else if (this.grid[row][col] === ButtonType.ChairReserved) {\n if (row > 0 && this.grid[row - 1][col] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairReserved_Up.PNG)`;\n } else if (row < this.numRows - 1 && this.grid[row + 1][col] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairReserved_Down.PNG)`;\n } else if (col > 0 && this.grid[row][col - 1] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairReserved_Left.PNG)`;\n } else if (col < this.numCols - 1 && this.grid[row][col + 1] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairReserved_Right.PNG)`;\n } else { \n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairReserved_Left.PNG)`;\n }\n } else if (this.grid[row][col] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/Table.PNG)`;\n } else if (this.grid[row][col] === ButtonType.Empty) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/EmptySquare.PNG)`;\n } else if (this.grid[row][col] === ButtonType.Disabled) {\n buttonStyleImage.backgroundImage = \"none\";\n }\n \n return buttonStyleImage;\n }\n\n getOptionStyles() {\n this.optionStyle.left = window.innerWidth * 135/512 + \"px\";\n this.optionStyle.top = window.innerWidth * 5/512 + \"px\";\n this.optionStyle.width = window.innerWidth * 124/512 + \"px\";\n }\n \n getOptionButtonStyles () {\n this.optionButtonStyle.height = window.innerWidth * 20/512 + \"px\";\n this.optionButtonStyle.width = this.optionButtonStyle.height;\n this.optionButtonStyle.marginRight = window.innerWidth * 11/512 + \"px\";\n }\n\n public getGrid() {\n return this.grid;\n }\n\n public displayInputGrid(grid: any[][]) {\n this.grid = grid;\n }\n\n public resetGrid() {\n this.grid = [];\n this.initializeGrid();\n }\n\n public setDate(date: any) {\n this.date = date;\n }\n\n public getGridJsonObject(): any {\n const date = {\n date: this.date,\n soldOut: false,\n squares: []\n }\n let square;\n for (let i = 0; i < this.numRows; i++){\n for (let j = 0; j < this.numCols; j++) {\n switch (this.grid[i][j]) {\n case ButtonType.Table:\n square = {\n row: i,\n column: j,\n type: 'T',\n reserved: false\n };\n date.squares.push(square);\n break;\n case ButtonType.ChairAvailable:\n square = {\n row: i,\n column: j,\n type: 'O',\n reserved: false\n };\n date.squares.push(square);\n break;\n case ButtonType.ChairReserved:\n square = {\n row: i,\n column: j,\n type: 'C',\n reserved: true\n };\n date.squares.push(square);\n break;\n default:\n break;\n }\n }\n }\n return date;\n }\n\n @HostListener('window:resize', ['$event'])\n onResize(event) {\n this.initializeGrid();\n }\n\n}\n","import { HashLocationStrategy } from '@angular/common';\nimport { debugOutputAstAsTypeScript } from '@angular/compiler';\nimport { Component, OnInit, HostListener, Output, EventEmitter, ChangeDetectorRef } from '@angular/core';\nimport { HighScoreService } from '../high-score.service';\nimport { PageStateService } from '../page-state.service';\nimport { ScoreService } from '../score.service';\n\n@Component({\n selector: 'app-high-score-input',\n templateUrl: './high-score-input.component.html',\n styleUrls: ['./high-score-input.component.css']\n})\nexport class HighScoreInputComponent implements OnInit {\n\n @Output() notifyParent: EventEmitter\n \n
\n
\n\n \n
\n \n
\n Number of Chairs: {{ chairCount }}\n
\n \n \n \n \n
\n Press ENTER to Submit\n
\n","import { Component, OnInit, ChangeDetectorRef, HostListener, Renderer2 } from '@angular/core';\nimport { PageStateService, PageState } from '../page-state.service'\n\n@Component({\n selector: 'app-home',\n templateUrl: './home.component.html',\n styleUrls: ['./home.component.css']\n})\nexport class HomeComponent implements OnInit {\n counterStyle: any;\n counterTopStyle: any;\n backgroundImage: string;\n backgroundPosition: string;\n\n public PageState = PageState;\n\n constructor(public state: PageStateService, private cdr: ChangeDetectorRef, private renderer: Renderer2){}\n\n chooseBackgroundImage() {\n let aspectRatio = window.innerWidth/window.innerHeight;\n if (this.state.currentState === PageState.ABOUT) { \n this.backgroundImage = `url(\"assets/AboutUsBackground.PNG\")`;\n } else if (aspectRatio < 0.95) {\n this.counterStyle.visibility = \"visible\";\n this.counterTopStyle.visibility = \"visible\";\n this.backgroundImage = `url(\"assets/kitchen/NewKitchenBase.PNG\")`;\n this.counterStyle.backgroundImage = `url(\"assets/kitchen/KitchenCounter.PNG\")`;\n this.counterStyle.backgroundSize = window.innerWidth*(1 + 0.2*(306*window.innerHeight/window.innerWidth - 322)/340) + \"px auto\";\n this.counterTopStyle.backgroundImage = `url(\"assets/kitchen/CounterTop.PNG\")`;\n this.counterTopStyle.width = window.innerWidth * 299/306 + \"px\";\n this.counterTopStyle.height = window.innerWidth * 56/306 + \"px\";\n this.counterTopStyle.top = window.innerWidth * 276/306*(1 + 0.22*(306*window.innerHeight/window.innerWidth - 322)/340) - this.state.getCounterTopCutoff() + \"px\";\n this.counterTopStyle.left = window.innerWidth * 3/306 + \"px\";\n // this.backgroundPosition = \"center \" + -100*(1 - (window.innerHeight*window.innerWidth/306 - 306)/356)/662 * window.innerHeight;\n if ((window.innerHeight/window.innerWidth*306 - 306)/356 < 1) {\n this.backgroundPosition = \"center \" + -this.state.getTopCutoff() + \"px\";\n this.counterStyle.backgroundPosition = \"center \" + -this.state.getCounterTopCutoff() + \"px\";\n } else {\n this.backgroundPosition = \"top\";\n this.counterStyle.backgroundSize = window.innerHeight*1.2*306/662 + \"px auto\";\n this.counterStyle.backgroundPosition = \"center \" + window.innerHeight*-0.45*126/662 + \"px\";\n }\n } else {\n this.counterStyle.visibility = \"hidden\";\n this.counterTopStyle.visibility = \"hidden\";\n if (aspectRatio < 1.44) {\n this.backgroundImage = `url(\"assets/kitchen/Kitchen_24_Narrow.PNG\")`\n } else {\n this.backgroundImage = `url(\"assets/kitchen/Kitchen_24.PNG\")`;\n }\n // this.backgroundImage = `url(\"assets/kitchen/Kitchen_24.PNG\")`;\n \n if (this.state.isNarrow()) {\n this.backgroundPosition = -this.state.getLeftCutoff() + \"px top\";\n } else {\n this.backgroundPosition = \"top\";\n }\n \n }\n this.cdr.detectChanges();\n }\n\n getTextShadow() {\n // const body = this.renderer.selectRootElement('body');\n // var shadowSize = window.innerWidth * 2/512;\n // if (window.innerWidth/window.innerHeight < 0.95) {\n // shadowSize = window.innerWidth * 2/306;\n // } else if (this.state.isNarrow()) {\n // shadowSize = window.innerHeight * 2/320;\n // }\n // console.log(shadowSize);\n // this.renderer.setStyle(body, 'text-shadow', `-${shadowSize}px -${shadowSize}px 0 #fff, ${shadowSize}px -${shadowSize}px 0 #fff, -${shadowSize}px ${shadowSize}px 0 #fff, ${shadowSize}px ${shadowSize}px 0 #fff`);\n }\n\n @HostListener('window:resize', ['$event'])\n onResize(event) {\n this.chooseBackgroundImage();\n this.getTextShadow();\n }\n\n ngOnInit() {\n this.counterStyle = {};\n this.counterTopStyle = {};\n this.chooseBackgroundImage();\n this.state.getCurrentStateObservable().subscribe(state => {\n this.chooseBackgroundImage();\n this.cdr.detectChanges();\n });\n }\n\n}\n","\n Press ENTER to Submit\n
\n
\n","import { Component, HostListener, OnInit, ViewChild } from '@angular/core';\nimport { FormBuilder, FormGroup, Validators } from '@angular/forms';\nimport { ActivatedRoute, Router } from '@angular/router';\nimport { FutureEventsService } from '../future-events.service';\nimport { ReservationService } from '../reservation.service';\nimport { TableReservationGridComponent } from '../table-reservation-grid/table-reservation-grid.component';\nimport { catchError } from 'rxjs/operators';\nimport { of } from 'rxjs';\n\n@Component({\n selector: 'app-customer-reservations',\n templateUrl: './customer-reservations.component.html',\n styleUrls: ['./customer-reservations.component.css']\n})\nexport class CustomerReservationsComponent implements OnInit {\n dateId: number;\n eventInfo: any;\n eventDate: any;\n reservationForm: FormGroup;\n gridStyle: any;\n formStyle: any;\n inputStyle: any;\n buttonStyle: any;\n selectedSeats: any[];\n seatCount: number;\n seatReserved: boolean;\n reservationFailed: boolean;\n\n @ViewChild(TableReservationGridComponent) tableDesignGridComponent: TableReservationGridComponent;\n\n constructor(private route: ActivatedRoute, private eventsService: FutureEventsService, private formBuilder: FormBuilder, private reservationService: ReservationService, private router: Router) {\n this.seatReserved = false;\n this.reservationFailed = false;\n }\n\n saveReservation() {\n if (this.reservationForm.valid && this.selectedSeats && this.selectedSeats.length > 0) {\n const reservationFormData = this.reservationForm.value;\n let reservation = {\n customerName: reservationFormData.customerName,\n customerEmail: reservationFormData.customerEmail,\n seats: this.selectedSeats,\n paid: false,\n date: {\n id: this.eventDate.id,\n date: this.eventDate.date,\n soldOut: this.eventDate.soldOut\n }\n };\n // console.log(reservation);\n this.reservationService.submitReservation(reservation).pipe(\n catchError((error) => {\n // Handle errors here\n console.error('Error during reservation:', error);\n return of('Reservation failed');\n })\n ).subscribe((response) => {\n if (response === 'Reservation failed') {\n this.reservationFailed = true;\n this.getEventData();\n setTimeout(() => {\n this.tableDesignGridComponent.initializeGrid();\n }, 2000);\n } else {\n this.seatReserved = true;\n }\n });\n } else {\n console.log(\"form invalid\");\n this.reservationFailed = true;\n }\n }\n\n goHome() {\n this.router.navigate(['/']);\n }\n\n setGridStyle() {\n var aspectRatio = window.innerWidth / window.innerHeight;\n this.gridStyle.position = \"fixed\";\n this.gridStyle.height = window.innerHeight * 101/512 + \"px\";\n this.gridStyle.width = window.innerWidth * 131/512 + \"px\";\n this.gridStyle.left = window.innerWidth * 20/512 + \"px\";\n this.gridStyle.top = window.innerHeight/2 - window.innerWidth * 101/512 + \"px\";\n if (aspectRatio < 0.84) {\n this.gridStyle.left = window.innerWidth * 45/512 + \"px\";\n this.gridStyle.top = window.innerWidth * 35/512 + \"px\";\n }\n }\n\n setFormStyle() {\n var aspectRatio = window.innerWidth / window.innerHeight;\n this.formStyle.position = \"fixed\";\n this.formStyle.textAlign = \"left\";\n this.formStyle.fontSize = window.innerWidth * 4/512 + \"px\";\n this.formStyle.lineHeight = window.innerWidth * 6.8/512 + \"px\";\n this.formStyle.height = window.innerHeight * 3/4 + \"px\";\n this.formStyle.width = window.innerWidth * 175/512 + \"px\";\n this.formStyle.left = window.innerWidth * 305/512 + \"px\";\n this.formStyle.top = window.innerHeight/2 - window.innerWidth * 101/512 + \"px\";\n if (aspectRatio < 0.84) {\n this.formStyle.left = window.innerWidth * 45/512 + \"px\";\n this.formStyle.width = 8/5 * window.innerWidth * 262/512 + \"px\";\n this.formStyle.fontSize = 7/5 * window.innerHeight * 4/512 + \"px\";\n this.formStyle.lineHeight = 7/5 * window.innerHeight * 6.3/512 + \"px\";\n this.formStyle.top = 7/5 * window.innerWidth * 202/512 + window.innerWidth * 45/512 + \"px\";\n }\n }\n\n setInputStyle() {\n let aspectRatio = window.innerWidth/window.innerHeight;\n this.inputStyle.padding = window.innerWidth * 2/512 + \"px\";\n this.inputStyle.width = window.innerWidth * 100/512 + \"px\";\n this.inputStyle.borderWidth = window.innerWidth * 1/512 + \"px\";\n this.inputStyle.fontSize = window.innerWidth * 3/512 + \"px\";\n if (aspectRatio < 0.84) {\n this.inputStyle.padding = window.innerHeight * 2/512 + \"px\";\n this.inputStyle.width = window.innerHeight * 100/512 + \"px\";\n this.inputStyle.borderWidth = window.innerHeight * 1/512 + \"px\";\n this.inputStyle.fontSize = window.innerHeight * 5/512 + \"px\";\n }\n }\n\n setButtonStyle() {\n let aspectRatio = window.innerWidth/window.innerHeight;\n this.buttonStyle.fontSize = window.innerWidth * 3/512 + \"px\";\n // this.buttonStyle.height = window.innerWidth * 7/512 + \"px\";\n this.buttonStyle.padding = window.innerWidth * 1.5/512 + \"px\";\n this.buttonStyle.borderWidth = window.innerWidth * 1/512 + \"px\";\n if (aspectRatio < 0.84) {\n this.buttonStyle.fontSize = window.innerHeight * 3/306 + \"px\";\n // this.buttonStyle.height = window.innerWidth * 7/306 + \"px\";\n this.buttonStyle.padding = window.innerHeight * 1.5/306 + \"px\";\n this.buttonStyle.borderWidth = window.innerHeight * 1/306 + \"px\";\n }\n }\n\n setStyles() {\n this.setGridStyle();\n this.setFormStyle();\n this.setInputStyle();\n this.setButtonStyle();\n }\n\n getSeatCount() {\n this.selectedSeats = this.tableDesignGridComponent.getSelectedSeats();\n this.seatCount = this.selectedSeats.length;\n }\n\n getEventData() {\n this.eventsService.getFutureDateById(this.dateId).subscribe((data: any) => {\n this.eventDate = data;\n this.eventInfo = {\n name: data.event.name,\n price: data.event.price,\n date: this.eventsService.formatDateWithoutTimeZone(data.date),\n squares: data.squares\n };\n });\n }\n\n @HostListener('click', ['$event'])\n onClick(event: Event): void {\n this.getSeatCount();\n }\n\n @HostListener('window:resize', ['$event'])\n onResize(event) {\n this.setStyles();\n }\n\n ngOnInit(): void {\n this.reservationForm = this.formBuilder.group({\n customerName: [null, Validators.required],\n customerEmail: [null, Validators.required],\n seats: this.formBuilder.array([])\n });\n\n this.gridStyle = {};\n this.formStyle = {};\n this.inputStyle = {};\n this.buttonStyle = {};\n\n this.route.params.subscribe(params => {\n this.dateId = params['dateId'];\n });\n\n this.getEventData();\n this.setStyles();\n this.getSeatCount();\n }\n\n}\n","\n\n \n
\n
\n\n
\n \n
\n \n
\n\n Congratulations! Your reservation has been confirmed pending payment.
\n \n
\n\n \n
\n \n \n
\n","import { Component, Input, OnInit } from '@angular/core';\nimport { GridService } from '../grid.service';\n\nenum ButtonType {\n Empty,\n Table,\n AvailableChair,\n SelectedChair,\n PendingChair,\n ReservedChair\n}\n\n@Component({\n selector: 'app-admin-reservation-grid',\n templateUrl: './admin-reservation-grid.component.html',\n styleUrls: ['./admin-reservation-grid.component.css']\n})\nexport class AdminReservationGridComponent implements OnInit {\n @Input() squares: any[];\n grid: any[][] = [];\n numRows: number;\n numCols: number;\n selectedSeat: any;\n\n constructor(private gridService: GridService) { \n this.numRows = this.gridService.numRows;\n this.numCols = this.gridService.numCols;\n }\n\n initializeGrid() {\n for (let i = 0; i < this.numRows; i++) {\n this.grid[i] = [];\n for (let j = 0; j < this.numCols; j++) {\n this.grid[i][j] = {\n type: ButtonType.Empty\n }\n }\n }\n for (let i = 0; i < this.squares.length; i++) {\n switch (this.squares[i].type) {\n case 'O':\n this.grid[this.squares[i].row][this.squares[i].column].type = ButtonType.AvailableChair;\n break;\n case 'T':\n this.grid[this.squares[i].row][this.squares[i].column].type = ButtonType.Table;\n break;\n case 'C':\n this.grid[this.squares[i].row][this.squares[i].column] = {\n type: ButtonType.ReservedChair,\n reservation:this.squares[i].reservation\n };\n break;\n case 'P':\n this.grid[this.squares[i].row][this.squares[i].column] = {\n type: ButtonType.PendingChair,\n reservation:this.squares[i].reservation\n };\n break;\n }\n }\n }\n\n getButtonClass(button: ButtonType): string {\n switch (button) {\n case ButtonType.Empty:\n return 'empty';\n case ButtonType.Table:\n return 'table';\n case ButtonType.AvailableChair:\n return 'chair-available';\n case ButtonType.PendingChair:\n return 'chair-pending';\n case ButtonType.SelectedChair:\n return 'chair-selected';\n case ButtonType.ReservedChair:\n return 'chair-reserved';\n default:\n return '';\n }\n }\n\n getButtonText(button: any): string {\n switch (button.type) {\n case ButtonType.PendingChair:\n case ButtonType.SelectedChair:\n case ButtonType.ReservedChair:\n return 'R';\n default:\n return '';\n }\n }\n\n getButtonClickable(i: number, j: number): boolean {\n return (this.grid[i][j].type === ButtonType.AvailableChair || this.grid[i][j].type === ButtonType.SelectedChair);\n }\n\n onButtonClick(i: number, j: number) {\n\n }\n\n ngOnInit(): void {\n this.initializeGrid();\n }\n\n}\n","import { Injectable } from '@angular/core';\nimport { HttpClient, HttpHeaders } from '@angular/common/http';\nimport { HighScoresComponent } from './high-scores/high-scores.component';\nimport { UrlService } from './url.service';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class HighScoreService {\n baseUrl: string;\n endpoint: string;\n\n private highScoreComponent: HighScoresComponent;\n\n constructor(private http: HttpClient, private urlService: UrlService) { \n this.baseUrl = this.urlService.getBaseUrl();\n this.endpoint = \"/CouchCafe/api/highscores\";\n }\n\n registerHighScoresComponent(component: HighScoresComponent) {\n this.highScoreComponent = component;\n }\n\n public getHighScores() {\n // const headers = new HttpHeaders({\n // 'Content-Type': 'application/json',\n // 'Access-Control-Allow-Origin': '*'\n // });\n // return this.http.get(this.baseUrl + this.endpoint, { headers });\n return this.http.get(this.baseUrl + this.endpoint, { });\n }\n\n public setHighScores() {\n this.highScoreComponent.setHighScoreText();\n }\n\n public postHighScore(highScore: any) {\n return this.http.post(this.baseUrl + this.endpoint, highScore, {});\n }\n}\n","import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\nimport { animate, style, transition, trigger } from '@angular/animations';\n\n@Component({\n selector: 'app-reservation-failed',\n templateUrl: './reservation-failed.component.html',\n styleUrls: ['./reservation-failed.component.css'],\n animations: [\n trigger('fadeAnimation', [\n transition(':enter', [\n style({ opacity: 0 }),\n animate('1s ease-in-out', style({ opacity: 1 })),\n ]),\n transition(':leave', [\n animate('1s ease-in-out', style({ opacity: 0 })),\n ]),\n ]),\n ]\n})\nexport class ReservationFailedComponent implements OnInit {\n @Input() isVisible: boolean = true;\n @Output() isVisibleChange = new EventEmitter\n \n
\n There was an error completing your reservation. Please enter all fields, select your seats and try again!
>\n","import { Component, OnInit, HostListener, NgZone, ChangeDetectorRef, ViewChild } from '@angular/core';\nimport { Router } from '@angular/router';\nimport {PageStateService, PageState } from '../page-state.service'\n\n@Component({\n selector: 'app-menu-buttons',\n templateUrl: './menu-buttons.component.html',\n styleUrls: ['./menu-buttons.component.css']\n})\nexport class MenuButtonsComponent implements OnInit {\n\n public PageState = PageState;\n\n futureDatesStyle: any;\n pastMenusStyle: any;\n aboutUsStyle: any;\n myspiceStyle: any;\n backgroundStyle: any;\n\n backgroundChecked: boolean;\n\n kitchenFutureMouseOver: string[] = ['assets/kitchen/FutureDates_2.PNG', 'assets/kitchen/FutureDates_3.PNG', 'assets/kitchen/FutureDates_4.PNG'];\n kitchenFutureMouseOverImgs: any[] = [];\n kitchenFutureMouseOut: string[] = ['assets/kitchen/FutureDates.PNG', 'assets/kitchen/FutureDates_6.PNG', 'assets/kitchen/FutureDates_7.PNG'];\n kitchenFutureMouseOutImgs: any[] = [];\n kitchenFutureClicked: string = 'assets/kitchen/FutureDates_clicked.PNG';\n kitchenPastMouseOver: string[] = [\"assets/kitchen/PastMenus_2.PNG\", \"assets/kitchen/PastMenus_3.PNG\"];\n kitchenPastMouseOverImgs: any[] = [];\n kitchenPastMouseOut: string[] = [\"assets/kitchen/PastMenus.PNG\", \"assets/kitchen/PastMenus_5.PNG\"];\n kitchenPastMouseOutImgs: any[] = [];\n kitchenStoryMouseOver: string[] = [\"assets/kitchen/OurStory_2.PNG\", \"assets/kitchen/OurStory_3.PNG\", \"assets/kitchen/OurStory_4.PNG\"];\n kitchenStoryMouseOverImgs: any[] = [];\n kitchenStoryMouseOut: string[] = [\"assets/kitchen/OurStory.PNG\", \"assets/kitchen/OurStory_6.PNG\", \"assets/kitchen/OurStory_7.PNG\"];\n kitchenStoryMouseOutImgs: any[] = [];\n kitchenMyspiceMouseOver: string[] = [\"assets/kitchen/myspice_1.PNG\", \"assets/kitchen/myspice_2.PNG\", \"assets/kitchen/myspice_3.PNG\", \"assets/kitchen/myspice_4.PNG\", \"assets/kitchen/myspice_5.PNG\", \"assets/kitchen/myspice_6.PNG\"];\n kitchenMyspiceMouseOverImgs: any[] = [];\n kitchenMyspiceMouseOut: string[] = [\"assets/kitchen/myspice.PNG\", \"assets/kitchen/myspice_mo_1.PNG\", \"assets/kitchen/myspice_mo_2.PNG\", \"assets/kitchen/myspice_mo_3.PNG\", \"assets/kitchen/myspice_mo_4.PNG\", \"assets/kitchen/myspice_mo_5.PNG\"];\n kitchenMyspiceMouseOutImgs: any[] = [];\n kitchenMyspiceClicked: string = 'assets/kitchen/myspice_clicked.PNG';\n\n isFutureMouseOverRunning: boolean = false;\n isFutureMouseOutRunning: boolean = false;\n isFutureHovered: boolean = false;\n isPastMouseOverRunning: boolean = false;\n isPastMouseOutRunning: boolean = false;\n isPastHovered: boolean = false;\n isMyspiceMouseOverRunning: boolean = false;\n isMyspiceMouseOutRunning: boolean = false;\n isMyspiceHovered: boolean = false;\n\n currentStoryMouseOverImage: number;\n currentStoryMouseOutImage: number;\n currentMenuMouseOverImage: number;\n currentMenuMouseOutImage: number;\n currentDateMouseOverImage: number;\n currentDateMouseOutImage: number;\n currentMyspiceMouseOverImage: number;\n currentMyspiceMouseOutImage: number;\n\n isMobile: boolean;\n\n constructor(private ngZone: NgZone, private cdr: ChangeDetectorRef, private state: PageStateService, private router: Router) { }\n\n setButtonSizes() {\n this.backgroundStyle.height = window.innerHeight + \"px\";\n this.backgroundStyle.width = window.innerWidth + \"px\";\n var aspectRatio = window.innerWidth / window.innerHeight;\n var narrow = aspectRatio < 512/320;\n let leftCutoff = this.state.getLeftCutoff();\n if (narrow) {\n this.futureDatesStyle.width = window.innerHeight * 53/320 + \"px\";\n this.futureDatesStyle.height = window.innerHeight * 96/320 + \"px\";\n this.futureDatesStyle.left = window.innerHeight * 63/320 - leftCutoff + \"px\";\n this.futureDatesStyle.top = window.innerHeight * 34/320 + \"px\";\n this.pastMenusStyle.width = window.innerHeight * 62/320 + \"px\";\n this.pastMenusStyle.height = window.innerHeight * 102/320 + \"px\";\n this.pastMenusStyle.left = window.innerHeight * 144/320 - leftCutoff + \"px\";\n this.pastMenusStyle.top = window.innerHeight * 57/320 + \"px\";\n this.aboutUsStyle.width = window.innerHeight * 37/320 + \"px\";\n this.aboutUsStyle.height = window.innerHeight * 89/320 + \"px\";\n this.aboutUsStyle.left = window.innerHeight * 362/320 - leftCutoff + \"px\";\n this.aboutUsStyle.top = window.innerHeight * 6/320 + \"px\";\n this.myspiceStyle.width = window.innerHeight * 96/320 + \"px\";\n this.myspiceStyle.height = window.innerHeight * 24/320 + \"px\";\n this.myspiceStyle.left = window.innerHeight * 265/320 - leftCutoff + \"px\";\n this.myspiceStyle.top = window.innerHeight * 94/320 + \"px\";\n } else {\n this.futureDatesStyle.width = window.innerWidth * 53/512 + \"px\";\n this.futureDatesStyle.height = window.innerWidth * 96/512 + \"px\";\n this.futureDatesStyle.left = window.innerWidth * 63/512 + \"px\";\n this.futureDatesStyle.top = window.innerWidth * 34/512 + \"px\";\n this.pastMenusStyle.width = window.innerWidth * 62/512 + \"px\";\n this.pastMenusStyle.height = window.innerWidth * 102/512 + \"px\";\n this.pastMenusStyle.left = window.innerWidth * 144/512 + \"px\";\n this.pastMenusStyle.top = window.innerWidth * 57/512 + \"px\";\n this.aboutUsStyle.width = window.innerWidth * 37/512 + \"px\";\n this.aboutUsStyle.height = window.innerWidth * 89/512 + \"px\";\n this.aboutUsStyle.left = window.innerWidth * 362/512 + \"px\";\n this.aboutUsStyle.top = window.innerWidth * 6/512 + \"px\";\n this.myspiceStyle.width = window.innerWidth * 96/512 + \"px\";\n this.myspiceStyle.height = window.innerWidth * 24/512 + \"px\";\n this.myspiceStyle.left = window.innerWidth * 265/512 + \"px\";\n this.myspiceStyle.top = window.innerWidth * 94/512 + \"px\";\n }\n if (aspectRatio < 1.12) {\n this.futureDatesStyle.width = window.innerWidth * 216/512 + \"px\";\n this.futureDatesStyle.height = window.innerWidth * 76/512 + \"px\";\n this.futureDatesStyle.left = window.innerWidth * 20/320 + \"px\";\n this.futureDatesStyle.top = window.innerHeight * 260/320 + \"px\";\n this.kitchenFutureMouseOver = ['assets/kitchen/FutureDatesWide_2.PNG', 'assets/kitchen/FutureDatesWide_3.PNG', 'assets/kitchen/FutureDatesWide_4.PNG'];\n this.kitchenFutureMouseOut = ['assets/kitchen/FutureDatesWide.PNG', 'assets/kitchen/FutureDatesWide_6.PNG', 'assets/kitchen/FutureDatesWide_7.PNG'];\n this.kitchenFutureClicked = 'assets/kitchen/FutureDatesWide_5.PNG';\n this.futureDatesStyle.backgroundImage = `url(assets/kitchen/FutureDatesWide.PNG)`;\n for (let i = 0; i < this.kitchenFutureMouseOver.length; i++) {\n this.kitchenFutureMouseOverImgs[i] = new Image();\n this.kitchenFutureMouseOverImgs[i].src = this.kitchenFutureMouseOver[i];\n }\n for (let i = 0; i < this.kitchenFutureMouseOut.length; i++) {\n this.kitchenFutureMouseOutImgs[i] = new Image();\n this.kitchenFutureMouseOutImgs[i].src = this.kitchenFutureMouseOut[i];\n }\n } else {\n this.kitchenFutureMouseOver = ['assets/kitchen/FutureDates_2.PNG', 'assets/kitchen/FutureDates_3.PNG', 'assets/kitchen/FutureDates_4.PNG'];\n this.kitchenFutureMouseOut = ['assets/kitchen/FutureDates.PNG', 'assets/kitchen/FutureDates_6.PNG', 'assets/kitchen/FutureDates_7.PNG'];\n this.kitchenFutureClicked = 'assets/kitchen/FutureDates_clicked.PNG';\n this.futureDatesStyle.backgroundImage = `url(assets/kitchen/FutureDates.PNG)`;\n for (let i = 0; i < this.kitchenFutureMouseOver.length; i++) {\n this.kitchenFutureMouseOverImgs[i] = new Image();\n this.kitchenFutureMouseOverImgs[i].src = this.kitchenFutureMouseOver[i];\n }\n for (let i = 0; i < this.kitchenFutureMouseOut.length; i++) {\n this.kitchenFutureMouseOutImgs[i] = new Image();\n this.kitchenFutureMouseOutImgs[i].src = this.kitchenFutureMouseOut[i];\n }\n }\n if (aspectRatio < 0.95) {\n this.futureDatesStyle.top = window.innerWidth * 390/306*(1 + 0.2*(306*window.innerHeight/window.innerWidth - 322)/340) - this.state.getCounterTopCutoff() + \"px\";\n this.pastMenusStyle.width = window.innerWidth * 62/306 + \"px\";\n this.pastMenusStyle.height = window.innerWidth * 102/306 + \"px\";\n this.pastMenusStyle.left = window.innerWidth * 28/306 + \"px\";\n this.pastMenusStyle.top = window.innerWidth * 161/306 - this.state.getTopCutoff() + \"px\";\n this.aboutUsStyle.width = window.innerWidth * 37/306 + \"px\";\n this.aboutUsStyle.height = window.innerWidth * 89/306 + \"px\";\n this.aboutUsStyle.left = window.innerWidth * 246/306 + \"px\";\n this.aboutUsStyle.top = window.innerWidth * 110/306 - this.state.getTopCutoff() + \"px\";\n this.myspiceStyle.width = window.innerWidth * 96/306 + \"px\";\n this.myspiceStyle.height = window.innerWidth * 24/306 + \"px\";\n this.myspiceStyle.left = window.innerWidth * 149/306 + \"px\";\n this.myspiceStyle.top = window.innerWidth * 198/306 - this.state.getTopCutoff() + \"px\";\n }\n if (aspectRatio < 0.65) {\n // this.futureDatesStyle.width = window.innerWidth * 216/512 + \"px\";\n // this.futureDatesStyle.height = window.innerWidth * 76/512 + \"px\";\n // this.futureDatesStyle.top = window.innerWidth * 355/306*(1 + 0.085*(306*window.innerHeight/window.innerWidth - 470)/192)*(1 + 0.2*(306*window.innerHeight/window.innerWidth - 322)/340) - this.state.getCounterTopCutoff() + \"px\";\n // this.futureDatesStyle.left = window.innerWidth/2 - parseInt(this.futureDatesStyle.width)/2 + \"px\";\n let isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) || (navigator.userAgent.includes(\"Macintosh\") && navigator.maxTouchPoints > 1);\n\n if (isMobile) {\n this.futureDatesStyle.top = window.innerWidth * 450/306*(1 + 0.2*(306*window.innerHeight/window.innerWidth - 322)/340) - this.state.getCounterTopCutoff() + \"px\";\n }\n }\n if (aspectRatio < 306/662) {\n // this.futureDatesStyle.width = window.innerHeight * 216/512*1.5*306/662 + \"px\";\n // this.futureDatesStyle.height = window.innerHeight * 76/512*1.5*306/662 + \"px\";\n // this.futureDatesStyle.top = window.innerWidth * 355/306*(1 + 0.095*(306*window.innerHeight/window.innerWidth - 470)/192)*(1 + 0.2*(306*window.innerHeight/window.innerWidth - 322)/340) - this.state.getCounterTopCutoff() + \"px\";\n // this.futureDatesStyle.left = window.innerWidth/2 - parseInt(this.futureDatesStyle.width)/2 + \"px\";\n this.pastMenusStyle.width = window.innerHeight * 62/662 + \"px\";\n this.pastMenusStyle.height = window.innerHeight * 102/662 + \"px\";\n this.pastMenusStyle.left = window.innerHeight * 28/662 + \"px\";\n this.pastMenusStyle.top = window.innerHeight * 161/662 + \"px\";\n this.aboutUsStyle.width = window.innerHeight * 37/662 + \"px\";\n this.aboutUsStyle.height = window.innerHeight * 89/662 + \"px\";\n this.aboutUsStyle.left = window.innerHeight * 246/662 + \"px\";\n this.aboutUsStyle.top = window.innerHeight * 110/662 + \"px\";\n this.myspiceStyle.width = window.innerHeight * 96/662 + \"px\";\n this.myspiceStyle.height = window.innerHeight * 24/662 + \"px\";\n this.myspiceStyle.left = window.innerHeight * 149/662 + \"px\";\n this.myspiceStyle.top = window.innerHeight * 198/662 + \"px\";\n }\n this.futureDatesStyle.backgroundImage = `url(${this.kitchenFutureMouseOutImgs[0].src})`;\n this.cdr.detectChanges();\n }\n\n futureDatesMouseEnterWrapper() {\n this.isFutureHovered = true;\n this.isFutureMouseOverRunning = true;\n this.futureDatesMouseEnter();\n }\n\n futureDatesMouseEnter() {\n this.isFutureHovered = true;\n this.isFutureMouseOutRunning = false;\n if (this.isFutureMouseOverRunning) {\n if(this.currentDateMouseOverImage >= this.kitchenFutureMouseOver.length) {\n this.isFutureMouseOverRunning = false;\n } else {\n this.futureDatesStyle.backgroundImage = `url(${this.kitchenFutureMouseOverImgs[this.currentDateMouseOverImage].src})`;\n this.currentDateMouseOverImage++;\n setTimeout(() => {\n this.ngZone.runOutsideAngular(() => requestAnimationFrame(() => this.futureDatesMouseEnter()));\n }, 50);\n }\n this.cdr.detectChanges();\n }\n }\n\n futureDatesMouseOutWrapper() {\n this.isFutureHovered = false;\n this.isFutureMouseOutRunning = true;\n this.futureDatesMouseOut();\n }\n\n futureDatesMouseOut() {\n this.isFutureHovered = false;\n this.isFutureMouseOverRunning = false;\n if (this.isFutureMouseOutRunning) {\n this.currentDateMouseOverImage = 0;\n if(this.currentDateMouseOutImage >= this.kitchenFutureMouseOut.length - 1) {\n this.currentDateMouseOutImage = 0;\n this.futureDatesStyle.backgroundImage = `url(${this.kitchenFutureMouseOutImgs[this.currentDateMouseOutImage].src})`;\n this.isFutureMouseOutRunning = false;\n } else {\n this.currentDateMouseOutImage++;\n this.futureDatesStyle.backgroundImage = `url(${this.kitchenFutureMouseOutImgs[this.currentDateMouseOutImage].src})`;\n setTimeout(() => {\n this.ngZone.runOutsideAngular(() => requestAnimationFrame(() => this.futureDatesMouseOut()));\n }, 100);\n \n }\n this.cdr.detectChanges();\n }\n }\n \n futureDatesMouseDown() {\n if (window.innerWidth / window.innerHeight < 1.12) {\n // this.futureDatesStyle.backgroundImage = \n }\n this.futureDatesStyle.backgroundImage = `url(${this.kitchenFutureClicked})`;\n this.cdr.detectChanges();\n }\n\n futureDatesClick() {\n this.state.currentState = PageState.FUTURE;\n this.cdr.detectChanges();\n }\n\n pastMenusMouseEnterWrapper() {\n this.isPastHovered = true;\n this.isPastMouseOverRunning = true;\n this.pastMenusMouseEnter();\n }\n\n pastMenusMouseEnter() {\n this.isPastHovered = true;\n this.isPastMouseOutRunning = false;\n if (this.isPastMouseOverRunning) {\n if(this.currentMenuMouseOverImage >= this.kitchenPastMouseOver.length) {\n this.isPastMouseOverRunning = false;\n } else {\n this.pastMenusStyle.backgroundImage = `url(${this.kitchenPastMouseOverImgs[this.currentMenuMouseOverImage].src})`;\n this.currentMenuMouseOverImage++;\n setTimeout(() => {\n this.ngZone.runOutsideAngular(() => requestAnimationFrame(() => this.pastMenusMouseEnter()));\n }, 50);\n }\n this.cdr.detectChanges();\n }\n }\n\n pastMenusMouseOutWrapper() {\n this.isPastHovered = false;\n this.isPastMouseOutRunning = true;\n this.pastMenusMouseOut();\n }\n\n pastMenusMouseOut() {\n this.isPastHovered = false;\n this.isPastMouseOverRunning = false;\n if (this.isPastMouseOutRunning) {\n this.currentMenuMouseOverImage = 0;\n if(this.currentMenuMouseOutImage >= this.kitchenPastMouseOut.length - 1) {\n this.currentMenuMouseOutImage = 0;\n this.pastMenusStyle.backgroundImage = `url(${this.kitchenPastMouseOutImgs[this.currentMenuMouseOutImage].src})`;\n this.isPastMouseOutRunning = false;\n } else {\n this.pastMenusStyle.backgroundImage = `url(${this.kitchenPastMouseOutImgs[this.currentMenuMouseOutImage].src})`;\n this.currentMenuMouseOutImage++;\n setTimeout(() => {\n this.ngZone.runOutsideAngular(() => requestAnimationFrame(() => this.pastMenusMouseOut()));\n }, 100);\n }\n this.cdr.detectChanges();\n }\n }\n\n pastMenusMouseDown() {\n this.pastMenusStyle.backgroundImage = `url(assets/kitchen/PastMenus_clicked.PNG)`;\n this.cdr.detectChanges();\n }\n\n pastMenusClick() {\n this.state.currentState = PageState.PAST;\n this.cdr.detectChanges();\n }\n\n aboutUsMouseEnter() {\n if(this.currentStoryMouseOverImage >= this.kitchenStoryMouseOver.length) {\n // break\n } else {\n this.aboutUsStyle.backgroundImage = `url(${this.kitchenStoryMouseOverImgs[this.currentStoryMouseOverImage].src})`;\n this.currentStoryMouseOverImage++;\n setTimeout(() => {\n this.ngZone.runOutsideAngular(() => requestAnimationFrame(() => this.aboutUsMouseEnter()));\n }, 50);\n }\n this.cdr.detectChanges();\n }\n\n aboutUsMouseOut() {\n this.currentStoryMouseOverImage = 0;\n if(this.currentStoryMouseOutImage >= this.kitchenStoryMouseOut.length-1) {\n this.currentStoryMouseOutImage = 0;\n this.aboutUsStyle.backgroundImage = `url(${this.kitchenStoryMouseOutImgs[this.currentStoryMouseOutImage].src})`;\n } else {\n this.currentStoryMouseOutImage++;\n this.aboutUsStyle.backgroundImage = `url(${this.kitchenStoryMouseOutImgs[this.currentStoryMouseOutImage].src})`;\n setTimeout(() => {\n this.ngZone.runOutsideAngular(() => requestAnimationFrame(() => this.aboutUsMouseOut()));\n }, 50);\n }\n this.cdr.detectChanges();\n }\n\n aboutUsMouseDown() {\n this.aboutUsStyle.backgroundImage = `url(assets/kitchen/OurStory_clicked.PNG)`;\n this.cdr.detectChanges();\n }\n\n aboutUsClick() {\n this.state.setCurrentState(PageState.ABOUT);\n }\n\n myspiceMouseOverWrapper() {\n this.isMyspiceHovered = true;\n this.isMyspiceMouseOverRunning = true;\n this.myspiceMouseOver();\n }\n\n myspiceMouseOver() {\n this.isMyspiceMouseOutRunning = false;\n if (this.isMyspiceMouseOverRunning) {\n // this.currentMyspiceMouseOutImage = 0;\n if(this.currentMyspiceMouseOverImage >= this.kitchenMyspiceMouseOver.length) {\n this.isMyspiceMouseOverRunning = false;\n } else {\n this.myspiceStyle.backgroundImage = `url(${this.kitchenMyspiceMouseOverImgs[this.currentMyspiceMouseOverImage].src})`;\n this.currentMyspiceMouseOverImage++;\n setTimeout(() => {\n this.ngZone.runOutsideAngular(() => requestAnimationFrame(() => this.myspiceMouseOver()));\n }, 60);\n }\n this.cdr.detectChanges();\n } \n }\n\n myspiceMouseOutWrapper() {\n this.isMyspiceHovered = false;\n this.isMyspiceMouseOutRunning = true;\n this.myspiceMouseOut();\n }\n\n myspiceMouseOut() {\n this.isMyspiceMouseOverRunning = false;\n if (this.isMyspiceMouseOutRunning) {\n this.currentMyspiceMouseOverImage = 0;\n if(this.currentMyspiceMouseOutImage >= this.kitchenMyspiceMouseOut.length-1) {\n this.currentMyspiceMouseOutImage = 0;\n this.myspiceStyle.backgroundImage = `url(${this.kitchenMyspiceMouseOutImgs[this.currentMyspiceMouseOutImage].src})`;\n this.isMyspiceMouseOutRunning = false;\n } else {\n this.currentMyspiceMouseOutImage++;\n this.myspiceStyle.backgroundImage = `url(${this.kitchenMyspiceMouseOutImgs[this.currentMyspiceMouseOutImage].src})`;\n setTimeout(() => {\n this.ngZone.runOutsideAngular(() => requestAnimationFrame(() => this.myspiceMouseOut()));\n }, 100);\n }\n this.cdr.detectChanges();\n }\n }\n\n myspiceMouseDown() {\n this.myspiceStyle.backgroundImage = `url(assets/kitchen/myspice_clicked.PNG)`;\n this.cdr.detectChanges();\n }\n\n myspiceClick() {\n // this.state.setCurrentState(PageState.ABOUT);\n if (this.isMobile) {\n this.myspiceMouseOverWrapper();\n setTimeout(() => {\n // this.router.navigate(['myspice']);\n window.open('https://scampiphilly.com', '_blank');\n this.cdr.detectChanges();\n }, 500);\n } else {\n // this.router.navigate(['myspice']);\n window.open('https://scampiphilly.com', '_blank');\n }\n }\n\n backgroundMouseEnter() {\n if (!this.aboutUsStyle.backgroundImage.includes(\"OurStory.PNG\")) {\n this.aboutUsMouseOut();\n }\n if (!this.futureDatesStyle.backgroundImage.includes(\"FutureDates.PNG\") && !this.futureDatesStyle.backgroundImage.includes(\"FutureDatesWide.PNG\")) {\n this.isFutureMouseOutRunning = true;\n this.futureDatesMouseOut();\n }\n if (!this.pastMenusStyle.backgroundImage.includes(\"PastMenus.PNG\")) {\n this.isPastMouseOutRunning = true;\n this.pastMenusMouseOut();\n }\n if (!this.myspiceStyle.backgroundImage.includes(\"myspice.PNG\")) {\n this.isMyspiceMouseOutRunning = true;\n this.myspiceMouseOut();\n }\n }\n\n checkButtons() {\n if (!this.aboutUsStyle.backgroundImage.includes(\"OurStory.PNG\")) {\n this.aboutUsMouseOut();\n }\n if (!this.isFutureHovered && !this.futureDatesStyle.backgroundImage.includes(\"FutureDates.PNG\") && !this.futureDatesStyle.backgroundImage.includes(\"FutureDatesWide.PNG\")) {\n this.isFutureMouseOutRunning = true;\n this.futureDatesMouseOut();\n }\n if (!this.isPastHovered && !this.pastMenusStyle.backgroundImage.includes(\"PastMenus.PNG\")) {\n this.isPastMouseOutRunning = true;\n this.pastMenusMouseOut();\n }\n if (!this.isMyspiceHovered && !this.myspiceStyle.backgroundImage.includes(\"myspice.PNG\")) {\n this.isMyspiceMouseOutRunning = true;\n this.myspiceMouseOut();\n }\n setTimeout(() => {\n this.ngZone.runOutsideAngular(() => requestAnimationFrame(() => this.checkButtons()));\n }, 250);\n }\n\n @HostListener('window:resize', ['$event'])\n onResize(event) {\n this.setButtonSizes();\n }\n\n ngOnInit(): void {\n this.isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) || (navigator.userAgent.includes(\"Macintosh\") && navigator.maxTouchPoints > 1);\n this.state.currentState = PageState.HOME;\n this.futureDatesStyle = {};\n this.pastMenusStyle = {};\n this.aboutUsStyle = {};\n this.myspiceStyle = {};\n this.backgroundStyle = {};\n this.backgroundStyle.left = \"0px\";\n this.backgroundChecked = true;\n this.setButtonSizes();\n\n for (let i = 0; i < this.kitchenFutureMouseOver.length; i++) {\n this.kitchenFutureMouseOverImgs[i] = new Image();\n this.kitchenFutureMouseOverImgs[i].src = this.kitchenFutureMouseOver[i];\n }\n for (let i = 0; i < this.kitchenFutureMouseOut.length; i++) {\n this.kitchenFutureMouseOutImgs[i] = new Image();\n this.kitchenFutureMouseOutImgs[i].src = this.kitchenFutureMouseOut[i];\n }\n for (let i = 0; i < this.kitchenPastMouseOver.length; i++) {\n this.kitchenPastMouseOverImgs[i] = new Image();\n this.kitchenPastMouseOverImgs[i].src = this.kitchenPastMouseOver[i];\n }\n for (let i = 0; i < this.kitchenPastMouseOut.length; i++) {\n this.kitchenPastMouseOutImgs[i] = new Image();\n this.kitchenPastMouseOutImgs[i].src = this.kitchenPastMouseOut[i];\n }\n for (let i = 0; i < this.kitchenStoryMouseOver.length; i++) {\n this.kitchenStoryMouseOverImgs[i] = new Image();\n this.kitchenStoryMouseOverImgs[i].src = this.kitchenStoryMouseOver[i];\n }\n for (let i = 0; i < this.kitchenStoryMouseOut.length; i++) {\n this.kitchenStoryMouseOutImgs[i] = new Image();\n this.kitchenStoryMouseOutImgs[i].src = this.kitchenStoryMouseOut[i];\n }\n for (let i = 0; i < this.kitchenMyspiceMouseOver.length; i++) {\n this.kitchenMyspiceMouseOverImgs[i] = new Image();\n this.kitchenMyspiceMouseOverImgs[i].src = this.kitchenMyspiceMouseOver[i];\n }\n for (let i = 0; i < this.kitchenMyspiceMouseOut.length; i++) {\n this.kitchenMyspiceMouseOutImgs[i] = new Image();\n this.kitchenMyspiceMouseOutImgs[i].src = this.kitchenMyspiceMouseOut[i];\n }\n\n this.pastMenusStyle.backgroundImage = `url(assets/kitchen/PastMenus.PNG)`;\n this.aboutUsStyle.backgroundImage = `url(assets/kitchen/OurStory.PNG)`;\n this.myspiceStyle.backgroundImage = `url(assets/kitchen/myspice.PNG)`;\n //this.futureDatesStyle.backgroundImage = `url(assets/kitchen/FutureDates.PNG)`;\n\n this.currentStoryMouseOverImage = 0;\n this.currentStoryMouseOutImage = 0;\n this.currentMenuMouseOverImage = 0;\n this.currentMenuMouseOutImage = 0;\n this.currentDateMouseOverImage = 0;\n this.currentDateMouseOutImage = 0;\n this.currentMyspiceMouseOutImage = 0;\n this.currentMyspiceMouseOverImage = 0;\n\n this.checkButtons();\n }\n\n}\n","\n\n\n\n\n\n\n","import { Component, OnInit } from '@angular/core';\n\n@Component({\n selector: 'app-beverage',\n templateUrl: './beverage.component.html',\n styleUrls: ['./beverage.component.css']\n})\nexport class BeverageComponent implements OnInit {\n\n constructor() { }\n\n ngOnInit(): void {\n }\n\n}\n","\n
\n","import { Injectable } from '@angular/core';\nimport { HttpClient, HttpHeaders } from '@angular/common/http';\nimport { Observable } from 'rxjs';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class BrevoService {\n\n private apiKey = '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';\n\n constructor(private http: HttpClient) { }\n\n subscribe(emailInput: string): Observable\n
\nWe are currently BYOB. For wine service, we charge a corkage fee of $20 per bottle. Thank you :)
\n\n
\n
\n\n","import { Component, OnInit } from '@angular/core';\nimport { MenuService } from '../menu.service';\n\n@Component({\n selector: 'app-menu',\n templateUrl: './menu.component.html',\n styleUrls: ['./menu.component.css']\n})\nexport class MenuComponent implements OnInit {\n\n pastMenus: string[];\n menuImages: any[] = [];\n\n constructor(private menuService: MenuService) { }\n\n ngOnInit(): void {\n this.pastMenus = this.menuService.getPastMenus().slice().reverse();;\n }\n\n}\n","\n
\n Our next menu is currently under construction.
\n
\n Our next menu is currently under construction.
Please check out our past menus below!
\n \n
\n\n ![\"Past]()
\n
\n \n
","import { Component, OnInit } from '@angular/core';\n\n@Component({\n selector: 'app-admin',\n templateUrl: './admin.component.html',\n styleUrls: ['./admin.component.css']\n})\nexport class AdminComponent implements OnInit {\n showForm: Boolean = false;\n\n switchForm() {\n this.showForm = !this.showForm;\n }\n\n constructor() { }\n\n ngOnInit(): void {\n }\n\n}\n","import { Component, EventEmitter, HostListener, OnInit, Output, ViewChild } from '@angular/core';\nimport { FormArray, FormBuilder, FormGroup, Validators, FormControl, AbstractControl } from '@angular/forms';\nimport { FutureEventsService } from '../future-events.service';\nimport { TableDesignGridComponent } from '../table-design-grid/table-design-grid.component';\n\n\n\n@Component({\n selector: 'app-new-event-input',\n templateUrl: './new-event-input.component.html',\n styleUrls: ['./new-event-input.component.css']\n})\nexport class NewEventInputComponent implements OnInit {\n dateForm: FormGroup;\n @Output() notifyParent: EventEmitterWelcome Admin ;)
\nNew Event!
\n\n
\n
\n \n
\n","GAME OVER
\n
\n \n
\n
\n","import { Component, HostListener, Input, OnInit, } from '@angular/core';\nimport { GridService } from '../grid.service';\n\nenum ButtonType {\n Empty,\n Table,\n AvailableChair,\n SelectedChair,\n PendingChair,\n ReservedChair,\n Disabled\n}\n\n@Component({\n selector: 'app-table-reservation-grid',\n templateUrl: './table-reservation-grid.component.html',\n styleUrls: ['./table-reservation-grid.component.css']\n})\nexport class TableReservationGridComponent implements OnInit {\n @Input() squares: any[];\n grid: ButtonType[][] = [];\n numRows: number;\n numCols: number;\n selectedSeats: any[];\n gridContainerStyle: any;\n gridStyle: any;\n buttonStyle: any;\n\n constructor(private gridService: GridService) { \n this.numRows = this.gridService.numRows;\n this.numCols = this.gridService.numCols;\n this.gridContainerStyle = {};\n this.gridStyle = {};\n this.buttonStyle = {};\n }\n\n initializeGrid() {\n this.getGridContainerStyles();\n this.getGridStyles();\n this.getButtonStyles();\n for (let i = 0; i < this.numRows; i++) {\n this.grid[i] = [];\n for (let j = 0; j < this.numCols; j++) {\n this.grid[i][j] = ButtonType.Empty;\n }\n }\n for (let i = 0; i < this.squares.length; i++) {\n switch (this.squares[i].type) {\n case 'O':\n this.grid[this.squares[i].row][this.squares[i].column] = ButtonType.AvailableChair;\n break;\n case 'T':\n this.grid[this.squares[i].row][this.squares[i].column] = ButtonType.Table;\n break;\n case 'C':\n this.grid[this.squares[i].row][this.squares[i].column] = ButtonType.ReservedChair;\n break;\n case 'P':\n this.grid[this.squares[i].row][this.squares[i].column] = ButtonType.PendingChair;\n break;\n }\n }\n }\n\n onButtonClick(row: number, col: number) {\n if (this.grid[row][col] === ButtonType.AvailableChair) {\n this.grid[row][col] = ButtonType.SelectedChair;\n } else if (this.grid[row][col] === ButtonType.SelectedChair) {\n this.grid[row][col] = ButtonType.AvailableChair;\n }\n }\n\n getButtonClass(button: ButtonType): string {\n switch (button) {\n case ButtonType.Empty:\n return 'empty';\n case ButtonType.Table:\n return 'table';\n case ButtonType.AvailableChair:\n return 'chair-available';\n case ButtonType.PendingChair:\n return 'chair-pending';\n case ButtonType.SelectedChair:\n return 'chair-selected';\n case ButtonType.ReservedChair:\n return 'chair-reserved';\n default:\n return '';\n }\n }\n\n getButtonClickable(i: number, j: number): boolean {\n return (this.grid[i][j] === ButtonType.AvailableChair || this.grid[i][j] === ButtonType.SelectedChair);\n }\n\n getGridContainerStyles() {\n var aspectRatio = window.innerWidth / window.innerHeight;\n this.gridContainerStyle.width = 5/5 * window.innerWidth * 262/512 + \"px\";\n this.gridContainerStyle.height = 5/5 * window.innerWidth * 202/512 + \"px\";\n this.gridContainerStyle.left = 5/5 * window.innerWidth * 3/512 + \"px\";\n if (aspectRatio < 0.84) { \n this.gridContainerStyle.width = 7/5 * window.innerWidth * 262/512 + \"px\";\n this.gridContainerStyle.height = 7/5 * window.innerWidth * 202/512 + \"px\";\n }\n }\n\n getGridStyles() {\n var aspectRatio = window.innerWidth / window.innerHeight;\n this.gridStyle.width = 5/5 * window.innerWidth * 180/512 + \"px\";\n this.gridStyle.left = 5/5 * window.innerWidth * 81/512 + \"px\";\n this.gridStyle.top = 5/5 * window.innerWidth * 1/512 + \"px\";\n if (aspectRatio < 0.84) { \n this.gridStyle.width = 7/5 * window.innerWidth * 180/512 + \"px\";\n this.gridStyle.left = 7/5 * window.innerWidth * 81/512 + \"px\";\n this.gridStyle.top = 7/5 * window.innerWidth * 1/512 + \"px\";\n // this.gridStyle.height = 6/5 * window.innerWidth * 81/512 + \"px\";\n }\n }\n\n getButtonStyles() {\n var aspectRatio = window.innerWidth / window.innerHeight;\n this.buttonStyle.width = 5/5 * window.innerWidth * 20/512 + \"px\";\n this.buttonStyle.height = 5/5 * window.innerWidth * 20/512 + \"px\";\n if (aspectRatio < 0.84) {\n this.buttonStyle.width = 7/5 * window.innerWidth * 20/512 + \"px\";\n this.buttonStyle.height = 7/5 * window.innerWidth * 20/512 + \"px\";\n }\n }\n\n getButtonImage(row: number, col: number) {\n let buttonStyleImage = this.buttonStyle;\n if (this.grid[row][col] === ButtonType.AvailableChair) {\n if (row > 0 && this.grid[row - 1][col] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairAvailable_Up.PNG)`;\n } else if (row < this.numRows - 1 && this.grid[row + 1][col] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairAvailable_Down.PNG)`;\n } else if (col > 0 && this.grid[row][col - 1] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairAvailable_Left.PNG)`;\n } else if (col < this.numCols - 1 && this.grid[row][col + 1] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairAvailable_Right.PNG)`;\n } else { \n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairAvailable_Left.PNG)`;\n }\n } else if (this.grid[row][col] === ButtonType.ReservedChair || this.grid[row][col] === ButtonType.PendingChair) {\n if (row > 0 && this.grid[row - 1][col] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairReserved_Up.PNG)`;\n } else if (row < this.numRows - 1 && this.grid[row + 1][col] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairReserved_Down.PNG)`;\n } else if (col > 0 && this.grid[row][col - 1] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairReserved_Left.PNG)`;\n } else if (col < this.numCols - 1 && this.grid[row][col + 1] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairReserved_Right.PNG)`;\n } else { \n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairReserved_Left.PNG)`;\n }\n } else if (this.grid[row][col] === ButtonType.SelectedChair) {\n if (row > 0 && this.grid[row - 1][col] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairSelected_Up.PNG)`;\n } else if (row < this.numRows - 1 && this.grid[row + 1][col] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairSelected_Down.PNG)`;\n } else if (col > 0 && this.grid[row][col - 1] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairSelected_Left.PNG)`;\n } else if (col < this.numCols - 1 && this.grid[row][col + 1] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairSelected_Right.PNG)`;\n } else { \n buttonStyleImage.backgroundImage = `url(assets/reservations/ChairSelected_Left.PNG)`;\n }\n } else if (this.grid[row][col] === ButtonType.Table) {\n buttonStyleImage.backgroundImage = `url(assets/reservations/Table.PNG)`;\n } else if (this.grid[row][col] === ButtonType.Empty || this.grid[row][col] === ButtonType.Disabled) {\n buttonStyleImage.backgroundImage = \"none\";\n }\n \n return buttonStyleImage;\n }\n\n getSelectedSeats(): any[] {\n let selectedSeats = [];\n for (let i = 0; i < this.numRows; i++) {\n for (let j = 0; j < this.numCols; j++) {\n if (this.grid[i][j] === ButtonType.SelectedChair) {\n for (let k = 0; k < this.squares.length; k++) {\n if (this.squares[k].row === i && this.squares[k].column === j) {\n selectedSeats.push({\n id: this.squares[k].id,\n row: i,\n column: j,\n type: 'P',\n reserved: true\n });\n }\n }\n }\n }\n }\n return selectedSeats;\n }\n\n @HostListener('window:resize', ['$event'])\n onResize(event) {\n this.initializeGrid();\n }\n\n ngOnInit(): void {\n this.initializeGrid();\n }\n\n}\n","import { Component, OnInit, HostListener, ChangeDetectorRef, NgZone, ViewChild, ElementRef } from '@angular/core';\nimport { PageStateService, PageState } from '../page-state.service'\nimport { MenuService } from '../menu.service';\n\n@Component({\n selector: 'app-menu-cards',\n templateUrl: './menu-cards.component.html',\n styleUrls: ['./menu-cards.component.css'],\n})\nexport class MenuCardsComponent implements OnInit {\n\n public PageState = PageState;\n\n menus: string[];\n menuImages: any[] = [];\n\n leftStaticStyle: any;\n leftTransitStyle: any;\n rightStaticStyle: any;\n rightTransitStyle: any;\n pageClosedStyleLeft: any;\n pageClosedStyleRight: any;\n\n @ViewChild('leftTransit') leftTransit: ElementRef;\n @ViewChild('rightTransit') rightTransit: ElementRef;\n\n currentLeftCardIndex: number;\n currentRightCardIndex: number;\n\n isLeftCardMoving: boolean;\n isRightCardMoving: boolean;\n isRightCardMovingRight: boolean;\n topCounter: number;\n \n pageOpened: boolean = false;\n\n aspectRatio: number;\n previousTimestamp: number;\n\n constructor(private cdr: ChangeDetectorRef, private ngZone: NgZone, private state: PageStateService, private menuService: MenuService) { }\n\n setCardSizes() {\n this.aspectRatio = window.innerWidth / window.innerHeight;\n var narrow = this.aspectRatio < 512/320;\n let leftCutoff = this.state.getLeftCutoff();\n this.leftStaticStyle.backgroundImage = `url(${this.menuImages[this.currentLeftCardIndex].src})`;\n this.leftTransitStyle.backgroundImage = `url(${this.menuImages[this.currentLeftCardIndex].src})`;\n this.rightStaticStyle.backgroundImage = `url(${this.menuImages[this.currentRightCardIndex].src})`;\n this.rightTransitStyle.backgroundImage = `url(${this.menuImages[this.currentRightCardIndex].src})`;\n this.pageClosedStyleLeft.backgroundImage = `url(${this.menuImages[this.currentLeftCardIndex].src})`;\n this.pageClosedStyleRight.backgroundImage = `url(${this.menuImages[this.currentRightCardIndex].src})`;\n this.leftStaticStyle.left = window.innerWidth * 69/512 + \"px\";\n this.leftTransitStyle.left = window.innerWidth * 74/512 + \"px\";\n this.rightStaticStyle.left = window.innerWidth * 281/512 + \"px\";\n this.rightTransitStyle.left = window.innerWidth * 286/512 + \"px\";\n \n // if (aspectRatio < 0.65) {\n // this.leftStaticStyle.top = window.innerWidth * 150/306 - this.state.getTopCutoff() + \"px\";\n // this.leftTransitStyle.top = window.innerWidth * 145/306 - this.state.getTopCutoff() + \"px\";\n // this.rightStaticStyle.top = window.innerWidth * 150/306 - this.state.getTopCutoff() + \"px\";\n // this.rightTransitStyle.top = window.innerWidth * 145/306 - this.state.getTopCutoff() + \"px\";\n // this.leftStaticStyle.height = window.innerWidth * 240/512 + \"px\";\n // this.leftStaticStyle.width = window.innerWidth * 162/512 + \"px\";\n // this.leftTransitStyle.height = window.innerWidth * 240/512 + \"px\";\n // this.leftTransitStyle.width = window.innerWidth * 162/512 + \"px\";\n // this.rightStaticStyle.height = window.innerWidth * 240/512 + \"px\";\n // this.rightStaticStyle.width = window.innerWidth * 162/512 + \"px\";\n // this.rightTransitStyle.height = window.innerWidth * 240/512 + \"px\";\n // this.rightTransitStyle.width = window.innerWidth * 162/512 + \"px\";\n // this.pageClosedStyleLeft.width = window.innerWidth * 15/306 + \"px\";\n // this.pageClosedStyleLeft.height = window.innerWidth * 20/306 + \"px\";\n // this.pageClosedStyleLeft.left = window.innerWidth * 62/306 + \"px\";\n // this.pageClosedStyleLeft.top = window.innerWidth * 218/306 - this.state.getTopCutoff() + \"px\";\n // }\n if (this.aspectRatio < 0.95) {\n this.leftStaticStyle.top = window.innerWidth * 122/306 - this.state.getTopCutoff() + \"px\";\n this.leftTransitStyle.top = window.innerWidth * 118/306 - this.state.getTopCutoff() + \"px\";\n this.rightStaticStyle.top = window.innerWidth * 114/306 - this.state.getTopCutoff() + \"px\";\n this.rightTransitStyle.top = window.innerWidth * 110/306 - this.state.getTopCutoff() + \"px\";\n this.leftStaticStyle.height = window.innerWidth * 480/512 + \"px\";\n this.leftStaticStyle.width = window.innerWidth * 324/512 + \"px\";\n this.leftTransitStyle.height = window.innerWidth * 480/512 + \"px\";\n this.leftTransitStyle.width = window.innerWidth * 324/512 + \"px\";\n this.rightStaticStyle.height = window.innerWidth * 480/512 + \"px\";\n this.rightStaticStyle.width = window.innerWidth * 324/512 + \"px\";\n this.rightTransitStyle.height = window.innerWidth * 480/512 + \"px\";\n this.rightTransitStyle.width = window.innerWidth * 324/512 + \"px\";\n this.pageClosedStyleLeft.width = window.innerWidth * 15/306 + \"px\";\n this.pageClosedStyleLeft.height = window.innerWidth * 20/306 + \"px\";\n this.pageClosedStyleLeft.left = window.innerWidth * 62/306 + \"px\";\n this.pageClosedStyleLeft.top = window.innerWidth * 218/306 - this.state.getTopCutoff() + \"px\";\n this.rightStaticStyle.left = window.innerWidth * 79/512 + \"px\";\n this.rightTransitStyle.left = window.innerWidth * 84/512 + \"px\";\n } else if (narrow) {\n this.leftStaticStyle.top = window.innerHeight * 30 / 320 + \"px\";\n this.leftTransitStyle.top = window.innerHeight * 25/320 + \"px\";\n this.rightStaticStyle.top = window.innerHeight * 30/320 + \"px\";\n this.rightTransitStyle.top = window.innerHeight * 25/320 + \"px\";\n this.leftStaticStyle.height = window.innerWidth * 240/512 + \"px\";\n this.leftStaticStyle.width = window.innerWidth * 162/512 + \"px\";\n this.leftTransitStyle.height = window.innerWidth * 240/512 + \"px\";\n this.leftTransitStyle.width = window.innerWidth * 162/512 + \"px\";\n this.rightStaticStyle.height = window.innerWidth * 240/512 + \"px\";\n this.rightStaticStyle.width = window.innerWidth * 162/512 + \"px\";\n this.rightTransitStyle.height = window.innerWidth * 240/512 + \"px\";\n this.rightTransitStyle.width = window.innerWidth * 162/512 + \"px\";\n this.pageClosedStyleLeft.width = window.innerHeight * 15/320 + \"px\";\n this.pageClosedStyleLeft.height = window.innerHeight * 20/320 + \"px\";\n this.pageClosedStyleLeft.left = window.innerHeight * 178/320 - leftCutoff + \"px\";\n this.pageClosedStyleLeft.top = window.innerHeight * 114/320 + \"px\";\n } else {\n this.leftStaticStyle.top = window.innerWidth * 30/512 + \"px\";\n this.leftTransitStyle.top = window.innerWidth * 25/512 + \"px\";\n this.rightStaticStyle.top = window.innerWidth * 30/512 + \"px\";\n this.rightTransitStyle.top = window.innerWidth * 25/512 + \"px\";\n this.leftStaticStyle.height = window.innerHeight * 240 / 320 + \"px\";\n this.leftStaticStyle.width = window.innerHeight * 162 / 320 + \"px\";\n this.leftTransitStyle.height = window.innerHeight * 240 / 320 + \"px\";\n this.leftTransitStyle.width = window.innerHeight * 162 / 320 + \"px\";\n this.rightStaticStyle.height = window.innerHeight * 240 / 320 + \"px\";\n this.rightStaticStyle.width = window.innerHeight * 162 / 320 + \"px\";\n this.rightTransitStyle.height = window.innerHeight * 240 / 320 + \"px\";\n this.rightTransitStyle.width = window.innerHeight * 162 / 320 + \"px\";\n this.pageClosedStyleLeft.width = window.innerWidth * 15/512 + \"px\";\n this.pageClosedStyleLeft.height = window.innerWidth * 20/512 + \"px\";\n this.pageClosedStyleLeft.left = window.innerWidth * 178/512 + \"px\";\n this.pageClosedStyleLeft.top = window.innerWidth * 114/512 + \"px\";\n }\n this.pageClosedStyleRight.width = this.pageClosedStyleLeft.width;\n this.pageClosedStyleRight.height = this.pageClosedStyleLeft.height;\n this.pageClosedStyleRight.left = this.pageClosedStyleLeft.left;\n this.pageClosedStyleRight.top = this.pageClosedStyleLeft.top;\n this.cdr.detectChanges();\n }\n\n moveLeftCard() {\n if (parseInt(this.leftTransitStyle.left, 10) < parseInt(this.rightStaticStyle.left, 10)) {\n this.leftTransitStyle.left = parseInt(this.leftTransitStyle.left, 10) + window.innerWidth * 0.01 + \"px\";\n } else {\n this.isLeftCardMoving = false;\n this.rightTransitStyle.backgroundImage = `url(${this.menuImages[this.currentRightCardIndex].src})`;\n this.leftTransitStyle.visibility = \"hidden\";\n this.setCardSizes();\n this.leftTransitStyle.visibility = \"visible\";\n }\n\n if (this.isLeftCardMoving) {\n setTimeout(() => {\n this.ngZone.runOutsideAngular(() => requestAnimationFrame(() => this.moveLeftCard()));\n }, 5);\n }\n this.cdr.detectChanges();\n }\n\n moveRightCard(currentTimestamp: number) {\n const elapsed = currentTimestamp - this.previousTimestamp;\n const sf = elapsed / 4;\n this.previousTimestamp = currentTimestamp;\n if (this.aspectRatio < 0.95) {\n if (this.isRightCardMovingRight && parseInt(this.rightTransitStyle.left, 10) < parseInt(this.rightStaticStyle.left, 10) + parseInt(this.rightStaticStyle.width,10) + window.innerWidth * 10/306) {\n this.rightTransitStyle.left = parseInt(this.rightTransitStyle.left, 10) + window.innerWidth * 0.01 * sf + \"px\";\n } else if (parseInt(this.rightTransitStyle.left, 10) > parseInt(this.rightStaticStyle.left, 10)) {\n this.isRightCardMovingRight = false;\n this.rightTransitStyle.zIndex = 800;\n this.rightTransitStyle.left = parseInt(this.rightTransitStyle.left, 10) - window.innerWidth * 0.01 * sf + \"px\";\n } else {\n this.isRightCardMoving = false;\n this.leftTransitStyle.backgroundImage = `url(${this.menuImages[this.currentRightCardIndex].src})`;\n this.rightTransitStyle.visibility = \"hidden\";\n this.setCardSizes();\n this.rightTransitStyle.zIndex = 1000;\n this.rightTransitStyle.visibility = \"visible\";\n }\n this.topCounter++;\n if (parseInt(this.leftStaticStyle.top,10) - parseInt(this.rightTransitStyle.top,10) > 0 && this.topCounter % 5 === 0) {\n this.topCounter = 0;\n this.rightTransitStyle.top = parseInt(this.rightTransitStyle.top, 10) + window.innerWidth * 0.003 * sf + \"px\";\n }\n } else {\n if (parseInt(this.rightTransitStyle.left, 10) > parseInt(this.leftStaticStyle.left, 10)) {\n this.rightTransitStyle.left = parseInt(this.rightTransitStyle.left, 10) - window.innerWidth * 0.01 * sf + \"px\";\n } else {\n this.isRightCardMoving = false;\n this.leftTransitStyle.backgroundImage = `url(${this.menuImages[this.currentRightCardIndex].src})`;\n this.rightTransitStyle.visibility = \"hidden\";\n this.setCardSizes();\n this.rightTransitStyle.visibility = \"visible\";\n }\n }\n\n if (this.isRightCardMoving) {\n setTimeout(() => {\n this.ngZone.runOutsideAngular(() => requestAnimationFrame(() => this.moveRightCard(performance.now())));\n }, 5);\n }\n this.cdr.detectChanges();\n }\n\n leftTransitClick() {\n if (this.currentLeftCardIndex - 1 >= 0) {\n this.currentLeftCardIndex--;\n } else {\n this.currentLeftCardIndex = this.menuImages.length - 1;\n }\n if (this.currentRightCardIndex - 1 >= 0) {\n this.currentRightCardIndex--;\n } else {\n this.currentRightCardIndex = this.menuImages.length - 1;\n }\n this.leftStaticStyle.backgroundImage = `url(${this.menuImages[this.currentLeftCardIndex].src})`;\n this.rightTransitStyle.zIndex = 900;\n this.leftTransitStyle.zIndex = 1000;\n this.isLeftCardMoving = true;\n this.moveLeftCard();\n }\n\n rightTransitClick() {\n if (this.currentRightCardIndex + 1 < this.menuImages.length) {\n this.currentRightCardIndex++;\n } else {\n this.currentRightCardIndex = 0;\n }\n if (this.currentLeftCardIndex + 1 < this.menuImages.length) {\n this.currentLeftCardIndex++;\n } else {\n this.currentLeftCardIndex = 0;\n }\n this.rightStaticStyle.backgroundImage = `url(${this.menuImages[this.currentRightCardIndex].src})`;\n this.leftTransitStyle.zIndex = 900;\n this.rightTransitStyle.zIndex = 1000;\n this.isRightCardMoving = true;\n this.isRightCardMovingRight = true;\n this.topCounter = 0;\n this.previousTimestamp = performance.now();\n this.moveRightCard(this.previousTimestamp);\n }\n\n checkCollision(event): boolean {\n if (this.leftTransit.nativeElement.contains(event.target) || this.rightTransit.nativeElement.contains(event.target)){\n return true;\n } else {\n return false;\n }\n }\n\n openPage() {\n if (parseInt(this.pageClosedStyleLeft.height, 10)/parseInt(this.leftTransitStyle.height) < 0.99) {\n this.pageClosedStyleLeft.width = parseInt(this.pageClosedStyleLeft.width, 10) + 1/3*(parseInt(this.leftTransitStyle.width) - parseInt(this.pageClosedStyleLeft.width, 10)) + \"px\";\n this.pageClosedStyleLeft.height = parseInt(this.pageClosedStyleLeft.height, 10) + 1/3*(parseInt(this.leftTransitStyle.height) - parseInt(this.pageClosedStyleLeft.height, 10)) + \"px\";\n this.pageClosedStyleLeft.left = parseInt(this.pageClosedStyleLeft.left, 10) + 1/3*(parseInt(this.leftTransitStyle.left) - parseInt(this.pageClosedStyleLeft.left, 10)) + \"px\";\n this.pageClosedStyleLeft.top = parseInt(this.pageClosedStyleLeft.top, 10) + 1/3*(parseInt(this.leftTransitStyle.top) - parseInt(this.pageClosedStyleLeft.top, 10)) + \"px\";\n this.pageClosedStyleRight.width = this.pageClosedStyleLeft.width;\n this.pageClosedStyleRight.height = this.pageClosedStyleLeft.height;\n this.pageClosedStyleRight.top = parseInt(this.pageClosedStyleRight.top, 10) + 1/3*(parseInt(this.rightTransitStyle.top) - parseInt(this.pageClosedStyleRight.top, 10)) + \"px\";\n this.pageClosedStyleRight.left = parseInt(this.pageClosedStyleRight.left, 10) + 1/3*(parseInt(this.rightTransitStyle.left) - parseInt(this.pageClosedStyleRight.left, 10)) + \"px\";\n \n setTimeout(() => {\n this.ngZone.runOutsideAngular(() => requestAnimationFrame(() => this.openPage()));\n }, 50);\n } else {\n this.pageOpened = true;\n }\n this.cdr.detectChanges();\n }\n\n closePage() {\n if (parseInt(this.leftTransitStyle.height, 10)/parseInt(this.pageClosedStyleLeft.height) > 1.01) {\n this.leftTransitStyle.width = parseInt(this.leftTransitStyle.width, 10) + 1/3*(parseInt(this.pageClosedStyleLeft.width) - parseInt(this.leftTransitStyle.width, 10)) + \"px\";\n this.leftTransitStyle.height = parseInt(this.leftTransitStyle.height, 10) + 1/3*(parseInt(this.pageClosedStyleLeft.height) - parseInt(this.leftTransitStyle.height, 10)) + \"px\";\n this.leftTransitStyle.left = parseInt(this.leftTransitStyle.left, 10) + 1/3*(parseInt(this.pageClosedStyleLeft.left) - parseInt(this.leftTransitStyle.left, 10)) + \"px\";\n this.leftTransitStyle.top = parseInt(this.leftTransitStyle.top, 10) + 1/3*(parseInt(this.pageClosedStyleLeft.top) - parseInt(this.leftTransitStyle.top, 10)) + \"px\";\n this.leftStaticStyle.width = this.leftTransitStyle.width;\n this.leftStaticStyle.height = this.leftTransitStyle.height;\n this.leftStaticStyle.left = this.leftTransitStyle.left\n this.leftStaticStyle.top = this.leftTransitStyle.top;\n this.rightTransitStyle.width = this.leftTransitStyle.width;\n this.rightTransitStyle.height = this.leftTransitStyle.height;\n this.rightTransitStyle.left = parseInt(this.rightTransitStyle.left, 10) + 1/3*(parseInt(this.pageClosedStyleLeft.left) - parseInt(this.rightTransitStyle.left, 10)) + \"px\";\n this.rightTransitStyle.top = this.leftTransitStyle.top;\n this.rightStaticStyle.width = this.leftTransitStyle.width;\n this.rightStaticStyle.height = this.leftTransitStyle.height;\n this.rightStaticStyle.left = this.rightTransitStyle.left\n this.rightStaticStyle.top = this.leftTransitStyle.top;\n \n setTimeout(() => {\n this.ngZone.runOutsideAngular(() => requestAnimationFrame(() => this.closePage()));\n }, 50);\n } else {\n this.pageOpened = false;\n this.state.setCurrentState(PageState.HOME);\n }\n this.cdr.detectChanges(); \n }\n\n @HostListener('document:click', ['$event'])\n onClick(event: MouseEvent) {\n if (this.state.currentState === PageState.PAST && !this.checkCollision(event) && this.pageOpened) {\n this.setCardSizes();\n this.closePage();\n // for (let i = 0; i < this.cardChildren.length; i++) {\n // this.cardChildren[i].style.transition = \"all 1s ease\";\n // }\n this.cdr.detectChanges();\n }\n }\n\n @HostListener('window:resize', ['$event'])\n onResize(event) {\n this.setCardSizes();\n }\n\n ngOnInit(): void {\n this.menus = this.menuService.getPastMenus();\n \n this.leftStaticStyle = {};\n this.leftTransitStyle = {};\n this.rightStaticStyle = {};\n this.rightTransitStyle = {};\n this.pageClosedStyleLeft = {};\n this.pageClosedStyleRight = {};\n\n this.currentLeftCardIndex = 0;\n this.currentRightCardIndex = 1;\n\n this.isLeftCardMoving = false;\n this.isRightCardMoving = false;\n\n for (let i = 0; i < this.menus.length; i++) {\n this.menuImages[i] = new Image();\n this.menuImages[i].src = this.menus[i];\n }\n\n this.setCardSizes();\n\n this.openPage();\n }\n\n}\n","\n \n \n
\n\n \n
\n \n
","import { Injectable, HostListener } from '@angular/core';\nimport { Subject } from 'rxjs';\n\nexport enum PageState {\n HOME,\n FUTURE,\n PAST,\n ABOUT\n}\n\n@Injectable({\n providedIn: 'root'\n})\nexport class PageStateService {\n\n public currentState: PageState = PageState.HOME;\n private currentStateSubject = new Subject\n
\n \n
\n \n
\n \n
\n \n
\n","import { Component, OnInit, HostListener, ChangeDetectorRef, ViewChild, ElementRef, NgZone } from '@angular/core';\nimport { PageStateService, PageState } from '../page-state.service';\nimport { Router } from '@angular/router';\nimport { FutureEventsService } from '../future-events.service';\n\nconst monthNames = [\n \"January\", \"February\", \"March\", \"April\",\n \"May\", \"June\", \"July\", \"August\",\n \"September\", \"October\", \"November\", \"December\"\n];\n\n@Component({\n selector: 'app-future-dates-calendar',\n templateUrl: './future-dates-calendar.component.html',\n styleUrls: ['./future-dates-calendar.component.css']\n})\nexport class FutureDatesCalendarComponent implements OnInit {\n\n public PageState = PageState;\n\n @ViewChild('futureDates') calendar: ElementRef;\n @ViewChild('previousMonthButton') previousButton: ElementRef;\n @ViewChild('nextMonthButton') nextButton: ElementRef;\n\n calendarStyle: any;\n calendarOpenedStyle: any;\n reservationButtonStyle: any;\n buttonStyle: any;\n previousButtonStyle: any;\n nextButtonStyle: any;\n events: any[];\n currentMonthEvents: any[];\n\n currentDate: Date;\n currentMonth: number;\n currentMonthName: string;\n selectedMonth: number;\n selectedMonthName: string;\n selectedYear: number;\n currentYear: number;\n\n pageOpened: boolean;\n textEnabled: boolean;\n\n constructor(private cdr: ChangeDetectorRef, private state: PageStateService, private ngZone: NgZone, private eventsService: FutureEventsService, private router: Router) { }\n\n setCalendarSize() {\n let aspectRatio = window.innerWidth/window.innerHeight;\n this.calendarStyle.width = window.innerWidth * 28/512 + \"px\";\n this.calendarStyle.height = window.innerWidth * 27/512 + \"px\";\n this.calendarStyle.left = window.innerWidth * 78/512 + \"px\";\n this.calendarStyle.top = window.innerWidth * 64/512 + \"px\";\n this.calendarStyle.paddingTop = window.innerWidth * 12/512 + \"px\";\n this.calendarStyle.paddingLeft = window.innerWidth * 2.4/512 + \"px\";\n this.calendarStyle.fontSize = window.innerWidth * 1.44/512 + \"px\";\n this.calendarStyle.textAlign = \"left\";\n this.calendarOpenedStyle.width = window.innerWidth * 151/512 + \"px\";\n this.calendarOpenedStyle.height = window.innerWidth * 131/512 + \"px\";\n this.calendarOpenedStyle.left = window.innerWidth * 90/512 + \"px\";\n this.calendarOpenedStyle.top = window.innerWidth * 32/512 + \"px\";\n this.calendarOpenedStyle.paddingRight = \"0px\";\n this.calendarOpenedStyle.textAlign = \"left\";\n if (aspectRatio < 0.65) {\n console.log(\"0.65\")\n this.calendarStyle.top = window.innerWidth * 363/306*(1 + 0.095*(306*window.innerHeight/window.innerWidth - 470)/192)*(1 + 0.2*(306*window.innerHeight/window.innerWidth - 322)/340) - this.state.getCounterTopCutoff() + \"px\";\n this.calendarStyle.left = window.innerWidth/2 - (window.innerWidth * 216/512*(1 + 0.5*(306*window.innerHeight/window.innerWidth - 322)/340))/2 + window.innerWidth*10/306 + \"px\";\n this.calendarStyle.height = window.innerWidth * 27/306*(1 + 0.5*(306*window.innerHeight/window.innerWidth - 322)/340) + \"px\";\n this.calendarStyle.width = window.innerWidth * 39/306*(1 + 0.5*(306*window.innerHeight/window.innerWidth - 322)/340) + \"px\";\n this.calendarStyle.paddingTop = window.innerWidth * 16.8/306*(1 + 0.5*(306*window.innerHeight/window.innerWidth - 322)/340) + \"px\";\n this.calendarStyle.paddingLeft = window.innerWidth * 3.36/306*(1 + 0.5*(306*window.innerHeight/window.innerWidth - 322)/340) + \"px\";\n this.calendarStyle.fontSize = window.innerWidth * 1.44/306 + \"px\";\n this.calendarOpenedStyle.width = window.innerWidth * 151/306 + \"px\";\n this.calendarOpenedStyle.height = window.innerWidth * 131/306 + \"px\";\n this.calendarOpenedStyle.left = window.innerHeight * 28/320 + \"px\";\n this.calendarOpenedStyle.top = window.innerWidth * 135/306 - this.state.getTopCutoff() + \"px\";\n } else if (aspectRatio < 0.95) {\n console.log(\"0.95\")\n this.calendarStyle.width = window.innerWidth * 30/306 + \"px\";\n this.calendarStyle.height = window.innerWidth * 27/306 + \"px\";\n this.calendarStyle.left = window.innerWidth/2 - window.innerHeight * 146/512/2 + \"px\";\n this.calendarStyle.top = window.innerWidth * 357/306*(1 + 0.2*(306*window.innerHeight/window.innerWidth - 322)/340) - this.state.getCounterTopCutoff() + \"px\";\n this.calendarStyle.paddingTop = window.innerWidth * 12/306 + \"px\";\n this.calendarStyle.fontSize = window.innerWidth * 1.44/306 + \"px\";\n this.calendarOpenedStyle.width = window.innerWidth * 151/306 + \"px\";\n this.calendarOpenedStyle.height = window.innerWidth * 131/306 + \"px\";\n this.calendarOpenedStyle.left = window.innerHeight * 28/320 + \"px\";\n this.calendarOpenedStyle.top = window.innerWidth * 135/306 - this.state.getTopCutoff() + \"px\";\n } else if (aspectRatio < 1.12) {\n this.calendarStyle.width = window.innerHeight * 39/320 + \"px\";\n this.calendarStyle.height = window.innerHeight * 27/320 + \"px\";\n this.calendarStyle.left = window.innerWidth/2 - window.innerHeight * 216/512/2 + \"px\";\n this.calendarStyle.top = window.innerHeight * 230/320 + \"px\";\n this.calendarStyle.paddingTop = window.innerHeight * 12/320 + \"px\";\n this.calendarStyle.fontSize = window.innerHeight * 1.44/320 + \"px\";\n this.calendarOpenedStyle.width = window.innerHeight * 151/320 + \"px\";\n this.calendarOpenedStyle.height = window.innerHeight * 131/320 + \"px\";\n this.calendarOpenedStyle.left = window.innerHeight * 28/320 + \"px\";\n this.calendarOpenedStyle.top = window.innerHeight * 32/320 + \"px\";\n } else if (aspectRatio < 512/320) {\n this.calendarStyle.width = window.innerHeight * 28/320 + \"px\";\n this.calendarStyle.height = window.innerHeight * 27/320 + \"px\";\n this.calendarStyle.left = window.innerHeight * 78/320 - this.state.getLeftCutoff() + \"px\";\n this.calendarStyle.top = window.innerHeight * 64/320 + \"px\";\n this.calendarStyle.paddingTop = window.innerHeight * 12/320 + \"px\";\n this.calendarStyle.fontSize = window.innerHeight * 1.44/320 + \"px\";\n this.calendarOpenedStyle.width = window.innerHeight * 151/320 + \"px\";\n this.calendarOpenedStyle.height = window.innerHeight * 131/320 + \"px\";\n this.calendarOpenedStyle.left = window.innerHeight * 90/320 - this.state.getLeftCutoff() + \"px\";\n this.calendarOpenedStyle.top = window.innerHeight * 32/320 + \"px\";\n }\n\n let calendarHeight = parseFloat(this.calendarOpenedStyle.height);\n this.calendarOpenedStyle.paddingTop = calendarHeight * 30/131 + \"px\";\n this.calendarOpenedStyle.paddingLeft = calendarHeight * 10/131 + \"px\";\n this.calendarOpenedStyle.fontSize = calendarHeight * 2.7/131 + \"px\";\n this.calendarOpenedStyle.lineHeight = calendarHeight * 7.2/131 + \"px\";\n this.cdr.detectChanges();\n }\n\n setButtonStyle() {\n let aspectRatio = window.innerWidth/window.innerHeight;\n this.buttonStyle.fontSize = window.innerWidth * 3/512 + \"px\";\n // this.buttonStyle.height = window.innerWidth * 7/512 + \"px\";\n this.buttonStyle.padding = window.innerWidth * 1.5/512 + \"px\";\n this.buttonStyle.borderWidth = window.innerWidth * 1/512 + \"px\";\n if (aspectRatio < 0.95) {\n this.buttonStyle.fontSize = window.innerWidth * 3/306 + \"px\";\n // this.buttonStyle.height = window.innerWidth * 7/306 + \"px\";\n this.buttonStyle.padding = window.innerWidth * 1.5/306 + \"px\";\n this.buttonStyle.borderWidth = window.innerWidth * 1/306 + \"px\";\n } else if (aspectRatio < 512/320) {\n this.buttonStyle.fontSize = window.innerHeight * 3/320 + \"px\";\n // this.buttonStyle.height = window.innerHeight * 7/320 + \"px\";\n this.buttonStyle.padding = window.innerHeight * 1.5/320 + \"px\";\n this.buttonStyle.borderWidth = window.innerHeight * 1/320 + \"px\";\n }\n\n this.previousButtonStyle = { ...this.buttonStyle };\n this.nextButtonStyle = { ...this.buttonStyle };\n\n this.previousButtonStyle.left = parseFloat(this.calendarOpenedStyle.left) + 1/3*parseFloat(this.calendarOpenedStyle.paddingLeft) + \"px\";\n this.nextButtonStyle.left = parseFloat(this.calendarOpenedStyle.left) + parseFloat(this.calendarOpenedStyle.width) - parseFloat(this.calendarOpenedStyle.paddingLeft) + \"px\";\n this.previousButtonStyle.top = parseFloat(this.calendarOpenedStyle.top) + parseFloat(this.calendarOpenedStyle.height) + 5/8*parseFloat(this.calendarOpenedStyle.paddingTop) + \"px\";\n this.nextButtonStyle.top = parseFloat(this.calendarOpenedStyle.top) + parseFloat(this.calendarOpenedStyle.height) + 5/8*parseFloat(this.calendarOpenedStyle.paddingTop) + \"px\";\n }\n\n openPage() {\n if (parseInt(this.calendarStyle.height, 10)/parseInt(this.calendarOpenedStyle.height) < 0.95) {\n this.calendarStyle.width = parseInt(this.calendarStyle.width, 10) + 1/3*(parseInt(this.calendarOpenedStyle.width) - parseInt(this.calendarStyle.width, 10)) + \"px\";\n this.calendarStyle.height = parseInt(this.calendarStyle.height, 10) + 1/3*(parseInt(this.calendarOpenedStyle.height) - parseInt(this.calendarStyle.height, 10)) + \"px\";\n this.calendarStyle.left = parseInt(this.calendarStyle.left, 10) + 1/3*(parseInt(this.calendarOpenedStyle.left) - parseInt(this.calendarStyle.left, 10)) + \"px\";\n this.calendarStyle.top = parseInt(this.calendarStyle.top, 10) + 1/3*(parseInt(this.calendarOpenedStyle.top) - parseInt(this.calendarStyle.top, 10)) + \"px\";\n this.calendarStyle.paddingTop = parseInt(this.calendarStyle.paddingTop, 10) + 1/3*(parseInt(this.calendarOpenedStyle.paddingTop) - parseInt(this.calendarStyle.paddingTop, 10)) + \"px\";\n this.calendarStyle.fontSize = parseInt(this.calendarStyle.fontSize, 10) + 1/3*(parseInt(this.calendarOpenedStyle.fontSize) - parseInt(this.calendarStyle.fontSize, 10)) + \"px\";\n setTimeout(() => {\n this.ngZone.runOutsideAngular(() => requestAnimationFrame(() => this.openPage()));\n }, 50);\n } else {\n this.pageOpened = true;\n this.textEnabled = true;\n this.setCalendarSize();\n this.setButtonStyle();\n }\n this.cdr.detectChanges();\n }\n\n closePage() {\n this.textEnabled = false;\n if (parseInt(this.calendarOpenedStyle.height, 10)/parseInt(this.calendarStyle.height, 10) > 1.05) {\n this.calendarOpenedStyle.width = parseInt(this.calendarOpenedStyle.width, 10) + 1/3*(parseInt(this.calendarStyle.width) - parseInt(this.calendarOpenedStyle.width, 10)) + \"px\";\n this.calendarOpenedStyle.height = parseInt(this.calendarOpenedStyle.height, 10) + 1/3*(parseInt(this.calendarStyle.height) - parseInt(this.calendarOpenedStyle.height, 10)) + \"px\";\n this.calendarOpenedStyle.left = parseInt(this.calendarOpenedStyle.left, 10) + 1/3*(parseInt(this.calendarStyle.left) - parseInt(this.calendarOpenedStyle.left, 10)) + \"px\";\n this.calendarOpenedStyle.top = parseInt(this.calendarOpenedStyle.top, 10) + 1/3*(parseInt(this.calendarStyle.top) - parseInt(this.calendarOpenedStyle.top, 10)) + \"px\";\n this.calendarOpenedStyle.paddingTop = parseInt(this.calendarOpenedStyle.paddingTop, 10) + 1/3*(parseInt(this.calendarStyle.paddingTop) - parseInt(this.calendarOpenedStyle.paddingTop, 10)) + \"px\";\n this.calendarOpenedStyle.fontSize = parseInt(this.calendarOpenedStyle.fontSize, 10) + 1/3*(parseInt(this.calendarStyle.fontSize) - parseInt(this.calendarOpenedStyle.fontSize, 10)) + \"px\";\n \n setTimeout(() => {\n this.ngZone.runOutsideAngular(() => requestAnimationFrame(() => this.closePage()));\n }, 20);\n } else {\n this.pageOpened = false;\n this.state.setCurrentState(PageState.HOME);\n }\n this.cdr.detectChanges();\n }\n\n openReservation(dateId: number) {\n this.ngZone.run(() => {\n this.router.navigate(['/reservations', dateId]);\n });\n }\n\n getCurrentMonthDates() {\n this.currentMonthEvents = [];\n \n for (let i = 0; i < this.events.length; i++) {\n for (let j = 0; j < this.events[i].dates.length; j++) {\n if (this.events[i].dates[j].date.includes(monthNames[this.selectedMonth]) && this.events[i].dates[j].date.includes(this.selectedYear)) {\n this.currentMonthEvents.push(this.events[i]);\n break;\n }\n }\n }\n }\n\n nextMonth() {\n if (this.selectedMonth < 11) {\n this.selectedMonth++;\n } else {\n this.selectedMonth = 0;\n this.selectedYear++;\n }\n this.selectedMonthName = monthNames[this.selectedMonth];\n this.getCurrentMonthDates();\n }\n\n previousMonth() {\n if (this.selectedMonth > 0) {\n this.selectedMonth--;\n } else {\n this.selectedMonth = 11;\n this.selectedYear--;\n }\n this.selectedMonthName = monthNames[this.selectedMonth];\n this.getCurrentMonthDates();\n }\n\n @HostListener('document:click', ['$event'])\n onClick(event: MouseEvent) {\n if (this.state.currentState === PageState.FUTURE \n && !this.calendar.nativeElement.contains(event.target) \n && !this.previousButton.nativeElement.contains(event.target)\n && !this.nextButton.nativeElement.contains(event.target)\n && this.pageOpened) {\n this.closePage();\n this.cdr.detectChanges();\n }\n }\n\n @HostListener('window:resize', ['$event'])\n onResize(event) {\n this.setCalendarSize();\n this.setButtonStyle();\n }\n\n ngOnInit(): void {\n this.calendarStyle = {};\n this.calendarOpenedStyle = {};\n this.buttonStyle = {};\n this.previousButtonStyle = {};\n this.nextButtonStyle = {};\n this.events = [];\n this.calendarStyle.backgroundImage = `url(\"assets/Calendar.PNG\")`;\n this.calendarOpenedStyle.backgroundImage = `url(\"assets/Calendar.PNG\")`;\n\n this.currentDate = new Date();\n this.currentMonth = this.currentDate.getMonth();\n this.selectedMonth = this.currentMonth;\n this.selectedMonthName = monthNames[this.selectedMonth];\n this.currentMonthName = monthNames[this.currentDate.getMonth()];\n this.currentYear = this.currentDate.getFullYear();\n this.selectedYear = this.currentYear;\n\n // this.http.get('assets/futureDates.txt', { responseType: 'text' }).subscribe(data => {\n // this.futureDatesText = data;\n // });\n\n this.eventsService.getFutureEvents().subscribe((data: any[]) => {\n this.events = this.eventsService.sortFutureDates(data);\n this.getCurrentMonthDates();\n });\n\n this.pageOpened = false;\n this.textEnabled = false;\n\n this.setCalendarSize();\n this.setButtonStyle();\n setTimeout(() => {\n this.setCalendarSize();\n this.setButtonStyle();\n }, 500);\n this.openPage();\n }\n\n}\n","\r\n\r\n
\r\n\r\n","import { HttpClient } from '@angular/common/http';\nimport { Injectable } from '@angular/core';\nimport { UrlService } from './url.service';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class FutureEventsService {\n baseUrl: string;\n eventsEndpoint: string;\n datesEndpoint: string;\n\n constructor(private http: HttpClient, private urlService: UrlService) {\n this.baseUrl = this.urlService.getBaseUrl();\n this.eventsEndpoint = \"/CouchCafe/api/futureevents\";\n this.datesEndpoint = \"/CouchCafe/api/futuredates\";\n }\n\n public saveFutureEvent(futureEvent: any) {\n return this.http.post(this.baseUrl + this.eventsEndpoint, futureEvent, {});\n }\n\n public getFutureEvents() {\n return this.http.get(this.baseUrl + this.eventsEndpoint, {});\n }\n\n public getFutureDateById(dateId: number) {\n return this.http.get(this.baseUrl + this.datesEndpoint + \"/\" + dateId);\n }\n\n public formatDateWithoutTimeZone(originalDateString: string): string {\n // Extract the relevant part of the string (excluding the timezone)\n const formattedDateString = originalDateString.substring(0, 19);\n \n // Convert the string to a Date object\n const dateWithoutTimeZone = new Date(formattedDateString);\n \n // Format the date without considering the time zone\n const options: Intl.DateTimeFormatOptions = {\n year: 'numeric',\n month: 'long',\n day: 'numeric',\n };\n \n const formattedDate = new Intl.DateTimeFormat('en-US', options).format(dateWithoutTimeZone);\n \n // Format the time without considering the time zone\n const hours = dateWithoutTimeZone.getHours();\n const minutes = dateWithoutTimeZone.getMinutes();\n const amPm = hours >= 12 ? 'PM' : 'AM';\n const formattedHours = hours % 12 === 0 ? 12 : hours % 12;\n const formattedTime = `${formattedHours}:${minutes.toString().padStart(2, '0')} ${amPm}`;\n \n return `${formattedDate} @ ${formattedTime}`;\n }\n\n public sortFutureDates(data: any[]) {\n let events: any[] = [];\n const sortedEvents = data.sort((a,b) => {\n let aDate = new Date(a.dates[0].date);\n let bDate = new Date(b.dates[0].date);\n return aDate.getTime() - bDate.getTime();\n });\n \n for (let i = 0; i < sortedEvents.length; i++) {\n const sortedDates = sortedEvents[i].dates.sort((a, b) => {\n let aDate = new Date(a.date);\n let bDate = new Date(b.date);\n return aDate.getTime() - bDate.getTime();\n });\n let event = {\n name: sortedEvents[i].name,\n dates: []\n };\n for (let j = 0; j < data[i].dates.length; j++) {\n event.dates.push({\n dateId: sortedEvents[i].dates[j].id,\n date: this.formatDateWithoutTimeZone(sortedDates[j].date),\n soldOut: sortedEvents[i].dates[j].soldOut\n });\n }\n events.push(event);\n }\n return events;\n }\n}\n","import { Injectable } from '@angular/core';\nimport { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot, UrlTree, Router } from '@angular/router';\nimport { PasswordService } from './password.service';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class AuthGuard implements CanActivate {\n constructor(private router: Router, private passwordService: PasswordService) {}\n\n canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {\n if (this.passwordService.isAuthenticated) {\n return true;\n } else {\n this.router.navigate(['/login']);\n return false;\n }\n }\n \n}\n","import { Component, OnInit, HostListener, ChangeDetectorRef } from '@angular/core';\nimport { HighScoreService } from '../high-score.service';\nimport { PageStateService } from '../page-state.service';\n\n@Component({\n selector: 'app-high-scores',\n templateUrl: './high-scores.component.html',\n styleUrls: ['./high-scores.component.css']\n})\nexport class HighScoresComponent implements OnInit {\n\n highScoreText: string;\n highScores: any[];\n\n divTransform: string;\n divFontSize: string;\n divLineHeight: string;\n divLetterSpacing: string;\n divHeight: string;\n divWidth: string;\n divLeft: string;\n divTop: string;\n textShadow: number;\n\n headingStyle: any;\n\n constructor(private highScoreService: HighScoreService, private cdr: ChangeDetectorRef, private state: PageStateService) { }\n\n setHighScoreDivSize() {\n var aspectRatio = window.innerWidth / window.innerHeight;\n var narrow = aspectRatio < 512/320;\n this.textShadow = window.innerWidth * 0.6/512;\n this.divFontSize = 16 * window.innerWidth * 190/512/413 + \"px\";\n this.divLineHeight = 12 * window.innerWidth * 190/512/413 + \"px\";\n this.divHeight = window.innerWidth * 70/512 + \"px\";\n this.divWidth = window.innerWidth * 72/512 + \"px\";\n this.divLeft = window.innerWidth * 412/512 + \"px\";\n this.divTop = window.innerWidth * 73/512 + \"px\";\n this.divTransform = `perspective(15cm) rotateX(-18deg) rotateY(-45deg) scale(1)`;\n this.divLetterSpacing = 1 * window.innerHeight * 190/320/413 + \"px\";\n this.headingStyle.visibility = \"hidden\";\n if (narrow) {\n this.divLeft = window.innerHeight * 412/320 - this.state.getLeftCutoff() + \"px\";\n this.divTop = window.innerHeight * 73/320 + \"px\";\n this.divHeight = window.innerHeight * 70/320 + \"px\";\n this.divWidth = window.innerHeight * 72/320 + \"px\";\n this.divFontSize = 16 * window.innerHeight * 190/320/413 + \"px\";\n this.divLineHeight = 12 * window.innerHeight * 190/320/413 + \"px\";\n this.textShadow = window.innerHeight * 0.6/320;\n }\n if (aspectRatio < 1.44) {\n this.divHeight = window.innerHeight * 70/320 + \"px\";\n this.divTop = window.innerHeight * 244/320 + \"px\";\n this.divTransform = \"none\";\n this.divLetterSpacing = 5 * window.innerHeight * 190/320/413 + \"px\";\n this.headingStyle.visibility = \"visible\";\n this.headingStyle.height = window.innerHeight * 15/320 + \"px\";\n this.headingStyle.top = window.innerHeight * 222/320 + \"px\";\n this.headingStyle.width = parseInt(this.headingStyle.height,10) * 164/22 + \"px\";\n this.divWidth = this.headingStyle.width;\n this.divLeft = window.innerWidth * 320/512 + \"px\";\n // this.divLeft = window.innerWidth/2 - parseInt(this.divWidth,10)/2 + \"px\";\n this.headingStyle.left = this.divLeft;\n }\n if (aspectRatio < 1.12) {\n this.divLeft = 0.75*window.innerWidth - parseInt(this.divWidth,10)/2 + \"px\";\n this.headingStyle.left = this.divLeft;\n } \n if (aspectRatio < 0.95) {\n this.divTop = window.innerWidth * 376/306*(1 + 0.2*(306*window.innerHeight/window.innerWidth - 322)/340) - this.state.getCounterTopCutoff() + \"px\";\n this.divFontSize = 16 * window.innerWidth * 190/306/413 + \"px\";\n this.divLineHeight = 12 * window.innerWidth * 190/320/413 + \"px\";\n this.headingStyle.height = window.innerWidth * 15/306 + \"px\";\n this.headingStyle.top = window.innerWidth * 352/306*(1 + 0.2*(306*window.innerHeight/window.innerWidth - 322)/340) - this.state.getCounterTopCutoff() + \"px\";\n this.headingStyle.width = parseInt(this.headingStyle.height,10) * 164/22 + \"px\";\n this.divWidth = this.headingStyle.width;\n this.divLeft = 0.75*window.innerWidth - parseInt(this.divWidth,10)/2 + \"px\";\n this.headingStyle.left = this.divLeft;\n this.textShadow = window.innerWidth * 0.65/306;\n }\n if (aspectRatio < 0.65) {\n // this.divTop = window.innerWidth * 376/306*(1 + 0.225*(306*window.innerHeight/window.innerWidth - 322)/340) - this.state.getCounterTopCutoff() + \"px\";\n // this.headingStyle.height = window.innerWidth * 15/306*(1 + 0.5*(306*window.innerHeight/window.innerWidth - 322)/340) + \"px\";\n // this.headingStyle.width = parseInt(this.headingStyle.height,10) * 164/22 + \"px\";\n // this.divWidth = this.headingStyle.width;\n\n let isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) || (navigator.userAgent.includes(\"Macintosh\") && navigator.maxTouchPoints > 1);\n\n // if (isMobile) {\n // this.divLeft = 0.35*window.innerWidth - parseInt(this.divWidth,10)/2 + \"px\";\n // } else {\n // this.divLeft = 0.5*window.innerWidth - parseInt(this.divWidth,10)/2 + \"px\";\n // }\n\n if (isMobile) {\n this.divLeft = 0.1*window.innerWidth + \"px\";\n this.divTop = window.innerWidth * 380/306*(1 + 0.2*(306*window.innerHeight/window.innerWidth - 322)/340) - this.state.getCounterTopCutoff() + \"px\";\n this.headingStyle.top = window.innerWidth * 356/306*(1 + 0.2*(306*window.innerHeight/window.innerWidth - 322)/340) - this.state.getCounterTopCutoff() + \"px\";\n this.divFontSize = 16.5 * window.innerWidth * 190/306/413 + \"px\";\n this.headingStyle.left = this.divLeft;\n }\n \n // this.divFontSize = 16 * window.innerWidth * 190/306/413*(1 + 0.7*(306*window.innerHeight/window.innerWidth - 322)/340) + \"px\";\n // this.divLineHeight = 12 * window.innerWidth * 190/320/413*(1 + 0.7*(306*window.innerHeight/window.innerWidth - 322)/340) + \"px\";\n // this.headingStyle.left = this.divLeft;\n }\n \n this.cdr.detectChanges();\n }\n\n setHighScoreText() {\n this.highScoreService.getHighScores().subscribe((data: any[]) => {\n data.sort((a, b) => {\n return b.score - a.score;\n });\n this.highScores = data;\n this.highScoreText = \"\";\n for (let i = 0; i < 6; i++) {\n this.highScoreText += this.highScores[i].name + \"-\" + this.highScores[i].score + \"\r\n
\r\n\r\n \r\n \r\n \r\n
\r\n{{ selectedMonthName }} {{ selectedYear }}
\r\n\r\n
Check our OpenTable for details on upcoming reservations.
\";\n }\n this.cdr.markForCheck();\n },\n (error) => {\n console.error('Error:', error);\n });\n }\n\n @HostListener('window:resize', ['$event'])\n onResize(event) {\n this.setHighScoreDivSize();\n this.cdr.detectChanges();\n }\n\n ngOnInit(): void { \n // this.divTransform = `perspective(15cm) rotateX(-18deg) rotateY(-45deg)`;\n this.headingStyle = {};\n this.headingStyle.backgroundImage = `url(\"assets/kitchen/HighScores.PNG\")`;\n this.headingStyle.backgroundSize = \"cover\";\n this.setHighScoreDivSize();\n this.setHighScoreText();\n this.highScoreService.registerHighScoresComponent(this);\n }\n\n}\n","
\n
\n\n"," ","import { Component, OnInit } from '@angular/core';\nimport { BrevoService } from '../brevo.service';\n\n@Component({\n selector: 'app-myspice-nav-bar',\n templateUrl: './myspice-nav-bar.component.html',\n styleUrls: ['./myspice-nav-bar.component.css']\n})\nexport class MyspiceNavBarComponent implements OnInit {\n email: string = '';\n message: string = '';\n\n buttonClass = 'default';\n\n isOpen = false;\n\n constructor(private brevoService: BrevoService) { }\n\n toggleMenu() {\n this.isOpen = !this.isOpen;\n }\n\n changeColor(isPressed: boolean) {\n this.buttonClass = isPressed ? 'pressed' : 'default';\n console.log('press')\n }\n\n onSubscribe() {\n this.brevoService.subscribe(this.email).subscribe(\n response => {\n this.message = 'Thank you for subscribing!';\n this.email = '';\n },\n error => {\n this.message = 'An error occured. Please try again.';\n console.error(error);\n }\n )\n }\n\n ngOnInit(): void {\n }\n\n}\n","import { NgModule } from '@angular/core';\nimport { RouterModule, Routes } from '@angular/router';\nimport { AdminComponent } from './admin/admin.component';\nimport { AuthGuard } from './auth.guard';\nimport { HomeComponent } from './home/home.component';\nimport { LoginComponent } from './login/login.component';\nimport { MyspaceComponent } from './myspace/myspace.component';\nimport { BeverageComponent } from './beverage/beverage.component';\nimport { MenuComponent } from './menu/menu.component';\n\nconst routes: Routes = [\n { path: '', component: HomeComponent },\n { path: 'myspice', component: MyspaceComponent },\n { path: 'login', component: LoginComponent },\n { path: 'beverage', component: BeverageComponent },\n { path: 'menu', component: MenuComponent },\n // { path: 'reservations/:dateId', component: CustomerReservationsComponent },\n // { path: 'reservations', component: CustomerReservationsComponent, canActivate: [ReservationGuard] }\n { path: 'admin', component: AdminComponent, canActivate: [AuthGuard]}\n // { path: 'admin', component: AdminComponent }\n];\n\n@NgModule({\n imports: [RouterModule.forRoot(routes)],\n exports: [RouterModule]\n})\nexport class AppRoutingModule { }\n","import { Component, OnInit } from '@angular/core';\nimport { Router } from '@angular/router';\nimport { PasswordService } from '../password.service';\n\n@Component({\n selector: 'app-login',\n templateUrl: './login.component.html',\n styleUrls: ['./login.component.css']\n})\nexport class LoginComponent implements OnInit {\n password = '';\n hashedPassword = '$2a$10$rKTJSpvUTnbmo7GE4HRdQu.AAbn6xk9KtTLElt8ElLdI2wJRNGWF.';\n\n constructor(private passwordService: PasswordService, private router: Router) { }\n\n async login() {\n const isPasswordCorrect = await this.passwordService.comparePasswords(this.password,this.hashedPassword);\n\n if (isPasswordCorrect) {\n this.passwordService.isAuthenticated = true;\n this.router.navigate(['/admin']);\n }\n }\n\n ngOnInit(): void {\n \n }\n\n}\n","","import { Component, OnInit, HostListener } from '@angular/core';\nimport { PageStateService } from '../page-state.service';\n\n@Component({\n selector: 'app-start-game',\n templateUrl: './start-game.component.html',\n styleUrls: ['./start-game.component.css']\n})\nexport class StartGameComponent implements OnInit {\n\n isMobile: boolean;\n\n mobileText: string = `Press JUMP to playLiz's Leap Frogs`;\n nativeText: string = `Press SPACE to play
Liz's Leap Frogs`;\n\n divStyle: any;\n\n constructor(private state: PageStateService) { }\n\n setDivStyle() {\n var textShadow = window.innerWidth * 0.65/512;\n this.divStyle.left = window.innerWidth * 175/512 + \"px\";\n this.divStyle.top = window.innerWidth * 175/512 + \"px\";\n this.divStyle.fontSize = window.innerWidth * 8/512 + \"px\";\n this.divStyle.lineHeight = window.innerWidth * 12/512 + \"px\";\n\n if (window.innerWidth/window.innerHeight < 0.95) {\n this.divStyle.left = window.innerWidth * 60/306 + \"px\";\n this.divStyle.top = window.innerWidth * 302/306*(1 + 0.2*(306*window.innerHeight/window.innerWidth - 322)/340) - this.state.getCounterTopCutoff() + \"px\";\n this.divStyle.fontSize = window.innerWidth * 9/306 + \"px\";\n this.divStyle.lineHeight = window.innerWidth * 12/306 + \"px\";\n textShadow = window.innerWidth * 0.65/306;\n\n } else if (this.state.isNarrow()) {\n this.divStyle.left = window.innerHeight * 175/320 - this.state.getLeftCutoff() + \"px\";\n this.divStyle.top = window.innerHeight * 175/320 + \"px\";\n this.divStyle.fontSize = window.innerHeight * 8/320 + \"px\";\n this.divStyle.lineHeight = window.innerHeight * 12/320 + \"px\";\n textShadow = window.innerHeight * 0.65/320;\n }\n\n this.divStyle.textShadow = '-' + textShadow + 'px -' + textShadow + 'px 0 #000, ' + textShadow + 'px -' + textShadow + 'px 0 #000, -' + textShadow + 'px ' + textShadow + 'px 0 #000, ' + textShadow + 'px ' + textShadow + 'px 0 #000';\n }\n\n @HostListener('window:resize', ['$event'])\n onResize(event) {\n this.setDivStyle();\n }\n\n ngOnInit(): void {\n this.divStyle = {};\n\n this.isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);\n\n this.setDivStyle();\n }\n\n}\n","\n","import { enableProdMode } from '@angular/core';\nimport { platformBrowserDynamic } from '@angular/platform-browser-dynamic';\n\nimport { AppModule } from './app/app.module';\nimport { environment } from './environments/environment';\n\nimport 'hammerjs';\n\nif (environment.production) {\n enableProdMode();\n}\n\nplatformBrowserDynamic().bootstrapModule(AppModule)\n .catch(err => console.error(err));\n","function webpackEmptyAsyncContext(req) {\n\t// Here Promise.resolve().then() is used instead of new Promise() to prevent\n\t// uncaught exception popping up in devtools\n\treturn Promise.resolve().then(function() {\n\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\te.code = 'MODULE_NOT_FOUND';\n\t\tthrow e;\n\t});\n}\nwebpackEmptyAsyncContext.keys = function() { return []; };\nwebpackEmptyAsyncContext.resolve = webpackEmptyAsyncContext;\nmodule.exports = webpackEmptyAsyncContext;\nwebpackEmptyAsyncContext.id = \"zn8P\";"],"sourceRoot":"webpack:///"}