+
+
+
+
+
+
+
+ The preview mode for assets in content lists.
+
+
+
diff --git a/frontend/app/features/schemas/pages/schema/fields/types/assets-ui.component.ts b/frontend/app/features/schemas/pages/schema/fields/types/assets-ui.component.ts
index 685daf2f8..61ddbe296 100644
--- a/frontend/app/features/schemas/pages/schema/fields/types/assets-ui.component.ts
+++ b/frontend/app/features/schemas/pages/schema/fields/types/assets-ui.component.ts
@@ -25,6 +25,9 @@ export class AssetsUIComponent implements OnInit {
public properties: AssetsFieldPropertiesDto;
public ngOnInit() {
+ this.editForm.setControl('previewMode',
+ new FormControl(this.properties.previewMode));
+
this.editForm.setControl('resolveFirst',
new FormControl(this.properties.resolveFirst));
}
diff --git a/frontend/app/shared/services/schemas.types.ts b/frontend/app/shared/services/schemas.types.ts
index ef5fbbda1..f293cfde7 100644
--- a/frontend/app/shared/services/schemas.types.ts
+++ b/frontend/app/shared/services/schemas.types.ts
@@ -172,6 +172,7 @@ export class ArrayFieldPropertiesDto extends FieldPropertiesDto {
export class AssetsFieldPropertiesDto extends FieldPropertiesDto {
public readonly fieldType = 'Assets';
+ public readonly previewMode: 'ImageAndFileName' | 'Image' | 'FileName';
public readonly allowDuplicates?: boolean;
public readonly allowedExtensions?: ReadonlyArray;
public readonly resolveFirst: boolean;
diff --git a/frontend/app/shared/state/contents.forms.spec.ts b/frontend/app/shared/state/contents.forms.spec.ts
index 799297d59..a442f92d4 100644
--- a/frontend/app/shared/state/contents.forms.spec.ts
+++ b/frontend/app/shared/state/contents.forms.spec.ts
@@ -456,9 +456,43 @@ describe('GetContentValue', () => {
}
};
- const result = getContentValue(content, language, fieldAssets);
+ const assetWithImageAndFileName = createField({ properties: createProperties('Assets', { previewMode: 'ImageAndFileName' }) });
+
+ const result = getContentValue(content, language, assetWithImageAndFileName);
+
+ expect(result).toEqual({ value: ['url/to/13', 'file13'], formatted: new HtmlValue('
file13') });
+ });
+
+ it('should resolve image url only from referenced asset', () => {
+ const content: any = {
+ referenceData: {
+ field1: {
+ en: ['url/to/13', 'file13']
+ }
+ }
+ };
+
+ const assetWithImage = createField({ properties: createProperties('Assets', { previewMode: 'Image' }) });
+
+ const result = getContentValue(content, language, assetWithImage);
+
+ expect(result).toEqual({ value: ['url/to/13', 'file13'], formatted: new HtmlValue('') });
+ });
+
+ it('should resolve filename only from referenced asset', () => {
+ const content: any = {
+ referenceData: {
+ field1: {
+ en: ['url/to/13', 'file13']
+ }
+ }
+ };
+
+ const assetWithFileName = createField({ properties: createProperties('Assets', { previewMode: 'FileName' }) });
+
+ const result = getContentValue(content, language, assetWithFileName);
- expect(result).toEqual({ value: ['url/to/13', 'file13'], formatted: new HtmlValue(' file13') });
+ expect(result).toEqual({ value: ['url/to/13', 'file13'], formatted: 'file13' });
});
it('should resolve filename from referenced asset', () => {
diff --git a/frontend/app/shared/state/contents.forms.ts b/frontend/app/shared/state/contents.forms.ts
index 340c6d418..cd8d571c1 100644
--- a/frontend/app/shared/state/contents.forms.ts
+++ b/frontend/app/shared/state/contents.forms.ts
@@ -69,7 +69,15 @@ export function getContentValue(content: ContentDto, language: LanguageDto, fiel
if (value) {
if (isAssets && Types.isArray(value)) {
if (value.length === 2) {
- formatted = new HtmlValue(`
${value[1]}`);
+ const previewMode = field.properties['previewMode'];
+
+ if (previewMode === 'ImageAndFileName') {
+ formatted = new HtmlValue(` ${value[1]}`);
+ } else if (previewMode === 'Image') {
+ formatted = new HtmlValue(``);
+ } else {
+ formatted = value[1];
+ }
} else if (value.length === 1) {
formatted = value[0];
}