Popup with media: How can I transform the returned value of a variable to lowercase before passing it into the sourceURL?

Question

I'm using one input-layer to get the attributes for two urls of images stored online. one url needs the ABK in lowercase (e.g. "https://www.xyz.x/xyz/xyz/foto_test.jpg") and one url needs the ABK in uppercase letters (e.g. "https://www.yy.y/y/yyy/foto_TEST.jpg"). I'm aware of various JS-functions which would transform the string from lowercase to uppercase and the other way round.

Unfortunately they don't work... either does it result in the transformation of the variable name (instead of the value) being transformed or in an unchanged variable value.

How can I transform the returned value of "{ABK}" to lowercase before passing it into the sourceURL?

Here my code snippet:

lang = "de"

title: "{PARK_NAME}",  content: [    {      type: "media",      mediaInfos: [        {        type: "image",        value: {          sourceURL: "https://www.xyz.x/xyz/xyz/foto_" + "{ABK}" + ".jpg", // here the ABK needs to be in lower case        }      }]    },{      type: "media", // to do: both logos next to each other instead of one after another      mediaInfos: [{        type: "image",        value: {          sourceURL: "https://www.yy.y/y/yyy/label/{ABK}", // here ABK needs to be uppercase        }      }]    }

nadja · Answer

Hi @JeffreyWilkerson

You're right, that's not my problem. I hope the following lines make it clearer:

The layer is hosted on the REST and is initialised as MapImageLayer in the map. It contains 20 different geometries with various variables. Amongst those variables/attributes is the said "ABK". ABK contains 20 different values, e.g. SNP, BVM, WPZ, ... I need the code to return the value of this variable (e.g. BVM), but in lowercase (e.g. bvm). Thus, I can't access the variable outside of the popup template (according to my understanding), as the value of "ABK" changes depending on which geometry has been clicked.

If I'm using your code, it just transforms {ABK} to {abk}. What I need is to transform the returned value to lowercase within the popup template. is that possible? or would a minimal example help?

JeffreyWilkerson · Answer

It's hard to understand where your URL references are coming from, but it almost seems as if you have access to them before they are needed. You should just be able to use the built in Javascript functions toLowerCase() and toUpperCase(), like:

let text = "{ABK}";
let lText = text.toLowerCase();
let uText = text.toUpperCase();

...
sourceURL: "https://www.xyz.x/xyz/xyz/foto_" + lText + ".jpg"
...
sourceURL: "https://www.yy.y/y/yyy/label/" + uText

But I'm guessing there's something you aren't telling us that makes this harder than this.