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

Implementing JSON (RepeatingSum Question)

1581846163

Edited 1581846357
GM
Pro
I'm having one more newbie problem.  I'm attempting to implement a RepeatingSum following the example on the Wiki, but I'm not able to get it to work.  As I wanted to try something simple, I set a bunch of 0/1 value Checkboxes for Readied Items, and just want it to total all of the checked boxes into a final number.  I do want to add more functionality after (including number x weight, etc) but I'm trying to start simple to figure out what I'm doing wrong. My JSON is in a script called "Repeating Inventory" and is as follows: /* ===== PARAMETERS ========== destination = the name of the attribute that stores the total quantity section = name of repeating fieldset, without the repeating_ fields = the name of the attribute field to be summed       can be a single attribute: 'weight'       or an array of attributes: ['weight','number','equipped'] multiplier (optional) = a multiplier to the entire fieldset total. For instance, if summing coins of weight 0.02, might want to multiply the final total by 0.02. */ const repeatingSum = (destination, section, fields, multiplier = 1) => {     if (!Array.isArray(fields)) fields = [fields];     getSectionIDs(`repeating_${section}`, idArray => {         const attrArray = idArray.reduce( (m,id) => [...m, ...(fields.map(field => `repeating_${section}_${id}_${field}`))],[]);         getAttrs(attrArray, v => {             console.log("===== values of v: "+ JSON.stringify(v) +" =====");                  // getValue: if not a number, returns 1 if it is 'on' (checkbox), otherwise returns 0..             const getValue = (section, id,field) => parseFloat(v[`repeating_${section}_${id}_${field}`]) || (v[`repeating_${section}_${id}_${field}`] === 'on' ? 1 : 0);             const sumTotal = idArray.reduce((total, id) => total + fields.reduce((subtotal,field) => subtotal * getValue(section, id,field),1),0);             setAttrs({[destination]: sumTotal * multiplier});            });     }); }; on('change:repeating_inventory remove:repeating_inventory', function() {     repeatingSum("InventoryReadiedTotal","inventory","Inventory_Readied"); }); The Fieldset entry I am attempting to read from (and place into an attribute called InventoryReadiedTotal for reading on the sheet) is called Inventory_Readied: <fieldset class=repeating_Inventory>             <input type="checkbox" class="sheet-text" name="attr_Inventory_Carried" value="1" style="width:16px;height:14px; color:#ffc500; font-size: 8pt; border-color:#303030; font-weight: bolder; text-shadow: 0px 0px 16px #f5ff91; background: #f6f6f6;; text-align: center; vertical-align: center; margin-left:12px; margin-right:4px;"/>                     <input type="checkbox" class="sheet-text" name="attr_Inventory_Readied" value="1" style="width:14px;height:14px; color:#ffc500; font-size: 8pt; border-color:#303030; font-weight: bolder; text-shadow: 0px 0px 16px #f5ff91; background: #f6f6f6;; text-align: center; vertical-align: center; margin-left:0px; margin-right:6px;"/>                     <input type="text" class="sheet-text" name="attr_Inventory_#" value="0" style="width:16px;height:16px;  background-color: rgb(24, 24, 24); color:#ffffff; font-size: 8pt; text-align: center; vertical-align: top; font-family: Contrail-One; font-size: 6pt; text-shadow: 1px 1px #000000; background-color: rgb(36, 36, 36); margin-left:0px; margin-right:2px;"/>                        <input type="text" class="sheet-text" name="attr_Inventory_Weight" value="0" style="width:32px;height:16px;  background-color: rgb(24, 24, 24); color:#ffffff; font-size: 8pt; text-align: center; vertical-align: top; font-family: Contrail-One; font-size: 6pt; text-shadow: 1px 1px #000000; background-color: rgb(36, 36, 36); margin-left:0px; margin-right:4px;"/>                        <input type="text" class="sheet-text" name="attr_Inventory_Item" value="" style="width:96px;height:16px;  background-color: rgb(24, 24, 24); color:#ffffff; font-size: 8pt; text-align: left; vertical-align: top; font-family: Contrail-One; font-size: 6pt; text-shadow: 1px 1px #000000; background-color: rgb(36, 36, 36); margin-left:0px; margin-right:8px;"/>                        <input type="text" class="sheet-text" name="attr_Inventory_Tags" value="" style="width:248px;height:16px;  background-color: rgb(24, 24, 24); color:#ffffff; font-size: 8pt; text-align: left; vertical-align: top; font-family: Contrail-One; font-size: 6pt; text-shadow: 1px 1px #000000; background-color: rgb(36, 36, 36); margin-left:0px; margin-right:4px;"/>                        <input type="text" class="sheet-text" name="attr_Inventory_AP" value="" style="width:24px;height:16px;  background-color: rgb(24, 24, 24); color:#ffffff; font-size: 8pt; text-align: center; vertical-align: top; font-family: Contrail-One; font-size: 6pt; text-shadow: 1px 1px #000000; background-color: rgb(36, 36, 36); margin-left:0px; margin-right:4px;"/>                        <input type="text" class="sheet-text" name="attr_Inventory_RANGE" value="" style="width:40px;height:16px;  background-color: rgb(24, 24, 24); color:#ffffff; font-size: 8pt; text-align: center; vertical-align: top; font-family: Contrail-One; font-size: 6pt; text-shadow: 1px 1px #000000; background-color: rgb(36, 36, 36); margin-left:0px; margin-right:4px;"/>                        <input type="text" class="sheet-text" name="attr_Inventory_DAMAGE" value="" style="width:40px;height:16px;  background-color: rgb(24, 24, 24); color:#ffffff; font-size: 8pt; text-align: center; vertical-align: top; font-family: Contrail-One; font-size: 6pt; text-shadow: 1px 1px #000000; background-color: rgb(36, 36, 36); margin-left:0px; margin-right:4px;"/>                     <input type="text" class="sheet-text" name="attr_Inventory_DURABILITY" value="" style="width:24px;height:16px;  background-color: rgb(24, 24, 24); color:#ffffff; font-size: 8pt; text-align: center; vertical-align: top; font-family: Contrail-One; font-size: 6pt; text-shadow: 1px 1px #000000; background-color: rgb(36, 36, 36); margin-left:0px; margin-right:4px;"/>        </fieldset> Yet when I go into to use the sheet, the input I have displaying the value of InventoryReadiedTotal simply says NAN and nothing seems to function.  I've also tried changing the read attribute to just the weight column (again, nothing fancy, just trying to add them up so I can get a feel for it) and nothing happens either. I have been trying to go through .json example files but most don't seem to cover the repeating inventory and the handful that do have so many modifications I've been unable to learn what I'm doing wrong. I am admittedly extremely very new to writing .json files, and am trying to follow the tutorials and examples to the best of my ability.  The rest of the sheet is working great and this is really the only "major missing feature" I have at the present time.  I have a feeling I'm overlooking something stupid (does there need to be more to the json than that?  Do I need another json to make this one run? etc.) at the core that's throwing me off. All help as always is appreciated.  I'm quite, quite happy with how the sheets I've been working on are turning out, better than I could have expected and the help has made it possible.  Thanks!
1581849779

Edited 1581861401
GiGs
Pro
Sheet Author
API Scripter
I think when you say JSON, you mean javascript? Regardless, this is the weirdest error I've ever seen. There's something messed up with your styles. When I removed them (and had to delete the file I originally copied them into), it started working fine.  Using the html you supplied, it wasnt working for me either. When I replaced it with this, it worked fine: <fieldset class=repeating_Inventory>             <input type="checkbox" class="sheet-text" name="attr_Inventory_Carried" value="1" />                     <input type="checkbox" class="sheet-text" name="attr_Inventory_Readied" value="1" />                     <input type="text" class="sheet-text" name="attr_Inventory_#" value="0" />                        <input type="text" class="sheet-text" name="attr_Inventory_Weight" value="0" />        </fieldset>          <label>Total: </label> <input type="number" class="sheet-text" name="attr_InventoryReadiedTotal" value="0" /> So I'd check over your styles and see what's going on there. Also you'd be best off copying the style info into your CSS file. Changing this input type="checkbox" class="sheet-text" name="attr_Inventory_Carried" value="1" style="width:16px;height:14px; color:#ffc500; font-size: 8pt; border-color:#303030; font-weight: bolder; text-shadow: 0px 0px 16px #f5ff91; background: #f6f6f6;; text-align: center; vertical-align: center; margin-left:12px; margin-right:4px;"/>         <input type="checkbox" class="sheet-text" name="attr_Inventory_Readied" value="1" style="width:14px;height:14px; color:#ffc500; font-size: 8pt; border-color:#303030; font-weight: bolder; text-shadow: 0px 0px 16px #f5ff91; background: #f6f6f6;; text-align: center; vertical-align: center; margin-left:0px; margin-right:6px;"/>         <input type="text" class="sheet-text" name="attr_Inventory_#" value="0" style="width:16px;height:16px;  background-color: rgb(24, 24, 24); color:#ffffff; font-size: 8pt; text-align: center; vertical-align: top; font-family: Contrail-One; font-size: 6pt; text-shadow: 1px 1px #000000; background-color: rgb(36, 36, 36); margin-left:0px; margin-right:2px;"/>            <input type="text" class="sheet-text" name="attr_Inventory_Weight" value="0" style="width:32px;height:16px;  background-color: rgb(24, 24, 24); color:#ffffff; font-size: 8pt; text-align: center; vertical-align: top; font-family: Contrail-One; font-size: 6pt; text-shadow: 1px 1px #000000; background-color: rgb(36, 36, 36); margin-left:0px; margin-right:4px;"/>    to this <fieldset class=repeating_Inventory>             <input type="checkbox" class="sheet-text inventory-checkbox" name="attr_Inventory_Carried" value="1" />                     <input type="checkbox" class="sheet-text inventory-checkbox" name="attr_Inventory_Readied" value="1" />                     <input type="text" class="sheet-text inventory-number" name="attr_Inventory_#" value="0" />                        <input type="text" class="sheet-text inventory-checkbox" name="attr_Inventory_Weight" value="0" />        </fieldset> and then in your CSS adding input[type="text"].sheet-inventory-number {     width:16px;     height:16px;          background-color: rgb(24, 24, 24);     color:#ffffff;     font-size: 8pt;     text-align: center;     vertical-align: top;     font-family: Contrail-One;     font-size: 6pt;     text-shadow: 1px 1px #000000;     background-color: rgb(36, 36, 36);     margin-left:0px;     margin-right:2px; } Though those text boxes should probably be type="number" In this way you dont need to type out the same styling info over and over. Just write it once, and give everything that has the style its matching class name.
Wow, thank you very much for the help!  I don't think I'd ever figured out that the Styles were the culprit in this not working without the help.  Thanks again, this is just saved me hours of hair pulling!
1581861509
GiGs
Pro
Sheet Author
API Scripter
You're welcome. I've never seen an error like that before, and honestly don't understand how the styles can interfere like this.
1582005467

Edited 1582005572
GM
Pro
So just a quick update.  I removed all of the formatting from all of my repeating sections, and it's still not functioning.  No matter how many boxes I click, the number remains at 0 indefinitely.  I tried it again with the Weight category to make sure it wasn't something with the check boxes and the same result:  Absolutely no adjustment to the attribute number. I very much appreciate the help and am at a complete loss; I've tried copying & pasting the example code directly and it still just doesn't function.  I can't seem to make any of the repeating calculations work at present time. Does anyone know of a way to verify the script is actually functioning?
1582010672
GiGs
Pro
Sheet Author
API Scripter
Do what I did: create a completely new campaign, with completely empty html and css. Copy this (and nothing else) into the html file, save it and try it now. <fieldset class=repeating_Inventory>             <input type="checkbox" class="sheet-text" name="attr_Inventory_Carried" value="1" />             <input type="checkbox" class="sheet-text" name="attr_Inventory_Readied" value="1" />             <input type="text" class="sheet-text" name="attr_Inventory_#" value="0" />                <input type="text" class="sheet-text" name="attr_Inventory_Weight" value="0" />        </fieldset>      <label>Total: </label> <input type="number" class="sheet-text" name="attr_InventoryReadiedTotal" value="0" /> <script type="text/worker"> /* ===== PARAMETERS ========== destination = the name of the attribute that stores the total quantity section = name of repeating fieldset, without the repeating_ fields = the name of the attribute field to be summed       can be a single attribute: 'weight'       or an array of attributes: ['weight','number','equipped'] multiplier (optional) = a multiplier to the entire fieldset total. For instance, if summing coins of weight 0.02, might want to multiply the final total by 0.02. */ const repeatingSum = (destination, section, fields, multiplier = 1) => {     if (!Array.isArray(fields)) fields = [fields];     getSectionIDs(`repeating_${section}`, idArray => {         const attrArray = idArray.reduce( (m,id) => [...m, ...(fields.map(field => `repeating_${section}_${id}_${field}`))],[]);         getAttrs(attrArray, v => {             console.log("===== values of v: "+ JSON.stringify(v) +" =====");                  // getValue: if not a number, returns 1 if it is 'on' (checkbox), otherwise returns 0..             const getValue = (section, id,field) => parseFloat(v[`repeating_${section}_${id}_${field}`]) || (v[`repeating_${section}_${id}_${field}`] === 'on' ? 1 : 0);             const sumTotal = idArray.reduce((total, id) => total + fields.reduce((subtotal,field) => subtotal * getValue(section, id,field),1),0);             setAttrs({[destination]: sumTotal * multiplier});            });     }); }; on('change:repeating_inventory remove:repeating_inventory', function() {     repeatingSum("InventoryReadiedTotal","inventory","Inventory_Readied"); }); </script> When i did this it worked fine. If that works for you, the issue in your original campaign is something else. Given that those style sections caused it to fail, if you have any  style sections like those in your file, remove them all and retest.