JSFiddle - React, Tailwind, and code Playground
by alexbernotas
HTML
<script src="https://s3-eu-west-1.amazonaws.com/static.competitionlabs.com/gamification-ux-package/build/javascript/gamification-ux-package.v3-selfinit.js"></script>
JavaScript
(function(){
// loading 'gamification-ux-package.v3-selfinit.js'
var widgetInstance = new window._clLeaderBoardV3SelfInit({
enableNotifications: false, // only if SSE is enabled
autoStart: false, // disable auto starting, initialise only on init() method
memberId: "jon-doe-Asd3-_J_CgpY-bw2S2Sy",
bindContainer: document.body,
uri: {
gatewayDomain: "" // removed for demo purpose
},
resources: [
"https://s3-eu-west-1.amazonaws.com/static.competitionlabs.com/gamification-ux-package/gamification-ux-package-examples/advance-blue-theme/css/theme/blue-theme-refresh.css?t=1611248971301"
],
navigation: {
achievements: {
enable: false
},
rewards: {
enable: false
},
inbox: {
enable: false
}
}
});
// overwrite API's with demo data
widgetInstance.settings.uri.members = "https://s3-eu-west-1.amazonaws.com/static.competitionlabs.com/gamification-ux-package/examples/data/member-data-sample.json";
widgetInstance.settings.uri.competitions = "https://s3-eu-west-1.amazonaws.com/static.competitionlabs.com/gamification-ux-package/examples/data/competition-list-data-sample.json";
widgetInstance.settings.uri.competitionById = "https://s3-eu-west-1.amazonaws.com/static.competitionlabs.com/gamification-ux-package/gamification-ux-package-examples/data/competition-data-sample_:id.json";
widgetInstance.settings.uri.memberCompetitions = "https://s3-eu-west-1.amazonaws.com/static.competitionlabs.com/gamification-ux-package/examples/data/competition-list-data-sample.json";
widgetInstance.settings.uri.memberCompetitionById = "https://s3-eu-west-1.amazonaws.com/static.competitionlabs.com/gamification-ux-package/gamification-ux-package-examples/data/competition-data-sample_:competitionId.json";
widgetInstance.settings.uri.contestLeaderboard =...