Skip to content

sjova/aircraft-seat-map

Repository files navigation

Aircraft Seat Map

This project was generated with Angular CLI version 11.2.6.

Development server

Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Code scaffolding

Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.

Build

Run ng build to build the project. The build artifacts will be stored in the dist/ directory. Use the --prod flag for a production build.

Running unit tests

Run ng test to execute the unit tests via Karma.

Running end-to-end tests

Run ng e2e to execute the end-to-end tests via Protractor.

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI Overview and Command Reference page.

Prototyping App Notes

Steps

  1. Seat Selection box with Select Seats button
  2. Middle steps including following elements and features:
  • Aircraft Seat Map
  • Display different seat types (Extra Legroom, Emergency Exit Row, Standard Seat)
  • Consider different seat map layouts (2+2, 3+3, 1+2, 2+3, 2+3+2, 3+4+3)
  • Support different number of flights (single flight, outbound/inbound flights, multiple flights with connection)
  • Responsive design (3 different breakpoints: extra small, small, and medium+)
  • Pre-selected first passenger in first flight
  • Select passenger seat for each flight
  • Auto-select next passenger
  • Tooltip with seat details
  • Dynamic passengers list height (depends on number of passengers)
  • Update seat selection before confirmation
  • Seat selection validation (all seats must be selected in the initial version)
  1. Seat Selection box with summary details and Edit Seats button

API Data Structure

API Data Structure

Demo Example Screens

Aircraft Seat Map Demo Example - First Step First Step Screen

Aircraft Seat Map Demo Example - Medium Middle Step, Medium+ Screen (924px+)

Aircraft Seat Map Demo Example - Small Middle Step, Small Screen (612px-923px)

Aircraft Seat Map Demo Example - Extra SMall Middle Step, Extra Small Screen (360px-611px)

Aircraft Seat Map Demo Example - Last Step Last Step Screen

Different Example URLs

The biggest aircraft's (additional note for discussion)

  • Airbus A380-800 (853 passengers; 3+4+3 seating layout)
  • Boeing 777-300 (550/368 passengers; 2+3+2 seating layout)
  • Boeing 747-400 (524/416 passengers; 3+4+3 seating layout)
  • Airbus A340-600 (475/380 passengers; 2+4+2 seating layout)
  • Boeing 747-8 Intercontinental (467 passengers; 3+4+3 seating layout)