Fiddling with the paths again, found out I could set opacity, now it's a question of if I can adjust opacity gradually - and thinking of an SVG/Path only implementation of some simple environmental effects: darkening the entire background, setting it to sunset (darken and slightly red) or a dream version (strange color plus opacity). Here's a script snippet that puts an SVG overlay over the entire map and sets it to slightly dim (roughly 20% opacity for the black overlay) in the background layer. I was thinking of having it capable of changing gradually over time instead of instantly, and varying up the "target" color and opacity. Opacity is in hex, so the 20/40/60/80/100 equivalents are roughly 33/66/99/CC/FF var opacity = "33";
//
on("ready", function(){
let pageObj = getObj("page", Campaign().get("playerpageid"));
let pageWidth = pageObj.get("width") * 70;
let pageHeight = pageObj.get("height") * 70;
let pathObj = createObj('path', {
pageid: Campaign().get("playerpageid"),
left: pageWidth/2,
top: pageHeight/2,
width: pageWidth,
height: pageHeight,
fill: "#000000" + opacity,
stroke: "transparent",
stroke_width: 1,
layer: 'map',
path: JSON.stringify([["M", 0, pageHeight],["L", 0, 0],["L", pageWidth, 0],["L", pageWidth, pageHeight],["Z"]]),
controlledby: "emoji"
});
toFront(pathObj);
}); Hah - was just thinking "yeah, but this won't color the tokens..." but you could marry this with tinting the player tokens for a complete effect...