JSFiddle - React, Tailwind, and code Playground

by Craig Haywood

HTML

<script
    id="fsc-api"
    src="https://d1f8f9xcsvx3ha.cloudfront.net/sbl/0.8.7/fastspring-builder.min.js"
    type="text/javascript"
    data-storefront="secondsplash.test.onfastspring.com/popup-secondsplash"
    data-popup-webhook-received="dataPopupWebhookReceived"
    data-continuous="true">
   
</script>
<script
    id="fsc-api"
    src="https://d1f8f9xcsvx3ha.cloudfront.net/sbl/0.8.9/fastspring-builder.min.js"
    type="text/javascript"
    data-storefront="secondsplash.onfastspring.com/popup-secondsplash">
</script>
<button data-fsc-item-display='SecondSplash Annual Pro Membership Subscription' data-fsc-item-path-value='secondsplash-annual-pro-membership-subscription' onclick="fastspring.builder.tag({'user_id':'2','sponsorid':'2'}); pushToFastSpring();" >
    Add to cart
</button>
<div id="log"></div>
<div id="log2"></div>

<script type="text/javascript">
	function pushToFastSpring() {
		fastspring.builder.recognize(
			{
				"email":"[email protected]",
				"firstName":"Bruce",
				"lastName":"Baxter"
			}
		);
    		fastspring.builder.reset
    		fastspring.builder.add('secondsplash-annual-pro-membership-subscription')
        fastspring.builder.checkout();
	}
</script>

<script>
    function dataPopupWebhookReceived(data) {
    		var json2 = JSON.stringify(data, null, 4)
        document.getElementById("log").innerHTML = "<pre>"+json2+"</pre>";
         if (data.items[0].product = "secondsplash-pro-membership-subscription") {
 document.getElementById("log2").innerHTML = "<pre>hello</pre>";}
    }
</script>