Table of contents
See it in Action
Check Out the Code
<html>
<head>
<SCRIPT type="text/javascript" lang="javascript"
src="http://cdn.gigya.com/JS/socialize.js?apikey=2_Y82PzwJ_chSFImHXaIDJClnLyJzmk-VFOavSsaNTzl6m901s_NNxRAS0xJ3bd3_N">
</SCRIPT>
<SCRIPT type="text/javascript" lang="javascript" >
// This method is activated when the page is loaded
function onLoad() {
// register for login event
gigya.socialize.addEventHandlers({
onLogin: onLoginHandler,
onLogout: onLogoutHandler
});
}
// onLogin Event handler
function onLoginHandler(eventObj) {
// Show the User Status plugin on login
gigya.gm.showUserStatusUI(userStatusParams);
}
// onLogout Event handler
function onLogoutHandler(eventObj) {
//Include the default challenge's badge in the Achievements plugin
gigya.gm.showAchievementsUI({containerID: 'divAchievements', excludeChallenges:''});
}
// Logout from Gigya platform. This method is activated when "Logout" button is clicked
function logoutFromGS() {
gigya.socialize.logout(); // logout from Gigya platform
}
var loginParams = {
containerID: 'divLogin',
showTermsLink:false,
hideGigyaLink:true,
height: 45,
width: 180
}
var userStatusParams = {
containerID: 'divUserStatus'
}
var challengeStatusParams = {
containerID: 'divChallengeStatus'
}
var achievmentsParams = {
containerID: 'divAchievements'
}
var leaderboardParams = {
containerID: 'divLeaderboard'
}
var notificationParams = {
debugMode:true // The notification plugin will appear even if no new level has been reached
}
</SCRIPT>
</head>
<body onload="onLoad()">
<br />
<font face="arial"> Login: </font>
<div id="divLogin"></div><br />
<div id="divUserStatus"></div>
<div id="divChallengeStatus"></div>
<div id="divAchievements"></div>
<div id="divLeaderboard"></div>
<script>
gigya.socialize.showLoginUI(loginParams);
gigya.gm.showUserStatusUI(userStatusParams);
gigya.gm.showChallengeStatusUI(challengeStatusParams);
gigya.gm.showAchievementsUI(achievmentsParams);
gigya.gm.showLeaderboardUI(leaderboardParams);
gigya.gm.showNotifications(notificationParams);
</script>
<br />
<input id="btnLogout" type="button" value="Logout"
onclick="logoutFromGS()"/>
<br />
</body>
</html>
Note:
In order to make this code work in your environment, please:
In order to make this code work in your environment, please:
- Click the "view source" icon (link located above code on the right hand side) - This will open a popup window with a text version of the code, which you may copy.
- The API key in the sample will only work on http://localhost/...
- To load the page from your domain, modify the value of the "APIKey" field in the code to your own Gigya API Key. A Gigya API Key can be obtained on the Site Dashboard page on Gigya's website. Please make sure that the domain from which you are loading the page is the same domain name that you used for generating the API Key.
Comments