[ENG-1084] Correctly format Orientation EXIF data in the UI (#1313)

* impl `Display` and a custom serde serializer

* remove the + as rust already shortens coords to 8SF

* remove manual serde impl and string conversion

* add `formatOrientation` to the `MediaData` part of the inspector

* make requested changes

---------

Co-authored-by: Jamie Pine <32987599+jamiepine@users.noreply.github.com>
This commit is contained in:
jake 2023-09-08 13:21:32 +01:00 committed by GitHub
parent b53ec4e8e2
commit c2d377a3ec
3 changed files with 22 additions and 9 deletions

View File

@ -9,13 +9,13 @@ use std::path::Path;
pub enum Orientation {
#[default]
Normal,
MirroredHorizontal,
CW90,
MirroredVertical,
MirroredHorizontalAnd270CW,
MirroredHorizontalAnd90CW,
CW180,
CW270,
MirroredVertical,
MirroredHorizontal,
MirroredHorizontalAnd90CW,
MirroredHorizontalAnd270CW,
}
impl Orientation {

View File

@ -1,4 +1,4 @@
import { MediaLocation, MediaMetadata, MediaTime } from '@sd/client';
import { MediaLocation, MediaMetadata, MediaTime, Orientation } from '@sd/client';
import Accordion from '~/components/Accordion';
import { usePlatform } from '~/util/Platform';
import { MetaData } from './index';
@ -15,10 +15,20 @@ function formatMediaTime(loc: MediaTime): string | null {
}
function formatLocation(loc: MediaLocation, dp: number): string {
// Stackoverflow says the `+` strips the trailing zeros or something so it's important, I think
return `${+loc.latitude.toFixed(dp)}, ${+loc.longitude.toFixed(dp)}`;
return `${loc.latitude.toFixed(dp)}, ${loc.longitude.toFixed(dp)}`;
}
const orientations = {
Normal: 'Normal',
MirroredHorizontal: 'Horizontally mirrored',
MirroredHorizontalAnd90CW: 'Mirrored horizontally and rotated 90° clockwise',
MirroredHorizontalAnd270CW: 'Mirrored horizontally and rotated 270° clockwise',
MirroredVertical: 'Vertically mirrored',
CW90: 'Rotated 90° clockwise',
CW180: 'Rotated 180° clockwise',
CW270: 'Rotated 270° clockwise'
};
function MediaData({ data }: Props) {
const platform = usePlatform();
@ -61,7 +71,10 @@ function MediaData({ data }: Props) {
/>
<MetaData label="Device" value={data.camera_data.device_make} />
<MetaData label="Model" value={data.camera_data.device_model} />
<MetaData label="Orientation" value={data.camera_data.orientation} />
<MetaData
label="Orientation"
value={orientations[data.camera_data.orientation] ?? '--'}
/>
<MetaData label="Color profile" value={data.camera_data.color_profile} />
<MetaData label="Color space" value={data.camera_data.color_space} />
<MetaData label="Flash" value={data.camera_data.flash?.mode} />

View File

@ -331,7 +331,7 @@ export type OptionalRange<T> = { from: T | null; to: T | null }
export type OrderAndPagination<TId, TOrder, TCursor> = { orderOnly: TOrder } | { offset: { offset: number; order: TOrder | null } } | { cursor: { id: TId; cursor: TCursor } }
export type Orientation = "Normal" | "MirroredHorizontal" | "CW90" | "MirroredVertical" | "MirroredHorizontalAnd270CW" | "MirroredHorizontalAnd90CW" | "CW180" | "CW270"
export type Orientation = "Normal" | "CW90" | "CW180" | "CW270" | "MirroredVertical" | "MirroredHorizontal" | "MirroredHorizontalAnd90CW" | "MirroredHorizontalAnd270CW"
/**
* TODO: P2P event for the frontend