From 6f5ecfaeb003ab30398a3fa802105bc142d78019 Mon Sep 17 00:00:00 2001 From: Jacob Coffee Date: Mon, 27 Apr 2026 20:59:29 -0500 Subject: [PATCH] feat(conference-map): 2026 floor plans with tappable per-floor cards MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Replace the inline scroll of three floor PNGs on the Floor Plans tab with a card list, one per LBCC floor / area, that opens a fullscreen zoomable modal on tap. Each card shows a small thumbnail (~50–80 KB) so the tab loads fast; the high-res image (~270–430 KB, 2200 px wide) is fetched only when the user opens the modal. The modal uses pinch-zoom with limitZoom="original image size" so double-tap / pinch / wheel can zoom up to native resolution instead of the library's default 3x cap. Floor plan images are extracted from the marked-up 2026 LBCC PDFs: - Page 1 (Concourse Level): original combined PDF - Page 2 (Upper Level): LBCC-Upper Level - Page 3 (Arena & Exhibit Halls): LBCC-Overview - Page 4 (Seaside): LBCC-Seaside Meeting Rooms-Airwall Removes the now-unused floor-{two,three,four}.png (~1.7 MB). Co-Authored-By: Claude Opus 4.7 (1M context) --- .../floor-plan-modal.component.html | 26 +++++++ .../floor-plan-modal.component.scss | 17 +++++ .../floor-plan-modal.component.ts | 19 +++++ .../conference-map/conference-map.module.ts | 3 +- .../conference-map/conference-map.page.html | 28 +++++-- .../conference-map/conference-map.page.scss | 70 +++++++++++++++++- .../conference-map/conference-map.page.ts | 54 ++++++++++++++ src/assets/img/floor-four.png | Bin 460322 -> 0 bytes .../img/floor-plans/floor-plan-1-thumb.jpg | Bin 0 -> 66252 bytes src/assets/img/floor-plans/floor-plan-1.jpg | Bin 0 -> 362083 bytes .../img/floor-plans/floor-plan-2-thumb.jpg | Bin 0 -> 48177 bytes src/assets/img/floor-plans/floor-plan-2.jpg | Bin 0 -> 265050 bytes .../img/floor-plans/floor-plan-3-thumb.jpg | Bin 0 -> 80139 bytes src/assets/img/floor-plans/floor-plan-3.jpg | Bin 0 -> 433597 bytes .../img/floor-plans/floor-plan-4-thumb.jpg | Bin 0 -> 69052 bytes src/assets/img/floor-plans/floor-plan-4.jpg | Bin 0 -> 344746 bytes src/assets/img/floor-three.png | Bin 715937 -> 0 bytes src/assets/img/floor-two.png | Bin 589194 -> 0 bytes 18 files changed, 206 insertions(+), 11 deletions(-) create mode 100644 src/app/floor-plan-modal/floor-plan-modal.component.html create mode 100644 src/app/floor-plan-modal/floor-plan-modal.component.scss create mode 100644 src/app/floor-plan-modal/floor-plan-modal.component.ts delete mode 100644 src/assets/img/floor-four.png create mode 100644 src/assets/img/floor-plans/floor-plan-1-thumb.jpg create mode 100644 src/assets/img/floor-plans/floor-plan-1.jpg create mode 100644 src/assets/img/floor-plans/floor-plan-2-thumb.jpg create mode 100644 src/assets/img/floor-plans/floor-plan-2.jpg create mode 100644 src/assets/img/floor-plans/floor-plan-3-thumb.jpg create mode 100644 src/assets/img/floor-plans/floor-plan-3.jpg create mode 100644 src/assets/img/floor-plans/floor-plan-4-thumb.jpg create mode 100644 src/assets/img/floor-plans/floor-plan-4.jpg delete mode 100644 src/assets/img/floor-three.png delete mode 100644 src/assets/img/floor-two.png diff --git a/src/app/floor-plan-modal/floor-plan-modal.component.html b/src/app/floor-plan-modal/floor-plan-modal.component.html new file mode 100644 index 00000000..abcfb881 --- /dev/null +++ b/src/app/floor-plan-modal/floor-plan-modal.component.html @@ -0,0 +1,26 @@ + + + + + + + + {{ title }} + + + + + + + + diff --git a/src/app/floor-plan-modal/floor-plan-modal.component.scss b/src/app/floor-plan-modal/floor-plan-modal.component.scss new file mode 100644 index 00000000..e0a56449 --- /dev/null +++ b/src/app/floor-plan-modal/floor-plan-modal.component.scss @@ -0,0 +1,17 @@ +.floor-plan-modal-content { + --background: #ffffff; +} + +.floor-plan-zoom { + width: 100%; + height: 100%; + background: #ffffff; +} + +.floor-plan-zoom img { + width: 100%; + height: auto; + display: block; + -webkit-user-drag: none; + user-select: none; +} diff --git a/src/app/floor-plan-modal/floor-plan-modal.component.ts b/src/app/floor-plan-modal/floor-plan-modal.component.ts new file mode 100644 index 00000000..5533e2ff --- /dev/null +++ b/src/app/floor-plan-modal/floor-plan-modal.component.ts @@ -0,0 +1,19 @@ +import { Component, Input } from '@angular/core'; +import { ModalController } from '@ionic/angular'; + +@Component({ + selector: 'app-floor-plan-modal', + templateUrl: './floor-plan-modal.component.html', + styleUrls: ['./floor-plan-modal.component.scss'], +}) +export class FloorPlanModalComponent { + @Input() title!: string; + @Input() imageSrc!: string; + @Input() altText?: string; + + constructor(private modalCtrl: ModalController) {} + + close() { + this.modalCtrl.dismiss(); + } +} diff --git a/src/app/pages/conference-map/conference-map.module.ts b/src/app/pages/conference-map/conference-map.module.ts index 6bc47964..a4582ad5 100644 --- a/src/app/pages/conference-map/conference-map.module.ts +++ b/src/app/pages/conference-map/conference-map.module.ts @@ -7,6 +7,7 @@ import { IonicModule } from '@ionic/angular'; import { PinchZoomModule } from '@ciag/ngx-pinch-zoom'; import { ExpoHallMapModule } from '../../expo-hall-map/expo-hall-map.module'; +import { FloorPlanModalComponent } from '../../floor-plan-modal/floor-plan-modal.component'; import { ConferenceMapPageRoutingModule } from './conference-map-routing.module'; @@ -21,6 +22,6 @@ import { ConferenceMapPage } from './conference-map.page'; ExpoHallMapModule, ConferenceMapPageRoutingModule ], - declarations: [ConferenceMapPage] + declarations: [ConferenceMapPage, FloorPlanModalComponent] }) export class ConferenceMapPageModule {} diff --git a/src/app/pages/conference-map/conference-map.page.html b/src/app/pages/conference-map/conference-map.page.html index f3ea8976..94b64a57 100644 --- a/src/app/pages/conference-map/conference-map.page.html +++ b/src/app/pages/conference-map/conference-map.page.html @@ -25,16 +25,28 @@ - + - -
- - - -
-
+
+ +