Custom image presenter not working

Liberty Create - Build Advice
1

Hi,

I’m trying to allow builders to pick an image file. Have set up this in main.js:

return {
get_settings: function() {
return {
test_image: {
main_label: “Test Image”,
base_format: “file”
}
};
},

get_template_data: function() {
let imageValue = presenter.get_setting(‘test_image’);
cs.log('Test image value: ’ + imageValue);
return {
test_image_value: imageValue
};
}
};

However, when an image is selected in build studio as below and Apply is clicked, the value is not returned to the presenter (empty array for imageValue in Detective).

Clicking Apply clears the selected image.

Have also tried base_format of image. Same result.

Any help much appreciated.

Thanks in advance,

Mark

2

Interesting, I don’t think using a file/image input as a setting is actually supported behind the scenes, even though it lets you configure it.

You can do something similar using Assets though. Have a setting which lets you choose from a dropdown list of Asset Images for example, then grab the URL for the selected asset.

As a basic example:

	get_template_data: function() {
		return {
			image_url: cs.asset_file_url(widget.get_setting('image'))
		} 
	},

	get_settings: function() {
		return {
			image: {
				main_label: "Image file",
				base_format: "choice",
				choices: cs.build_choices("asset_image")
			}
		};
	}

And then in frontend:
<img :src="image_url" />

1 Like