login.html | searchcode

/src/main/webapp/fb/examples/mootools/login.html

https://github.com/arindambiswas/NatGeo · HTML · 84 lines · 60 code · 9 blank · 15 comment · 0 complexity · b9b56d68d8229f358dc00f28bdcddd0d MD5 · raw file

<!doctype html>
<html>
  <!--
    Copyright Facebook Inc.

    Licensed under the Apache License, Version 2.0 (the "License");
    you may not use this file except in compliance with the License.
    You may obtain a copy of the License at

        http://www.apache.org/licenses/LICENSE-2.0

    Unless required by applicable law or agreed to in writing, software
    distributed under the License is distributed on an "AS IS" BASIS,
    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
    See the License for the specific language governing permissions and
    limitations under the License.
  -->
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <title>Connect JavaScript - MooTools Login Example</title>
  </head>
  <body>
    <h1>Connect JavaScript - MooTools Login Example</h1>
    <div>
      <button id="login">Login</button>
      <button id="logout">Logout</button>
      <button id="disconnect">Disconnect</button>
    </div>
    <div id="user-info"></div>

    <script src="http://ajax.googleapis.com/ajax/libs/mootools/1.2.3/mootools-yui-compressed.js"></script>

    <div id="fb-root"></div>
    <script src="http://connect.facebook.net/en_US/all.js"></script>
    <script>
      // initialize the library with the API key
      FB.init({ apiKey: '48f06bc570aaf9ed454699ec4fe416df' });

      // fetch the status on load
      FB.getLoginStatus(handleSessionResponse);

      $('login').addEvent('click', function() {
        FB.login(handleSessionResponse);
      });

      $('logout').addEvent('click', function() {
        FB.logout(handleSessionResponse);
      });

      $('disconnect').addEvent('click', function() {
        FB.api({ method: 'Auth.revokeAuthorization' }, function(response) {
          clearDisplay();
        });
      });

      // no user, clear display
      function clearDisplay() {
        document.getElementById('user-info').innerHTML = '';
      }

      // handle a session response from any of the auth related calls
      function handleSessionResponse(response) {
        // if we dont have a session, just hide the user info
        if (!response.session) {
          clearDisplay();
          return;
        }

        // if we have a session, query for the user's profile picture and name
        FB.api(
          {
            method: 'fql.query',
            query: 'SELECT name, pic FROM profile WHERE id=' + FB.getSession().uid
          },
          function(response) {
            var user = response[0];
            var userInfo = document.getElementById('user-info');
            userInfo.innerHTML = '<img src="' + user.pic + '">' + user.name;
          }
        );
      }
    </script>
  </body>
</html>