Sign in Register
Go to solution
Copied to clipboard

Flag this post as spam?

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


  • Matthew Vines 11 posts 31 karma points
    Jan 03, 2011 @ 00:44
    Matthew Vines
    0

    how to allow the user to select a media image in a macro.

    I've developed the following very simple .net user control macro.

    GallerMacro.ascx

    <%@ Control Language="C#" AutoEventWireup="true" CodeFile="GalleryMacro.ascx.cs" Inherits="GalleryMacro" %>
    <div id="gallery">
        <div class="third" id="text-panel">
          <%= GalleryText %>
        </div>
        <div class="third">
          <a rel="gallery" href="<%= Image1Path %>">
            <img src="<%= Image1Path %>" />
          </a>
        </div>
        <div class="third">
          <a rel="gallery" href="<%= Image2Path %>">
            <img src="<%= Image2Path %>" />
          </a>
        </div>
      </div>
      <div class="clear"></div>
      <div>
        <div class="eigth">
          <a rel="gallery" href="<%= Image3Path %>">
            <img src="<%= Image3Path %>" />
          </a>
        </div>
        <div class="eigth">
          <a rel="gallery" href="<%= Image4Path %>">
            <img src="<%= Image4Path %>" />
          </a>
        </div>
        <div class="eigth">
          <a rel="gallery" href="<%= Image5Path %>">
            <img src="<%= Image5Path %>" />
          </a>
        </div>
        <div class="eigth">
          <a rel="gallery" href="<%= Image6Path %>">
            <img src="<%= Image6Path %>" />
          </a>
        </div>
        <div class="eigth">
          <a rel="gallery" href="<%= Image7Path %>">
            <img src="<%= Image7Path %>" />
          </a>
        </div>
        <div class="eigth">
          <a rel="gallery" href="<%= Image8Path %>">
            <img src="<%= Image9Path %>" />
          </a>
        </div>
        <div class="eigth">
          <a rel="gallery" href="<%= Image9Path %>">
            <img src="<%= Image9Path %>" />
          </a>
        </div>
        <div class="eigth">
          <a rel="gallery" href="<%= Image10Path %>">
            <img src="<%= Image10Path %>" />
          </a>
        </div>
    </div>

    And GalleryMacro.ascx.cs

    public partial class GalleryMacro : System.Web.UI.UserControl
    {
        public string GalleryText { get; set; }
        public string Image1Path { get; set; }
        public string Image2Path { get; set; }
        public string Image3Path { get; set; }
        public string Image4Path { get; set; }
        public string Image5Path { get; set; }
        public string Image6Path { get; set; }
        public string Image7Path { get; set; }
        public string Image8Path { get; set; }
        public string Image9Path { get; set; }
        public string Image10Path { get; set; }
    }

    I have successfully copied this to my usercontrols directory, and bin directory, and set up a new macro in the developer section.

    Notice that I have all my properties as strings.  Listing Gallery description text, and then the paths to 10 images that will be used in the gallery.  So my GalleryText property points to a macro parameter of type text.  And all the ImageNPath parameters are of type currentMedia.  As I want the user to select an image from their media repository.

    Unfortunately, this is not working as I had expected.  This macro produces the following output after being added to a page and selecting all 10 images.

    <div id="gallery">
        <div class="third" id="text-panel">
          This is my galery text.
        </div>
        <div class="third">
          <a rel="gallery" href="1095">
            <img src="1095" />
          </a>
        </div>
        <div class="third">
          <a rel="gallery" href="1097">
            <img src="1097" />
          </a>
        </div>
      </div>
      <div class="clear"></div>
      <div>
        <div class="eigth">
          <a rel="gallery" href="1098">
            <img src="1098" />
          </a>
        </div>
        <div class="eigth">
          <a rel="gallery" href="1099">
            <img src="1099" />
          </a>
        </div>
        <div class="eigth">
          <a rel="gallery" href="1100">
            <img src="1100" />
          </a>
        </div>
        <div class="eigth">
          <a rel="gallery" href="1101">
            <img src="1101" />
          </a>
        </div>
        <div class="eigth">
          <a rel="gallery" href="1102">
            <img src="1102" />
          </a>
        </div>
        <div class="eigth">
          <a rel="gallery" href="1103">
            <img src="1104" />
          </a>
        </div>
        <div class="eigth">
          <a rel="gallery" href="1104">
            <img src="1104" />
          </a>
        </div>
        <div class="eigth">
          <a rel="gallery" href="1105">
            <img src="1105" />
          </a>
        </div>
    </div>

    Notice that the image paths are not paths at all, but rather, media item IDs I believe.  So, my question is: How do I allow my user to select an image useing the media picker control, and get the path into a set location in my macro?  I did not see a parameter type that will accomplish this the way I have it set up.

    Thanks for your time.

    Copy Link
  • Eran Meir 401 posts 543 karma points
    Jan 03, 2011 @ 07:36
    Eran Meir
    0

    you need to set the path to media source

    look at this

    http://our.umbraco.org/forum/developers/api-questions/7993-Get-URL-of-media-file

    Copy Link
  • skiltz 501 posts 701 karma points
    Jan 03, 2011 @ 09:12
    skiltz
    0

    This is the code I use.

         public string GetImageUrlFromMediaNode(int MediaNodeID)
            {
                XPathNodeIterator x1 = umbraco.library.GetMedia(MediaNodeID, false);
                x1.MoveNext();
                string imgUrl = String.Empty;
                XPathNodeIterator x2 = x1.Current.Select("/Image/umbracoFile");
                x2.MoveNext();
                return x2.Current.Value; 
            }
    Copy Link
  • Eran Meir 401 posts 543 karma points
    Jan 03, 2011 @ 14:49
    Eran Meir
    0

    i didnt had a chance to play with XPathNodeIterator, but if you get the path of the file why don't you save it in a string object instead of XPathNodeIterator ?

    Copy Link
  • Matthew Vines 11 posts 31 karma points
    Jan 03, 2011 @ 19:37
    Matthew Vines
    0

    Thanks skiltz that was exactly what I was looking for.

    I dug around quite a bit for some documenation on Media.  I couldn't even find how the xml is formatted post 4.5.  Makes this a lot more difficult than it needs to be.

    This is my updated code behind file for anyone who is curious.  There were no changes to the ascx file.

    using System.Xml.XPath;

    public partial class GalleryMacro : System.Web.UI.UserControl
    {
        public string GalleryText { get; set; }

        protected string Image1Path;
        private int _image1Id;
        public int Image1Id
        {
            get { return _image1Id; }
            set
            {
                _image1Id = value;
                Image1Path = GetImageUrlFromMediaNodeId(_image1Id);
            }
        }

        protected string Image2Path;
        private int _image2Id;
        public int Image2Id
        {
            get { return _image2Id; }
            set
            {
                _image2Id = value;
                Image2Path = GetImageUrlFromMediaNodeId(_image2Id);
            }
        }

        protected string Image3Path;
        private int _image3Id;
        public int Image3Id
        {
            get { return _image3Id; }
            set
            {
                _image3Id = value;
                Image3Path = GetImageUrlFromMediaNodeId(_image3Id);
            }
        }

        protected string Image4Path;
        private int _image4Id;
        public int Image4Id
        {
            get { return _image4Id; }
            set
            {
                _image4Id = value;
                Image4Path = GetImageUrlFromMediaNodeId(_image4Id);
            }
        }

        protected string Image5Path;
        private int _image5Id;
        public int Image5Id
        {
            get { return _image5Id; }
            set
            {
                _image5Id = value;
                Image5Path = GetImageUrlFromMediaNodeId(_image5Id);
            }
        }

        protected string Image6Path;
        private int _image6Id;
        public int Image6Id
        {
            get { return _image6Id; }
            set
            {
                _image6Id = value;
                Image6Path = GetImageUrlFromMediaNodeId(_image6Id);
            }
        }

        protected string Image7Path;
        private int _image7Id;
        public int Image7Id
        {
            get { return _image7Id; }
            set
            {
                _image7Id = value;
                Image7Path = GetImageUrlFromMediaNodeId(_image7Id);
            }
        }

        protected string Image8Path;
        private int _image8Id;
        public int Image8Id
        {
            get { return _image8Id; }
            set
            {
                _image8Id = value;
                Image8Path = GetImageUrlFromMediaNodeId(_image8Id);
            }
        }

        protected string Image9Path;
        private int _image9Id;
        public int Image9Id
        {
            get { return _image9Id; }
            set
            {
                _image9Id = value;
                Image9Path = GetImageUrlFromMediaNodeId(_image9Id);
            }
        }

        protected string Image10Path;
        private int _image10Id;
        public int Image10Id
        {
            get { return _image10Id; }
            set
            {
                _image10Id = value;
                Image10Path = GetImageUrlFromMediaNodeId(_image10Id);
            }
        }

        private string GetImageUrlFromMediaNodeId(int mediaNodeId)
        {
            XPathNodeIterator x1 = umbraco.library.GetMedia(mediaNodeId, false);
            x1.MoveNext();

            XPathNodeIterator x2 = x1.Current.Select("/Image/umbracoFile");
            x2.MoveNext();

            return x2.Current.Value;
        }
    }
    Copy Link
Please Sign in or register to post replies

Write your reply to:

Draft