Updated to Angular 8

src/app/app.module.ts

@@ -1,27 +1,26 @@
-import {BrowserModule} from '@angular/platform-browser';
-import {NgModule} from '@angular/core';
+import {NgModule} from "@angular/core";
 import {AppRouting} from './app.routing';
 import {AppComponent} from './app.component';
-import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {ServiceWorkerModule} from '@angular/service-worker';
 import {environment} from '../environments/environment';
-import {FormsModule} from "@angular/forms";
 import {MapComponent} from "./views/map/map.component";
 import {HomeComponent} from "./views/home/home.component";
 import {MaterialModule} from "./material.module";
 import {CalibrateComponent} from "./components/calibrate/calibrate.component";
-import {MatInputModule} from "@angular/material";
 import {PermissionsComponent} from "./components/permissions/permissions.component";
-import {AngularFireModule} from "@angular/fire";
-import {AngularFirestoreModule} from "@angular/fire/firestore";
 import {ToolbarComponent} from "./components/toolbar/toolbar.component";
 import {PaletteComponent} from "./components/palette/palette.component"
 import {AnimatedBackgroundComponent} from "./components/animatedBackground/animatedBackground.component";
-import {ClickOutsideModule} from "ng-click-outside";
-import {ColorPickerModule} from "ngx-color-picker";
 import {ColorPickerDialogComponent} from "./components/colorPickerDialog/colorPickerDialog.component";
 import {DimensionsDialogComponent} from "./components/dimensionsDialog/dimensionsDialog.component";
 import {EditSymbolComponent} from "./components/editSymbol/editSymbol.component";
+import {AngularFireModule} from "@angular/fire";
+import {AngularFirestoreModule} from "@angular/fire/firestore";
+import {BrowserAnimationsModule} from "@angular/platform-browser/animations";
+import {BrowserModule} from "@angular/platform-browser";
+import {ClickOutsideModule} from "ng-click-outside";
+import {ColorPickerModule} from "ngx-color-picker";
+import {FormsModule} from "@angular/forms";
+import {ServiceWorkerModule} from "@angular/service-worker";
 
 @NgModule({
     declarations: [
@@ -48,7 +47,6 @@ import {EditSymbolComponent} from "./components/editSymbol/editSymbol.component"
         FormsModule,
         MaterialModule,
         ServiceWorkerModule.register('ngsw-worker.js', {enabled: environment.production}),
-        MatInputModule,
     ],
     providers: [],
     entryComponents: [CalibrateComponent, ColorPickerDialogComponent, DimensionsDialogComponent, EditSymbolComponent, PermissionsComponent],

src/app/components/calibrate/calibrate.component.ts

@@ -1,5 +1,5 @@
 import {Component} from "@angular/core";
-import {MatBottomSheetRef} from "@angular/material";
+import {MatBottomSheetRef} from "@angular/material/bottom-sheet";
 import {PhysicsService} from "../../services/physics.service";
 import {collapse, expand} from "../../animations";
 

src/app/components/permissions/permissions.component.ts

@@ -1,5 +1,5 @@
 import { Component, Inject } from "@angular/core";
-import { MAT_DIALOG_DATA } from "@angular/material";
+import {MAT_DIALOG_DATA} from "@angular/material/dialog";
 
 @Component({
     selector: 'permissions',

src/app/components/permissions/permissions.service.ts

@@ -1,5 +1,5 @@
 import {Injectable} from "@angular/core";
-import {MatDialog} from "@angular/material";
+import {MatDialog} from "@angular/material/dialog";
 import {PermissionsComponent} from "./permissions.component";
 
 @Injectable({
@@ -9,7 +9,7 @@ export class PermissionsService {
     constructor(private dialog: MatDialog) { }
 
     async requestPermission(name: string, icon: string, message: string) {
-        let perm = await navigator['permissions'].query({name: name});
+        let perm = await navigator['permissions'].query({name: <PermissionName>name});
         if (perm.state == 'prompt') {
             return await this.dialog.open(PermissionsComponent, {autoFocus: false, data: {icon: icon, message: message}}).afterClosed().toPromise();
         }

src/app/material.module.ts

@@ -1,14 +1,18 @@
-import {
-    MatBottomSheetModule,
-    MatButtonModule, MatDialogModule, MatDividerModule, MatFormFieldModule,
-    MatIconModule, MatInputModule, MatMenuModule, MatSliderModule,
-    MatSnackBarModule,
-    MatToolbarModule
-} from "@angular/material";
-import {NgModule} from "@angular/core";
-import {MatTooltipModule} from "@angular/material/tooltip";
-import {MatProgressSpinnerModule} from "@angular/material/progress-spinner";
+import {MatBottomSheetModule} from "@angular/material/bottom-sheet";
+import {MatButtonModule} from "@angular/material/button";
 import {MatButtonToggleModule} from "@angular/material/button-toggle";
+import {MatDialogModule} from "@angular/material/dialog";
+import {MatDividerModule} from "@angular/material/divider";
+import {MatFormFieldModule} from "@angular/material/form-field";
+import {NgModule} from "@angular/core";
+import {MatMenuModule} from "@angular/material/menu";
+import {MatProgressSpinnerModule} from "@angular/material/progress-spinner";
+import {MatInputModule} from "@angular/material/input";
+import {MatIconModule} from "@angular/material/icon";
+import {MatSliderModule} from "@angular/material/slider";
+import {MatToolbarModule} from "@angular/material/toolbar";
+import {MatSnackBarModule} from "@angular/material/snack-bar";
+import {MatTooltipModule} from "@angular/material/tooltip";
 
 export const materialModules = [
     MatBottomSheetModule,

src/app/views/map/map.component.ts

@@ -1,7 +1,6 @@
 import {Component, OnDestroy, OnInit} from "@angular/core";
 import {PhysicsService} from "../../services/physics.service";
 import {filter, finalize, skip, take} from "rxjs/operators";
-import {MatBottomSheet, MatSnackBar} from "@angular/material";
 import {CalibrateComponent} from "../../components/calibrate/calibrate.component";
 import {ToolbarItem} from "../../models/toolbarItem";
 import {flyInRight, flyOutRight} from "../../animations";
@@ -16,6 +15,8 @@ import {MapData, Marker} from "../../models/mapSymbol";
 import {Adjectives} from "../../adjectives";
 import {Nouns} from "../../nounes";
 import {EditSymbolComponent} from "../../components/editSymbol/editSymbol.component";
+import {MatSnackBar} from "@angular/material/snack-bar";
+import {MatBottomSheet} from "@angular/material/bottom-sheet";
 
 declare const L;