From 5517e07b27ff47c4f940327715c867c1b0a5e589 Mon Sep 17 00:00:00 2001
From: panaaj <38519157+panaaj@users.noreply.github.com>
Date: Fri, 4 Aug 2023 14:17:18 +0930
Subject: [PATCH] Add button to center vessel in the Vessels List

---
 CHANGELOG.md                                   |  4 ++++
 src/app/app.component.html                     |  1 +
 src/app/modules/skresources/lists/aislist.html | 10 +++++++++-
 src/app/modules/skresources/lists/aislist.ts   | 12 +++++++++++-
 4 files changed, 25 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index e48219b3..98e740d0 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,9 @@
 # CHANGELOG: Freeboard
 
+### v2.2.0
+
+- **Added**: Ability to center a vessel in the Vessels List.
+
 ### v2.1.0
 
 - **Added**: Ability to limit map zoom to min / max of displayed charts.
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 9f469e36..5f8b4b26 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -510,6 +510,7 @@
             (properties)="featureProperties({ id: $event, type: 'ais' })"
             (closed)="displayLeftMenu()"
             (focusVessel)="switchActiveVessel($event)"
+            (pan)="centerResource($event.center, $event.zoomLevel)"
           >
           </ais-list>
 
diff --git a/src/app/modules/skresources/lists/aislist.html b/src/app/modules/skresources/lists/aislist.html
index e5a162e1..c413df08 100644
--- a/src/app/modules/skresources/lists/aislist.html
+++ b/src/app/modules/skresources/lists/aislist.html
@@ -109,12 +109,20 @@
                 UNFOCUS
               </button>
             </div>
+            <button
+              mat-icon-button
+              color="primary"
+              [disabled]="app.config.map.moveMap"
+              (click)="emitCenter(r[1].position)"
+              matTooltip="Center Vessel"
+            >
+              <mat-icon>center_focus_strong</mat-icon>
+            </button>
             <div>
               <button
                 mat-button
                 (click)="itemProperties(r[0])"
                 matTooltip="Vessel Properties"
-                matTooltipPosition="right"
               >
                 <mat-icon color="primary">info_outline</mat-icon>
                 INFO
diff --git a/src/app/modules/skresources/lists/aislist.ts b/src/app/modules/skresources/lists/aislist.ts
index ff71acae..e93cd952 100644
--- a/src/app/modules/skresources/lists/aislist.ts
+++ b/src/app/modules/skresources/lists/aislist.ts
@@ -7,6 +7,7 @@ import {
 } from '@angular/core';
 import { AppInfo } from 'src/app/app.info';
 import { SKVessel } from 'src/app/modules/skresources/resource-classes';
+import { Position } from 'src/app/lib/geoutils';
 
 //** AIS Dialog **
 @Component({
@@ -22,6 +23,8 @@ export class AISListComponent {
   @Output() closed: EventEmitter<void> = new EventEmitter();
   @Output() properties: EventEmitter<string> = new EventEmitter();
   @Output() focusVessel: EventEmitter<string> = new EventEmitter();
+  @Output() pan: EventEmitter<{ center: Position; zoomLevel: number }> =
+    new EventEmitter();
 
   aisAvailable = [];
   filterList = [];
@@ -29,7 +32,7 @@ export class AISListComponent {
   someSel = false;
   allSel = false;
 
-  constructor(private app: AppInfo) {}
+  constructor(public app: AppInfo) {}
 
   ngOnInit() {
     this.initItems();
@@ -130,4 +133,11 @@ export class AISListComponent {
   focus(id?: string) {
     this.focusVessel.emit(id);
   }
+
+  emitCenter(position: Position) {
+    this.pan.emit({
+      center: position,
+      zoomLevel: this.app.config.map.zoomLevel
+    });
+  }
 }