x First time here? Check out the FAQ

Come work for Umbraco - The Umbraco HQ are hiring Project managers, .NET developers and DevOps people!

  • Avatar50posts79karma

    Extracting the data of an image crop

    mmmoustache started this topic March 2, 2012 @ 05:19

    I'm working on the process of rendering out the crop version of an image using razor. I always seem to have consistency issues with this process, every time the solutions differs between Umbraco versions and projects, but this time I'm completely stuck. All the images that I want the crops of are in a Multi-Node Tree Picker and all I want to do is get the crop of each image instead of the full size versions.

    Here is my code at the moment, which renders out some xml (I think?) data about the crop image, including the Url of the crop itself:

    @foreach(var item in @Model.myMultiNodePickerProperty)
          {
             var media Model.MediaById(item.InnerText);
             var image Model.MediaById(media.primaryImage);
             var crops image.crops;
           <li>
                 <p>@crops</p>
           </li>
          }


    This is what renders within the paragraph tags:

     

    <crops date="14/11/2011 16:50:17"><crop name="myCropAlias" x="0" y="42" x2="220" y2="262" url="/media/1863/fileName_myCropAlias.jpg" /></crops>

    Is there a way to extract the url (I was thinking along the lines of '@crops.Url' but to no avail) or is there something I'm missing from the code?


  • Jeroen Breuer posted this reply March 4, 2012 @ 04:48

    Have a look at the Cultiv Razor Examples project. It also has some crop examples.

    Jeroen


  • Avatar80posts145karma
    Comment with ID: 127570
    Arjan H. posted this reply September 28, 2012 @ 03:53

    I've been struggling with different methods to fetch crop data. Checking the crop's BaseElement works best for me:

    @{
      var image = Model.MediaById(<mediaid>);
      var crops = image.mediaCropper; // mediaCropper is the Image Cropper property I added to the Image media type

    // check if specific crop exists
      if (crops.Find("@name","<cropname>").BaseElement != null) {
        // crop exists
        <img src="@crops.Find("@name","<cropname>").url" alt="@image.Name" />
      }
      else {
        // crop doesn't exist, use alternative method (e.g. ImageGen)
      }
    }

Please login or Sign up To post replies