From 13e828d21041c1c67203f498fc64eb594ac8ac8d Mon Sep 17 00:00:00 2001 From: "Patrik J. Braun" Date: Wed, 3 Jan 2024 11:06:19 +0100 Subject: [PATCH] Merge thumbnail and photo preview (generated photo) handling #806 --- .../thumbnail/PhotoConverterMWs.ts | 46 --- .../thumbnail/ThumbnailGeneratorMWs.ts | 14 +- .../model/diagnostics/ConfigDiagnostics.ts | 287 ++++++++++-------- .../fileprocessing/PhotoProcessing.ts | 53 ++-- src/backend/model/jobs/JobRepository.ts | 6 +- .../model/jobs/jobs/PhotoConvertingJob.ts | 84 ++++- .../model/jobs/jobs/ThumbnailGenerationJob.ts | 83 ----- src/backend/model/messenger/Messenger.ts | 2 +- src/backend/routes/GalleryRouter.ts | 35 +-- src/common/BackendTexts.ts | 3 +- src/common/Utils.ts | 16 +- src/common/config/private/PrivateConfig.ts | 69 +---- src/common/config/public/ClientConfig.ts | 155 ++++------ src/common/entities/job/JobDTO.ts | 3 +- src/frontend/app/model/backendtext.service.ts | 12 +- src/frontend/app/ui/gallery/Media.ts | 18 +- src/frontend/app/ui/gallery/MediaIcon.ts | 106 ++++--- .../controls.lightbox.gallery.component.html | 2 +- .../controls.lightbox.gallery.component.ts | 2 +- .../media.lightbox.gallery.component.html | 2 +- .../media/media.lightbox.gallery.component.ts | 70 ++--- .../lightbox.map.gallery.component.ts | 8 +- .../app/ui/gallery/thumbnailLoader.service.ts | 2 +- .../app/ui/settings/scheduled-jobs.service.ts | 3 + .../settings/workflow/workflow.component.html | 44 ++- .../fileprocessing/PhotoProcessing.spec.ts | 56 +--- 26 files changed, 530 insertions(+), 651 deletions(-) delete mode 100644 src/backend/middlewares/thumbnail/PhotoConverterMWs.ts delete mode 100644 src/backend/model/jobs/jobs/ThumbnailGenerationJob.ts diff --git a/src/backend/middlewares/thumbnail/PhotoConverterMWs.ts b/src/backend/middlewares/thumbnail/PhotoConverterMWs.ts deleted file mode 100644 index 7d57de60..00000000 --- a/src/backend/middlewares/thumbnail/PhotoConverterMWs.ts +++ /dev/null @@ -1,46 +0,0 @@ -import {NextFunction, Request, Response} from 'express'; -import * as fs from 'fs'; -import {PhotoProcessing} from '../../model/fileaccess/fileprocessing/PhotoProcessing'; -import {Config} from '../../../common/config/private/Config'; -import {ErrorCodes, ErrorDTO} from '../../../common/entities/Error'; - -export class PhotoConverterMWs { - public static async convertPhoto( - req: Request, - res: Response, - next: NextFunction - ): Promise { - if (!req.resultPipe) { - return next(); - } - // if conversion is not enabled redirect, so browser can cache the full - if (Config.Media.Photo.Converting.enabled === false) { - return res.redirect(req.originalUrl.slice(0, -1 * '\\bestFit'.length)); - } - const fullMediaPath = req.resultPipe as string; - - const convertedVideo = PhotoProcessing.generateConvertedPath( - fullMediaPath, - Config.Media.Photo.Converting.resolution - ); - - // check if converted photo exist - if (fs.existsSync(convertedVideo) === true) { - req.resultPipe = convertedVideo; - return next(); - } - - if (Config.Media.Photo.Converting.onTheFly === true) { - try { - req.resultPipe = await PhotoProcessing.convertPhoto(fullMediaPath); - } catch (err) { - return next(new ErrorDTO(ErrorCodes.PHOTO_GENERATION_ERROR, err.message)); - } - return next(); - } - - // not converted and won't be now - return res.redirect(req.originalUrl.slice(0, -1 * '\\bestFit'.length)); - } -} - diff --git a/src/backend/middlewares/thumbnail/ThumbnailGeneratorMWs.ts b/src/backend/middlewares/thumbnail/ThumbnailGeneratorMWs.ts index a62f13b0..a8943c09 100644 --- a/src/backend/middlewares/thumbnail/ThumbnailGeneratorMWs.ts +++ b/src/backend/middlewares/thumbnail/ThumbnailGeneratorMWs.ts @@ -14,7 +14,7 @@ import {PersonEntry} from '../../model/database/enitites/PersonEntry'; export class ThumbnailGeneratorMWs { private static ThumbnailMapEntries = - Config.Media.Thumbnail.generateThumbnailMapEntries(); + Config.Media.Photo.generateThumbnailMapEntries(); @ServerTime('2.th', 'Thumbnail decoration') public static async addThumbnailInformation( @@ -34,7 +34,7 @@ export class ThumbnailGeneratorMWs { // regenerate in case the list change since startup ThumbnailGeneratorMWs.ThumbnailMapEntries = - Config.Media.Thumbnail.generateThumbnailMapEntries(); + Config.Media.Photo.generateThumbnailMapEntries(); if (cw.directory) { ThumbnailGeneratorMWs.addThInfoTODir(cw.directory); } @@ -67,7 +67,7 @@ export class ThumbnailGeneratorMWs { let erroredItem: PersonEntry = null; try { - const size: number = Config.Media.Thumbnail.personThumbnailSize; + const size: number = Config.Media.Photo.personThumbnailSize; const persons: PersonEntry[] = req.resultPipe as PersonEntry[]; @@ -147,11 +147,11 @@ export class ThumbnailGeneratorMWs { const mediaPath = req.resultPipe as string; let size: number = parseInt(req.params.size, 10) || - Config.Media.Thumbnail.thumbnailSizes[0]; + Config.Media.Photo.thumbnailSizes[0]; // validate size - if (Config.Media.Thumbnail.thumbnailSizes.indexOf(size) === -1) { - size = Config.Media.Thumbnail.thumbnailSizes[0]; + if (Config.Media.Photo.thumbnailSizes.indexOf(size) === -1) { + size = Config.Media.Photo.thumbnailSizes[0]; } try { @@ -188,7 +188,7 @@ export class ThumbnailGeneratorMWs { // load parameters const mediaPath = req.resultPipe as string; - const size: number = Config.Media.Thumbnail.iconSize; + const size: number = Config.Media.Photo.iconSize; try { req.resultPipe = await PhotoProcessing.generateThumbnail( diff --git a/src/backend/model/diagnostics/ConfigDiagnostics.ts b/src/backend/model/diagnostics/ConfigDiagnostics.ts index 42c9bdee..f3213bd5 100644 --- a/src/backend/model/diagnostics/ConfigDiagnostics.ts +++ b/src/backend/model/diagnostics/ConfigDiagnostics.ts @@ -20,21 +20,24 @@ import { ServerAlbumCoverConfig, ServerDataBaseConfig, ServerJobConfig, - ServerThumbnailConfig, + ServerPhotoConfig, ServerVideoConfig, } from '../../../common/config/private/PrivateConfig'; import {SearchQueryParser} from '../../../common/SearchQueryParser'; import {SearchQueryTypes, TextSearch,} from '../../../common/entities/SearchQueryDTO'; import {Utils} from '../../../common/Utils'; +import {JobRepository} from '../jobs/JobRepository'; +import {ExtensionConfig} from '../extension/ExtensionConfigWrapper'; +import {ConfigClassBuilder} from '../../../../node_modules/typeconfig/node'; const LOG_TAG = '[ConfigDiagnostics]'; export class ConfigDiagnostics { static testAlbumsConfig( - // eslint-disable-next-line @typescript-eslint/no-unused-vars - albumConfig: ClientAlbumConfig, - // eslint-disable-next-line @typescript-eslint/no-unused-vars - original: PrivateConfigClass + // eslint-disable-next-line @typescript-eslint/no-unused-vars + albumConfig: ClientAlbumConfig, + // eslint-disable-next-line @typescript-eslint/no-unused-vars + original: PrivateConfigClass ): void { Logger.debug(LOG_TAG, 'Testing album config'); // nothing to check @@ -53,27 +56,39 @@ export class ConfigDiagnostics { } static async testDatabase( - databaseConfig: ServerDataBaseConfig + databaseConfig: ServerDataBaseConfig ): Promise { Logger.debug(LOG_TAG, 'Testing database config'); await SQLConnection.tryConnection(databaseConfig); if (databaseConfig.type === DatabaseType.sqlite) { try { await this.checkReadWritePermission( - SQLConnection.getSQLiteDB(databaseConfig) + SQLConnection.getSQLiteDB(databaseConfig) ); } catch (e) { throw new Error( - 'Cannot read or write sqlite storage file: ' + - SQLConnection.getSQLiteDB(databaseConfig) + 'Cannot read or write sqlite storage file: ' + + SQLConnection.getSQLiteDB(databaseConfig) ); } } } + static async testJobsConfig( + jobsConfig: ServerJobConfig + ): Promise { + Logger.debug(LOG_TAG, 'Testing jobs config'); + for(let i = 0; i< jobsConfig.scheduled.length; ++i){ + const j = jobsConfig.scheduled[i]; + if(!JobRepository.Instance.exists(j.name)){ + throw new Error('Unknown Job :' + j.name); + } + } + } + static async testMetaFileConfig( - metaFileConfig: ClientMetaFileConfig, - config: PrivateConfigClass + metaFileConfig: ClientMetaFileConfig, + config: PrivateConfigClass ): Promise { Logger.debug(LOG_TAG, 'Testing meta file config'); if (metaFileConfig.gpx === true && config.Map.enabled === false) { @@ -98,19 +113,19 @@ export class ConfigDiagnostics { ffmpeg().getAvailableCodecs((err: Error) => { if (err) { return reject( - new Error( - 'Error accessing ffmpeg, cant find executable: ' + - err.toString() - ) + new Error( + 'Error accessing ffmpeg, cant find executable: ' + + err.toString() + ) ); } ffmpeg(__dirname + '/blank.jpg').ffprobe((err2: Error) => { if (err2) { return reject( - new Error( - 'Error accessing ffmpeg-probe, cant find executable: ' + - err2.toString() - ) + new Error( + 'Error accessing ffmpeg-probe, cant find executable: ' + + err2.toString() + ) ); } return resolve(); @@ -157,26 +172,26 @@ export class ConfigDiagnostics { } - static async testThumbnailConfig( - thumbnailConfig: ServerThumbnailConfig + static async testPhotoConfig( + photoConfig: ServerPhotoConfig ): Promise { Logger.debug(LOG_TAG, 'Testing thumbnail config'); - if (thumbnailConfig.personFaceMargin < 0 || thumbnailConfig.personFaceMargin > 1) { + if (photoConfig.personFaceMargin < 0 || photoConfig.personFaceMargin > 1) { throw new Error('personFaceMargin should be between 0 and 1'); } - if (isNaN(thumbnailConfig.iconSize) || thumbnailConfig.iconSize <= 0) { + if (isNaN(photoConfig.iconSize) || photoConfig.iconSize <= 0) { throw new Error( - 'IconSize has to be >= 0 integer, got: ' + thumbnailConfig.iconSize + 'IconSize has to be >= 0 integer, got: ' + photoConfig.iconSize ); } - if (!thumbnailConfig.thumbnailSizes.length) { + if (!photoConfig.thumbnailSizes.length) { throw new Error('At least one thumbnail size is needed'); } - for (const item of thumbnailConfig.thumbnailSizes) { + for (const item of photoConfig.thumbnailSizes) { if (isNaN(item) || item <= 0) { throw new Error('Thumbnail size has to be >= 0 integer, got: ' + item); } @@ -184,18 +199,18 @@ export class ConfigDiagnostics { } static async testTasksConfig( - // eslint-disable-next-line @typescript-eslint/no-unused-vars - task: ServerJobConfig, - // eslint-disable-next-line @typescript-eslint/no-unused-vars - config: PrivateConfigClass + // eslint-disable-next-line @typescript-eslint/no-unused-vars + task: ServerJobConfig, + // eslint-disable-next-line @typescript-eslint/no-unused-vars + config: PrivateConfigClass ): Promise { Logger.debug(LOG_TAG, 'Testing tasks config'); return; } static async testFacesConfig( - faces: ClientFacesConfig, - config: PrivateConfigClass + faces: ClientFacesConfig, + config: PrivateConfigClass ): Promise { Logger.debug(LOG_TAG, 'Testing faces config'); if (faces.enabled === true) { @@ -206,33 +221,33 @@ export class ConfigDiagnostics { } static async testSearchConfig( - // eslint-disable-next-line @typescript-eslint/no-unused-vars - search: ClientSearchConfig, - // eslint-disable-next-line @typescript-eslint/no-unused-vars - config: PrivateConfigClass + // eslint-disable-next-line @typescript-eslint/no-unused-vars + search: ClientSearchConfig, + // eslint-disable-next-line @typescript-eslint/no-unused-vars + config: PrivateConfigClass ): Promise { Logger.debug(LOG_TAG, 'Testing search config'); //nothing to check } static async testSharingConfig( - sharing: ClientSharingConfig, - config: PrivateConfigClass + sharing: ClientSharingConfig, + config: PrivateConfigClass ): Promise { Logger.debug(LOG_TAG, 'Testing sharing config'); if ( - sharing.enabled === true && - config.Users.authenticationRequired === false + sharing.enabled === true && + config.Users.authenticationRequired === false ) { throw new Error('In case of no authentication, sharing is not supported'); } } static async testRandomPhotoConfig( - // eslint-disable-next-line @typescript-eslint/no-unused-vars - sharing: ClientRandomPhotoConfig, - // eslint-disable-next-line @typescript-eslint/no-unused-vars - config: PrivateConfigClass + // eslint-disable-next-line @typescript-eslint/no-unused-vars + sharing: ClientRandomPhotoConfig, + // eslint-disable-next-line @typescript-eslint/no-unused-vars + config: PrivateConfigClass ): Promise { Logger.debug(LOG_TAG, 'Testing random photo config'); //nothing to check @@ -244,14 +259,14 @@ export class ConfigDiagnostics { return; } if ( - map.mapProvider === MapProviders.Mapbox && - (!map.mapboxAccessToken || map.mapboxAccessToken.length === 0) + map.mapProvider === MapProviders.Mapbox && + (!map.mapboxAccessToken || map.mapboxAccessToken.length === 0) ) { throw new Error('Mapbox needs a valid api key.'); } if ( - map.mapProvider === MapProviders.Custom && - (!map.customLayers || map.customLayers.length === 0) + map.mapProvider === MapProviders.Custom && + (!map.customLayers || map.customLayers.length === 0) ) { throw new Error('Custom maps need at least one valid layer'); } @@ -268,10 +283,10 @@ export class ConfigDiagnostics { Logger.debug(LOG_TAG, 'Testing cover config'); const sp = new SearchQueryParser(); if ( - !Utils.equalsFilter( - sp.parse(sp.stringify(settings.SearchQuery)), - settings.SearchQuery - ) + !Utils.equalsFilter( + sp.parse(sp.stringify(settings.SearchQuery)), + settings.SearchQuery + ) ) { throw new Error('SearchQuery is not valid. Got: ' + JSON.stringify(sp.parse(sp.stringify(settings.SearchQuery)))); } @@ -286,7 +301,7 @@ export class ConfigDiagnostics { await ConfigDiagnostics.testMetaFileConfig(config.MetaFile, config); await ConfigDiagnostics.testAlbumsConfig(config.Album, config); await ConfigDiagnostics.testImageFolder(config.Media.folder); - await ConfigDiagnostics.testThumbnailConfig(config.Media.Thumbnail); + await ConfigDiagnostics.testPhotoConfig(config.Media.Photo); await ConfigDiagnostics.testSearchConfig(config.Search, config); await ConfigDiagnostics.testAlbumCoverConfig(config.AlbumCover); await ConfigDiagnostics.testFacesConfig(config.Faces, config); @@ -294,6 +309,7 @@ export class ConfigDiagnostics { await ConfigDiagnostics.testSharingConfig(config.Sharing, config); await ConfigDiagnostics.testRandomPhotoConfig(config.Sharing, config); await ConfigDiagnostics.testMapConfig(config.Map); + await ConfigDiagnostics.testJobsConfig(config.Jobs); } @@ -311,8 +327,8 @@ export class ConfigDiagnostics { const err: Error = ex; Logger.warn(LOG_TAG, '[SQL error]', err.toString()); Logger.error( - LOG_TAG, - 'Error during initializing SQL DB, check DB connection and settings' + LOG_TAG, + 'Error during initializing SQL DB, check DB connection and settings' ); process.exit(1); } @@ -323,15 +339,15 @@ export class ConfigDiagnostics { const err: Error = ex; Logger.warn( - LOG_TAG, - '[Thumbnail hardware acceleration] module error: ', - err.toString() + LOG_TAG, + '[Thumbnail hardware acceleration] module error: ', + err.toString() ); Logger.warn( - LOG_TAG, - 'Thumbnail hardware acceleration is not possible.' + - ' \'sharp\' node module is not found.' + - ' Falling back temporally to JS based thumbnail generation' + LOG_TAG, + 'Thumbnail hardware acceleration is not possible.' + + ' \'sharp\' node module is not found.' + + ' Falling back temporally to JS based thumbnail generation' ); process.exit(1); } @@ -349,32 +365,32 @@ export class ConfigDiagnostics { } catch (ex) { const err: Error = ex; NotificationManager.warning( - 'Video support error, switching off..', - err.toString() + 'Video support error, switching off..', + err.toString() ); Logger.warn( - LOG_TAG, - 'Video support error, switching off..', - err.toString() + LOG_TAG, + 'Video support error, switching off..', + err.toString() ); Config.Media.Video.enabled = false; } try { await ConfigDiagnostics.testMetaFileConfig( - Config.MetaFile, - Config + Config.MetaFile, + Config ); } catch (ex) { const err: Error = ex; NotificationManager.warning( - 'Meta file support error, switching off gpx..', - err.toString() + 'Meta file support error, switching off gpx..', + err.toString() ); Logger.warn( - LOG_TAG, - 'Meta file support error, switching off..', - err.toString() + LOG_TAG, + 'Meta file support error, switching off..', + err.toString() ); Config.MetaFile.gpx = false; } @@ -384,13 +400,13 @@ export class ConfigDiagnostics { } catch (ex) { const err: Error = ex; NotificationManager.warning( - 'Albums support error, switching off..', - err.toString() + 'Albums support error, switching off..', + err.toString() ); Logger.warn( - LOG_TAG, - 'Meta file support error, switching off..', - err.toString() + LOG_TAG, + 'Meta file support error, switching off..', + err.toString() ); Config.Album.enabled = false; } @@ -403,8 +419,8 @@ export class ConfigDiagnostics { Logger.error(LOG_TAG, 'Images folder error', err.toString()); } try { - await ConfigDiagnostics.testThumbnailConfig( - Config.Media.Thumbnail + await ConfigDiagnostics.testPhotoConfig( + Config.Media.Photo ); } catch (ex) { const err: Error = ex; @@ -417,14 +433,14 @@ export class ConfigDiagnostics { } catch (ex) { const err: Error = ex; NotificationManager.warning( - 'Search is not supported with these settings. Disabling temporally. ' + - 'Please adjust the config properly.', - err.toString() + 'Search is not supported with these settings. Disabling temporally. ' + + 'Please adjust the config properly.', + err.toString() ); Logger.warn( - LOG_TAG, - 'Search is not supported with these settings, switching off..', - err.toString() + LOG_TAG, + 'Search is not supported with these settings, switching off..', + err.toString() ); Config.Search.enabled = false; } @@ -434,13 +450,13 @@ export class ConfigDiagnostics { } catch (ex) { const err: Error = ex; NotificationManager.warning( - 'Cover settings are not valid, resetting search query', - err.toString() + 'Cover settings are not valid, resetting search query', + err.toString() ); Logger.warn( - LOG_TAG, - 'Cover settings are not valid, resetting search query', - err.toString() + LOG_TAG, + 'Cover settings are not valid, resetting search query', + err.toString() ); Config.AlbumCover.SearchQuery = { type: SearchQueryTypes.any_text, @@ -453,14 +469,14 @@ export class ConfigDiagnostics { } catch (ex) { const err: Error = ex; NotificationManager.warning( - 'Faces are not supported with these settings. Disabling temporally. ' + - 'Please adjust the config properly.', - err.toString() + 'Faces are not supported with these settings. Disabling temporally. ' + + 'Please adjust the config properly.', + err.toString() ); Logger.warn( - LOG_TAG, - 'Faces are not supported with these settings, switching off..', - err.toString() + LOG_TAG, + 'Faces are not supported with these settings, switching off..', + err.toString() ); Config.Faces.enabled = false; } @@ -470,14 +486,14 @@ export class ConfigDiagnostics { } catch (ex) { const err: Error = ex; NotificationManager.warning( - 'Some Tasks are not supported with these settings. Disabling temporally. ' + - 'Please adjust the config properly.', - err.toString() + 'Some Tasks are not supported with these settings. Disabling temporally. ' + + 'Please adjust the config properly.', + err.toString() ); Logger.warn( - LOG_TAG, - 'Some Tasks not supported with these settings, switching off..', - err.toString() + LOG_TAG, + 'Some Tasks not supported with these settings, switching off..', + err.toString() ); Config.Faces.enabled = false; } @@ -487,34 +503,34 @@ export class ConfigDiagnostics { } catch (ex) { const err: Error = ex; NotificationManager.warning( - 'Sharing is not supported with these settings. Disabling temporally. ' + - 'Please adjust the config properly.', - err.toString() + 'Sharing is not supported with these settings. Disabling temporally. ' + + 'Please adjust the config properly.', + err.toString() ); Logger.warn( - LOG_TAG, - 'Sharing is not supported with these settings, switching off..', - err.toString() + LOG_TAG, + 'Sharing is not supported with these settings, switching off..', + err.toString() ); Config.Sharing.enabled = false; } try { await ConfigDiagnostics.testRandomPhotoConfig( - Config.Sharing, - Config + Config.Sharing, + Config ); } catch (ex) { const err: Error = ex; NotificationManager.warning( - 'Random Media is not supported with these settings. Disabling temporally. ' + - 'Please adjust the config properly.', - err.toString() + 'Random Media is not supported with these settings. Disabling temporally. ' + + 'Please adjust the config properly.', + err.toString() ); Logger.warn( - LOG_TAG, - 'Random Media is not supported with these settings, switching off..', - err.toString() + LOG_TAG, + 'Random Media is not supported with these settings, switching off..', + err.toString() ); Config.Sharing.enabled = false; } @@ -524,20 +540,41 @@ export class ConfigDiagnostics { } catch (ex) { const err: Error = ex; NotificationManager.warning( - 'Maps is not supported with these settings. Using open street maps temporally. ' + - 'Please adjust the config properly.', - err.toString() + 'Maps is not supported with these settings. Using open street maps temporally. ' + + 'Please adjust the config properly.', + err.toString() ); Logger.warn( - LOG_TAG, - 'Maps is not supported with these settings. Using open street maps temporally ' + - 'Please adjust the config properly.', - err.toString() + LOG_TAG, + 'Maps is not supported with these settings. Using open street maps temporally ' + + 'Please adjust the config properly.', + err.toString() ); Config.Map.mapProvider = MapProviders.OpenStreetMap; } + try { + await ConfigDiagnostics.testJobsConfig( + Config.Jobs, + ); + } catch (ex) { + const err: Error = ex; + NotificationManager.warning( + 'Jobs error. Resetting to default for now to let the app start up. ' + + 'Please adjust the config properly.', + err.toString() + ); + Logger.warn( + LOG_TAG, + 'Jobs error. Resetting to default for now to let the app start up. ' + + 'Please adjust the config properly.', + err.toString() + ); + const pc = ConfigClassBuilder.attachPrivateInterface(new PrivateConfigClass()); + Config.Jobs.scheduled = pc.Jobs.scheduled; + } + } } diff --git a/src/backend/model/fileaccess/fileprocessing/PhotoProcessing.ts b/src/backend/model/fileaccess/fileprocessing/PhotoProcessing.ts index fd331ba3..53a5d8c2 100644 --- a/src/backend/model/fileaccess/fileprocessing/PhotoProcessing.ts +++ b/src/backend/model/fileaccess/fileprocessing/PhotoProcessing.ts @@ -21,13 +21,13 @@ export class PhotoProcessing { return; } - Config.Media.Thumbnail.concurrentThumbnailGenerations = Math.max( + Config.Media.Photo.concurrentThumbnailGenerations = Math.max( 1, os.cpus().length - 1 ); this.taskQue = new TaskExecuter( - Config.Media.Thumbnail.concurrentThumbnailGenerations, + Config.Media.Photo.concurrentThumbnailGenerations, (input): Promise => PhotoWorker.render(input) ); @@ -45,7 +45,7 @@ export class PhotoProcessing { photo.directory.name, photo.name ); - const size: number = Config.Media.Thumbnail.personThumbnailSize; + const size: number = Config.Media.Photo.personThumbnailSize; const faceRegion = person.sampleRegion.media.metadata.faces.find(f => f.name === person.name); // generate thumbnail path const thPath = PhotoProcessing.generatePersonThumbnailPath( @@ -65,11 +65,11 @@ export class PhotoProcessing { const margin = { x: Math.round( faceRegion.box.width * - Config.Media.Thumbnail.personFaceMargin + Config.Media.Photo.personFaceMargin ), y: Math.round( faceRegion.box.height * - Config.Media.Thumbnail.personFaceMargin + Config.Media.Photo.personFaceMargin ), }; @@ -90,9 +90,9 @@ export class PhotoProcessing { width: faceRegion.box.width + margin.x, height: faceRegion.box.height + margin.y, }, - useLanczos3: Config.Media.Thumbnail.useLanczos3, - quality: Config.Media.Thumbnail.quality, - smartSubsample: Config.Media.Thumbnail.smartSubsample, + useLanczos3: Config.Media.Photo.useLanczos3, + quality: Config.Media.Photo.quality, + smartSubsample: Config.Media.Photo.smartSubsample, } as MediaRendererInput; input.cut.width = Math.min( input.cut.width, @@ -110,13 +110,13 @@ export class PhotoProcessing { public static generateConvertedPath(mediaPath: string, size: number): string { const file = path.basename(mediaPath); - const animated = Config.Media.Thumbnail.animateGif && path.extname(mediaPath).toLowerCase() == '.gif'; + const animated = Config.Media.Photo.animateGif && path.extname(mediaPath).toLowerCase() == '.gif'; return path.join( ProjectPath.TranscodedFolder, ProjectPath.getRelativePathToImages(path.dirname(mediaPath)), - file + '_' + size + 'q' + Config.Media.Thumbnail.quality + + file + '_' + size + 'q' + Config.Media.Photo.quality + (animated ? 'anim' : '') + - (Config.Media.Thumbnail.smartSubsample ? 'cs' : '') + + (Config.Media.Photo.smartSubsample ? 'cs' : '') + PhotoProcessing.CONVERTED_EXTENSION ); } @@ -142,7 +142,7 @@ export class PhotoProcessing { .digest('hex') + '_' + size + - '_' + Config.Media.Thumbnail.personFaceMargin + + '_' + Config.Media.Photo.personFaceMargin + PhotoProcessing.CONVERTED_EXTENSION ); } @@ -177,8 +177,7 @@ export class PhotoProcessing { if ( (size + '').length !== sizeStr.length || - (Config.Media.Thumbnail.thumbnailSizes.indexOf(size) === -1 && - Config.Media.Photo.Converting.resolution !== size) + (Config.Media.Photo.thumbnailSizes.indexOf(size) === -1) ) { return false; } @@ -189,7 +188,7 @@ export class PhotoProcessing { const quality = parseInt(qualityStr, 10); if ((quality + '').length !== qualityStr.length || - quality !== Config.Media.Thumbnail.quality) { + quality !== Config.Media.Photo.quality) { return false; } @@ -198,7 +197,7 @@ export class PhotoProcessing { const lowerExt = path.extname(origFilePath).toLowerCase(); - const shouldBeAnimated = Config.Media.Thumbnail.animateGif && lowerExt == '.gif'; + const shouldBeAnimated = Config.Media.Photo.animateGif && lowerExt == '.gif'; if (shouldBeAnimated) { if (convertedPath.substring( nextIndex, @@ -210,7 +209,7 @@ export class PhotoProcessing { } - if (Config.Media.Thumbnail.smartSubsample) { + if (Config.Media.Photo.smartSubsample) { if (convertedPath.substring( nextIndex, nextIndex + 2 @@ -236,14 +235,6 @@ export class PhotoProcessing { return true; } - public static async convertPhoto(mediaPath: string): Promise { - return this.generateThumbnail( - mediaPath, - Config.Media.Photo.Converting.resolution, - ThumbnailSourceType.Photo, - false - ); - } static async convertedPhotoExist( mediaPath: string, @@ -287,9 +278,9 @@ export class PhotoProcessing { size, outPath, makeSquare, - useLanczos3: Config.Media.Thumbnail.useLanczos3, - quality: Config.Media.Thumbnail.quality, - smartSubsample: Config.Media.Thumbnail.smartSubsample, + useLanczos3: Config.Media.Photo.useLanczos3, + quality: Config.Media.Photo.quality, + smartSubsample: Config.Media.Photo.smartSubsample, } as MediaRendererInput; const outDir = path.dirname(input.outPath); @@ -328,9 +319,9 @@ viewBox="${svgIcon.viewBox || '0 0 512 512'}">d="${svgIcon.items}`, outPath, makeSquare: false, animate: false, - useLanczos3: Config.Media.Thumbnail.useLanczos3, - quality: Config.Media.Thumbnail.quality, - smartSubsample: Config.Media.Thumbnail.smartSubsample, + useLanczos3: Config.Media.Photo.useLanczos3, + quality: Config.Media.Photo.quality, + smartSubsample: Config.Media.Photo.smartSubsample, } as SvgRendererInput; const outDir = path.dirname(input.outPath); diff --git a/src/backend/model/jobs/JobRepository.ts b/src/backend/model/jobs/JobRepository.ts index 92a10bcd..a866bbf0 100644 --- a/src/backend/model/jobs/JobRepository.ts +++ b/src/backend/model/jobs/JobRepository.ts @@ -3,7 +3,6 @@ import {IndexingJob} from './jobs/IndexingJob'; import {GalleryRestJob} from './jobs/GalleryResetJob'; import {VideoConvertingJob} from './jobs/VideoConvertingJob'; import {PhotoConvertingJob} from './jobs/PhotoConvertingJob'; -import {ThumbnailGenerationJob} from './jobs/ThumbnailGenerationJob'; import {TempFolderCleaningJob} from './jobs/TempFolderCleaningJob'; import {AlbumCoverFillingJob} from './jobs/AlbumCoverFillingJob'; import {GPXCompressionJob} from './jobs/GPXCompressionJob'; @@ -33,6 +32,10 @@ export class JobRepository { } this.availableJobs[job.Name] = job; } + + exists(name: string) { + return !!this.availableJobs[name]; + } } JobRepository.Instance.register(new IndexingJob()); @@ -41,7 +44,6 @@ JobRepository.Instance.register(new AlbumCoverFillingJob()); JobRepository.Instance.register(new AlbumCoverRestJob()); JobRepository.Instance.register(new VideoConvertingJob()); JobRepository.Instance.register(new PhotoConvertingJob()); -JobRepository.Instance.register(new ThumbnailGenerationJob()); JobRepository.Instance.register(new GPXCompressionJob()); JobRepository.Instance.register(new TempFolderCleaningJob()); JobRepository.Instance.register(new AlbumRestJob()); diff --git a/src/backend/model/jobs/jobs/PhotoConvertingJob.ts b/src/backend/model/jobs/jobs/PhotoConvertingJob.ts index 87d182b2..83e6732d 100644 --- a/src/backend/model/jobs/jobs/PhotoConvertingJob.ts +++ b/src/backend/model/jobs/jobs/PhotoConvertingJob.ts @@ -2,26 +2,94 @@ import {Config} from '../../../../common/config/private/Config'; import {DefaultsJobs} from '../../../../common/entities/job/JobDTO'; import {FileJob} from './FileJob'; import {PhotoProcessing} from '../../fileaccess/fileprocessing/PhotoProcessing'; +import {ThumbnailSourceType} from '../../fileaccess/PhotoWorker'; +import {MediaDTOUtils} from '../../../../common/entities/MediaDTO'; +import {FileDTO} from '../../../../common/entities/FileDTO'; +import {backendTexts} from '../../../../common/BackendTexts'; -export class PhotoConvertingJob extends FileJob { +export class PhotoConvertingJob extends FileJob<{ + sizes?: number[]; + maxVideoSize?: number; + indexedOnly?: boolean; +}> { public readonly Name = DefaultsJobs[DefaultsJobs['Photo Converting']]; constructor() { - super({noVideo: true, noMetaFile: true}); + super({noMetaFile: true}); + this.ConfigTemplate.push({ + id: 'sizes', + type: 'number-array', + name: backendTexts.sizeToGenerate.name, + description: backendTexts.sizeToGenerate.description, + defaultValue: [Config.Media.Photo.thumbnailSizes[0]], + }, { + id: 'maxVideoSize', + type: 'number', + name: backendTexts.maxVideoSize.name, + description: backendTexts.maxVideoSize.description, + defaultValue: 800, + }); } public get Supported(): boolean { - return Config.Media.Photo.Converting.enabled === true; + return true; + } + + start( + config: { sizes?: number[]; indexedOnly?: boolean }, + soloRun = false, + allowParallelRun = false + ): Promise { + if (!config || !config.sizes || !Array.isArray(config.sizes) || config.sizes.length === 0) { + config = config || {}; + config.sizes = this.ConfigTemplate.find(ct => ct.id == 'sizes').defaultValue as number[]; + } + for (const item of config.sizes) { + if (Config.Media.Photo.thumbnailSizes.indexOf(item) === -1) { + throw new Error( + 'unknown thumbnails size: ' + + item + + '. Add it to the possible thumbnail sizes.' + ); + } + } + + return super.start(config, soloRun, allowParallelRun); + } + + protected async filterMediaFiles(files: FileDTO[]): Promise { + return files; + } + + // eslint-disable-next-line @typescript-eslint/no-unused-vars + protected async filterMetaFiles(files: FileDTO[]): Promise { + return undefined; } protected async shouldProcess(mPath: string): Promise { - return !(await PhotoProcessing.convertedPhotoExist( - mPath, - Config.Media.Photo.Converting.resolution - )); + for (const item of this.config.sizes) { + if (!(await PhotoProcessing.convertedPhotoExist(mPath, item))) { + return true; + } + } + return false; } protected async processFile(mPath: string): Promise { - await PhotoProcessing.convertPhoto(mPath); + const isVideo = MediaDTOUtils.isVideoPath(mPath); + for (const item of this.config.sizes) { + // skip hig- res photo creation for video files. App does not use photo preview fore videos in the lightbox + if (this.config.maxVideoSize < item && isVideo) { + continue; + } + await PhotoProcessing.generateThumbnail( + mPath, + item, + isVideo + ? ThumbnailSourceType.Video + : ThumbnailSourceType.Photo, + false + ); + } } } diff --git a/src/backend/model/jobs/jobs/ThumbnailGenerationJob.ts b/src/backend/model/jobs/jobs/ThumbnailGenerationJob.ts deleted file mode 100644 index e8a25f84..00000000 --- a/src/backend/model/jobs/jobs/ThumbnailGenerationJob.ts +++ /dev/null @@ -1,83 +0,0 @@ -import {Config} from '../../../../common/config/private/Config'; -import {DefaultsJobs} from '../../../../common/entities/job/JobDTO'; -import {FileJob} from './FileJob'; -import {PhotoProcessing} from '../../fileaccess/fileprocessing/PhotoProcessing'; -import {ThumbnailSourceType} from '../../fileaccess/PhotoWorker'; -import {MediaDTOUtils} from '../../../../common/entities/MediaDTO'; -import {FileDTO} from '../../../../common/entities/FileDTO'; -import {backendTexts} from '../../../../common/BackendTexts'; - -export class ThumbnailGenerationJob extends FileJob<{ - sizes?: number[]; - indexedOnly?: boolean; -}> { - public readonly Name = DefaultsJobs[DefaultsJobs['Thumbnail Generation']]; - - constructor() { - super({noMetaFile: true}); - this.ConfigTemplate.push({ - id: 'sizes', - type: 'number-array', - name: backendTexts.sizeToGenerate.name, - description: backendTexts.sizeToGenerate.description, - defaultValue: [Config.Media.Thumbnail.thumbnailSizes[0]], - }); - } - - public get Supported(): boolean { - return true; - } - - start( - config: { sizes?: number[]; indexedOnly?: boolean }, - soloRun = false, - allowParallelRun = false - ): Promise { - if (!config || !config.sizes || !Array.isArray(config.sizes) || config.sizes.length === 0) { - config = config || {}; - config.sizes = this.ConfigTemplate.find(ct => ct.id == 'sizes').defaultValue as number[]; - } - for (const item of config.sizes) { - if (Config.Media.Thumbnail.thumbnailSizes.indexOf(item) === -1) { - throw new Error( - 'unknown thumbnails size: ' + - item + - '. Add it to the possible thumbnail sizes.' - ); - } - } - - return super.start(config, soloRun, allowParallelRun); - } - - protected async filterMediaFiles(files: FileDTO[]): Promise { - return files; - } - - // eslint-disable-next-line @typescript-eslint/no-unused-vars - protected async filterMetaFiles(files: FileDTO[]): Promise { - return undefined; - } - - protected async shouldProcess(mPath: string): Promise { - for (const item of this.config.sizes) { - if (!(await PhotoProcessing.convertedPhotoExist(mPath, item))) { - return true; - } - } - return false; - } - - protected async processFile(mPath: string): Promise { - for (const item of this.config.sizes) { - await PhotoProcessing.generateThumbnail( - mPath, - item, - MediaDTOUtils.isVideoPath(mPath) - ? ThumbnailSourceType.Video - : ThumbnailSourceType.Photo, - false - ); - } - } -} diff --git a/src/backend/model/messenger/Messenger.ts b/src/backend/model/messenger/Messenger.ts index 3d2cf338..2b867f74 100644 --- a/src/backend/model/messenger/Messenger.ts +++ b/src/backend/model/messenger/Messenger.ts @@ -22,7 +22,7 @@ export abstract class Messenger = Record - Math.floor((1 + Math.random()) * 0x10000) - .toString(16) - .substring(1); + Math.floor((1 + Math.random()) * 0x10000) + .toString(16) + .substring(1); return s4() + s4() + '-' + s4() + s4(); } @@ -135,8 +135,8 @@ export class Utils { public static canonizePath(path: string): string { return path - .replace(new RegExp('\\\\', 'g'), '/') - .replace(new RegExp('/+', 'g'), '/'); + .replace(new RegExp('\\\\', 'g'), '/') + .replace(new RegExp('/+', 'g'), '/'); } static concatUrls(...args: string[]): string { @@ -262,9 +262,9 @@ export class Utils { const E = Math.pow(10, 38); const nE = Math.pow(10, -38); return ( - !isNaN(value) && - ((value >= -3.402823466 * E && value <= -1.175494351 * nE) || - (value <= 3.402823466 * E && value >= 1.175494351 * nE)) + !isNaN(value) && + ((value >= -3.402823466 * E && value <= -1.175494351 * nE) || + (value <= 3.402823466 * E && value >= 1.175494351 * nE)) ); } diff --git a/src/common/config/private/PrivateConfig.ts b/src/common/config/private/PrivateConfig.ts index a02dd3af..5375b9dd 100644 --- a/src/common/config/private/PrivateConfig.ts +++ b/src/common/config/private/PrivateConfig.ts @@ -16,11 +16,9 @@ import { ClientMediaConfig, ClientMetaFileConfig, ClientPhotoConfig, - ClientPhotoConvertingConfig, ClientServiceConfig, ClientSharingConfig, ClientSortingConfig, - ClientThumbnailConfig, ClientUserConfig, ClientVideoConfig, ConfigPriority, @@ -299,7 +297,7 @@ export class ServerUserConfig extends ClientUserConfig { @SubConfigClass({softReadonly: true}) -export class ServerThumbnailConfig extends ClientThumbnailConfig { +export class ServerPhotoConfig extends ClientPhotoConfig { @ConfigProperty({ tags: { @@ -664,16 +662,10 @@ export class ServerJobConfig { {} ), new JobScheduleConfig( - DefaultsJobs[DefaultsJobs['Thumbnail Generation']], - DefaultsJobs[DefaultsJobs['Thumbnail Generation']], + DefaultsJobs[DefaultsJobs['Photo Converting']], + DefaultsJobs[DefaultsJobs['Photo Converting']], new AfterJobTriggerConfig(DefaultsJobs[DefaultsJobs['Album Cover Filling']]), - {sizes: [240], indexedOnly: true} - ), - new JobScheduleConfig( - DefaultsJobs[DefaultsJobs['Photo Converting']], - DefaultsJobs[DefaultsJobs['Photo Converting']], - new AfterJobTriggerConfig(DefaultsJobs[DefaultsJobs['Thumbnail Generation']]), - {indexedOnly: true} + {sizes: [320], maxVideoSize: 800, indexedOnly: true} ), new JobScheduleConfig( DefaultsJobs[DefaultsJobs['Video Converting']], @@ -823,44 +815,6 @@ export class ServerVideoConfig extends ClientVideoConfig { transcoding: VideoTranscodingConfig = new VideoTranscodingConfig(); } -@SubConfigClass({softReadonly: true}) -export class PhotoConvertingConfig extends ClientPhotoConvertingConfig { - @ConfigProperty({ - tags: { - name: $localize`On the fly converting`, - priority: ConfigPriority.underTheHood, - uiDisabled: (sc: PhotoConvertingConfig) => - !sc.enabled - - }, - description: $localize`Converts photos on the fly, when they are requested.`, - }) - onTheFly: boolean = true; - @ConfigProperty({ - type: 'unsignedInt', - tags: { - name: $localize`Resolution`, - priority: ConfigPriority.advanced, - uiOptions: [720, 1080, 1440, 2160, 4320], - unit: 'px', - uiDisabled: (sc: PhotoConvertingConfig) => - !sc.enabled - }, - description: $localize`The shorter edge of the converted photo will be scaled down to this, while keeping the aspect ratio.`, - }) - resolution: videoResolutionType = 1080; -} - -@SubConfigClass({softReadonly: true}) -export class ServerPhotoConfig extends ClientPhotoConfig { - @ConfigProperty({ - tags: { - name: $localize`Photo resizing`, - priority: ConfigPriority.advanced, - } - }) - Converting: PhotoConvertingConfig = new PhotoConvertingConfig(); -} @SubConfigClass({softReadonly: true}) export class ServerAlbumCoverConfig { @@ -951,23 +905,10 @@ export class ServerMediaConfig extends ClientMediaConfig { name: $localize`Photo`, uiIcon: 'ionCameraOutline', priority: ConfigPriority.advanced, - uiJob: [ - { - job: DefaultsJobs[DefaultsJobs['Photo Converting']], - relevant: (c) => c.Media.Photo.Converting.enabled - }] + uiJob: [{job: DefaultsJobs[DefaultsJobs['Photo Converting']]}] } as TAGS }) Photo: ServerPhotoConfig = new ServerPhotoConfig(); - @ConfigProperty({ - tags: { - name: $localize`Thumbnail`, - uiIcon: 'ionImageOutline', - priority: ConfigPriority.advanced, - uiJob: [{job: DefaultsJobs[DefaultsJobs['Thumbnail Generation']]}] - } as TAGS - }) - Thumbnail: ServerThumbnailConfig = new ServerThumbnailConfig(); } @SubConfigClass({softReadonly: true}) diff --git a/src/common/config/public/ClientConfig.ts b/src/common/config/public/ClientConfig.ts index 6be967c8..3ac5b769 100644 --- a/src/common/config/public/ClientConfig.ts +++ b/src/common/config/public/ClientConfig.ts @@ -620,60 +620,6 @@ export class ClientMapConfig { bendLongPathsTrigger: number = 0.5; } -@SubConfigClass({tags: {client: true}, softReadonly: true}) -export class ClientThumbnailConfig { - @ConfigProperty({ - type: 'unsignedInt', max: 100, - tags: { - name: $localize`Map Icon size`, - unit: 'px', - priority: ConfigPriority.underTheHood - }, - description: $localize`Icon size (used on maps).`, - }) - iconSize: number = 45; - @ConfigProperty({ - type: 'unsignedInt', tags: { - name: $localize`Person thumbnail size`, - unit: 'px', - priority: ConfigPriority.underTheHood - }, - description: $localize`Person (face) thumbnail size.`, - }) - personThumbnailSize: number = 200; - @ConfigProperty({ - arrayType: 'unsignedInt', tags: { - name: $localize`Thumbnail sizes`, - priority: ConfigPriority.advanced - }, - description: $localize`Size of the thumbnails. The best matching size will be generated. More sizes give better quality, but use more storage and CPU to render. If size is 240, that shorter side of the thumbnail will have 160 pixels.`, - }) - thumbnailSizes: number[] = [240, 480]; - @ConfigProperty({ - volatile: true, - description: 'Updated to match he number of CPUs. This manny thumbnail will be concurrently generated.', - }) - concurrentThumbnailGenerations: number = 1; - - /** - * Generates a map for bitwise operation from icon and normal thumbnails - */ - generateThumbnailMap(): { [key: number]: number } { - const m: { [key: number]: number } = {}; - [this.iconSize, ...this.thumbnailSizes.sort()].forEach((v, i) => { - m[v] = Math.pow(2, i + 1); - }); - return m; - } - - /** - * Generates a map for bitwise operation from icon and normal thumbnails - */ - generateThumbnailMapEntries(): { size: number, bit: number }[] { - return Object.entries(this.generateThumbnailMap()).map(v => ({size: parseInt(v[0]), bit: v[1]})); - } -} - export enum NavigationLinkTypes { gallery = 1, faces, albums, search, url } @@ -1004,6 +950,16 @@ export class ClientLightboxConfig { loopVideos: boolean = false; + @ConfigProperty({ + tags: { + name: $localize`Load full resolution image on zoom.`, + priority: ConfigPriority.advanced + }, + description: $localize`Enables loading the full resolution image on zoom in the ligthbox (preview).`, + }) + loadFullImageOnZoom: boolean = true; + + @ConfigProperty({ tags: { name: $localize`Titles`, @@ -1156,8 +1112,10 @@ export class ClientGalleryConfig { @ConfigProperty({ tags: { name: $localize`Lightbox`, + uiIcon: 'ionImageOutline', priority: ConfigPriority.advanced, - }, + } as TAGS, + description: $localize`Photo and video preview window.` }) Lightbox: ClientLightboxConfig = new ClientLightboxConfig(); @@ -1228,37 +1186,65 @@ export class ClientVideoConfig { } -@SubConfigClass({tags: {client: true}, softReadonly: true}) -export class ClientPhotoConvertingConfig { - @ConfigProperty({ - tags: { - name: $localize`Enable` - } as TAGS, - description: $localize`Enable photo converting.` - }) - enabled: boolean = true; - - @ConfigProperty({ - tags: { - name: $localize`Load full resolution image on zoom.`, - priority: ConfigPriority.advanced, - uiDisabled: (sc: ClientPhotoConvertingConfig) => - !sc.enabled - }, - description: $localize`Enables loading the full resolution image on zoom in the ligthbox (preview).`, - }) - loadFullImageOnZoom: boolean = true; -} - @SubConfigClass({tags: {client: true}, softReadonly: true}) export class ClientPhotoConfig { + + @ConfigProperty({ + type: 'unsignedInt', max: 100, tags: { - name: $localize`Photo converting`, - priority: ConfigPriority.advanced - } + name: $localize`Map Icon size`, + unit: 'px', + priority: ConfigPriority.underTheHood + }, + description: $localize`Icon size (used on maps).`, }) - Converting: ClientPhotoConvertingConfig = new ClientPhotoConvertingConfig(); + iconSize: number = 45; + + @ConfigProperty({ + type: 'unsignedInt', tags: { + name: $localize`Person thumbnail size`, + unit: 'px', + priority: ConfigPriority.underTheHood + }, + description: $localize`Person (face) thumbnail size.`, + }) + personThumbnailSize: number = 200; + + @ConfigProperty({ + arrayType: 'unsignedInt', tags: { + name: $localize`Thumbnail and photo preview sizes`, + priority: ConfigPriority.advanced, + githubIssue: 806 + } as TAGS, + description: $localize`Size of the thumbnails and photo previews. The best matching size will be used (smaller for photo and video thumbnail, bigger for photo preview). More sizes give better quality, but use more storage and CPU to render. If size is 240, that shorter side of the thumbnail will be 240 pixels.`, + }) + thumbnailSizes: number[] = [320, 540, 1080, 2160]; + + @ConfigProperty({ + volatile: true, + description: 'Updated to match he number of CPUs. This manny thumbnail will be concurrently generated.', + }) + concurrentThumbnailGenerations: number = 1; + + + /** + * Generates a map for bitwise operation from icon and normal thumbnails + */ + generateThumbnailMap(): { [key: number]: number } { + const m: { [key: number]: number } = {}; + [this.iconSize, ...this.thumbnailSizes.sort()].forEach((v, i) => { + m[v] = Math.pow(2, i + 1); + }); + return m; + } + + /** + * Generates a map for bitwise operation from icon and normal thumbnails + */ + generateThumbnailMapEntries(): { size: number, bit: number }[] { + return Object.entries(this.generateThumbnailMap()).map(v => ({size: parseInt(v[0]), bit: v[1]})); + } @ConfigProperty({ arrayType: 'string', @@ -1288,13 +1274,6 @@ export class ClientGPXCompressingConfig { @SubConfigClass({tags: {client: true}, softReadonly: true}) export class ClientMediaConfig { - @ConfigProperty({ - tags: { - name: $localize`Thumbnail`, - priority: ConfigPriority.advanced - } - }) - Thumbnail: ClientThumbnailConfig = new ClientThumbnailConfig(); @ConfigProperty({ tags: { name: $localize`Video`, diff --git a/src/common/entities/job/JobDTO.ts b/src/common/entities/job/JobDTO.ts index 60ed59ca..3e364f2e 100644 --- a/src/common/entities/job/JobDTO.ts +++ b/src/common/entities/job/JobDTO.ts @@ -4,8 +4,7 @@ export enum DefaultsJobs { Indexing = 1, 'Gallery Reset' = 2, 'Video Converting' = 3, - 'Photo Converting' = 4, - 'Thumbnail Generation' = 5, + 'Photo Converting' = 5, 'Temp Folder Cleaning' = 6, 'Album Cover Filling' = 7, 'Album Cover Reset' = 8, diff --git a/src/frontend/app/model/backendtext.service.ts b/src/frontend/app/model/backendtext.service.ts index 1d69706a..1fa77cbd 100644 --- a/src/frontend/app/model/backendtext.service.ts +++ b/src/frontend/app/model/backendtext.service.ts @@ -14,6 +14,10 @@ export class BackendtextService { return $localize`Size to generate`; case backendTexts.sizeToGenerate.description: return $localize`These thumbnails will be generated. The list should be a subset of the enabled thumbnail sizes`; + case backendTexts.maxVideoSize.name: + return $localize`Max video size`; + case backendTexts.maxVideoSize.description: + return $localize`Sizes bigger than this value won't be generated for videos. Videos does not use photo based previews, so it is not needed to generate big previews for them.`; case backendTexts.indexedFilesOnly.name: return $localize`Indexed only`; case backendTexts.indexedFilesOnly.description: @@ -58,8 +62,6 @@ export class BackendtextService { return $localize`Gallery reset`; case DefaultsJobs['Album Reset']: return $localize`Album reset`; - case DefaultsJobs['Thumbnail Generation']: - return $localize`Thumbnail generation`; case DefaultsJobs['Photo Converting']: return $localize`Photo converting`; case DefaultsJobs['Video Converting']: @@ -92,10 +94,8 @@ export class BackendtextService { return $localize`Deletes all directories, photos and videos from the DB.`; case DefaultsJobs['Album Reset']: return $localize`Removes all albums from the DB`; - case DefaultsJobs['Thumbnail Generation']: - return $localize`Generates thumbnails from all media files and stores them in the tmp folder.`; - case DefaultsJobs['Photo Converting']: - return $localize`Generates high res photos from all media files and stores them in the tmp folder.`; + case DefaultsJobs['Photo Converting']: + return $localize`Generates thumbnails and high-res photos from all media files and stores them in the tmp folder. Smaller sizes will be used for thumbnail (in the grid view), bigger sizes for previews (in the lightbox). Videos does not use photo previews (the app loads the video file instead).`; case DefaultsJobs['Video Converting']: return $localize`Transcodes all videos and stores them in the tmp folder.`; case DefaultsJobs['Temp Folder Cleaning']: diff --git a/src/frontend/app/ui/gallery/Media.ts b/src/frontend/app/ui/gallery/Media.ts index 5a2ab610..98763ce7 100644 --- a/src/frontend/app/ui/gallery/Media.ts +++ b/src/frontend/app/ui/gallery/Media.ts @@ -4,8 +4,6 @@ import {Config} from '../../../../common/config/public/Config'; import {MediaDTO, MediaDTOUtils} from '../../../../common/entities/MediaDTO'; export class Media extends MediaIcon { - static readonly sortedThumbnailSizes = - Config.Media.Thumbnail.thumbnailSizes.sort((a, b): number => a - b); constructor( media: MediaDTO, @@ -27,8 +25,7 @@ export class Media extends MediaIcon { } getThumbnailSize(): number { - const longerEdge = Math.max(this.renderWidth, this.renderHeight); - return Utils.findClosestinSorted(longerEdge, Media.sortedThumbnailSizes); + return this.getMediaSize(this.renderWidth,this.renderHeight); } getReplacementThumbnailSize(): number { @@ -37,7 +34,7 @@ export class Media extends MediaIcon { const size = this.getThumbnailSize(); if (this.media.missingThumbnails) { - for (const thSize of Config.Media.Thumbnail.thumbnailSizes) { + for (const thSize of Config.Media.Photo.thumbnailSizes) { // eslint-disable-next-line no-bitwise if ( (this.media.missingThumbnails & MediaIcon.ThumbnailMap[thSize]) === @@ -73,7 +70,6 @@ export class Media extends MediaIcon { Config.Server.apiPath, '/gallery/content/', this.getRelativePath(), - 'thumbnail', size.toString() ); } @@ -83,14 +79,6 @@ export class Media extends MediaIcon { } getThumbnailPath(): string { - const size = this.getThumbnailSize(); - return Utils.concatUrls( - Config.Server.urlBase, - Config.Server.apiPath, - '/gallery/content/', - this.getRelativePath(), - 'thumbnail', - size.toString() - ); + return this.getBestSizedMediaPath(this.renderWidth,this.renderHeight); } } diff --git a/src/frontend/app/ui/gallery/MediaIcon.ts b/src/frontend/app/ui/gallery/MediaIcon.ts index 20acc081..1306e009 100644 --- a/src/frontend/app/ui/gallery/MediaIcon.ts +++ b/src/frontend/app/ui/gallery/MediaIcon.ts @@ -4,7 +4,10 @@ import {MediaDTO} from '../../../../common/entities/MediaDTO'; export class MediaIcon { protected static readonly ThumbnailMap = - Config.Media.Thumbnail.generateThumbnailMap(); + Config.Media.Photo.generateThumbnailMap(); + static readonly sortedThumbnailSizes = + Config.Media.Photo.thumbnailSizes.sort((a, b): number => a - b); + protected replacementSizeCache: number | boolean = false; @@ -17,79 +20,112 @@ export class MediaIcon { iconLoaded(): void { this.media.missingThumbnails -= - MediaIcon.ThumbnailMap[Config.Media.Thumbnail.iconSize]; + MediaIcon.ThumbnailMap[Config.Media.Photo.iconSize]; } isIconAvailable(): boolean { // eslint-disable-next-line no-bitwise return ( - (this.media.missingThumbnails & - MediaIcon.ThumbnailMap[Config.Media.Thumbnail.iconSize]) === - 0 + (this.media.missingThumbnails & + MediaIcon.ThumbnailMap[Config.Media.Photo.iconSize]) === + 0 + ); + } + + + isPhotoAvailable(renderWidth: number, renderHeight: number): boolean { + const size = this.getMediaSize(renderWidth, renderHeight); + // eslint-disable-next-line no-bitwise + return ( + (this.media.missingThumbnails & + MediaIcon.ThumbnailMap[size]) === 0 ); } getReadableRelativePath(): string { return Utils.concatUrls( - this.media.directory.path, - this.media.directory.name, - this.media.name + this.media.directory.path, + this.media.directory.name, + this.media.name ); } getRelativePath(): string { return ( - encodeURI( - this.getReadableRelativePath() - ) - // do not escape all urls with encodeURIComponent because that make the URL ugly and not needed - // do not escape before concatUrls as that would make prevent optimizations - // .replace(new RegExp('%', 'g'), '%25') // order important - .replace(new RegExp('#', 'g'), '%23') - .replace(new RegExp('\\$', 'g'), '%24') - .replace(new RegExp('\\?', 'g'), '%3F') + encodeURI( + this.getReadableRelativePath() + ) + // do not escape all urls with encodeURIComponent because that make the URL ugly and not needed + // do not escape before concatUrls as that would make prevent optimizations + // .replace(new RegExp('%', 'g'), '%25') // order important + .replace(new RegExp('#', 'g'), '%23') + .replace(new RegExp('\\$', 'g'), '%24') + .replace(new RegExp('\\?', 'g'), '%3F') ); } getIconPath(): string { return Utils.concatUrls( - Config.Server.urlBase, - Config.Server.apiPath, - '/gallery/content/', - this.getRelativePath(), - 'icon' + Config.Server.urlBase, + Config.Server.apiPath, + '/gallery/content/', + this.getRelativePath(), + 'icon' ); } - getMediaPath(): string { + getOriginalMediaPath(): string { return Utils.concatUrls( - Config.Server.urlBase, - Config.Server.apiPath, - '/gallery/content/', - this.getRelativePath() + Config.Server.urlBase, + Config.Server.apiPath, + '/gallery/content/', + this.getRelativePath() ); } - getBestFitMediaPath(): string { - return Utils.concatUrls(this.getMediaPath(), '/bestFit'); + getMediaSize(renderWidth: number, renderHeight: number): number { + const longerEdge = Math.max(renderWidth, renderHeight); + return Utils.findClosestinSorted(longerEdge, MediaIcon.sortedThumbnailSizes); + } + + /** + * @param renderWidth bonding box width + * @param renderHeight bounding box height + */ + getBestSizedMediaPath(renderWidth: number, renderHeight: number): string { + const size = this.getMediaSize(renderWidth, renderHeight); + return Utils.concatUrls( + Config.Server.urlBase, + Config.Server.apiPath, + '/gallery/content/', + this.getRelativePath(), + size.toString() + ); + } + + /** + * Uses the converted video if the original is not available + */ + getBestFitVideoPath(): string { + return Utils.concatUrls(this.getOriginalMediaPath(), '/bestFit'); } equals(other: MediaDTO | MediaIcon): boolean { // is gridphoto if (other instanceof MediaIcon) { return ( - this.media.directory.path === other.media.directory.path && - this.media.directory.name === other.media.directory.name && - this.media.name === other.media.name + this.media.directory.path === other.media.directory.path && + this.media.directory.name === other.media.directory.name && + this.media.name === other.media.name ); } // is media if (other.directory) { return ( - this.media.directory.path === other.directory.path && - this.media.directory.name === other.directory.name && - this.media.name === other.name + this.media.directory.path === other.directory.path && + this.media.directory.name === other.directory.name && + this.media.name === other.name ); } diff --git a/src/frontend/app/ui/gallery/lightbox/controls/controls.lightbox.gallery.component.html b/src/frontend/app/ui/gallery/lightbox/controls/controls.lightbox.gallery.component.html index 8cc1fb96..b93f119f 100644 --- a/src/frontend/app/ui/gallery/lightbox/controls/controls.lightbox.gallery.component.html +++ b/src/frontend/app/ui/gallery/lightbox/controls/controls.lightbox.gallery.component.html @@ -43,7 +43,7 @@ role="menu" aria-labelledby="button-basic">
  • - + Something went wrong. diff --git a/src/frontend/app/ui/gallery/lightbox/media/media.lightbox.gallery.component.ts b/src/frontend/app/ui/gallery/lightbox/media/media.lightbox.gallery.component.ts index 0842d89f..d6c514d8 100644 --- a/src/frontend/app/ui/gallery/lightbox/media/media.lightbox.gallery.component.ts +++ b/src/frontend/app/ui/gallery/lightbox/media/media.lightbox.gallery.component.ts @@ -48,17 +48,17 @@ export class GalleryLightboxMediaComponent implements OnChanges { get ImageTransform(): SafeStyle { return this.sanitizer.bypassSecurityTrustStyle( - 'scale(' + - this.zoom + - ') translate(calc(' + - -50 / this.zoom + - '% + ' + - this.drag.x / this.zoom + - 'px), calc(' + - -50 / this.zoom + - '% + ' + - this.drag.y / this.zoom + - 'px))' + 'scale(' + + this.zoom + + ') translate(calc(' + + -50 / this.zoom + + '% + ' + + this.drag.x / this.zoom + + 'px), calc(' + + -50 / this.zoom + + '% + ' + + this.drag.y / this.zoom + + 'px))' ); } @@ -71,7 +71,7 @@ export class GalleryLightboxMediaComponent implements OnChanges { return; } this.video.nativeElement.currentTime = - this.video.nativeElement.duration * (value / 100); + this.video.nativeElement.duration * (value / 100); if (this.video.nativeElement.paused) { this.video.nativeElement.play().catch(console.error); } @@ -134,9 +134,9 @@ export class GalleryLightboxMediaComponent implements OnChanges { } this.setImageSize(); if ( - this.thumbnailSrc == null && - this.gridMedia && - this.ThumbnailUrl !== null + this.thumbnailSrc == null && + this.gridMedia && + this.ThumbnailUrl !== null ) { this.thumbnailSrc = this.ThumbnailUrl; } @@ -167,8 +167,8 @@ export class GalleryLightboxMediaComponent implements OnChanges { // TODO:handle error this.imageLoadFinished.this = true; console.error( - 'Error: cannot load media for lightbox url: ' + - this.gridMedia.getBestFitMediaPath() + 'Error: cannot load media for lightbox url: ' + + this.gridMedia.getBestSizedMediaPath(window.innerWidth, window.innerHeight) ); this.loadNextPhoto(); } @@ -181,11 +181,12 @@ export class GalleryLightboxMediaComponent implements OnChanges { public showThumbnail(): boolean { return ( - this.gridMedia && - !this.mediaLoaded && - this.thumbnailSrc !== null && - (this.gridMedia.isThumbnailAvailable() || - this.gridMedia.isReplacementThumbnailAvailable()) + this.gridMedia && + !this.mediaLoaded && + this.thumbnailSrc !== null && + !this.gridMedia.isPhotoAvailable(window.innerWidth, window.innerHeight) && + (this.gridMedia.isThumbnailAvailable() || + this.gridMedia.isReplacementThumbnailAvailable()) ); } @@ -208,11 +209,7 @@ export class GalleryLightboxMediaComponent implements OnChanges { this.imageLoadFinished.next = true; return; } - if (Config.Media.Photo.Converting.enabled === true) { - this.nextImage.src = this.nextGridMedia.getBestFitMediaPath(); - } else { - this.nextImage.src = this.nextGridMedia.getMediaPath(); - } + this.nextImage.src = this.nextGridMedia.getBestSizedMediaPath(window.innerWidth, window.innerHeight); this.nextImage.onload = () => this.imageLoadFinished.next = true; this.nextImage.onerror = () => { @@ -231,29 +228,24 @@ export class GalleryLightboxMediaComponent implements OnChanges { } if ( - this.zoom === 1 || - Config.Media.Photo.Converting.loadFullImageOnZoom === false + this.zoom === 1 || + Config.Gallery.Lightbox.loadFullImageOnZoom === false ) { if (this.photo.src == null) { - if (Config.Media.Photo.Converting.enabled === true) { - this.photo.src = this.gridMedia.getBestFitMediaPath(); - this.photo.isBestFit = true; - } else { - this.photo.src = this.gridMedia.getMediaPath(); - this.photo.isBestFit = false; - } + this.photo.src = this.gridMedia.getBestSizedMediaPath(window.innerWidth, window.innerHeight); + this.photo.isBestFit = true; } // on zoom load high res photo } else if (this.photo.isBestFit === true || this.photo.src == null) { - this.photo.src = this.gridMedia.getMediaPath(); + this.photo.src = this.gridMedia.getOriginalMediaPath(); this.photo.isBestFit = false; } } public onVideoProgress(): void { this.videoProgress = - (100 / this.video.nativeElement.duration) * - this.video.nativeElement.currentTime; + (100 / this.video.nativeElement.duration) * + this.video.nativeElement.currentTime; } private setImageSize(): void { diff --git a/src/frontend/app/ui/gallery/map/lightbox/lightbox.map.gallery.component.ts b/src/frontend/app/ui/gallery/map/lightbox/lightbox.map.gallery.component.ts index 141241d8..dee6e2bf 100644 --- a/src/frontend/app/ui/gallery/map/lightbox/lightbox.map.gallery.component.ts +++ b/src/frontend/app/ui/gallery/map/lightbox/lightbox.map.gallery.component.ts @@ -72,12 +72,12 @@ export class GalleryMapLightboxComponent implements OnChanges, OnDestroy { defLayer: TileLayer; darkLayer: TileLayer; private smallIconSize = new Point( - Config.Media.Thumbnail.iconSize * 0.75, - Config.Media.Thumbnail.iconSize * 0.75 + Config.Media.Photo.iconSize * 0.75, + Config.Media.Photo.iconSize * 0.75 ); private iconSize = new Point( - Config.Media.Thumbnail.iconSize, - Config.Media.Thumbnail.iconSize + Config.Media.Photo.iconSize, + Config.Media.Photo.iconSize ); private usedIconSize = this.iconSize; private mapLayersControlOption: LeafletControlLayersConfig & { diff --git a/src/frontend/app/ui/gallery/thumbnailLoader.service.ts b/src/frontend/app/ui/gallery/thumbnailLoader.service.ts index 3d6b2863..38308758 100644 --- a/src/frontend/app/ui/gallery/thumbnailLoader.service.ts +++ b/src/frontend/app/ui/gallery/thumbnailLoader.service.ts @@ -25,7 +25,7 @@ export class ThumbnailLoaderService { if ( this.que.length === 0 || this.runningRequests >= - Config.Media.Thumbnail.concurrentThumbnailGenerations + Config.Media.Photo.concurrentThumbnailGenerations ) { return; } diff --git a/src/frontend/app/ui/settings/scheduled-jobs.service.ts b/src/frontend/app/ui/settings/scheduled-jobs.service.ts index fde6dd27..849b2d87 100644 --- a/src/frontend/app/ui/settings/scheduled-jobs.service.ts +++ b/src/frontend/app/ui/settings/scheduled-jobs.service.ts @@ -28,6 +28,9 @@ export class ScheduledJobsService { this.availableMessengers = new BehaviorSubject([]); } + public isValidJob(name: string): boolean { + return !!this.availableJobs.value.find(j => j.Name === name); + } public async getAvailableJobs(): Promise { this.availableJobs.next( diff --git a/src/frontend/app/ui/settings/workflow/workflow.component.html b/src/frontend/app/ui/settings/workflow/workflow.component.html index 01d8fc63..1e8caad3 100644 --- a/src/frontend/app/ui/settings/workflow/workflow.component.html +++ b/src/frontend/app/ui/settings/workflow/workflow.component.html @@ -1,24 +1,34 @@ - +
    + + + - {{schedule.name}} + {{ schedule.name }} every - {{periods[$any(schedule.trigger).periodicity]}} {{atTimeLocal($any(schedule.trigger).atTime) | date:"HH:mm (z)"}} + {{ periods[$any(schedule.trigger).periodicity] }} {{ atTimeLocal($any(schedule.trigger).atTime) | date:"HH:mm (z)" }} @{{$any(schedule.trigger).time | date:"medium"}} + *ngSwitchCase="JobTriggerType.scheduled">@{{ $any(schedule.trigger).time | date:"medium" }} + never after - {{$any(schedule.trigger).afterScheduleName}} + {{ $any(schedule.trigger).afterScheduleName }}
    @@ -27,6 +37,7 @@
    - {{backendTextService.getJobName(schedule.jobName)}} + {{ backendTextService.getJobName(schedule.jobName) }}
    @@ -128,7 +140,7 @@ + [for]="configEntry.id+'_'+i">{{ backendTextService.get(configEntry.name) }}
    @@ -235,7 +247,7 @@ (ngModelChange)="onChange($event)" [(ngModel)]="schedule.config[configEntry.id]" class="form-select"> - @@ -246,7 +258,9 @@
    + [for]="configEntry.id+'_'+i"> + Search Query + - {{ (j + 1) }}
    ';' separated integers. - {{backendTextService.get(configEntry.description)}} + {{ backendTextService.get(configEntry.description) }}
    @@ -405,7 +419,7 @@ [(ngModel)]="newSchedule.jobName" name="newJobName" required> { - /* eslint-disable no-unused-expressions,@typescript-eslint/no-unused-expressions */ - it('should generate converted file path', async () => { - - await Config.load(); - Config.Media.Thumbnail.thumbnailSizes = []; - Config.Media.Thumbnail.animateGif = true; - ProjectPath.ImageFolder = path.join(__dirname, './../../../assets'); - const photoPath = path.join(ProjectPath.ImageFolder, 'test_png.png'); - - expect(await PhotoProcessing - .isValidConvertedPath(PhotoProcessing.generateConvertedPath(photoPath, - Config.Media.Photo.Converting.resolution))) - .to.be.true; - - expect(await PhotoProcessing - .isValidConvertedPath(PhotoProcessing.generateConvertedPath(photoPath + 'noPath', - Config.Media.Photo.Converting.resolution))) - .to.be.false; - - { - const convertedPath = PhotoProcessing.generateConvertedPath(photoPath, - Config.Media.Photo.Converting.resolution); - Config.Media.Photo.Converting.resolution = (1 as any); - expect(await PhotoProcessing.isValidConvertedPath(convertedPath)).to.be.false; - } - }); - it('should generate converted gif file path', async () => { await Config.load(); - Config.Media.Thumbnail.thumbnailSizes = []; + Config.Media.Photo.thumbnailSizes = []; ProjectPath.ImageFolder = path.join(__dirname, './../../../assets'); const gifPath = path.join(ProjectPath.ImageFolder, 'earth.gif'); - Config.Media.Thumbnail.animateGif = true; - expect(await PhotoProcessing - .isValidConvertedPath(PhotoProcessing.generateConvertedPath(gifPath, - Config.Media.Photo.Converting.resolution))) - .to.be.true; - Config.Media.Thumbnail.animateGif = false; - expect(await PhotoProcessing - .isValidConvertedPath(PhotoProcessing.generateConvertedPath(gifPath, - Config.Media.Photo.Converting.resolution))) - .to.be.true; + for (const thSize of Config.Media.Photo.thumbnailSizes) { + Config.Media.Photo.animateGif = true; + + expect(await PhotoProcessing + .isValidConvertedPath(PhotoProcessing.generateConvertedPath(gifPath, thSize))) + .to.be.true; + + Config.Media.Photo.animateGif = false; + expect(await PhotoProcessing + .isValidConvertedPath(PhotoProcessing.generateConvertedPath(gifPath, thSize))) + .to.be.true; + } }); @@ -60,12 +35,11 @@ describe('PhotoProcessing', () => { it('should generate converted thumbnail path', async () => { await Config.load(); - Config.Media.Photo.Converting.resolution = (null as any); - Config.Media.Thumbnail.thumbnailSizes = [10, 20]; + Config.Media.Photo.thumbnailSizes = [10, 20]; ProjectPath.ImageFolder = path.join(__dirname, './../../../assets'); const photoPath = path.join(ProjectPath.ImageFolder, 'test_png.png'); - for (const thSize of Config.Media.Thumbnail.thumbnailSizes) { + for (const thSize of Config.Media.Photo.thumbnailSizes) { expect(await PhotoProcessing .isValidConvertedPath(PhotoProcessing.generateConvertedPath(photoPath, thSize))) .to.be.true;