Now trying in a normal page with a DAMP called "image" and a cropup crop called "article".

What appears in the source is <img src="" alt="Focus Article" class="img-polaroid"> So the DAMP is being hit or I wouldn't be getting the alt text, just not getting a URL.

Any advice on how to access the crops URL would be greatly appreciated.

Seem to have this trouble everytime the Umbraco API changes, not enough documentation.

Cheers,

Craig

Hey Craig,

As I understand it, you are using DAMP plus have installed the CropUp compatibility pack plus have installed the DAMP property editor converter package and are using CropUp to render out your Cropped image using a specifc crop alias. DAMP (and it's converter) will not return you the CropUp data it will only return native Umbraco Cropping editor data, instead you just need to get the Url from DAMP using @imageItem.Url then use CropUp normally. The CropUp pack for DAMP makes use of CropUp in the Umbraco UI and allows your editors to see the CropUp settings (if added to your media items) when using DAMP.

e.g for a specifc CropUp cropping alias named "article" in your Eksponent.CropUp.config

@CropUp.GetUrl(imageItem.Url, new ImageSizeArguments {CropAlias = "article"})

Or if you just wanted to use a auto crop, specifying a width

 @CropUp.GetUrl(imageItem.Url, new ImageSizeArguments { Width = 200})

I think that's what you after?

Cheers,

Jeavon

Also, you need to add @using Eksponent.CropUp; to your View

Hi Jeavon,

Thanks for that. I now have images showing in a couple of scenarios but the final two escape me.

One is a page that has a Partial that lists out child content nodes and within each node is a DAMP. So it ends up being a foreach in a foreach.

The other is a page that list out child nodes within each is a DAMP, again, it's a foreach in a foreach but not in a partial.

In each case it's the inner foreach that fails.  Seems like the dataType of the first foreach doesn't contain the necessary structure for the second......

 Without Partial

                                @foreach(var itemPhoto in item.GetPropertyValue("photo")){                                

With Partial

                                foreach(var itemImage in item.GetPropertyValue("image")){

Is this stuff something that's discoverable or really requires documentation? In anycase, I hope this is helping someone else too.

Cheers,

Craig

I think you are nearly there, can you just try specifying the DAMP converter type after your GetPropertyValue methods? e.g item.GetPropertyValue<DAMP.PropertyEditorValueConverter.Model>("image") I think that's all your missing but I cant properly check until tomorrow now. Let me know.

I think are probably one of the first to be putting all this together but I'm sure it will be useful to others.

Thanks, Jeavon

HI Jeavon,

I'm just getting a YSOD with "Object not set to an instance of an object" on the new line.

Cheers,

Craig

Hi Jeavon,

You assumed correctly. Putting that check in place has fixed all of my DAMP access issues.

This brought out the fact that the first record in the DAMP in the first foreach didn't have an image selected but the second one did. So that must have been where the "Object not set to an instance of an object" came from. Good job this was the case actually as it would have been embarrassing had it gone live and the client just removed the first image!

Many thanks,

Craig

Hey Craig, awesome to hear all is working!

Cheers,

Jeavon

I'm using DAMP with CropUp in MVC with some extension methods. Here is how I use it:

MediaItem.cs

public class MediaItem
{
    public string Url { get; set; }
    public string Alt { get; set; }
    public virtual bool HasValue
    {
        get
        {
            return !string.IsNullOrEmpty(Url) && !string.IsNullOrEmpty(Alt);
        }
    }
}

MediaItemCrop.cs

public class MediaItemCrop : MediaItem
{
    public string Crop { get; set; }
    public override bool HasValue
    {
        get
        {
            return !string.IsNullOrEmpty(Url) && !string.IsNullOrEmpty(Alt) && !string.IsNullOrEmpty(Crop);
        }
    }
}

Extension methods:

/// <summary>
/// Return the media item.
/// </summary>
/// <param name="content"></param>
/// <param name="alias"></param>
/// <returns></returns>
public static MediaItem GetMediaItem(this IPublishedContent content, string alias, string altAlias = "", string placeholder = "")
{
    //Get all media items from DAMP.
    var dampModel = content.GetPropertyValue<DAMP.PropertyEditorValueConverter.Model>(alias);

    if (!dampModel.Any)
    {
        if (!string.IsNullOrEmpty(placeholder))
        {
            return new MediaItem()
            {
                Alt = "Placeholder",
                Url = placeholder
            };
        }

        return new MediaItem();
    }

    //Get the first media item from DAMP.
    var dampMedia = dampModel.First;

    //Return the media item with the properties set.
    return new MediaItem()
    {
        Url = dampMedia.Url,
        Alt = !string.IsNullOrEmpty(altAlias) ? dampMedia.GetProperty(altAlias) : dampMedia.Alt,
    };
}

/// <summary>
/// Return a croped image based on the width and height.
/// </summary>
/// <param name="content"></param>
/// <param name="alias"></param>
/// <param name="width"></param>
/// <param name="height"></param>
/// <returns></returns>
public static MediaItemCrop GetCroppedImage(this IPublishedContent content, string alias, int width, int height, string altAlias = "", string placeholder = "")
{
    //Get all media items from DAMP.
    var dampModel = content.GetPropertyValue<DAMP.PropertyEditorValueConverter.Model>(alias);

    if (!dampModel.Any)
    {
        if (!string.IsNullOrEmpty(placeholder))
        {
            return new MediaItemCrop()
            {
                Alt = "Placeholder",
                Url = placeholder,
                Crop = placeholder
            };
        }

        return new MediaItemCrop();
    }

    //Get the first media item from DAMP.
    var dampMedia = dampModel.First;

    //Return the media item with the properties set.
    return new MediaItemCrop()
    {
        Url = dampMedia.Url,
        Alt = !string.IsNullOrEmpty(altAlias) ? dampMedia.GetProperty(altAlias) : dampMedia.Alt,
        Crop = CropUp.GetUrl(dampMedia.Url, new ImageSizeArguments() { Width = width, Height = height })
    };
}

/// <summary>
/// Return all media items.
/// </summary>
/// <param name="content"></param>
/// <param name="alias"></param>
/// <returns></returns>
public static IEnumerable<MediaItem> GetMediaItems(this IPublishedContent content, string alias, string altAlias = "")
{
    //Get all media items from DAMP.
    var dampModel = content.GetPropertyValue<DAMP.PropertyEditorValueConverter.Model>(alias);

    if (!dampModel.Any())
    {
        //Return an empty IEnumerable if DAMP doesn't have any media items.
        return Enumerable.Empty<MediaItem>();
    }

    //Return the media items with the properties set.
    return 
    (
        from m in dampModel
        select new MediaItem()
        {
            Url = m.Url,
            Alt = !string.IsNullOrEmpty(altAlias) ? m.GetProperty(altAlias) : m.Alt,
        }
    );
}

/// <summary>
/// Return all images with crop based on the width and height.
/// </summary>
/// <param name="content"></param>
/// <param name="alias"></param>
/// <param name="width"></param>
/// <param name="height"></param>
/// <returns></returns>
public static IEnumerable<MediaItemCrop> GetCroppedImages(this IPublishedContent content, string alias, int width, int height, string altAlias = "")
{
    //Get all media items from DAMP.
    var dampModel = content.GetPropertyValue<DAMP.PropertyEditorValueConverter.Model>(alias);

    if (!dampModel.Any())
    {
        //Return an empty IEnumerable if DAMP doesn't have any media items.
        return Enumerable.Empty<MediaItemCrop>();
    }

    //Return the media items with the properties set.
    return 
    (
        from m in dampModel
        select new MediaItemCrop()
        {
            Url = m.Url,
            Alt = !string.IsNullOrEmpty(altAlias) ? m.GetProperty(altAlias) : m.Alt,
            Crop = CropUp.GetUrl(m.Url, new ImageSizeArguments() { Width = width, Height = height })
        }
    );
}

With those extension methods you can do this in your view:

//Single image
var image = Model.Content.GetCroppedImage("photo", 300, 148);
<img src="@image.Crop" alt="@image.Alt"/>

//Multiple images
var images = Model.Content.GetCroppedImages("photos", 300, 148);
foreach(var img in images)
{
   <a href="@img.Url" targer="_blank"><img src="@img.Crop" alt="@img.Alt"/></a>
} 

You can only use GetProperty on a DAMP model if you use the latest version on codeplex. Otherwise you should just use m.alt.

Jeroen

The above extension methods are part of the Hybrid Framework.

Jeroen

is working on a reply...