diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/imaging/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/media/imaging/constants.ts index 2df4ed57ef..e808cedcd9 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/imaging/constants.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/imaging/constants.ts @@ -1 +1,2 @@ export const UMB_IMAGING_REPOSITORY_ALIAS = 'Umb.Repository.Imaging'; +export const UMB_IMAGING_STORE_ALIAS = 'Umb.Store.Imaging'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/imaging/imaging.store.token.ts b/src/Umbraco.Web.UI.Client/src/packages/media/imaging/imaging.store.token.ts new file mode 100644 index 0000000000..cebe560072 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/media/imaging/imaging.store.token.ts @@ -0,0 +1,4 @@ +import type { UmbImagingStore } from './imaging.store.js'; +import { UmbContextToken } from '@umbraco-cms/backoffice/context-api'; + +export const UMB_IMAGING_STORE_CONTEXT = new UmbContextToken('UmbImagingStore'); diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/imaging/imaging.store.ts b/src/Umbraco.Web.UI.Client/src/packages/media/imaging/imaging.store.ts new file mode 100644 index 0000000000..c48a6a2d0d --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/media/imaging/imaging.store.ts @@ -0,0 +1,47 @@ +import { UMB_IMAGING_STORE_CONTEXT } from './imaging.store.token.js'; +import type { UmbImagingModel } from './types.js'; +import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api'; +import type { UmbApi } from '@umbraco-cms/backoffice/extension-api'; +import { UmbContextBase } from '@umbraco-cms/backoffice/class-api'; + +export class UmbImagingStore extends UmbContextBase implements UmbApi { + #data; + + constructor(host: UmbControllerHost) { + super(host, UMB_IMAGING_STORE_CONTEXT.toString()); + this.#data = new Map>(); + } + + /** + * Gets the data from the store. + */ + getData(unique: string) { + return this.#data.get(unique); + } + + /** + * Gets a specific crop if it exists. + */ + getCrop(unique: string, data?: UmbImagingModel) { + return this.#data.get(unique)?.get(this.#generateCropKey(data)); + } + + /** + * Adds a new crop to the store. + */ + addCrop(unique: string, urlInfo: string, data?: UmbImagingModel) { + if (!this.#data.has(unique)) { + this.#data.set(unique, new Map()); + } + this.#data.get(unique)?.set(this.#generateCropKey(data), urlInfo); + } + + /** + * Generates a unique key for the crop based on the width, height and mode. + */ + #generateCropKey(data?: UmbImagingModel) { + return data ? `${data.width}x${data.height};${data.mode}` : 'generic'; + } +} + +export default UmbImagingStore; diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/imaging/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/media/imaging/manifests.ts index 7f8ef13bb2..c27d00801c 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/imaging/manifests.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/imaging/manifests.ts @@ -1,5 +1,5 @@ -import { UMB_IMAGING_REPOSITORY_ALIAS } from './constants.js'; -import type { ManifestRepository, ManifestTypes } from '@umbraco-cms/backoffice/extension-registry'; +import { UMB_IMAGING_REPOSITORY_ALIAS, UMB_IMAGING_STORE_ALIAS } from './constants.js'; +import type { ManifestRepository, ManifestStore, ManifestTypes } from '@umbraco-cms/backoffice/extension-registry'; const repository: ManifestRepository = { type: 'repository', @@ -8,4 +8,11 @@ const repository: ManifestRepository = { api: () => import('./imaging.repository.js'), }; -export const manifests: Array = [repository]; +const store: ManifestStore = { + type: 'store', + alias: UMB_IMAGING_STORE_ALIAS, + name: 'Imaging Store', + api: () => import('./imaging.store.js'), +}; + +export const manifests: Array = [repository, store];