mbellinaso/AzCommerceDemo-WebFrontend.html

## AzCommerceDemo-WebFrontend.html
<html>
<body>
    <h1>Products</h1>
    <ul>
        <li>Product 123 <input id="chkNotifyInStock123" type="checkbox" onclick="toggleNotifyTag(this, '123');">Notify</input></li>
        <li>Product 456 <input id="chkNotifyInStock456" type="checkbox" onclick="toggleNotifyTag(this, '456');">Notify</input></li>
        <li>Product 789 <input id="chkNotifyInStock789" type="checkbox" onclick="toggleNotifyTag(this, '789');">Notify</input></li>
    </ul>
    <script type="text/javascript">
        ...Urban Airship snippet goes here...
    </script>
    <script type="text/javascript">
        UA.then(function(sdk) {
            if (sdk.isSupported && sdk.canRegister) {
                sdk.register();

                document.getElementById("chkNotifyInStock123").checked = sdk.channel.tags.has("notify-instock-123");
                document.getElementById("chkNotifyInStock456").checked = sdk.channel.tags.has("notify-instock-456");
                document.getElementById("chkNotifyInStock789").checked = sdk.channel.tags.has("notify-instock-789");
            }
        }).catch(function(err) {
            console.log(err)
        })

        function toggleNotifyTag(chk, id) {
            UA.then(function(sdk) {
                if (!sdk.channel.optedIn && chk.checked) {
                    alert("You need to accept the browser permission request before being able to use this...");
                    chk.checked = false;
                    console.log("Notifications not enabled, nothing to do...");
                    return;
                }

                var tag = "notify-instock-" + id;
                if (chk.checked) {
                    sdk.channel.tags.add(tag);
                    console.log("added notifications for productId " + id);
                } else {
                    sdk.channel.tags.remove(tag);
                    console.log("removed notifications for productId " + id);
                }
            }).catch(function(err) {
                console.log(err)
            })
        }
    </script>
</body>
</html>
	<html>
	<body>
	<h1>Products</h1>
	<ul>
	<li>Product 123 <input id="chkNotifyInStock123" type="checkbox" onclick="toggleNotifyTag(this, '123');">Notify</input></li>
	<li>Product 456 <input id="chkNotifyInStock456" type="checkbox" onclick="toggleNotifyTag(this, '456');">Notify</input></li>
	<li>Product 789 <input id="chkNotifyInStock789" type="checkbox" onclick="toggleNotifyTag(this, '789');">Notify</input></li>
	</ul>
	<script type="text/javascript">
	...Urban Airship snippet goes here...
	</script>
	<script type="text/javascript">
	UA.then(function(sdk) {
	if (sdk.isSupported && sdk.canRegister) {
	sdk.register();

	document.getElementById("chkNotifyInStock123").checked = sdk.channel.tags.has("notify-instock-123");
	document.getElementById("chkNotifyInStock456").checked = sdk.channel.tags.has("notify-instock-456");
	document.getElementById("chkNotifyInStock789").checked = sdk.channel.tags.has("notify-instock-789");
	}
	}).catch(function(err) {
	console.log(err)
	})

	function toggleNotifyTag(chk, id) {
	UA.then(function(sdk) {
	if (!sdk.channel.optedIn && chk.checked) {
	alert("You need to accept the browser permission request before being able to use this...");
	chk.checked = false;
	console.log("Notifications not enabled, nothing to do...");
	return;
	}

	var tag = "notify-instock-" + id;
	if (chk.checked) {
	sdk.channel.tags.add(tag);
	console.log("added notifications for productId " + id);
	} else {
	sdk.channel.tags.remove(tag);
	console.log("removed notifications for productId " + id);
	}
	}).catch(function(err) {
	console.log(err)
	})
	}
	</script>
	</body>
	</html>