Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Toni Becker 146 posts 425 karma points
    Mar 30, 2011 @ 13:46
    Toni Becker
    0

    DAMP concerned retrieving Crop url @ Sebastiaan

    Okay let's start. The past 2 days we've managed to return multiple Images via Damp and Razor.

    Now next step. I've added to the MediaType an imageCropper with 2 values and want to retrieve the url data to output it for a galleryListing.

    Here's the XML:

       <galleryArea id="1159" parentID="1158" level="3" writerID="0" creatorID="0" nodeType="1072" template="1060" sortOrder="1" createDate="2011-03-21T15:36:28" updateDate="2011-03-30T12:33:11" nodeName="gallery" urlName="elo" writerName="admin" creatorName="admin" path="-1,1100,1158,1159" isDoc="">
            <galleryImg>
              <DAMP fullMedia="">
                <mediaItem>
                  <Image id="1195" version="25f94761-36b2-444f-9bcf-c5aa841275e2" parentID="1189" level="3" writerID="0" nodeType="1032" template="0" sortOrder="1" createDate="2011-03-30T12:31:13" updateDate="2011-03-30T12:31:13" nodeName="gallerylist" urlName="gallerylist" writerName="admin" nodeTypeAlias="Image" path="-1,1182,1189,1195">
                    <umbracoFile>/media/676/item1.jpg</umbracoFile>
                    <umbracoWidth>585</umbracoWidth>
                    <umbracoHeight>185</umbracoHeight>
                    <umbracoBytes>23498</umbracoBytes>
                    <umbracoExtension>jpg</umbracoExtension>
                    <thumbPictures>
                      <crops date="30.03.2011 12:31:23">
                        <crop name="thumbSmall" x="184" y="26" x2="344" y2="152" url="/media/676/item1_small.jpg" />
                        <crop name="thumbQuad" x="0" y="0" x2="585" y2="185" url="/media/676/item1_quad.jpg" />
                      </crops>
                    </thumbPictures>
                  </Image>
                </mediaItem>
              </DAMP>
            </galleryImg>

    And here's the razor so far, but it just a placeholder for rendering out 1 item so far and i'm using the XmlFunctions.cshtml inside my App_code folder:

    <img src="@XmlFunctions.GetAttributeValue(Model.galleryArea.galleryImg.mediaItem.Image.thumbPictures), "/crops/crop[@name = 'thumbSmall']", "url")" alt=""/>

    And it give's back this error:

    error CS1501: No overload for method 'GetAttributeValue' takes 1 arguments

    Any ideas solving this problem?

    dear sincerely Toni

    
    
                    
  • Alex 78 posts 136 karma points
    Mar 30, 2011 @ 13:51
    Alex
    0

    Not used XmlFunctions, but I would guess from the error message that you have got an extra closing bracket in there. Try this:

    <img src="@XmlFunctions.GetAttributeValue(Model.galleryArea.galleryImg.mediaItem.Image.thumbPictures, "/crops/crop[@name = 'thumbSmall']", "url")" alt=""/>
  • Toni Becker 146 posts 425 karma points
    Mar 30, 2011 @ 13:58
    Toni Becker
    0

    Throws an error while rendering out:

    The best overloaded method match for 'ASP.XmlFunctions.GetAttributeValue(string, string, string)' has some invalid arguments

  • Alex 78 posts 136 karma points
    Mar 30, 2011 @ 14:03
    Alex
    0

    I'm only guessing but this is probably because you are passing a DynamicXml object as the first parameter. Try this, no idea whether it will work or not and can't test anything at the moment (you might want to try outputting just Model.galleryArea.galleryImg.mediaItem.Image.thumbPictures.ToXml().ToString()to see what you are getting aswell):

    <img src="@XmlFunctions.GetAttributeValue(Model.galleryArea.galleryImg.mediaItem.Image.thumbPictures.ToXml().ToString(), "/crops/crop[@name = 'thumbSmall']", "url")" alt=""/>
  • Toni Becker 146 posts 425 karma points
    Mar 30, 2011 @ 14:09
    Toni Becker
    0

    Okay not giving back an error but it's not rendering the image hmpf.

    are there any other possibilities to retrieve the data inside the crops (url)?

  • Alex 78 posts 136 karma points
    Mar 30, 2011 @ 14:24
    Alex
    0

    You can probably just navigate through using the DynamicXml, like below, but you will start getting into trouble again when there is more than 1 image selected. Not sure how you would do a selection based on the crop name at the moment either. 

    @Model.galleryArea.galleryImg.mediaItem.Image.thumbPictures.crops.crop[0].url

    Maybe do something like this

    foreach(dynamic crop in Model.galleryArea.galleryImg.mediaItem.Image.thumbPictures.crops)
            {
               if (crop.name == "thumbSmall")
               <img src="@crop.url" /> }
            }

    edited because I was using our earlier example structure from the other thread

  • Toni Becker 146 posts 425 karma points
    Mar 30, 2011 @ 17:32
    Toni Becker
    0

    okay solved. :) thanks for the help alex. Couldn't realize that it's so easy to target the value inside the crop with the . notation.

    My oppinion razor rocks alot more than xslt does :)

  • Jeroen Breuer 4908 posts 12265 karma points MVP 4x admin c-trib
    Mar 31, 2011 @ 09:26
    Jeroen Breuer
    0

    Hello,

    I'm new to Razor and I'm interessted in a combination of this topic and the Question for an XML Data Loop topic. So how can I loop through multiple items that are selected with DAMP and then get a specific crop value? Hope someone can give me an example.

    Jeroen

  • Toni Becker 146 posts 425 karma points
    Mar 31, 2011 @ 10:24
    Toni Becker
    0

    I'm testing it out and will share the snippet with you.

    My logic behind is for using it for a featured article or a gallery. In the featured article i will have 1 big pictureframe and inside 3 topic related thumbs with pop up.

    So i think it's best to check with an if statement if there are multiple media items inside the picker with this loop:

        @using umbraco.MacroEngines
        @foreach(dynamic img in Model.Children)
        {
          if(img.imageUpload.ToString() != "")
          {
            foreach(dynamic d in img.imageUpload.mediaItem)
            {
              if (d.BaseElement.Name == "Image")
              { <img src="@d.umbracoFile" /> }
              else
              { <img src="@d.Image.umbracoFile" /> }
            }
          }
          else
          { <span>No images selected</span> }
       }

    So the next step of mine is to implement a checkbox for featured article defined in the docType.
    When checked looping through the crops and add it to the mainpictureframe. i think it sounds a little bit confusing but will show you an example when it's ready to release the snippet.

    A logical development could be

    If there's checked featured article, look up for the crops inside multiple Items and render it.

    Stay tuned :)

  • Jakub Leśniak 1 post 21 karma points
    Apr 20, 2012 @ 00:01
    Jakub Leśniak
    0

    A good example for using DUMP in Razor is in Cultiv Razor Examples.

    if (Model.HasValue("Media")) {
            dynamic mediaItems = Model.Media.mediaItem;
            if (mediaItems.Count() != 0)
            {
               
     
                    @foreach (var item in mediaItems)
     
                    {
     
                        var image = item.Image;
     
                       
      •                     Original image: @image.nodeName (@image.umbracoBytes bytes)
                       
                            @*
                                If the type of the mediacropper is not XML (but a string) then there 
                                are no crops defined, so I should not try to find the crops.
                            *@
                            @{ var crops = image.mediaCropper; }
                            @if (crops.GetType().ToString() != "System.String")
                            {
                                Crops:
                                @image.nodeName                        @image.nodeName
                            }
                       
     
                    }
     
                 

            }
        }

    Beware! Not every mediaItem has the property Image. Take a look at Dump data type settings. There's a setting that let's you choose if default type for created media is File, Folder or Image (or probably something else if there were more, I can't tell). The default is File. This was the reason why my code worked for the first image (from library) and crashed on the second one - created by DUMP. There are probably more catches like these. This is precisely why I hate dynamic keyword in C#!

     

  • Craig100 1136 posts 2523 karma points c-trib
    Jun 18, 2012 @ 16:49
    Craig100
    0

    Hi,

    Trying DAMP and Image Cropper datatypes for the first time. Using razor and using CultivRazorExamples and forum posts as a guide I can't get hold of a crop that I know is there. It's a 4.7.2 site.

    The Macro is:-

     

    @{
      var pagesToList = @Model.Children.Where("Visible");
      var width = Parameter.w;
      var height = Parameter.h;  
    
      foreach (var newsItem in pagesToList) {
          var newsCopy = newsItem.bodyText;
          newsCopy = Library.StripHtml(newsCopy);
          newsCopy = Library.Truncate(newsCopy, 200, true);
    
          var newsImage = ""; //newsItem.image1.mediaItem.Image.imageCropper.crops.crop.Find("name","News Item").url;                                      
          foreach (dynamic crop in newsItem.image1.mediaItem.Image.imageCropper.crops)
             {
                if(crop.name == "News Item")
                {
                 newsImage = crop.url;
                 }
              }
    
          <article class="newsListItem">
           <a href="@newsItem.Url"><img src="/ImageGen.ashx?image=@newsImage&amp;AltImage=noimage-newslist.gif&amp;width=@width&amp;height=@height" width="@width" height="@height" alt="@newsItem.summaryHeadline"></a>    
           <h3><a href="@newsItem.Url">@newsItem.headline</a></h3>
           <p>@newsCopy</p>
          </article>
        }
    }

     

    The XML from umbraco.config is:-

          <NewsItemPage id="1098" parentID="1097" level="3" writerID="0" creatorID="0" nodeType="1095" template="1096" sortOrder="1" createDate="2012-06-04T23:11:04" updateDate="2012-06-18T14:51:41" nodeName="NewsItem1" urlName="newsitem1" writerName="admin" creatorName="admin" path="-1,1053,1097,1098" isDoc="">
            <headline><![CDATA[This is the first articles headline]]></headline>
            <bodyText><![CDATA[
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris
    varius eros eu nulla convallis adipiscing. Sed ultrices mollis dui
    sit amet consectetur. Pellentesque interdum ante at risus sodales
    </p>
    ]]></bodyText>
            <articleExcerpt><![CDATA[Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut eget arcu in elit euismod facilisis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. In nec purus ultricies risus suscipit porta sit amet non nunc.]]></articleExcerpt>
            <newsListImage><![CDATA[]]></newsListImage>
            <image1>
              <DAMP fullMedia="">
                <mediaItem>
                  <Image id="1217" version="8a511a02-07d1-42e1-bb87-490da6ba9174" parentID="1119" level="2" writerID="0" nodeType="1032" template="0" sortOrder="1" createDate="2012-06-10T21:45:43" updateDate="2012-06-10T21:45:43" nodeName="Holly In Wnter" urlName="hollyinwnter" writerName="admin" nodeTypeAlias="Image" path="-1,1119,1217">
                    <umbracoFile>/media/2376/Holly in wnter.jpg</umbracoFile>
                    <umbracoWidth>2248</umbracoWidth>
                    <umbracoHeight>1360</umbracoHeight>
                    <umbracoBytes>444434</umbracoBytes>
                    <umbracoExtension>jpg</umbracoExtension>
                    <imageCropper>
                      <crops date="2012-06-10T21:45:43">
                        <crop name="Home Thumbnails" x="149" y="452" x2="1557" y2="1360" url="/media/2376/Holly in wnter_Home Thumbnails.jpg" />
                        <crop name="Submenu Thumbnails" x="580" y="0" x2="1668" y2="1360" url="/media/2376/Holly in wnter_Submenu Thumbnails.jpg" />
                        <crop name="News Item" x="215" y="2" x2="1573" y2="1360" url="/media/2376/Holly in wnter_News Item.jpg" />
                        <crop name="Contact Page" x="0" y="118" x2="2248" y2="1242" url="/media/2376/Holly in wnter_Contact Page.jpg" />
                        <crop name="Gallery Image" x="444" y="0" x2="1804" y2="1360" url="/media/2376/Holly in wnter_Gallery Image.jpg" />
                        <crop name="Zoomable Image" x="0" y="155" x2="2248" y2="1204" url="/media/2376/Holly in wnter_Zoomable Image.jpg" />
                      </crops>
                    </imageCropper>
                  </Image>
                </mediaItem>
              </DAMP>
            </image1>
            <image2>
              <DAMP fullMedia="">
                <mediaItem>
                  <Image id="1218" version="af108270-aaaf-4c97-8a67-38ee518ddad7" parentID="1119" level="2" writerID="0" nodeType="1032" template="0" sortOrder="2" createDate="2012-06-10T21:45:43" updateDate="2012-06-10T21:45:43" nodeName="Loch Clair" urlName="lochclair" writerName="admin" nodeTypeAlias="Image" path="-1,1119,1218">
                    <umbracoFile>/media/2381/Loch Clair.JPG</umbracoFile>
                    <umbracoWidth>3456</umbracoWidth>
                    <umbracoHeight>2304</umbracoHeight>
                    <umbracoBytes>1561867</umbracoBytes>
                    <umbracoExtension>JPG</umbracoExtension>
                    <imageCropper>
                      <crops date="2012-06-10T21:45:43">
                        <crop name="Home Thumbnails" x="827" y="188" x2="2770" y2="1441" url="/media/2381/Loch Clair_Home Thumbnails.jpg" />
                        <crop name="Submenu Thumbnails" x="806" y="0" x2="2649" y2="2304" url="/media/2381/Loch Clair_Submenu Thumbnails.jpg" />
                        <crop name="News Item" x="576" y="0" x2="2880" y2="2304" url="/media/2381/Loch Clair_News Item.jpg" />
                        <crop name="Contact Page" x="0" y="288" x2="3456" y2="2016" url="/media/2381/Loch Clair_Contact Page.jpg" />
                        <crop name="Gallery Image" x="576" y="0" x2="2880" y2="2304" url="/media/2381/Loch Clair_Gallery Image.jpg" />
                        <crop name="Zoomable Image" x="0" y="345" x2="3456" y2="1957" url="/media/2381/Loch Clair_Zoomable Image.jpg" />
                      </crops>
                    </imageCropper>
                  </Image>
                </mediaItem>
              </DAMP>
            </image2>
            <backgroundImage>1086</backgroundImage>
            <pageTitle>News Item</pageTitle>
            <metaDescription />
            <metaKeywords />
            <hideSubNav>0</hideSubNav>
            <xmldumpAllowed>0</xmldumpAllowed>
            <umbracoNaviHide>0</umbracoNaviHide>
            <hideFromSearchAndSitemap>0</hideFromSearchAndSitemap>
          </NewsItemPage>

    NewsItemPage are children of NewsAreaPage. Each NewsItemPage has two images, I just want to show the first image.

    The umbDebugShowTrace gives: "Error Loading Razor Script (file: Get News Items List) 'umbraco.MacroEngines.DynamicXml' does not contain a definition for 'name'", yet it is there. Other iterations of this code (from the cultivRazorExamples insisted that url wasn't there as well. There must be some syntax problem somewhere but I'm too new to see it.

    Any help would be greatly appreciated.

    Craig

  • Jeroen Breuer 4908 posts 12265 karma points MVP 4x admin c-trib
    Oct 25, 2012 @ 09:45
    Jeroen Breuer
    0

    Hello,

    I've released the DAMP Razor Model package. It's now much easier to use DAMP in Razor. It also has some examples and you can see a demo here: http://www.screenr.com/qvj8.

    Jeroen

Please Sign in or register to post replies

Write your reply to:

Draft