Sorry about that. It's kinda hard to do it without seeing the exact HTML, but since you are inserting macroLink()'s into the code as it is (for the dice rolls), it shouldn't be too hard to do the rest.
So, okay - in your variable html
, you set up a page to look like the compendium entries - which is awesome. You're also adding in links wherever there's a diceroll, using the macroLink() function, so basically it's a matter of adding in a few more macro commands in addition to the HTML.
So, step one is to create a new property on your tokens, called something like "PowerTracker". The value of this property should be a JSON Object in the format powername
- where the value can be a simple 1 or 0. This property is what records whether a power was used, and is consulted whenever the token's statcard frame refreshes.
Step to is to embed the updating of that JSON Object, PowerTracker
, when you click a button. There are several ways to do this but I think the simplest for your purposes might be to modify the variable html
to include a couple extra commands. At the top, before any actual html code, you'll want to add something like:
[h:args = macro.args] <!--just for convenience-->
[h,if(json.type(args) == "ARRAY"),CODE:
[powerClicked = json.get(args, 0)]
[PowerTracker = json.set(PowerTracker, powerClicked, isUsed)]
<!--rest of the HTML for the frame follows here...-->
That section is run every time the frame initialized, and it checks for an argument being passed to it. If the argument is a JSON Array, it "knows" a power roll has been clicked. If so, it gets the power name from the first element of the array, and sets the corresponding key in the PowerTracker variable to 1 to represent the power being expended. I use an array here (even though it's only sending a single element) because I can do a type check on it.
Okay, so there's that. Now, in the HTML, I see that you can format a power's name differently, so clearly you know how to identify the power name. Assuming you can identify which dice roll goes with which power name, there are two things to do. First, what you append to whatever macro the dice roll link calls is something like this:
The above code assumes a few things - one, there's a macro on the token that shows the stat card. I don't know what it's called, but "ShowStatCard" is a reasonable guess. Also, it assumes, you can identify the power that the diceroll applies to, and can put that value in a variable.
Second, embedded in the HTML code next to each power name, you have this macro code:
[r:if(json.get(PowerTracker, powerName), "X", "")]
What this does is every time the frame is loaded for a token, it looks at the PowerTracker JSON object. For every power, it checks the corresponding key in that object, and if the key's value is 1, then it puts an X in front of the power name. If it's 0, it leaves it be.
What will happen then, assuming it all works, is this:
1. You load the frame. Since it's the first load, macro.args is not an Array, so nothing happens except it loads. All of the powers should be un-used.
2. Click on the power's dice roll link. This launches the macro that rolls dice.
3. The macro that rolls the dice also then calls the macro to re-launch the stat card. However, this time it sends a JSON array containing the name of the power that was just clicked. The code at the top of the HTML quickly sets the value for the power in PowerTracker to 1 (meaning used), and then continues.
4. When MapTool renders the HTML, it checks each power against PowerTracker, and if the power is used, puts an X in front of it.
It's not the only way to do it - if you would like, I'll take a look through your code and see if I can implement something like it? I don't want to step on your toes, though!