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

Select and populate multiple fields with different values

April 12 (9 years ago)
SᵃᵛᵃǤᵉ
Sheet Author
API Scripter
So here is what I am trying to do'

I have a row with four input fields the left most is one where the player can select an option. The other three will then display a text value based on the selection in box 1.
Bottomline this is and attempt to automate the following.

Player selects the maneuver then the active defense box  displays some text and the movement box displays some text and so on.
April 13 (9 years ago)
Finderski
Sheet Author
Compendium Curator
I'd probably recommend trying this using <span>s instead of input fields for displaying the text. Then you might be able to do something like this with your CSS:
.sheet-maneuver[value="0"] ~ charsheet.span.sheet-ActiveDefense::before {
	content: "None";
}

.sheet-maneuver[value="0"] ~ charsheet.span.sheet-Movement::before {
	content: "1/2 Forward";
}

.sheet-maneuver[value="0"] ~ charsheet.span.sheet-ActiveDefense::before {
	content: "+4 to hit";
}
That would assume that the selection field has a class of sheet-maneuver, and you have spans set up with each of the corresponding classes listed in the CSS above as well...

I also don't know if this would, but it's where I would start. You may need to .sheet-maneuver[value="0"]:checked 

I hope this helps in some way...I've not tested it, but didn't want to leave you hanging, either. :)
April 13 (9 years ago)
Lithl
Pro
Sheet Author
API Scripter
Unfortunately, that won't work, GV. selects don't have a value attribute for the CSS to check against.

However, sheet workers could accomplish a similar thing to what you're suggesting.
April 13 (9 years ago)
Finderski
Sheet Author
Compendium Curator
D'oh! I keep forgetting about sheet workers...
April 13 (9 years ago)

Edited April 13 (9 years ago)
SᵃᵛᵃǤᵉ
Sheet Author
API Scripter
What you guys are talking about is way above my skill level. I have a general idea of how to make it work but have not had any success.
April 16 (9 years ago)
Finderski
Sheet Author
Compendium Curator
Crazy Master Gamer,

I'm not the best with Sheet Workers, AND I'm assuming that you are wanting to incorporate that entire image, so the CSS trick wouldn't really work so well, because to do this using CSS you'd have to have a TON of checkboxes (since, as Brian said selects don't have a value attribute). So...here's something to hopefully get you started (untested, so debugging is likely necessary and there are others who are more qualified to help with Sheet Workers, but it's easier to get help if you have some code to work with). :)

Assumption: you have a Select tag and three text areas, something like this:
<select name='attr_maneuver'>
	<option value='0'>N/A</option>
	<option value='1'>Aim</option>
	<option value='2'>All-Out-Attack - Melee (Determined)</option>
	<option value='3'>All-Out-Attack - Melee (Double)</option>
	<option value='4'>All-Out-Attack - Melee (Feint)</option>
	<option value='5'>All-Out-Attack - Melee (Long)</option>
	<option value='6'>All-Out-Attack - Melee (Strong)</option>
</select>
<textarea name='attr_activedefense'></textarea>
<textarea name='attr_movement'></textarea>
<textarea name='attr_description'></textarea>
Here's how I would set up the Sheet Worker:
//Set Active Defense, Movement, and Description according to the Maneuver value
on("change:maneuver", function() {
     getAttrs(["maneuver", "activedefense", "movement", "description"], function(value) {
	if (value.maneuver = 0) {
		console.log("Setting Active Defense, Movement, and Description to blank");
		setAttrs({activedefense: ""});
		setAttrs({movement: ""});
		setAttrs({description: ""});
	}
	else if (value.maneuver === 1) {
		setAttrs({activedefense: "Any*"});
		setAttrs({movement: "Step|None"});
		setAttrs({description: "Aim a ranged weapon to get its Acc bonus (+1 for tracking, +1 for 2 turn, +2 for 3+ turns, the combined bonus for all targeting systems cannot exceed the weapons base Accuracy)|You get no step if your tw-handed weapon is braced"});
	}
	else if (value.maneuver === 2) {
		setAttrs({activedefense: "None"});
		setAttrs({movement: "1/2 forward"});
		setAttrs({description: "+4 to hit"});
	}
	else if (value.maneuver === 3) {
		setAttrs({activedefense: "None"});
		setAttrs({movement: "1/2 forward"});
		setAttrs({description: "2 attacks on same foe with ready weapon (-4 to off-hand without Ambidexterity"});
	}
	else if (value.maneuver === 4) {
		setAttrs({activedefense: "None"});
		setAttrs({movement: "1/2 forward"});
		setAttrs({description: "Make one feint and one attack on the same foe"});
	}
	else if (value.maneuver === 5) {
		setAttrs({activedefense: "None"});
		setAttrs({movement: "1/2 forward"});
		setAttrs({description: "Increase reach by 1 yard (Swing attacks at -2 dmg or -1 per die), may end in crouch (MA87)"});
	}
	else {
		setAttrs({activedefense: "None"});
		setAttrs({movement: "1/2 forward"});
		setAttrs({description: "+2 to damage (or +1 per damage die)"});
	}
     });
});
//End Maneuver
Again, not tested, but something to mess around with.

I hope this helps.
April 16 (9 years ago)
SᵃᵛᵃǤᵉ
Sheet Author
API Scripter
Nope.

I set up a sandox game to see if it was my CSS screwing things up and nope not working
April 16 (9 years ago)
SᵃᵛᵃǤᵉ
Sheet Author
API Scripter
Just to be sure sheet worker scripts go in the API area, right. I am starting to second guess myself .
April 16 (9 years ago)

Edited April 16 (9 years ago)
Finderski
Sheet Author
Compendium Curator

Crazy Master Gamer said:

Just to be sure sheet worker scripts go in the API area, right. I am starting to second guess myself .
No, sheet workers go in the character sheet.  It needs to be enclosed within script tags like this:
<script type="text/worker">
//Set Active Defense, Movement, and Description according to the Maneuver value
on("change:maneuver", function() {
     getAttrs(["maneuver", "activedefense", "movement", "description"], function(value) {
	if (value.maneuver = 0) {
		console.log("Setting Active Defense, Movement, and Description to blank");
		setAttrs({activedefense: ""});
		setAttrs({movement: ""});
		setAttrs({description: ""});
	}
	else if (value.maneuver === 1) {
		setAttrs({activedefense: "Any*"});
		setAttrs({movement: "Step|None"});
		setAttrs({description: "Aim a ranged weapon to get its Acc bonus (+1 for tracking, +1 for 2 turn, +2 for 3+ turns, the combined bonus for all targeting systems cannot exceed the weapons base Accuracy)|You get no step if your tw-handed weapon is braced"});
	}
	else if (value.maneuver === 2) {
		setAttrs({activedefense: "None"});
		setAttrs({movement: "1/2 forward"});
		setAttrs({description: "+4 to hit"});
	}
	else if (value.maneuver === 3) {
		setAttrs({activedefense: "None"});
		setAttrs({movement: "1/2 forward"});
		setAttrs({description: "2 attacks on same foe with ready weapon (-4 to off-hand without Ambidexterity"});
	}
	else if (value.maneuver === 4) {
		setAttrs({activedefense: "None"});
		setAttrs({movement: "1/2 forward"});
		setAttrs({description: "Make one feint and one attack on the same foe"});
	}
	else if (value.maneuver === 5) {
		setAttrs({activedefense: "None"});
		setAttrs({movement: "1/2 forward"});
		setAttrs({description: "Increase reach by 1 yard (Swing attacks at -2 dmg or -1 per die), may end in crouch (MA87)"});
	}
	else {
		setAttrs({activedefense: "None"});
		setAttrs({movement: "1/2 forward"});
		setAttrs({description: "+2 to damage (or +1 per damage die)"});
	}
     });
});
//End Maneuver
</script>
Just place that above the actual character sheet code in the html file.

EDIT: Post below this one has the corrected code for the sheet worker and the html form elements that it uses...
April 16 (9 years ago)
Finderski
Sheet Author
Compendium Curator
Ok, I decided to mess around with this a bit and see if I could get it to work...there were some errors that needed to be corrected, but this code does work (I tested it and got it working):
<script type="text/worker">
//Set Active Defense, Movement, and Description according to the Maneuver value
on("sheet:opened change:maneuver", function() {
    getAttrs(["maneuver", "activedefense", "movement", "description"], function(value) {
        if (value.maneuver === "0") {
		    console.log("Setting Active Defense, Movement, and Description to blank");
		    setAttrs({activedefense: " ",
                      movement: " ",
                      description: " "});
	    }
	    else if (value.maneuver === "1") {
            console.log("Updating Active Defense, Movement, and Description for Aim");
    		setAttrs({activedefense: "Any*",
                      movement: "Step|None",
                      description: "Aim a ranged weapon to get its Acc bonus (+1 for tracking, +1 for 2 turn, +2 for 3+ turns, the combined bonus for all targeting systems cannot exceed the weapons base Accuracy)|You get no step if your tw-handed weapon is braced"});
	    }
    	else if (value.maneuver === "2") {
            console.log("Updating Active Defense, Movement, and Description for AOA-Melee: Determined");
    		setAttrs({activedefense: "None",
                      movement: "1/2 forward",
                      description: "+4 to hit"});
    	}
    	else if (value.maneuver === "3") {
            console.log("Updating Active Defense, Movement, and Description for AOA-Melee: Double");
    		setAttrs({activedefense: "None",
                      movement: "1/2 forward",
                      description: "2 attacks on same foe with ready weapon (-4 to off-hand without Ambidexterity"});
    	}
    	else if (value.maneuver === "4") {
            console.log("Updating Active Defense, Movement, and Description for AOA-Melee: Feint");
    		setAttrs({activedefense: "None",
                      movement: "1/2 forward",
                      description: "Make one feint and one attack on the same foe"});
    	}
    	else if (value.maneuver === "5") {
            console.log("Updating Active Defense, Movement, and Description for AOA-Melee: Long");
    		setAttrs({activedefense: "None",
                      movement: "1/2 forward",
                      description: "Increase reach by 1 yard (Swing attacks at -2 dmg or -1 per die), may end in crouch (MA87)"});
    	}
    	else if (value.maneuver === "6") {
            console.log("Updating Active Defense, Movement, and Description for AOA-Melee: Strong");
    		setAttrs({activedefense: "None",
                      movement: "1/2 forward",
                      description: "+2 to damage (or +1 per damage die)"});
    	}
        else {
            console.log("Didn't update anything...");
        }
        console.log("Finished with doing stuff!");
    });
});
//End Maneuver
</script>

<div class='sheet-main'>
    <select name='attr_maneuver'>
        <option value='0'>N/A</option>
	    <option value='1'>Aim</option>
	    <option value='2'>All-Out-Attack - Melee (Determined)</option>
	    <option value='3'>All-Out-Attack - Melee (Double)</option>
	    <option value='4'>All-Out-Attack - Melee (Feint)</option>
	    <option value='5'>All-Out-Attack - Melee (Long)</option>
	    <option value='6'>All-Out-Attack - Melee (Strong)</option>
    </select>
    <textarea name='attr_activedefense' readonly></textarea>
    <textarea name='attr_movement' readonly></textarea>
    <textarea name='attr_description' readonly></textarea> 
</div>
You'll notice that I set the text areas to readonly so that players couldn't modify those, but the sheet worker still can.  The type of input doesn't have to be text area, you just need to make sure you are using the correct naming conventions, but I do think that for the description you will at least want a text area so it's easier to read...

Anyway, I hope this helps.
April 16 (9 years ago)
SᵃᵛᵃǤᵉ
Sheet Author
API Scripter
Thanks thats a big help I still have other maneuvers to add but this gets me started.
Now I just need to clean it up with some nice CSS...of which I suck at.
Could you use this to output a calculation rather than text?  Something like this:

[CODE]
else if (value.maneuver === "2") { console.log("Updating Active Defense, Movement, and Description for AOA-Melee: Determined"); setAttrs({activedefense: "@{StrMod}+@{Level}", movement: "@{Move}+@{MoveMod}", description: "+4 to hit"});
[/CODE]
Sorry, like this

    	else if (value.maneuver === "2") {
            console.log("Updating Active Defense, Movement, and Description for AOA-Melee: Determined");
    		setAttrs({activedefense: "@{StrMod}+@{Level}",
                      movement: "@{Move}+@{MoveMod}",
                      description: "+4 to hit"});
    	}
April 30 (9 years ago)
Finderski
Sheet Author
Compendium Curator

Michael D. said:

Could you use this to output a calculation rather than text?  Something like this:

[CODE]
else if (value.maneuver === "2") { console.log("Updating Active Defense, Movement, and Description for AOA-Melee: Determined"); setAttrs({activedefense: "@{StrMod}+@{Level}", movement: "@{Move}+@{MoveMod}", description: "+4 to hit"});
[/CODE]

Are you thinking active defense would be a calculated field? If so, then no, because for a field to be an auto-calc it needs to be disabled and Sheetworkers can't work with disabled fields.  however, you could read in the values for StrMod and Level, add them together and then output that value to activedefense field.
May 03 (9 years ago)
SᵃᵛᵃǤᵉ
Sheet Author
API Scripter
I just want it to display the modifiers....I cannot automate it fully. Thats against the SJ Games policy
May 03 (9 years ago)
Finderski
Sheet Author
Compendium Curator

Crazy Master Gamer said:

I just want it to display the modifiers....I cannot automate it fully. Thats against the SJ Games policy

Ok, so another point of clarification...do you want the field to display "@{StrMod}+@{Level}" or if StrMod=5 and Level=2, then the field should display: "5+2"?

In either case, the Sheet Worker should be able to do that. In fact, what you have above should output the text: "@{StrMod}+@{Level}"

If you wanted the latter, just read in the values for StrMod and Level into the Sheet Worker and you could craft the string to include those instead.
May 03 (9 years ago)
SᵃᵛᵃǤᵉ
Sheet Author
API Scripter
I appreciate that thanks
May 15 (9 years ago)

Edited May 15 (9 years ago)
Late reply here but how do you read in the values? I'm still learning JS. I tried parseInt(values.StrMod) + parseInt(values.Level) but it didn't work.  In your example I would want the output to be 7