Custom script to update progress bar from sales, Squarespace.

So, here's the idea. We have a new product we are launching for Pre-Order on our SquareSpace website. We would like to incorporate some form on progress bar on the website (its already designed and positioned where we want it, CSS is attached) The HTML code for the progress bar is below: <div class="progress-bg"> <div class="progress-bar"> <h3 class="raised">$0&nbsp;of&nbsp;$5,000&nbsp;goal</h3> </div> </div> As mentioned previously, we need to update this progress bar based on the number of sales we have. Squarespace doesn't give too much access so we need this solution to be 100% browser based. The setup: On the page the script will run, SquareSpace will output the quantity in stock using JSON (we believe). Feel free to check for yourself at [login to view URL] (This is where the script will be running) If you inspect the area near the dropdown to select the style of 3D printer you will see the various options, prices, sale prices, and quantity in stock. The idea is that the script will have a hardcoded starting quantity for each product variant (for instance, 100pcs) and a hardcoded goal value (for instance, 5000) The script will likely have to have the variant names hardcoded as well. (This is okay, so long that we can easily add more variants later on.) The script will likely use the variant name to pull its price and the quantity in stock. This quantity in stock will be checked that against the hard-coded inventory starting value (remember we said 100 for this instance). The difference is the number of sales, and the amount/value of sales will be determined by multiplying the difference and the price of the variant. This will need to be done for each variant to add up the total sales. From there, the total sales will be divided by our hard-coded goal, (5000 in this instance) and then properly adjust the CSS slider and update the HTML text accordingly "$XX of $GOAL goal"