Az elején gyorsan megjegyzem, hogy nem fogok foglalkozni az opensocial xml-es leíró nyelvével (egyenlőre)
Elsőnek adjuk is a html oldalunkhoz hozzá a szükséges könyvtárakat:
<script type="text/javascript" src="./scripts/jquery.js"></script>
<script type="text/javascript" src="./scripts/index.js"></script>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>
Elsőnek a jQuery-vel kezdtem, mert nagyon leegyszerűsíti a HTML DOM használatát. A későbbiekben nem fogok kitérni a használatának részleteire. Nagyon jó dokumentációja van telis-tele példákkal.
A második a saját kis index.js fileom, ahova majd mindenféle jó dolgot fogunk írni.
Az utolsó kettő pedig az opensocial betöltéséhez, illetve Friend Connect API-hoz szükséges.
FONTOS! Mielőtt folytatnánk, keressük fel a Google Friend Connect központot, és állítsunk be egy oldalt. Itt jutunk hozzá egy egyedi azonosítóhoz, ami elengedhetetlen a további munkához.
Amint a fentiekkel megvagyunk, adjuk hozzá a következő sorokat:
<script type="text/javascript">
google.load('friendconnect', '0.8');
</script>
A maradékot pedig beírtam az index.js fileomba:
$(document).ready(function(){
google.friendconnect.container.setParentUrl('http://yourdomain.com/root/');
google.friendconnect.container.initOpenSocialApi({
site: 'xxxxxxxxxxxxxxxxxxxx', // az egyedi azonosítód
onload: function(securityToken) { alert('done'); }
});
});
Készen vagyunk! :)
Megjegyzés: Az alert('done'); helyére fogjuk beírni a callback függvényünket, amin keresztül már dolgozhatunk is az OpenSocial függvényekkel.
