Copied to clipboard

Flag this post as spam?

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


  • dan 54 posts 133 karma points
    Sep 12, 2015 @ 23:54
    dan
    0

    MediaPicker Object to JSON using Serialization

    I'm trying to take a different approach to the same problem I have....

    "to convert the entire mediapicker with its contents to a json object"

    Example:

    { ['name':'muffin', 'file':'muffin.jpg', 'text':'some text'], ['name':'gargamel', 'file':'smurf.jpg', 'text':'some more text'] }
    

    This means not just to convert the mediaPicker but iterate through its folder contents to be part of the JSON object.

    I was trying to work out the issue in this other link here:

    https://our.umbraco.org/forum/umbraco-7/using-umbraco-7/70287-media-picker-object-to-javascript

    And on stack overflow: http://stackoverflow.com/questions/32184847/umbraco-mediapicker-object-data-to-json/32216406?noredirect=1#comment52553177_32216406.

    On stackoverflow, I got closer but was apparently unable to get the webAPI to work; i.e. convert a mediapicker to json.

    I'd gladly update all of my threads, if I could just get a solution but I digress.

    I'm creating this in a PartialViewMacroPage so I can add this dynamically. The first issue I see (partially due to my lack of understanding in razor is not being able to have the "using" to import items.

    So to use the JavaScriptSerializer class it looks like this:

     if (CurrentPage.HasValue("mediaPhotos")){     
            var mediaThingy = Umbraco.Media(CurrentPage.mediaPhotos);
            System.Web.Script.Serialization.JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
            var mediaJSON = serializer.Serialize(mediaThingy);
    

    This doesn't work so I tried referencing it in an external class in App_Code like from this link:

    http://www.devx.com/tips/Tip/43148

    Or here:

    http://www.advancesharp.com/blog/1086/convert-object-to-json-and-json-to-object-in-c

    I either can't debug with a break point or I get this error: A circular reference was detected while serializing an object of type 'Umbraco.Web.Models.DynamicPublishedContentList'.

    I don't know where I can go from here. The frustrating thing is if I just put a break point on a variable set equal to the "mediaThingy" var. I can see the contents of the mediapicker with a whole lot of other stuff. I just can't convert it to json.

    mediaPicker object contents

  • jivan thapa 194 posts 681 karma points
    Sep 13, 2015 @ 10:06
    jivan thapa
    0

    What you can do, is to create a new class and add some properties that you need on JSON data. I guess you do not need all Media properties on Json data. and use the Class instead of Entire Media object.

    Here is an example

     public  class MediaPickerProperties
        {
    
            public  string MediaUrl { get; set; }
            public  int MediaId { get; set; }
        }
    
    
       var mediaThingy = Umbraco.TypedMedia(1108);
    
        var mediaPickerProperties = new MediaPickerProperties
        {
            MediaId = mediaThingy.Id,
            MediaUrl = mediaThingy.Url
        };
    
    
        var serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
    
        var mediaJSON = serializer.Serialize(mediaPickerProperties);
    
        var jsonToMediaPicker = serializer.Deserialize<MediaPickerProperties>(mediaJSON);
    
        @jsonToMediaPicker.MediaId
    
  • dan 54 posts 133 karma points
    Sep 16, 2015 @ 00:22
    dan
    0

    Thanks Jivan

    I tried implementing your example and I see you did answer it though quite literally. I need the entire contents of the mediaPicker. So the mediaPicker plus its children.

    So the mediaPicker is a folder and that folder has contents. I need to get to the contents which are images with basic info; name, url, id, etc.

    I'm going to edit my question above.

  • dan 54 posts 133 karma points
    Sep 17, 2015 @ 03:36
    dan
    0

    I can only access the top level properties of the mediapicker object. How can I parse deeper into the object using dot notation?

    JavaScript makes it so much simpler where I could have a parent object and parse into it quickly but not in .net.

       someObj.array[0].name = "muffin";
       someObj.array[0].url = "http://www...";
    

    This edited screenshot from above, I'm trying to get down to the array of items contained in the mediapicker but I cannot reference its parent "Results View".

    If I can access that deep, I could loop through its contents and create a simple C# object to then serialize to JSON.

    Can some one show me how I can parse through to the mediapickers contents(the image files and their properties) so I can convert it?

    In the screenshot below. I can't just get to any of the properties. For example...

    m1.base. Results View [0].Id
    

    parsing .net object

  • dan 54 posts 133 karma points
    Sep 20, 2015 @ 01:01
    dan
    1

    Here is the screenshot of the data I'm ultimately trying to get to and serialize to JSON in the mediapicker. Its in a "non-public member" which I assume is private. I don't know how to get past this issue.

    'Umbraco.Web.Models.DynamicPublishedContentList.Items' is inaccessible due to its protection level
    

    How can I make this data accessible so I can simply write this to get the first item of the array:

    var item1 = selection.Items[0];
    

    Target data

  • jivan thapa 194 posts 681 karma points
    Sep 20, 2015 @ 07:02
    jivan thapa
    0

    Hi, Dan It is much more clear now. You may consider to use Umbraco.TypedMedia, and use the Children method.

    This might solve your issue.

      public  class MediaPickerProperties
        {
            public  string MediaUrl { get; set; }
            public  int MediaId { get; set; }
            public string Name { get; set; }
    
            public List<MediaPickerProperties> ChildList { get; set; } 
        }
    

    And here is how to serialize. ChildList contains the children item.

     var mediaThingy = Umbraco.TypedMedia(1109); 
      var mediaPickerProperties = new MediaPickerProperties
    {
        MediaId = mediaThingy.Id,
        MediaUrl = mediaThingy.DocumentTypeAlias == "Image" ? mediaThingy.Url : "",
        Name = mediaThingy.Name,
        ChildList = mediaThingy.Children.Select(x => 
             new MediaPickerProperties
             {
                  MediaId = x.Id , 
                 MediaUrl =  x.DocumentTypeAlias== "Image" ? x.Url : "" ,
                 Name = x.Name
              }).ToList()
    };
    
        var serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
    
        // serialize
        var mediaJSON = serializer.Serialize(mediaPickerProperties);
    
  • dan 54 posts 133 karma points
    Sep 20, 2015 @ 19:41
    dan
    0

    I keep running into this issue:

    "Cannot use a lambda expression as an argument to a dynamically dispatched operation without first casting it to a delegate"

    I did change the name of the helper class from MediaPickerProperties to MediaPickerModel but its still the same thing.

    public class MediaPickerModel
    {
        public int MediaId { get; set; }
        public string MediaName { get; set; }
        public string MediaUrl { get; set; }
        public List<MediaPickerModel> ChildList { get; set; } 
    }
    

    enter image description here

  • dan 54 posts 133 karma points
    Sep 24, 2015 @ 01:51
    dan
    0

    I know that this block of code is the issue and it circles around the value of x. The compiler doesn't like x since its not defined prior to runtime because its dynamic responding with the nebulous error message I called out above. I need to somehow re-write this so x is defined before runtime.

                ChildList = mediaThingy.Children.Select(x =>
                     new MediaPickerModel
                     {
                         MediaId = x.Id,
                         MediaUrl = x.DocumentTypeAlias == "Image" ? x.Url : "",
                         Name = x.Name
                     }).ToList()
    

    Full code Partial Macro Page for reference:

    @inherits Umbraco.Web.Macros.PartialViewMacroPage
    
    
      @if(CurrentPage.HasValue("mediaPhotos")){      
    
    
            var media = Umbraco.Media(CurrentPage.mediaPhotos);
            var mediaThingy = Umbraco.TypedMedia(media.Id);
    
            var mediaPickerProperties = new MediaPickerModel
            {
                MediaId = mediaThingy.Id,
                MediaName = mediaThingy.Name,
                ChildList = mediaThingy.Children.Select(x =>
                     new MediaPickerModel
                     {
                         MediaId = x.Id,
                         MediaUrl = x.DocumentTypeAlias == "Image" ? x.Url : "",
                         Name = x.Name
                     }).ToList()
            };
    
            var serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
            var mediaJSON = serializer.Serialize(mediaPickerProperties);
    }
    
  • jivan thapa 194 posts 681 karma points
    Sep 24, 2015 @ 03:50
    jivan thapa
    0

    Well, You can try normal foreach loop.

     var mediaThingy = Umbraco.TypedMedia(1109);
    
    
        var childList = new List<MediaPickerProperties>();
        foreach (var v in mediaThingy.Children)
        {
    
            if (v.DocumentTypeAlias == "Image")
            {
                 childList.Add(new MediaPickerProperties()
                 {
                     MediaId = v.Id,
                     MediaUrl = v.Url,
                     Name = v.Name
                 });
            }
        }
    
    
    
        var mediaPickerProperties = new MediaPickerProperties
        {
            MediaId = mediaThingy.Id,
            MediaUrl = mediaThingy.DocumentTypeAlias == "Image" ? mediaThingy.Url : "",
            Name = mediaThingy.Name,
            ChildList = childList
        };
    
  • dan 54 posts 133 karma points
    Sep 25, 2015 @ 17:00
    dan
    0

    OMG, I'm filly getting some where.

    It took me the longest time just to realize how to debug this properly.

    First the preview loads the previewed page into a iframe. That took me a bit to realize since I couldn't get the JSON value at first. The next issue I'm running into is this error.

    base {System.SystemException} = {"Cannot resolve a Url for a media item when there is no 'umbracoFile' property defined."}
    

    enter image description here

    Since this is a custom media type, I don't know what could be missing.

    I actually don't see any of the fields created with this media type for example I have a link(content picker), headline (text string), and text (textbox multiple). I cannot see any of them in the children list object of the mediapicker.

    For the Url property, I figured it would be as simple as comparing my custom type to the image type and changing the properties to match. I changed the "upload" property alias in my custom type to umbracoFile to match the Image media type I see this error.

    Url = The function evaluation requires all threads to run.
    

    enter image description here

    The only saving grace here is that I do see the Url property though I don't see it defined. Without changing the Upload property in the custom type to match the Image type, it doesn't even show up in the debugger.

Please Sign in or register to post replies

Write your reply to:

Draft