Deploy Property Editor with Media Picker on Umbraco Cloud
I'm wondering if someone would know what's necessary if a custom Property Editor has a Media Picker that needs to be handled by Deploy when deploying between environments on Umbraco Cloud?
Is it enough to "flag" somewhere that "the config with the key 'someKeyName' is referencing a Media item" ?
I was 50/50 on replying to this, as it's likely to opens a can-o-worms... but I couldn't leave you hanging. :-)
It comes down to 2 options.
Make your property-editor's data format fit a shape that any of the existing ValueConnectors can understand. Then wire-up the UmbracoDeploy.Settings.config to point your editor alias to the existing ValueConnector. This is what is happening with nuPickers in the doc's example.
Write your own custom ValueConnector. Ultimately, you'll have more control over it, but you'll need to write C# and figure out how to test the damn thing. (Speaking from past experience).
Do you have an example of the data from your property-editor? I assume it's JSON.
I think I may be doing something weird, actually - because I can see now that it's not actually the Property Data that's wrong - it's the DataType that doesn't get deployed correct.
This is fine, but as it stores the image's path against the value - as opposed to the media's node ID. I've taken a look at the default Deploy ValueConnectors, unfortunately there's nothing that supports adding media node dependencies for the "imagepicker". There are various ones for "media", but that's not going to help you here.
So the way to do it is to write a custom Deploy connector, but not a ValueConnector... but a IPreValueConnector instead!
This would need to do a reverse lookup of the image path, to find the media node, and add that as a dependency for the Deploy transfer.
re: IPreValueConnector example. I had a look around, virtually non-existent!
OK, so I cooked something up...
Usual disclaimers apply... I haven't tested this - code snippet is MIT licensed, no warranty, don't sue me, yadda yadda yawn.
using System.Collections.Generic;
using Umbraco.Core;
using Umbraco.Core.Deploy;
using Umbraco.Core.Services;
namespace Vokseverk
{
public class ImageHotspotPreValueConnector : IPreValueConnector
{
private readonly IMediaService _mediaService;
// By the Power of Grayskull, I have dependency injection!
public ImageHotspotPreValueConnector(IMediaService mediaService)
{
_mediaService = mediaService;
}
public IEnumerable<string> PropertyEditorAliases => new[] { "Vokseverk.ImageHotspot" };
public IDictionary<string, string> ConvertToDeploy(IDictionary<string, string> preValues, ICollection<ArtifactDependency> dependencies)
{
// Get the value for the "imageSrc" prevalue/field.
if (preValues.TryGetValue("imageSrc", out string imageSrc) && string.IsNullOrWhiteSpace(imageSrc) == false)
{
// Go find the media node from the image path.
var media = _mediaService.GetMediaByPath(imageSrc);
if (media != null)
{
// Once found, get the UDI and add it as a dependency.
var udi = media.GetUdi();
dependencies.Add(new ArtifactDependency(udi, false, ArtifactDependencyMode.Exist));
}
}
// We didn't do anything with the prevalues, let's return them as is.
return preValues;
}
public IDictionary<string, string> ConvertToLocalEnvironment(IDictionary<string, string> preValues)
{
// Nothing to do here. Return the prevalues as is.
return preValues;
}
}
}
Add that to a C# file, drop it in your App_Code... cross your fingers and close your eyes, this is where the fun begins!
Added the code to the site and deployed it to DEV & LIVE
I made a change to the DataType on DEV and deployed that change to LIVE
I queued the nodes (5 in total so not many) using the DataType for transfer
I started the transfer and got a schema mismatch error that said the JSON checksum for the DataType was differing (the "source" from DEV correctly had the dependency recorded, while the "target" on LIVE didn't)
I tried many things thereafter - deleting the datatype on LIVE and deploying the new one all the way from DEV; deleting the content using it on LIVE and transferring that over from DEV. But nothing worked. I also talked to support but in the end decided I didn't have the time to continue trying.
/Chriztian
PS: Before anyone points out that the code doesn't compile (small syntax error with the out variable), I'll say that I fixed that part before trying any of the above :)
Small note about the out string bit, it's a C#7 feature for declaring variables inline. I think default for Umbraco 7.x is C#5. I'd forgot that when writing the code above. (I generally add latest C# on my websites.)
Ah - of course; it makes so much more sense that way :D
Thanks again Lee - appreciate the attempt; hopefully I get to try again on a less demanding site where I can mess a bit around and see what I'm missing!
Deploy Property Editor with Media Picker on Umbraco Cloud
I'm wondering if someone would know what's necessary if a custom Property Editor has a Media Picker that needs to be handled by Deploy when deploying between environments on Umbraco Cloud?
Is it enough to "flag" somewhere that "the config with the key 'someKeyName' is referencing a Media item" ?
Or do I need to write a ValueConnector and/or a config transform to include it in the
UmbracoDeploy.Settings.config
file, e.g. like shown here: https://our.umbraco.com/Documentation/Umbraco-Cloud/Deployment/Deploy-Settings/#valueconnectors ?Thanks, Chriztian
Hi Chriztian,
I was 50/50 on replying to this, as it's likely to opens a can-o-worms... but I couldn't leave you hanging. :-)
It comes down to 2 options.
UmbracoDeploy.Settings.config
to point your editor alias to the existing ValueConnector. This is what is happening with nuPickers in the doc's example.Do you have an example of the data from your property-editor? I assume it's JSON.
Cheers,
- Lee
Thanks Lee!
I think I may be doing something weird, actually - because I can see now that it's not actually the Property Data that's wrong - it's the DataType that doesn't get deployed correct.
It's this one, to be quite accurate: https://github.com/vokseverk/Vokseverk.ImageHotspot/
As you can probably figure out I have a config that's a Media Picker...
When I deploy a document with this property editor, the datatype is correctly transferred as a dependency but the referenced media item is not.
(Could be me not really understanding all of this :-)
/Chriztian
Sounds like you understand the problem fine. Knowing the solution on the other hand... let's just say, I've been there.
Is this for Umbraco 7? (Just to make sure).
I'll take a look at your repo. BRB.
Cool Lee — It's v7, yes. For now :D
/Chriztian
Looking at your property-editor config, the field (prevalue) is using "imagepicker".
https://github.com/vokseverk/Vokseverk.ImageHotspot/blob/v0.3/src/package.manifest#L16
This is fine, but as it stores the image's path against the value - as opposed to the media's node ID. I've taken a look at the default Deploy ValueConnectors, unfortunately there's nothing that supports adding media node dependencies for the "imagepicker". There are various ones for "media", but that's not going to help you here.
So the way to do it is to write a custom Deploy connector, but not a ValueConnector... but a
IPreValueConnector
instead!This would need to do a reverse lookup of the image path, to find the media node, and add that as a dependency for the Deploy transfer.
I'll see what I can knock up.
That is some nice explaining, Lee - thank you very much!
Makes great sense - I'll try to find some samples of
IPreValueConnector
s and have a play./Chriztian
re:
IPreValueConnector
example. I had a look around, virtually non-existent!OK, so I cooked something up...
Usual disclaimers apply... I haven't tested this - code snippet is MIT licensed, no warranty, don't sue me, yadda yadda yawn.
Add that to a C# file, drop it in your App_Code... cross your fingers and close your eyes, this is where the fun begins!
Cheers,
- Lee
I've sent it over as a pull request on your GitHub repo too! https://github.com/vokseverk/Vokseverk.ImageHotspot/pull/7
That is super awesome Lee — I'l let you know as soon as I've been able to try it out. Testing Deploy-/Transfer stuff on Cloud is not super easy :-D
/Chriztian
Some follow up for the curious:
So I tried it...
DEV
&LIVE
DEV
and deployed that change toLIVE
DEV
correctly had the dependency recorded, while the "target" onLIVE
didn't)I tried many things thereafter - deleting the datatype on
LIVE
and deploying the new one all the way fromDEV
; deleting the content using it onLIVE
and transferring that over fromDEV
. But nothing worked. I also talked to support but in the end decided I didn't have the time to continue trying./Chriztian
PS: Before anyone points out that the code doesn't compile (small syntax error with theout
variable), I'll say that I fixed that part before trying any of the above :)Bummer that it didn't work! :-(
Small note about the
out string
bit, it's a C#7 feature for declaring variables inline. I think default for Umbraco 7.x is C#5. I'd forgot that when writing the code above. (I generally add latest C# on my websites.)Ah - of course; it makes so much more sense that way :D
Thanks again Lee - appreciate the attempt; hopefully I get to try again on a less demanding site where I can mess a bit around and see what I'm missing!
/Chriztian
is working on a reply...