include JS enabled login button and background status ping in example

daaku · daaku · commit f3073bdd3c0e · 2010-05-09T00:16:30.000Z
diff --git a/examples/example.php b/examples/example.php
@@ -41,7 +41,7 @@
 
 ?>
 <!doctype html>
-<html>
+<html xmlns:fb="http://www.facebook.com/2008/fbml">
   <head>
     <title>php-sdk</title>
     <style>
@@ -58,16 +58,51 @@
     </style>
   </head>
   <body>
+    <!--
+      We use the JS SDK to provide a richer user experience. For more info,
+      look here: http://github.com/facebook/connect-js
+    -->
+    <div id="fb-root"></div>
+    <script>
+      window.fbAsyncInit = function() {
+        FB.init({
+          appId  : '<?php echo $facebook->getAppId(); ?>',
+          status : true, // check login status
+          cookie : true, // enable cookies to allow the server to access the session
+          xfbml  : true  // parse XFBML
+        });
+
+        // whenever the user logs in, we refresh the page
+        FB.Event.subscribe('auth.login', function() {
+          window.location.reload();
+        });
+      };
+
+      (function() {
+        var e = document.createElement('script');
+        e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
+        e.async = true;
+        document.getElementById('fb-root').appendChild(e);
+      }());
+    </script>
+
+
     <h1><a href="example.php">php-sdk</a></h1>
 
     <?php if ($me): ?>
     <a href="<?php echo $logoutUrl; ?>">
       <img src="http://static.ak.fbcdn.net/rsrc.php/z2Y31/hash/cxrz4k7j.gif">
     </a>
     <?php else: ?>
-    <a href="<?php echo $loginUrl; ?>">
-      <img src="http://static.ak.fbcdn.net/rsrc.php/zB6N8/hash/4li2k73z.gif">
-    </a>
+    <div>
+      Using JavaScript &amp; XFBML: <fb:login-button></fb:login-button>
+    </div>
+    <div>
+      Without using JavaScript &amp; XFBML:
+      <a href="<?php echo $loginUrl; ?>">
+        <img src="http://static.ak.fbcdn.net/rsrc.php/zB6N8/hash/4li2k73z.gif">
+      </a>
+    </div>
     <?php endif ?>
 
     <h3>Session</h3>
