From 02fe0064d5bddeba74b19fc5e153d3bca8deed70 Mon Sep 17 00:00:00 2001 From: Marcin Czachurski Date: Sun, 25 Aug 2024 15:41:35 +0200 Subject: [PATCH] New film exif metadata and editable exif --- .../upload-photo/upload-photo.component.html | 111 ++++++++++++++---- .../upload-photo/upload-photo.component.scss | 10 ++ src/app/models/exif.ts | 1 + src/app/models/temporary-attachment.ts | 1 + src/app/models/upload-photo.ts | 20 ++-- src/app/pages/status/status.page.html | 7 +- src/app/pages/upload/upload.page.ts | 63 ++++++++-- src/styles/flex-layout.scss | 4 +- 8 files changed, 171 insertions(+), 46 deletions(-) diff --git a/src/app/components/widgets/upload-photo/upload-photo.component.html b/src/app/components/widgets/upload-photo/upload-photo.component.html index 3e03d3e..1a337e1 100644 --- a/src/app/components/widgets/upload-photo/upload-photo.component.html +++ b/src/app/components/widgets/upload-photo/upload-photo.component.html @@ -64,29 +64,90 @@ -
Exif metadata
- - Manufacturer: {{ photo.make }} - - - Model: {{ photo.model }} - - - Lens: {{ photo.lens }} - - - Create date: {{ photo.createDate }} - - - Focal length: {{ photo.focalLenIn35mmFilm }} - - - Aperture: {{ photo.fNumber }} - - - Exposure time: {{ photo.exposureTime }} - - - ISO: {{ photo.photographicSensitivity }} - +
Exif metadata
+
+
+ + Manufacturer: + + + + +
+ +
+ + Model: + + + + +
+ +
+ + Lens: + + + + +
+ +
+ + Focal length: + + + + mm   + +
+ +
+ + Aperture: + + + f/ + + +
+ +
+ + Exposure time: + + + + sec   + +
+ +
+ + ISO: + + + + +
+ +
+ + Film: + + + + +
+ +
+ + Create date: + + + + +
+
diff --git a/src/app/components/widgets/upload-photo/upload-photo.component.scss b/src/app/components/widgets/upload-photo/upload-photo.component.scss index e69de29..f5d14a3 100644 --- a/src/app/components/widgets/upload-photo/upload-photo.component.scss +++ b/src/app/components/widgets/upload-photo/upload-photo.component.scss @@ -0,0 +1,10 @@ +.exif-label { + width: 140px; + margin-top: 8px; +} + +.exif-values { + ::ng-deep .mat-mdc-form-field-subscript-wrapper { + height: 0; + } +} \ No newline at end of file diff --git a/src/app/models/exif.ts b/src/app/models/exif.ts index c3cb444..2cb21bc 100644 --- a/src/app/models/exif.ts +++ b/src/app/models/exif.ts @@ -7,4 +7,5 @@ export class Exif { public fNumber?: string; public exposureTime?: string; public photographicSensitivity?: string; + public film?: string; } \ No newline at end of file diff --git a/src/app/models/temporary-attachment.ts b/src/app/models/temporary-attachment.ts index 7987132..534f59a 100644 --- a/src/app/models/temporary-attachment.ts +++ b/src/app/models/temporary-attachment.ts @@ -12,6 +12,7 @@ export class TemporaryAttachment { public fNumber?: string; public exposureTime?: string; public photographicSensitivity?: string; + public film?: string; public locationId?: string; public licenseId?: string; } \ No newline at end of file diff --git a/src/app/models/upload-photo.ts b/src/app/models/upload-photo.ts index c4b8d93..8bb0de3 100644 --- a/src/app/models/upload-photo.ts +++ b/src/app/models/upload-photo.ts @@ -9,23 +9,25 @@ export class UploadPhoto { public locationId?: string; public licenseId?: string; - public showMake = true; - public showModel = true; - public showLens = true; - public showCreateDate = true; - public showFocalLenIn35mmFilm = true; - public showFNumber = true; - public showExposureTime = true; - public showPhotographicSensitivity = true; + public showMake = false; + public showModel = false; + public showLens = false; + public showCreateDate = false; + public showFocalLenIn35mmFilm = false; + public showFNumber = false; + public showExposureTime = false; + public showPhotographicSensitivity = false; + public showFilm = false; public make?: string; public model?: string; public lens?: string; - public createDate?: string; + public createDate?: Date; public focalLenIn35mmFilm?: string; public fNumber?: string; public exposureTime?: string; public photographicSensitivity?: string; + public film?: string; constructor(photoFile: Blob) { this.photoFile = photoFile; diff --git a/src/app/pages/status/status.page.html b/src/app/pages/status/status.page.html index 1561523..1933e9c 100644 --- a/src/app/pages/status/status.page.html +++ b/src/app/pages/status/status.page.html @@ -170,7 +170,7 @@
camera - {{ getExif(currentIndex)?.lens }} + {{ getExif(currentIndex)?.lens }}
@@ -180,6 +180,11 @@ {{ getExif(currentIndex)?.exposureTime }}s ISO {{ getExif(currentIndex)?.photographicSensitivity }}
+ +
+ camera_roll + {{ getExif(currentIndex)?.film }} +
diff --git a/src/app/pages/upload/upload.page.ts b/src/app/pages/upload/upload.page.ts index e276462..1d7070f 100644 --- a/src/app/pages/upload/upload.page.ts +++ b/src/app/pages/upload/upload.page.ts @@ -150,7 +150,7 @@ export class UploadPage extends ResponsiveComponent implements OnInit { } if (photo.showCreateDate) { - temporaryAttachment.createDate = photo.createDate + temporaryAttachment.createDate = photo.createDate?.toISOString() } if (photo.showFocalLenIn35mmFilm) { @@ -158,7 +158,7 @@ export class UploadPage extends ResponsiveComponent implements OnInit { } if (photo.fNumber) { - temporaryAttachment.fNumber = photo.fNumber + temporaryAttachment.fNumber = `f/${photo.fNumber}` } if (photo.exposureTime) { @@ -169,6 +169,10 @@ export class UploadPage extends ResponsiveComponent implements OnInit { temporaryAttachment.photographicSensitivity = photo.photographicSensitivity } + if (photo.film) { + temporaryAttachment.film = photo.film + } + temporaryAttachment.locationId = photo.locationId; temporaryAttachment.licenseId = photo.licenseId; @@ -214,14 +218,53 @@ export class UploadPage extends ResponsiveComponent implements OnInit { bufferReader.addEventListener('load', () => { const tags = ExifReader.load(bufferReader.result as ArrayBuffer); - uploadPhoto.make = tags['Make']?.description.toString(); - uploadPhoto.model = tags['Model']?.description.toString(); - uploadPhoto.lens = tags['Lens']?.description.toString(); - uploadPhoto.createDate = tags['CreateDate']?.description.toString(); - uploadPhoto.focalLenIn35mmFilm = tags['FocalLengthIn35mmFilm']?.description.toString(); - uploadPhoto.fNumber = tags['FNumber']?.description.toString(); - uploadPhoto.exposureTime = tags['ExposureTime']?.description.toString(); - uploadPhoto.photographicSensitivity = tags['ISOSpeedRatings']?.description.toString(); + const make = tags['Make']?.description.toString(); + if (make) { + uploadPhoto.make = make; + uploadPhoto.showMake = true; + } + + const model = tags['Model']?.description.toString(); + if (model) { + uploadPhoto.model = model; + uploadPhoto.showModel = true; + } + + const lens = tags['Lens']?.description.toString(); + if (lens) { + uploadPhoto.lens = lens; + uploadPhoto.showLens = true; + } + + const focalLenIn35mmFilm = tags['FocalLengthIn35mmFilm']?.description.toString(); + if (focalLenIn35mmFilm) { + uploadPhoto.focalLenIn35mmFilm = focalLenIn35mmFilm; + uploadPhoto.showFocalLenIn35mmFilm = true; + } + + const exposureTime = tags['ExposureTime']?.description.toString(); + if (exposureTime) { + uploadPhoto.exposureTime = exposureTime; + uploadPhoto.showExposureTime = true; + } + + const photographicSensitivity = tags['ISOSpeedRatings']?.description.toString(); + if (photographicSensitivity) { + uploadPhoto.photographicSensitivity = photographicSensitivity; + uploadPhoto.showPhotographicSensitivity = true; + } + + const fNumber = tags['FNumber']?.description.toString(); + if (fNumber) { + uploadPhoto.fNumber = fNumber?.replace('f/', ''); + uploadPhoto.showFNumber = true; + } + + const createDate = tags['CreateDate']?.description.toString(); + if (createDate) { + uploadPhoto.createDate = new Date(createDate); + uploadPhoto.showCreateDate = true; + } }); bufferReader.readAsArrayBuffer(uploadPhoto.photoFile); diff --git a/src/styles/flex-layout.scss b/src/styles/flex-layout.scss index 20753a0..40f8c9c 100644 --- a/src/styles/flex-layout.scss +++ b/src/styles/flex-layout.scss @@ -64,4 +64,6 @@ // Grow. .flex-grow-1 { flex-grow: 1; } -.flex-grow-2 { flex-grow: 2; } \ No newline at end of file +.flex-grow-2 { flex-grow: 2; } +.flex-grow-3 { flex-grow: 3; } +.flex-grow-4 { flex-grow: 4; } \ No newline at end of file