Thumbs Bomber (behind the scene :P) Thumbs Bomber (behind the scene :P)

Kalo ini sih udah pasti wajib ada.. (asal jangan dobel-dobel aja)

<div id="fb-root"></div>

<script type="text/javascript">
var idAplikasiGue = '333487403180';

window.fbAsyncInit = function(){
  FB.init({
    appId: idAplikasiGue, 
    status: true, cookie: true, xfbml: true
  });
};
(function() {
  var e = document.createElement('script'); 
      e.async = 'true';
      e.src = document.location.protocol + 
              '//connect.facebook.net/en_US/all.js';
      document.getElementById('fb-root').appendChild(e);
}());
</script>

Deteksi User & Permissions.. (Secara manual pake onClick event)

CSS..

<style type="text/css">
#tempat-kontent img#gambar-user{
  float:left; 
  padding:0px 7px 0px 0px; 
  border:0px; 
  max-width:100px; _width:100px;
}
#tempat-kontent h3#nama-user{
  margin-left:110px;
}
#klik-login input.button{
  font-family: 'lucida grande',tahoma,verdana,arial,sans-serif;
  background:#617AAC url(http://2.bp.blogspot.com/_bBL9ze_JZsw/TTkfFTP1LiI/AAAAAAAAALM/88pCEE5Ck0M/s1600/rock.gif) no-repeat scroll 4px 2px;
  color: #FFFFFF;
  font-weight: bold;
  border: 1px outset #29447E;
 -moz-border-radius: 5px; border-radius: 5px;
  padding:2px 7px 2px 20px;
  cursor: pointer;
  margin-top:5px;
}
#klik-login input.button:hover{
  background-color: #011A4C;
  color: yellow;
}
</style>

HTML..

<div id="tempat-kontent" style="display:none;">
  <img id="gambar-user" src="http://static.ak.fbcdn.net/rsrc.php/v1/yb/r/GsNJNwuI-UM.gif"/>
  <h3 id="nama-user"><img src="http://static.ak.fbcdn.net/rsrc.php/v1/yb/r/GsNJNwuI-UM.gif"/></h3>
  <hr style="clear:both;"/>
</div>

<center id="klik-login">
  <input type="button" class="button" onClick="loginDong()" value="Click Here to Begin.."/>
</center>

JavaScript..

<script type="text/javascript">
function loginDong(){
  FB.login(klikLogin,{perms:'read_stream,publish_stream'});
}

function klikLogin(response){
  if (response.session){
    if(response.perms){
      openSesion(response);
    }else{
      loginDong();
    }
  }else{
    loginDong();
  }
}

var idPengguna='';
function openSesion(response){
  if(response.session.uid){
    document.getElementById('klik-login').style.display='none';
    document.getElementById('tempat-kontent').style.display='block';

    idPengguna=response.session.uid;
    document.getElementById('gambar-user').src='http://graph.facebook.com/'+idPengguna+'/picture?type=normal';
    FB.api('/'+idPengguna+'?fields=name,username', 'get', tulisNamaUser);
  }else{
    loginDong();
  }
}

function tulisNamaUser(response){
  if(response.name && response.username){
    document.getElementById('nama-user').innerHTML='<a href="http://www.facebook.com/'+response.username+'" target="_blank">'+response.name+'</a>';
  }else if(response.name){
    document.getElementById('nama-user').innerHTML='<a href="http://www.facebook.com/profile.php?id='+idPengguna+'" target="_blank">'+response.name+'</a>';
  }else{
    document.getElementById('nama-user').innerHTML='wkwkwkk.. doDOL nih Script-nya!! :P';
  }
}
</script>

Coba dong..

Buat nge-Like sebuah postingan.. (pake Facebook JavaScript SDK)

HTML..

<label for="masukan-id-post">Masukan Post_id:</label> 

<input type="text" id="masukan-id-post" value="100000175501773_233130340036148" onClick="this.select()" style="width:225px;"/>
<br/>
<a onClick="likePostinganDong(document.getElementById('masukan-id-post').value)" style="cursor:pointer;">coba dong..</a> 
<img id="gambar-loading-like" src="http://static.ak.fbcdn.net/rsrc.php/v1/yb/r/GsNJNwuI-UM.gif" style="display:none;"/>

JavaScript..

<script type="text/javascript">
function likePostinganDong(idPostingan){
  document.getElementById('gambar-loading-like').style.display='inline-block';
  FB.api('/'+idPostingan+'/likes', 'post', tulisResponNya);
}

function tulisResponNya(respon){
  document.getElementById('gambar-loading-like').style.display='none';
  if(respon.error){
    alert(respon.error.message)
  }else{
    alert(respon);
  }
}
</script>

Masukan Post_id:

---

Format post_id yang digunakan:
userID_PostID
100000175501773_233130340036148

---

Sayangnya Facebook gak nerima format userName_PostID
Just.Ask.Me.Who.Iam_233130340036148

Dapetin Post_IDs.. (Facebook JavaScript SDK)

HTML..

<label for="id-input">ID or UserName 
  <input id="id-input" type="text" value="" onClick="this.select()"/>
</label> 
<br/>
<label for="howmuch"> How much? 
  <select id="howmuch">
    <option value="5" selected="selected">5 Posts</option>
    <option value="10">10 Posts</option>
  </select>
</label> 

<label for="where">Where? 
  <select id="where">
    <option value="home" selected="selected">My home feed</option>
    <option value="feed">wall feed</option>
  </select>
</label> 

<div id="lapor-gan"></div>
<div id="posts-list"></div>

<input type="button" class="button" onClick="cariPostIds(document.getElementById('id-input').value, document.getElementById('howmuch').value, document.getElementById('where').value)" value="coba dong.."/> 

JavaScript..

<script type="text/javascript">
  function cariPostIds(userNya,howmuch,where){
    var laporGan = document.getElementById('lapor-gan');
    var postslist = document.getElementById('posts-list');
    var daptarPostIds=[];

    if(userNya==''){userNya='me'}
    if(userNya=='me'){
      //mau diapain?
    }else{where='feed'}

    laporGan.innerHTML='<img src="http://static.ak.fbcdn.net/rsrc.php/v1/yb/r/GsNJNwuI-UM.gif"/> ';
    laporGan.innerHTML+='<small>detecting Posts please wait..</small>';
    postslist.innerHTML='';

    FB.api('/'+userNya+'/'+where, 'get', {limit:howmuch}, function(response){
      if(response.data){

        for(x in response.data){
          if(response.data[x].id){
            daptarPostIds[x]=response.data[x].id;
            postslist.innerHTML+=response.data[x].id+'<br/>';
          }
        }
        laporGan.innerHTML='<h3><big>'+daptarPostIds.length+'</big> Posts detected..!</h3> ';
      }else if(response.error){
        laporGan.innerHTML='<h3><big>Error</big> '+response.error.message+'</h3> ';
      }else{
        laporGan.innerHTML='<h3><big>'+response+'</big></h3> ';
      }
    });
  }
</script>

ID or UserName:  
How much?      5 Posts     10 Posts    Where?      My home feed     wall feed   

 

Tar Lanjut..