From 591b156bb612f65071e9ce3a9ce8ace9e4483e39 Mon Sep 17 00:00:00 2001 From: "Patrik J. Braun" Date: Mon, 9 Dec 2019 17:19:28 +0100 Subject: [PATCH] adding (transcoded) avi support --- backend/model/threading/DiskMangerWorker.ts | 25 +++------------- backend/routes/GalleryRouter.ts | 18 +++++++----- common/SupportedFormats.ts | 29 +++++++++++++++++++ common/entities/MediaDTO.ts | 9 ++++-- .../media.lightbox.gallery.component.html | 2 +- .../media/media.lightbox.gallery.component.ts | 11 ------- 6 files changed, 51 insertions(+), 43 deletions(-) create mode 100644 common/SupportedFormats.ts diff --git a/backend/model/threading/DiskMangerWorker.ts b/backend/model/threading/DiskMangerWorker.ts index 3c253ec..3b9222e 100644 --- a/backend/model/threading/DiskMangerWorker.ts +++ b/backend/model/threading/DiskMangerWorker.ts @@ -9,30 +9,13 @@ import {VideoDTO} from '../../../common/entities/VideoDTO'; import {FileDTO} from '../../../common/entities/FileDTO'; import {MetadataLoader} from './MetadataLoader'; import {Logger} from '../../Logger'; +import {SupportedFormats} from '../../../common/SupportedFormats'; const LOG_TAG = '[DiskManagerTask]'; export class DiskMangerWorker { - private static readonly SupportedEXT = { - photo: [ - '.gif', - '.jpeg', '.jpg', '.jpe', - '.png', - '.webp', - '.svg' - ], - video: [ - '.mp4', - '.webm', - '.ogv', - '.ogg' - ], - metaFile: [ - '.gpx' - ] - }; public static calcLastModified(stat: Stats) { return Math.max(stat.ctime.getTime(), stat.mtime.getTime()); @@ -186,17 +169,17 @@ export class DiskMangerWorker { private static isImage(fullPath: string) { const extension = path.extname(fullPath).toLowerCase(); - return this.SupportedEXT.photo.indexOf(extension) !== -1; + return SupportedFormats.WithDots.Photos.indexOf(extension) !== -1; } private static isVideo(fullPath: string) { const extension = path.extname(fullPath).toLowerCase(); - return this.SupportedEXT.video.indexOf(extension) !== -1; + return SupportedFormats.WithDots.Videos.indexOf(extension) !== -1; } private static isMetaFile(fullPath: string) { const extension = path.extname(fullPath).toLowerCase(); - return this.SupportedEXT.metaFile.indexOf(extension) !== -1; + return SupportedFormats.WithDots.MetaFiles.indexOf(extension) !== -1; } } diff --git a/backend/routes/GalleryRouter.ts b/backend/routes/GalleryRouter.ts index bb31675..62cc2a9 100644 --- a/backend/routes/GalleryRouter.ts +++ b/backend/routes/GalleryRouter.ts @@ -6,6 +6,7 @@ import {ThumbnailGeneratorMWs} from '../middlewares/thumbnail/ThumbnailGenerator import {UserRoles} from '../../common/entities/UserDTO'; import {ThumbnailSourceType} from '../model/threading/ThumbnailWorker'; import {VersionMWs} from '../middlewares/VersionMWs'; +import {SupportedFormats} from '../../common/SupportedFormats'; export class GalleryRouter { public static route(app: Express) { @@ -41,7 +42,7 @@ export class GalleryRouter { private static addGetImage(app: Express) { - app.get(['/api/gallery/content/:mediaPath(*\.(jpg|jpeg|jpe|webp|png|gif|svg))'], + app.get(['/api/gallery/content/:mediaPath(*\.(' + SupportedFormats.Photos.join('|') + '))'], AuthenticationMWs.authenticate, AuthenticationMWs.normalizePathParam('mediaPath'), AuthenticationMWs.authorisePath('mediaPath', false), @@ -51,7 +52,7 @@ export class GalleryRouter { } private static addGetVideo(app: Express) { - app.get(['/api/gallery/content/:mediaPath(*\.(mp4|ogg|ogv|webm))'], + app.get(['/api/gallery/content/:mediaPath(*\.(' + SupportedFormats.Videos.join('|') + '))'], AuthenticationMWs.authenticate, AuthenticationMWs.normalizePathParam('mediaPath'), AuthenticationMWs.authorisePath('mediaPath', false), @@ -59,8 +60,9 @@ export class GalleryRouter { RenderingMWs.renderFile ); } + private static addGetBestFitVideo(app: Express) { - app.get(['/api/gallery/content/:mediaPath(*\.(mp4|ogg|ogv|webm))/bestFit'], + app.get(['/api/gallery/content/:mediaPath(*\.(' + SupportedFormats.Videos.join('|') + '))/bestFit'], AuthenticationMWs.authenticate, AuthenticationMWs.normalizePathParam('mediaPath'), AuthenticationMWs.authorisePath('mediaPath', false), @@ -70,7 +72,7 @@ export class GalleryRouter { } private static addGetMetaFile(app: Express) { - app.get(['/api/gallery/content/:mediaPath(*\.(gpx))'], + app.get(['/api/gallery/content/:mediaPath(*\.(' + SupportedFormats.MetaFiles.join('|') + '))'], AuthenticationMWs.authenticate, AuthenticationMWs.normalizePathParam('mediaPath'), AuthenticationMWs.authorisePath('mediaPath', false), @@ -91,7 +93,7 @@ export class GalleryRouter { } private static addGetImageThumbnail(app: Express) { - app.get('/api/gallery/content/:mediaPath(*\.(jpg|jpeg|jpe|webp|png|gif|svg))/thumbnail/:size?', + app.get('/api/gallery/content/:mediaPath(*\.(' + SupportedFormats.Photos.join('|') + '))/thumbnail/:size?', AuthenticationMWs.authenticate, AuthenticationMWs.normalizePathParam('mediaPath'), AuthenticationMWs.authorisePath('mediaPath', false), @@ -102,7 +104,7 @@ export class GalleryRouter { } private static addGetVideoThumbnail(app: Express) { - app.get('/api/gallery/content/:mediaPath(*\.(mp4|ogg|ogv|webm))/thumbnail/:size?', + app.get('/api/gallery/content/:mediaPath(*\.(' + SupportedFormats.Videos.join('|') + '))/thumbnail/:size?', AuthenticationMWs.authenticate, AuthenticationMWs.normalizePathParam('mediaPath'), AuthenticationMWs.authorisePath('mediaPath', false), @@ -114,7 +116,7 @@ export class GalleryRouter { private static addGetVideoIcon(app: Express) { - app.get('/api/gallery/content/:mediaPath(*\.(mp4|ogg|ogv|webm))/icon', + app.get('/api/gallery/content/:mediaPath(*\.(' + SupportedFormats.Videos.join('|') + '))/icon', AuthenticationMWs.authenticate, AuthenticationMWs.normalizePathParam('mediaPath'), AuthenticationMWs.authorisePath('mediaPath', false), @@ -125,7 +127,7 @@ export class GalleryRouter { } private static addGetImageIcon(app: Express) { - app.get('/api/gallery/content/:mediaPath(*\.(jpg|jpeg|jpe|webp|png|gif|svg))/icon', + app.get('/api/gallery/content/:mediaPath(*\.(' + SupportedFormats.Photos.join('|') + '))/icon', AuthenticationMWs.authenticate, AuthenticationMWs.normalizePathParam('mediaPath'), AuthenticationMWs.authorisePath('mediaPath', false), diff --git a/common/SupportedFormats.ts b/common/SupportedFormats.ts new file mode 100644 index 0000000..bb7b045 --- /dev/null +++ b/common/SupportedFormats.ts @@ -0,0 +1,29 @@ +export const SupportedFormats = { + Photos: [ + 'gif', + 'jpeg', 'jpg', 'jpe', + 'png', + 'webp', + 'svg' + ], + Videos: [ + 'mp4', + 'webm', + 'ogv', + 'ogg', + 'avi' + ], + MetaFiles: [ + 'gpx' + ], + WithDots: { + Photos: [], + Videos: [], + MetaFiles: [], + } +}; + +SupportedFormats.WithDots.Photos = SupportedFormats.Photos.map(f => '.' + f); +SupportedFormats.WithDots.Videos = SupportedFormats.Videos.map(f => '.' + f); +SupportedFormats.WithDots.MetaFiles = SupportedFormats.MetaFiles.map(f => '.' + f); + diff --git a/common/entities/MediaDTO.ts b/common/entities/MediaDTO.ts index 13788c2..b428036 100644 --- a/common/entities/MediaDTO.ts +++ b/common/entities/MediaDTO.ts @@ -1,8 +1,8 @@ import {DirectoryDTO} from './DirectoryDTO'; import {PhotoDTO} from './PhotoDTO'; import {OrientationTypes} from 'ts-exif-parser'; -import {VideoDTO} from './VideoDTO'; import {FileDTO} from './FileDTO'; +import {SupportedFormats} from '../SupportedFormats'; export interface MediaDTO extends FileDTO { id: number; @@ -56,7 +56,12 @@ export module MediaDTO { export const isVideo = (media: MediaDTO): boolean => { const lower = media.name.toLowerCase(); - return lower.endsWith('.mp4') || lower.endsWith('.webm') || lower.endsWith('.ogg') || lower.endsWith('.ogv'); + for (const ext of SupportedFormats.WithDots.Videos) { + if (lower.endsWith(ext)) { + return true; + } + } + return false; }; export const getRotatedSize = (photo: MediaDTO): MediaDimension => { diff --git a/frontend/app/ui/gallery/lightbox/media/media.lightbox.gallery.component.html b/frontend/app/ui/gallery/lightbox/media/media.lightbox.gallery.component.html index cd897ee..4cf694b 100644 --- a/frontend/app/ui/gallery/lightbox/media/media.lightbox.gallery.component.html +++ b/frontend/app/ui/gallery/lightbox/media/media.lightbox.gallery.component.html @@ -22,7 +22,7 @@ (error)="onImageError()" (timeupdate)="onVideoProgress()" #video> - + diff --git a/frontend/app/ui/gallery/lightbox/media/media.lightbox.gallery.component.ts b/frontend/app/ui/gallery/lightbox/media/media.lightbox.gallery.component.ts index b4fc693..e46bfce 100644 --- a/frontend/app/ui/gallery/lightbox/media/media.lightbox.gallery.component.ts +++ b/frontend/app/ui/gallery/lightbox/media/media.lightbox.gallery.component.ts @@ -129,17 +129,6 @@ export class GalleryLightboxMediaComponent implements OnChanges { return this.video.nativeElement.paused; } - public getVideoType(): string { - switch (this.gridMedia.getExtension().toLowerCase()) { - case 'webm': - return 'video/webm'; - case 'ogv': - case 'ogg': - return 'video/ogg'; - default: - return 'video/mp4'; - } - } onImageError() { // TODO:handle error