How to make fb:login-button as a plain text

Question

I have implemented facebook login to my website. Now that, I want fb:login-button to be in a plain text format. Is there any way to do it in polymer?

I want it to be like :

<a href= "#" on-click="FB.customCheckLoginState();"> Sign in with Facebook </a>

Reference : https://github.com/davidwittenbrink/facebook-login/blob/master/facebook-login.html

Answer 1

The solution is pretty simple. Found out the hard way - trial and error.

HTML :

<a href="#" on-click="fb_login">Sign in with facebook</a>

Polymer Script:

Polymer ({
    is: 'facebook-login',

    fb_login: function() {
        FB.login( function( response ) {
            FB.api( '/me', function( facebookResponse ) {
               /* Do something here*/
            });
        }, { scope: 'public_profile,email,user_birthday' } );
    },

    ready: function() {
        window.fbAsyncInit = function() {
            FB.init({
                appId: 'YOUR_APP_ID',
                cookie : true,
                xfbml: true,
                version: 'v2.3'
            });
        }; 
        if( typeof(FB) == 'undefined' ) {
            ( function( d, s, id ) {
                var js, fjs = d.getElementsByTagName(s)[0];
                if ( d.getElementById( id ) ) return;
                js = d.createElement(s); js.id = id;
                js.src = "//connect.facebook.net/en_US/sdk.js";
                fjs.parentNode.insertBefore(js, fjs);
            }( document, 'script', 'facebook-jssdk' ) );
        }
    },

});