ucc-sdk
Version:
UnchainedCarrot SDK
53 lines (47 loc) • 2.06 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>UCC SDK Browser Example</title>
<script src="./dist/bundle.umd.js"></script>
</head>
<body>
<h1>Open Browser Console To See if there are Errors</h1>
<label for="event-type">Choose An Event Type:</label>
<select name="events" id="event-type">
<option value="track">Track Event</option>
<option value="engagement">Engagement Event</option>
<option value="interaction">Interaction Event</option>
<option value="experience">Experience Event</option>
</select>
<button id="btn-trigger">Trigger Event</button>
<script>
// Initialize SDK
window.addEventListener('DOMContentLoaded', () => {
uccSdk.track.initialize({
customerId: "your_customer_id", // Customer ObjectId from MongoDB, Required
projectId: 'your_project_id', // Defaults to App Host if Not Provided
apiKey: 'live_soon_to_be_deprecated', // Optional
pageId: 'your_landing_page_id', // Optional
stage: 'dev' // Defaults to dev but Possible Values are 'dev' or 'prod'
});
});
// Submit Page Event
window.addEventListener('load', () => {
uccSdk.track.pageEvent();
});
// Trigger Event
document.querySelector('#btn-trigger').addEventListener('click', () => {
const eventType = document.querySelector('#event-type').value;
// console.log(eventType);
uccSdk.track.submitEvent({
event: 'BUTTON_CLICKED', // event name preferrable in caps and underscore for spaces
data: { code: true, ninja: false, assassin: true }, // event data is free object that accepts any properties
user: { name: 'code assassin' }, // if user is present else defaults to browser fingerprint result
type: eventType, // defaults to track if not supplied. eligible values are: track, engagement, interaction & experience
});
});
</script>
</body>
</html>