custom grideditor

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

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

Jimmy 31 posts 147 karma points

Mar 02, 2019 @ 13:43
0

Custom Grideditor

Umbraco 8

Umbraco 8
Hi

I am making a custom GridEditor in V8 { "name": "Thumbnail Image", "alias": "thumbImage", "view": "media", "icon": "icon-picture", "config": { "size": { "width": 200, "height": 200 } } }

But when it renders it does make use of the focus point. The rendered HTML is
```
<img src="/media/662af6ca411a4c93a6c722c4845698e7/00000006000000000000000000000000/16403439029_f500be349b_o.jpg?width=200&amp;height=200" alt="">
```
I would expect something like &center=0,0638297872340425,0,943262411347518&mode=crop added to the URL.

Am I missing something or?

Best regards

Jimmy
Copy Link
Søren Gregersen 441 posts 1884 karma points MVP 2x c-trib

Mar 03, 2019 @ 17:22

0

hi, you would need to edit the view (media.cshtml), to have the focalpoint rendered :)

Copy Link
Jimmy 31 posts 147 karma points

Mar 03, 2019 @ 18:00
0
Hi Søren

Thanks for your answer.

If I look in media.cshtml there is already this code
```
if(Model.value.focalPoint != null){
        url += "&center=" + Model.value.focalPoint.top +"," + Model.value.focalPoint.left;
        url += "&mode=crop";
    }
```
So I would expect it to work out of the box?
Copy Link
Søren Gregersen 441 posts 1884 karma points MVP 2x c-trib

Mar 03, 2019 @ 18:23

0

can you have a look at what it being saved?

use the dev tools to inspect the json posted to "PostSave" (or similar) in the backoffice. I don't think the focalpoint is being saved. I don't think it ever has in the grid editor ;)

You would have to load the image, and read the focalpoint from that

Mind you, the "image" saved in the media editor, is the url for the image, not the UDI :(

Copy Link

Jimmy 31 posts 147 karma points

Mar 03, 2019 @ 18:45

Hi Søren

You are right, focalpoint is not saved in V8.

Here is the PostSave for that grid item.

{
"grid": 4,
"allowAll": true,
"hasConfig": false,
"controls": [{
    "value": {
        "id": 1132,
        "udi": "umb://media/55514845b8bd487cb3709724852fd6bb",
        "image": "/media/55514845b8bd487cb3709724852fd6bb/00000006000000000000000000000000/4730684907_8a7f8759cb_b.jpg",
        "altText": "test thumb"
    },
    "editor": {
        "name": "Thumbnail Image",
        "alias": "thumbImage",
        "view": "media",
        "render": null,
        "icon": "icon-picture",
        "config": {
            "size": {
                "width": 200,
                "height": 200
            }
        }
    },
    "active": true
}],
"hasActiveChild": true,
"active": true

}

If I do the exact same thing in V7, then I do get focalpoint

{
                        "grid": 4,
                        "hasConfig": false,
                        "controls": [{
                            "value": "<p>2</p>",
                            "editor": {
                                "alias": "rte"
                            },
                            "active": false
                        }, {
                            "value": {
                                "focalPoint": {
                                    "left": 0.056818181818181816,
                                    "top": 0.085034013605442174
                                },
                                "id": 1069,
                                "udi": "umb://media/860e409b8f3246bd9b310e9eed3377d1",
                                "image": "/media/1003/dsc07977-2.jpg"
                            },
                            "editor": {
                                "alias": "thumbImage"
                            },
                            "active": false
                        }, {
                            "value": {
                                "focalPoint": {
                                    "left": 0.87045454545454548,
                                    "top": 0.12925170068027211
                                },
                                "id": 1066,
                                "udi": "umb://media/6ebd16dc88d0436d93c0366350d71973",
                                "image": "/media/1002/dsc08752-1-1.jpg",
                                "altText": "test thumb v7"
                            },
                            "editor": {
                                "alias": "thumbImage"
                            },
                            "active": true
                        }],
                        "active": true,
                        "hasActiveChild": true
                    }

Copy Link

is working on a reply...

Please Sign in or register to post replies

Flag this post as spam?