Probably best to use IPublishedContent as the type; then you can just use the ImageCropper extensions.

Hi John,

It's a good question. I've never tried the ImageCropper with Ditto.

We'll do some tests with it - unless you've already figured it out? ;-)

Cheers,
- Lee

Hi John,

I think this is likely due to the fact that within Umbraco there is no value converter that resolves the image cropper value to a strongly typed model. There does seem to be the concept of an ImageCropDataSet, which looks like this is what they convert to internally, however this hasn't been encapsulated in a value converter for when you wish to retrieve the raw value, so my guess is that it will come out as a string, and you'd need to JSON convert it (this is all HQ do internally).

When resolving a value to a type, ditto will use the inbuilt value converters first, and then the attributed type converters on your model if one is supplied.

I think the right thing here would be to create a value converter for the image cropper that can resolve an ImageCropDataSet. If you then needed this data in an alternative format, you could then use a custom Type Converter on your view model to convert it into something new.

Matt

Hello,

Here's a value converter I prepared earlier:

namespace MyProject.ValueConverters
{
    using Newtonsoft.Json;
    using System;
    using Umbraco.Core;
    using Umbraco.Core.Models.PublishedContent;
    using Umbraco.Core.PropertyEditors;
    using Umbraco.Web.Models;

    public class ImageCropperPropertyConverter : PropertyValueConverterBase, IPropertyValueConverterMeta
    {
        public override object ConvertSourceToObject(PublishedPropertyType propertyType, object source, bool preview)
        {
            try
            {
                return JsonConvert.DeserializeObject<ImageCropDataSet>(source.ToString());
            }
            catch
            {
                return null;
            }
        }

        public override bool IsConverter(PublishedPropertyType propertyType)
        {
            return Constants.PropertyEditors.ImageCropperAlias.InvariantEquals(propertyType.PropertyEditorAlias);
        }

        public PropertyCacheLevel GetPropertyCacheLevel(PublishedPropertyType propertyType, PropertyCacheValue cacheValue)
        {
            return PropertyCacheLevel.Content;
        }

        public Type GetPropertyValueType(PublishedPropertyType propertyType)
        {
            return typeof(ImageCropDataSet);
        }
    }
}

We also have created a GetCropUrl extension method on ImageCropDataSet which I could share if useful...?

Jeavon

I have been thinking for a while about adding this value converter and the GetCropUrl helper to my Core value converters package as we use it all the time as we use Ditto.

We think of value converters as "fixing" the core, so that everything is IPublishedContent or other existing core/third party models and then use TypeConverters for Ditto to convert to specific ViewModels etc...

It would be a breaking change so I would create a v3 release and add a legacy setting for upgrades....

Any thoughts...?

@Jeavon:

Your ImageCropperPropertyConverter found here seems to break the default methods for working with the image cropper (https://our.umbraco.org/documentation/getting-started/backoffice/property-editors/built-in-property-editors/image-cropper).

• HasImage and HasCrop are always false
• GetCropUrl returns something like Umbraco.Web.Models.ImageCropDataSet?mode=pad&rnd=130886239890000000

Any ideas?

I have had a bash at this and not quite getting it working either. I have added the converter and that is getting triggered but when i try and access the crops im getting a null value for the crops property.

Not sure whats going wrong...

My model property:

public ImageCropDataSet Image { get; set; }

and also have the Converter above.

If i remove the converter and use IPublishedContent i can get the crop fine but having no luck with ditto and converters for it.

Hi,

Sorry - i've only just got to look at this.

Can see your test works ok but if I use ImageCropDataSet I get a null object. Set its type to IPublishedContent and i can see the properties in the JSON and get the crop using razor.

Why could this be? Just doesn't work if i use ImagecropDataSet. I've also tied setting the property name in UmbracoProperty attribute as i a using a prefix. Wondered if that was causing issues.

    public IPublishedContent Image { get; set; }

or

    public ImageCropDataSet Image { get; set; }

When i add this code the Image is null so get no crop:

    [DittoIgnore]
    public string ImageCrop
    {
        get { return Image.GetCropUrl("infoBlock"); }
    }

Ah yeah - thats it. I have put an image cropper on the Image file type and then a media picker on my doc type.

I've quickly changed my code to have a nested class as above and we have a result so i'll have a look at the other options tonight and see what works best for what I am doing.

Thanks for the help Lee! :) Knew i must have been doing something wrong.

I've been away from Umbraco for a few months but it feels like over a year with all the new features and packages... playing catch up.

is working on a reply...