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

[Custom Sheet] If Statements and Radio Button Booleans

1515635898

Edited 1515643704
I'm trying to create a simple inventory system that sums the total weight based on weight per item, quantity, &nbsp;and a checkbox that indicates if the item is on them or not. <a href="https://jsfiddle.net/zu9q534e/6/" rel="nofollow">https://jsfiddle.net/zu9q534e/6/</a> Just trying to get a simple thing working before I do much styling, using CSS from another sheet. What I'm trying to do in concept is have an if statement that won't add the item to the total if its a checkbox isn't checked.
1515649392

Edited 1515649441
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator
Apparently fiddle doesn't like mobile; can't see any code in the link. I do have a note though - I wouldn't trust whatever behavior you get out of fiddle as the sheets rely on quite a bit of underlying parsing and what not to work in game. Anyways, I'll take a look tomorrow morning,assuming one of the character sheet masters hasn't stopped by
I figured it would've been the easiest way to share the CSS and HTML, even though it wouldn't parse the same way. I'm testing it in a test game. I don't know how to post code blocks on the forums.
1515688886

Edited 1515689006
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator
Here are my edits, most of them are just simplifying some of your coding using the underscore.js library that is included with Roll20; there was only one substantive change made. &lt;script type="text/worker"&gt; on("change:repeating_inventory:item_weight change:repeating_inventory:item_carrying change:repeating_inventory:item_quantity remove:repeating_inventory", function() { &nbsp;&nbsp; &nbsp;getSectionIDs("repeating_inventory", function(IDArray) { &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;var fieldNames = []; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; _.each(IDArray,(id)=&gt;{//Underscore.js is a very useful library for doing many things that used to require ugly expressions, like for loops &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; fieldNames.push("repeating_inventory_" + id + "_item_weight"); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;fieldNames.push("repeating_inventory_" + id + "_item_quantity"); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;fieldNames.push("repeating_inventory_" + id + "_item_carrying"); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }); &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var total = 0; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var per = 0; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;var equipped = 0; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; getAttrs(fieldNames, function(values) { &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;_.each(IDArray,(id)=&gt;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; equipped = values["repeating_inventory_" + id + "_item_carrying"]*1;//This is the only change that I think you actually needed for this to work. Attributes are text (aka strings) by default, so your checkbox was actually evaluating to "0" or "1", both of which are truthy in javascript. Multiplying by 1 converts it to a number (or NaN if it can't be converted) allowing your if statement to work. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (equipped){//this should now properly gate whether or not to add the weight of the item &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;per = values["repeating_inventory_" + id + "_item_weight"]*1||0; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;total+= per*values["repeating_inventory_" + id + "_item_quantity"]||0; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;} &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;}); &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;setAttrs({weight_total: total}); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }); &nbsp;&nbsp; &nbsp;}); }); &lt;/script&gt; Hope that helps. EDIT: To post use the code formatting, select it from the paragraph symbol dropdown menu in the top left of the post textarea.
That has been very helpful thank you. I tried using the more optomized code you provided but it wasn't working so I instead implemented your fix into the original. I've been able to get the enabled and disabled working, but I'm having a bit of trouble with the values function. &lt;input type="checkbox" class="" name="attr_equip_uniform" value="1" title="Clothing" checked="true"/&gt;&nbsp; &lt;span class="" style='line-height: 40px;'&gt;UNIFORM&lt;/span&gt; &lt;input type="checkbox" class="" name="attr_equip_vest" value="1" title="Vest" checked="true"/&gt;&nbsp; &lt;span class="" style='line-height: 20px;'&gt;VEST&lt;/span&gt; &lt;input type="checkbox" class="" name="attr_equip_backpack" value="1" title="Bakcpack" checked="true"/&gt;&nbsp; &lt;span class="" style='line-height: 40px;'&gt;BACKPACK&lt;/span&gt; &lt;div class="top"&gt; &nbsp; &nbsp; &lt;span class="label" style="width: 106px; margin: 80px"&gt;Item&lt;/span&gt; &nbsp; &nbsp; &lt;span class="label" style="width: 35px; margin: 32px"&gt;Weight&lt;/span&gt; &nbsp; &nbsp; &lt;span class="label" style="width: 50px;"&gt;Quantity&lt;/span&gt; &nbsp; &nbsp; &lt;span class="label" style="width: 50px; margin: 32px"&gt;Equipped&lt;/span&gt; &nbsp; &nbsp; &nbsp; &lt;span class="label" style="width: 50px;"&gt;Location&lt;/span&gt; &lt;/div&gt; &lt;fieldset class="repeating_inventory"&gt;&nbsp; &lt;div&gt; &lt;input type="text" name="attr_item_name" style="width: 180px" class="sheet-skill-label"&gt; &lt;input type="number" name="attr_item_weight" style="width: 90px" class="sheet-skill-value"&gt; &lt;input type="number" name="attr_item_quantity" style="width: 90px" class="sheet-skill-value"&gt; &lt;input type="checkbox" name="attr_item_carrying" style="width: 90px" value="1" checked="true"&gt; &nbsp; &lt;select name="attr_item_location" class="sheet-skill-value"&gt; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;option value="uniform"&gt;Uniform&lt;/option&gt; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;option value="vest"&gt;Vest&lt;/option&gt; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;option value="backpack"&gt;Backpack&lt;/option&gt; &nbsp; &nbsp; &nbsp; &nbsp; &lt;/select&gt; &lt;/div&gt; &lt;/fieldset&gt; &lt;div class="weighttotal"&gt; &lt;span class="label"&gt;TOTAL WEIGHT&lt;/span&gt; &lt;input type="text" name="attr_weight_total" value="0"&gt; lbs &lt;/div&gt; &lt;script type="text/worker"&gt; on(" change:equip_uniform change:equip_vest change:equip_backpack change:repeating_inventory:item_weight&nbsp; change:repeating_inventory:item_carrying&nbsp; change:repeating_inventory:item_location&nbsp; change:repeating_inventory:item_quantity&nbsp; remove:repeating_inventory ", function() { getSectionIDs("repeating_inventory", function(IDArray) { var fieldNames = []; &nbsp; &nbsp; &nbsp; &nbsp; for (var i=0; i &lt; IDArray.length; i++) { fieldNames.push("repeating_inventory_" + IDArray[i] + "_item_weight"); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; fieldNames.push("repeating_inventory_" + IDArray[i] + "_item_quantity"); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; fieldNames.push("repeating_inventory_" + IDArray[i] + "_item_carrying"); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; fieldNames.push("repeating_inventory_" + IDArray[i] + "_item_location"); } &nbsp; &nbsp; &nbsp; &nbsp; var total = 0; &nbsp; &nbsp; &nbsp; &nbsp; var per = 0; var equipped = 0; &nbsp; &nbsp; &nbsp; &nbsp; getAttrs(fieldNames, function(values) { for (var i=0; i &lt; IDArray.length; i++) { uniform_enabled = values["_equip_uniform"]*1; vest_enabled = values["_equip_vest"]*1; backpack_enabled = values["_equip_backpack"]*1; location = values["repeating_inventory_" + IDArray[i] + "_item_location"]; equipped = values["repeating_inventory_" + IDArray[i] + "_item_carrying"]*1; if(equip_backpack)&nbsp; { if (location == "backpack") { if (equipped){ per = 0; per = values["repeating_inventory_" + IDArray[i] + "_item_weight"]*1||0; total += per*values["repeating_inventory_" + IDArray[i] + "_item_quantity"]||0; } } }&nbsp; else if (equip_vest)&nbsp; { if (location == "vest") { if (equipped){ per = 0; per = values["repeating_inventory_" + IDArray[i] + "_item_weight"]*1||0; total += per*values["repeating_inventory_" + IDArray[i] + "_item_quantity"]||0; } } }&nbsp; else if (equip_uniform) { if (location == "uniform") { if (equipped){ per = 0; per = values["repeating_inventory_" + IDArray[i] + "_item_weight"]*1||0; total += per*values["repeating_inventory_" + IDArray[i] + "_item_quantity"]||0; } } } } setAttrs({ "weight_total": total }); &nbsp; &nbsp; &nbsp; &nbsp; }); }); }); &lt;/script&gt; So what I'm trying to do here is make it so players can essentially drop their backpack by unchecking the checkbox. I was trying to find examples of the value command being used on the sheet worker page but wasn't able to find anything, which is why I don't think it's working at the moment. Also, I've seen people using console.log() in other forum posts. Is that console supposed to output to the API Log because I wasn't seeing anything come up.
1515714379

Edited 1515714414
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator
I think your big problem is your on() statement. It breaks if you put line breaks in the middle of the string. To organize it on multiple lines so that you don't have to side scroll forever you'd do this instead (note that the trailing spaces are essential): on("change:equip_uniform " +"change:equip_vest " +"change:equip_backpack " +"change:repeating_inventory:item_weight " +"change:repeating_inventory:item_carrying "&nbsp; +"change:repeating_inventory:item_location " +"change:repeating_inventory:item_quantity " +"remove:repeating_inventory" ", function() { Also, from your code it looks like your only totaling the weight from the backpack and ignoring the uniform/vest if backpack is checked, and then if backpack is unchecked, but vest is checked, only totaling the vest weight and ignoring the uniform weight, and so the uniform weight only gets counted if the vest and backpack aren't equipped. Related to this issue is the fact that you are incorrectly referencing the equip_vest/uniform/backpack attributes. There is no attribute called "_equip_vest", there is an attribute called "equip_vest". The "attr_" part of an attributes html name is ignored for all purposes except for the html itself. The console.log outputs to the browser's console. In firefox this can be accessed by ctrl-shift-i (or CMD-alt-i on mac). I don't know the keyboard shortcut in chrome, but you can right click on an html element (that isn't on the canvas) and select "inspect element" from the drop-down menu in either firefox or chrome.
1515719581

Edited 1515719607
Thanks, it'll help me a lot knowing that I can use the console for some debugging now. Chrome uses Ctrl Shift J And ya I just realized my logic error on those if statements, fixed that now. I guess one underlying question is why... per = values["repeating_inventory_" + IDArray[i] + "_item_weight"]*1||0; Includes &nbsp; the attribute written as&nbsp; _item_weight &nbsp;is that because it takes fieldset values as &lt;fieldset class&gt;_&lt;ID of the fieldset entry&gt;_&lt;attribute&gt; &nbsp;?
1515720576
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator
yep, because the full attribute name is repeating_inventory_ID_item_weight
1515726951

Edited 1515726970
Looks like I got it working now, thanks very much for your help Scott. Knowing where the debug console was really helped in the right direction. So, the changes that were made: Used var &nbsp;to initialize variable (might be redundant) The getAttr function, needed to add the equip_uniform, etc. items to the array fieldNames &nbsp;that was passed to the function Added some console outputs for debugging Made the if statements check for if(... != 0) &nbsp;maybe redundant but it was one of the changes I made before it worked (I'm fairly confident that the if statement should just recognize a value 0 as false and anything else as true, but it's working right now) &lt;input type="checkbox" class="" name="attr_equip_uniform" value="1" title="Clothing" checked="true"/&gt;&nbsp; &lt;span class="" style='line-height: 40px;'&gt;UNIFORM&lt;/span&gt; &lt;input type="checkbox" class="" name="attr_equip_vest" value="1" title="Vest" checked="true"/&gt;&nbsp; &lt;span class="" style='line-height: 20px;'&gt;VEST&lt;/span&gt; &lt;input type="checkbox" class="" name="attr_equip_backpack" value="1" title="Bakcpack" checked="true"/&gt;&nbsp; &lt;span class="" style='line-height: 40px;'&gt;BACKPACK&lt;/span&gt; &lt;div class="top"&gt; &nbsp; &nbsp; &lt;span class="label" style="width: 106px; margin: 80px"&gt;Item&lt;/span&gt; &nbsp; &nbsp; &lt;span class="label" style="width: 35px; margin: 32px"&gt;Weight&lt;/span&gt; &nbsp; &nbsp; &lt;span class="label" style="width: 50px;"&gt;Quantity&lt;/span&gt; &nbsp; &nbsp; &lt;span class="label" style="width: 50px; margin: 32px"&gt;Equipped&lt;/span&gt; &nbsp; &nbsp; &nbsp; &lt;span class="label" style="width: 50px;"&gt;Location&lt;/span&gt; &lt;/div&gt; &lt;fieldset class="repeating_inventory"&gt;&nbsp; &lt;div&gt; &lt;input type="text" name="attr_item_name" style="width: 180px" class="sheet-skill-label"&gt; &lt;input type="number" name="attr_item_weight" style="width: 90px" class="sheet-skill-value"&gt; &lt;input type="number" name="attr_item_quantity" style="width: 90px" class="sheet-skill-value"&gt; &lt;input type="checkbox" name="attr_item_carrying" style="width: 90px" value="1" checked="true"&gt; &nbsp; &lt;select name="attr_item_location" class="sheet-skill-value"&gt; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;option value="uniform"&gt;Uniform&lt;/option&gt; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;option value="vest"&gt;Vest&lt;/option&gt; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;option value="backpack"&gt;Backpack&lt;/option&gt; &nbsp; &nbsp; &nbsp; &nbsp; &lt;/select&gt; &lt;/div&gt; &lt;/fieldset&gt; &lt;div class="weighttotal"&gt; &lt;span class="label"&gt;TOTAL WEIGHT&lt;/span&gt; &lt;input type="text" name="attr_weight_total" value="0"&gt; lbs &lt;/div&gt; &lt;script type="text/worker"&gt; on("change:equip_uniform change:equip_vest change:equip_backpack change:repeating_inventory:item_weight change:repeating_inventory:item_carrying change:repeating_inventory:item_location change:repeating_inventory:item_quantity remove:repeating_inventory", function() { getSectionIDs("repeating_inventory", function(IDArray) { var fieldNames = []; &nbsp; &nbsp; &nbsp; &nbsp; for (var i=0; i &lt; IDArray.length; i++) { fieldNames.push("repeating_inventory_" + IDArray[i] + "_item_weight"); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; fieldNames.push("repeating_inventory_" + IDArray[i] + "_item_quantity"); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; fieldNames.push("repeating_inventory_" + IDArray[i] + "_item_carrying"); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; fieldNames.push("repeating_inventory_" + IDArray[i] + "_item_location"); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; fieldNames.push("equip_uniform"); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; fieldNames.push("equip_vest"); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; fieldNames.push("equip_backpack"); } console.log("Start of the script after gathering field names----------------------------------"); var total = 0; &nbsp; &nbsp; &nbsp; &nbsp; var per = 0; var equipped = 0; &nbsp; &nbsp; &nbsp; &nbsp; getAttrs(fieldNames, function(values) { &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; for (var i=0; i &lt; IDArray.length; i++) { &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var uniform_enabled = values["equip_uniform"]; var vest_enabled = values["equip_vest"]; var backpack_enabled = values["equip_backpack"]; console.log("here are the values of the enabled clothing items"); console.log("uniform:" + uniform_enabled + " backpack:" + backpack_enabled + " vest:" + vest_enabled); var location = values["repeating_inventory_" + IDArray[i] + "_item_location"]; var equipped = values["repeating_inventory_" + IDArray[i] + "_item_carrying"]*1; if(backpack_enabled != 0)&nbsp; { console.log("inside of backpack_enabled loop with this as the value:"+backpack_enabled); console.log("where is the item though?:"+location); if (location == "backpack") { console.log("inside of location == backpack loop with this as the value:"+location); if (equipped){ per = 0; per = values["repeating_inventory_" + IDArray[i] + "_item_weight"]*1||0; total += per*values["repeating_inventory_" + IDArray[i] + "_item_quantity"]||0; } } }&nbsp; if (vest_enabled != 0)&nbsp; { console.log("inside of vest_enabled loop with this as the value:"+vest_enabled); console.log("where is the item though?:"+location); if (location == "vest") { console.log("inside of location == backpack loop with this as the value:"+location); if (equipped){ per = 0; per = values["repeating_inventory_" + IDArray[i] + "_item_weight"]*1||0; total += per*values["repeating_inventory_" + IDArray[i] + "_item_quantity"]||0; } } }&nbsp; if (uniform_enabled != 0) { console.log("inside of uniform_enabled loop with this as the value:"+uniform_enabled); console.log("where is the item though?:"+location); if (location == "uniform") { console.log("inside of location == backpack loop with this as the value:"+location); if (equipped){ per = 0; per = values["repeating_inventory_" + IDArray[i] + "_item_weight"]*1||0; total += per*values["repeating_inventory_" + IDArray[i] + "_item_quantity"]||0; } } } } setAttrs({ "weight_total": total }); &nbsp; &nbsp; &nbsp; &nbsp; }); }); }); &lt;/script&gt;
1515727260
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator
Yep, 0 (as a number) is a falsy value, so you could just do if(variable).