Roll20 uses cookies to improve your experience on our site. Cookies enable you to enjoy certain features, social sharing functionality, and tailor message and display ads to your interests on our site and others. They also help us understand how our site is being used. By continuing to use our site, you consent to our use of cookies. Update your cookie preferences .
×
Create a free account

Can a token fade into/out of view?

Is there a way to have a token or group of tokens graphically fade into or out of view over the course of a few seconds?
Not any simple or built-in way that I can think of.  The only way that I can think of would be to create a rollable token where each side was the same image with progressively more transparent images, then using a script to increment through the sides.  TokenMod can change the side, and you could probably use it in combination with MetaScripts and the !delay command to do that. There may be other scripts that can do that and/or a custom script might not be difficult to write for this. 
That is a very creative suggestion. Thank you!
1718312802
timmaugh
Forum Champion
API Scripter
I had a go at mocking this up, and while the mulit-sided token will work, I found it to have a bit too much "flicker" as it changed sides, so I mocked up a separate implementation where I used TokenMod + Metascripts to assign the image source of the token. First, the multi-sided token option: The command line in the GIF (shown in the roll template) left a little off. Here is the full command line I used: !{{(^) {&amp;select KokoroFade, +layer in [objects,gmlayer]} &nbsp; !token-mod --set currentside|1 &nbsp; !token-mod --set layer|objects {^&amp;delay .25} &nbsp; !token-mod --set currentside|2 {^&amp;delay .25} &nbsp; !token-mod --set currentside|3 {^&amp;delay .25} &nbsp; !token-mod --set currentside|4 {^&amp;delay .25} &nbsp; !token-mod --set currentside|5 {^&amp;delay .25} &nbsp; !token-mod --set currentside|6 {^&amp;delay .25} &nbsp; !token-mod --set currentside|7 {^&amp;delay .25} &nbsp; !token-mod --set currentside|8 {^&amp;delay .25} &nbsp; !token-mod --set currentside|9 {^&amp;delay .25} &nbsp; !token-mod --set currentside|10 {^&amp;delay .25} &nbsp; !multiTokenFx burst death {^&amp;delay .25} }} Note that for this one I planned on having the token (named KokoroFade) set to a transparent face to begin with, and positioned on the GM layer, so the first thing the command does is set the token to be the first face (10% opacity), and then it gets moved to the objects layer. After that, we cycle through sides that show images which are 10% increases in opacity, before finally erupting in an FX burst. Scripts Required: MetascriptToolbox TokenMod multiTokenFx (see code &amp; note at the bottom) Better Solution by Setting imgsrc of Token Here's the other (and better, IMO) solution I found, built around using TokenMod to change the imgsrc property of the token. To make this work, I still used the same rollable table of images (10 images, each in 10% opacity increments up to 100%). I created a token from this rollable table, named it "KokoroFadeSource," and placed it on the GMLayer. Then I placed a normal token (not mutli-sided) for the character I wanted to have fade in, and also on the GMLayer. This one I named "KokoroFade". The logic to this goes: ... set the token's imgsrc property to be a transparent png (using a hard-coded URL from my library for a fully transparent png) ... retrieve the sides list from the source token ... use a Plugger replace()&nbsp; function to replace the pipe-separators with new line characters and TokenMod verbiage to set up individual commands that will change the imgsrc of the main token, including individual {&amp;delay values} to give the effect time to manifest Note: I preexamined my images to see that they had 2 particular cache values on the end, which I also included in the find/replace so that I could strip the values off. In the end, the command line is slimmer and more token-agnostic, and the effect is smoother. Here is the command: !{{(^) {&amp;select KokoroFade, +layer in [gmlayer,objects]} &nbsp; !token-mod --set imgsrc|<a href="https://s3.amazonaws.com/files.d20.io/images/396805006/y_oYWA8ZypRaDvyLVsFuAQ/original.png" rel="nofollow">https://s3.amazonaws.com/files.d20.io/images/396805006/y_oYWA8ZypRaDvyLVsFuAQ/original.png</a> &nbsp; !token-mod --set layer|objects {^&amp;delay .1} &nbsp; !token-mod --set imgsrc|{&amp;eval}replace(--source|"@(KokoroFadeSource.sides)" --find#"https%3A"#"https:" --find|%3F1718223729|' ' --find|%3F1718223730|' ' --find#"|"#"{&amp;^delay .25}{&amp;cr}!token-mod --set imgsrc|"){&amp;/eval}{&amp;^delay .25} &nbsp; !multiTokenFx burst death {^&amp;delay .25} }} And here is the effect in action: A Note About multiTokenFx I'm using a script I nabbed from Nick O in this video , but which I have modified to work with metascripts. The version I'm using is below: /* */ on('ready', () =&gt; { &nbsp; &nbsp; on("chat:message", msg =&gt; { &nbsp; &nbsp; &nbsp; &nbsp; if (msg.type !== "api") { return; } &nbsp; &nbsp; &nbsp; &nbsp; let args = msg.content.split(/\s+/); &nbsp; &nbsp; &nbsp; &nbsp; if (args[0] == "!multiTokenFx") { &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (!msg.selected) { &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; sendChat("MultiFX", "/w gm please select some tokens"); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; } &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; let fxType = args[1].toLowerCase(); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; let fxColor = args[2].toLowerCase(); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; let fxTypes = ['beam', 'bomb', 'breath', 'bubbling', 'burn', 'burst', 'explode', 'glow', 'missile', 'nova', 'splatter']; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; let fxColors = ['acid', 'blood', 'charm', 'death', 'fire', 'frost', 'holy', 'magic', 'slime', 'smoke', 'water']; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (fxTypes.includes(fxType) &amp;&amp; fxColors.includes(fxColor)) { &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; let fullFx = fxType + "-" + fxColor; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; msg.selected.forEach(selectedItem =&gt; { &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (selectedItem._type == "graphic") { &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; let token = getObj("graphic", selectedItem._id); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; spawnFx(token.get("left"), token.get("top"), fullFx, token.get("pageid")); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; } &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; } else { &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if(!fxTypes.includes(fxType)){ &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; sendChat("MultiFX", `/w gm Acceptable fxTypes include: ${fxTypes.join(', ')}`); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; } &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (!fxColors.includes(fxColor)) { &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; sendChat("MultiFX", `/w gm Acceptable fxColors include: ${fxColors.join(', ')}`); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; } &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; } &nbsp; &nbsp; &nbsp; &nbsp; } &nbsp; &nbsp; }); }); /* */
1718316816

Edited 1718317038
keithcurtis
Forum Champion
Marketplace Creator
API Scripter
Depending on the situation, this script might help . I'm not sure how it handles transparency in the code, but the video looks pretty promising.