1-888-365-2779
+1-888-365-2779
Try Now
More in this section

Forums / Developing with Sitefinity / ImageGallery fetch single Image

ImageGallery fetch single Image

7 posts, 0 answered
  1. Roman
    Roman avatar
    20 posts
    Registered:
    20 Jan 2009
    12 Aug 2009
    Link to this post
    Hi

    Actually my problem's quite simple. I tried to get the first Image of an ImageGallery (for setting new options like height & width).
    Since I'm a big noob I tried different ways (manager, listcontainer, etc.) but never really managed to fetch the right object.
    A little help would be great :)
    If I get annoying just ignore this post ;)

    Thanks
    Roman

  2. Joe
    Joe avatar
    5 posts
    Registered:
    26 Mar 2007
    12 Aug 2009
    Link to this post
    Hi,

    Try this:

      private static IList GetMyLibraryImages(string LibraryName)  
        {  
            Telerik.Libraries.LibraryManager libraryManager = new Telerik.Libraries.LibraryManager();  
            // get a library  
            Telerik.Libraries.ILibrary lib = libraryManager.GetLibrary(LibraryName);  
            // Get its ID as a Guid  
            Guid[] myGuid = new Guid[1];  
            myGuid[0] = lib.ID;  
            //Feed that GUID into the GetImages method and get all the images (assuming 1 is highest)  
            System.Collections.IList listOfImages = libraryManager.GetImages(0, 1, "Name ASC", myGuid);  
            return listOfImages;  
        }  

    -Joe
  3. Roman
    Roman avatar
    20 posts
    Registered:
    20 Jan 2009
    13 Aug 2009
    Link to this post
    Hello Joe

    Thanks a lot for your answer. This method is exactly what I've been looking for - but I don't know where to use it :S I could not find appropriate members of ImageGallery where I could get the library name and then assign the IList. Sorry.

    Thanks for your help!
    Best
    Roman
  4. Nikolai
    Nikolai avatar
    216 posts
    Registered:
    01 Jun 2017
    13 Aug 2009
    Link to this post
    Hi Roman,

    You can wrap the code in UserControl(.ascx).
    I am not sure what are you trying to do because there is Image control inside Sitefinity in which you can set properties like Wight and Height. 

    Greetings,
    Nikolai
    the Telerik team

    Instantly find answers to your questions on the newTelerik Support Portal.
    Check out the tipsfor optimizing your support resource searches.
  5. Roman
    Roman avatar
    20 posts
    Registered:
    20 Jan 2009
    13 Aug 2009
    Link to this post
    Hello Nikolai

    Thanks for your answer.
    What I try is to slightly modify my own ImageGallery. I need it to modify the first Image in an ImageLibrary. Hmm hope that helps:

    namespace Telerik.Libraries.WebControls  
    {  
        public class ImageGalleryExtender : ImageGallery  
        {  
            protected override void CreateChildControls()  
            {  
                base.CreateChildControls();  
     
                //Load the first Image - the one to modify.  
                Image theImageIWantToModify = this.Controls[0].Controls[0] as Image;  
     
                //Add a css class to it  
                theImageIWantToModify.CssClass = ".theBiggerImage";  
     
                //put the image back into the list  
                this.Controls[0].Controls[0] = theImageIWantToModify;  
     
            }  
        }  

    My example is not working, but kinda shows what I want to do.
    If further explanation is needed, please let me know!

    Thanks a lot to you two
    Best
    Roman
  6. Nikolai
    Nikolai avatar
    216 posts
    Registered:
    01 Jun 2017
    14 Aug 2009
    Link to this post
    Hi Roman,

    The ImageGallery  creates the Images via asp:Repeater so to get to the image control you will have to override most of the Methods in ImageGallery control. What I will suggest you is much simpler and it is done on the client-side so it does not require additional calls to the server. I will use JavaScript to get to the <img element and apply directly the class attribute. In this example I will show you how to do that with the default ImageGallery control.

    How to:
    1. Be sure to use external templates.
    2. Open ~\Sitefinity\Admin\ControlTemplates\Libraries\Modes\GalleryListView.ascx
    3. Wrap the asp:Repeater in <div> tags like this:
    <div id="imageList"
    <asp:Repeater ID="repeater" runat="server"
        <HeaderTemplate><ol class="sf_listAndPage"></HeaderTemplate> 
        <ItemTemplate> 
            <li> 
            <dl> 
                <dd class="sf_image" OnLoad="Asd" runat="server"><asp:HyperLink ID="DownloadLink" runat="server"  /></dd
                <dt ID="TitleWrap" runat="server"
                    <%--<asp:Literal ID="Literal1" runat="server" Text="<%$Resources:Title %>" />--%> 
                    <asp:HyperLink ID="Title" runat="server" /> 
                </dt> 
                <dd ID="UploadDateWrap" runat="server"
                   <%-- <asp:Literal ID="Literal3" runat="server" Text="<%$Resources:UploadDate %>" />--%> 
                    <asp:Literal ID="UploadDate" runat="server" /> 
                </dd> 
                <dd ID="AuthorWrap" runat="server"
                    <%--<asp:Literal ID="Literal2" runat="server" Text="<%$Resources:Author %>" />--%> 
                    <asp:Label ID="Author" runat="server" /> 
                </dd> 
                <dd ID="TagWrap" runat="server" class="sf_tags">     
                     
                    <asp:Repeater ID="Tags" runat="server"
                        <HeaderTemplate> 
                            <asp:Literal ID="Literal5" runat="server" Text="<%$Resources:Gallery_Tags %>" /> 
                        </HeaderTemplate> 
                        <ItemTemplate> 
                            <asp:HyperLink ID="tagLink" runat="server" /> 
                        </ItemTemplate> 
                    </asp:Repeater> 
                </dd> 
            </dl> 
            </li> 
        </ItemTemplate> 
        <FooterTemplate></ol></FooterTemplate> 
    </asp:Repeater> 
    </div> 

    4. At the bottom of the control add this JS code block:
    <script type="text/javascript"
         
        var div = document.getElementById('imageList'); 
        var firstImage = div.childNodes[1].childNodes[1].childNodes[1].childNodes[1].childNodes[0].childNodes[0]; 
        //Set Attributes Exaples 
        firstImage.setAttribute('width''50'); 
        firstImage.setAttribute('height''50'); 
        firstImage.setAttribute('class''MyClass'); 
     
    </script> 

    5. Save.

    You can see the result in the screen shot.

    Regards,
    Nikolai
    the Telerik team

    Instantly find answers to your questions on the newTelerik Support Portal.
    Check out the tipsfor optimizing your support resource searches.
  7. Roman
    Roman avatar
    20 posts
    Registered:
    20 Jan 2009
    14 Aug 2009
    Link to this post
    Wow thanks a lot for your perfect description! (And your patience of course)
    I'll try it out as soon as possible :)

    Many thanks!
    Greetings
    Roman
Register for webinar
7 posts, 0 answered