Wie erstelle ich einen Facebook RSS Feed Reader für meinen Blog - Seite 5

9 Eine Einladungs-Seite erstellen

In diesem Kapitel erstelle ich eine Einladungsfunktion, die es den Benutzern Deiner Anwendung erlaubt, bis zu 10 Freunde auf einmal einzuladen, Deine App ebenfalls zu installieren. Die Vorgehensweise wird hier beschrieben: http://wiki.developers.facebook.com/index.php/Invite_Page, ich werde jedoch den Code für unsere Anwendung anpassen:

vi /var/www/fb/htf_feed_reader/friendselect.php


<?php
include_once 'conf.php'; require_once('appinclude.php'); // Collect the user's friends $fql = "SELECT uid, name, has_added_app, pic_small FROM user WHERE uid IN (SELECT uid2 FROM friend WHERE uid1=".$user.")"; $friends = $facebook->api_client->fql_query($fql); ?> <html> <head> <script type="text/javascript"> function toggle_box(box_id) { thebox = document.getElementById('uid'+box_id); if (thebox.checked == false && thebox.disabled == false) { thebox.checked = true; } else if (thebox.checked == true) { thebox.checked = false; } disable_extras(); } function disable_extras() { var checkboxes = document.getElementsByTagName('input'); num_checked = 0; for (i=0; i < checkboxes.length; i++) { if (checkboxes[i].type == "checkbox" && checkboxes[i].checked == true) num_checked ++; } if (num_checked == 10) { for (i=0; i < checkboxes.length; i++) { if (checkboxes[i].type == "checkbox" && checkboxes[i].checked == false) checkboxes[i].disabled = true; } } else { for (i=0; i < checkboxes.length; i++) { checkboxes[i].disabled = false; } } } </script> </head> <body> <form action="http://apps.facebook.com/htf_feed_reader/invite.php" method="post" target="_parent"> <div style="width: 500px; height: 300px; overflow: auto; border: #aaaaaa 1px solid;"> <?php echo '<table style="width: 100%;">'; $count = 0; for ($i=0; $i < count($friends); $i++) { // Print out all friends who have not added the application. Check the first 10 friends (checked="checked" until $count reaches 10). $record = $friends[$i]; if ($record['has_added_app'] != 0) continue; if ($count%5 == 0) echo '<tr>'; if ($count < 10) { $checked = ' checked="checked"'; $disabled = ''; } else { $checked = ''; $disabled = ' disabled="true"'; } if ($record['pic_small'] == '') $pic_url = 'http://static.ak.facebook.com/pics/t_default.jpg'; else $pic_url = $record['pic_small']; echo '<td style="font-family: Arial; font-size: 70%; text-align: center; width: 25%; vertical-align: top; padding: 10px; cursor: pointer;" onclick="toggle_box(''.$record['uid'].'');">'; echo '<img src="'.$pic_url.'" /><br /><br />'; echo '<input type="checkbox" id="uid'.$record['uid'].'" name="uid'.$record['uid'].'"'.$disabled.$checked.' style="cursor: pointer;" onclick="toggle_box(''.$record['uid'].'');" /> '; echo $record['name']; echo '</td>'; if (($count+1)%5 == 0) echo '</tr>'; $count ++; } if ($count%5 != 0) echo '</tr>'; echo '</table>'; ?> </div> <div style="text-align: center; width: 500px; height: 50px; padding: 10px;"> <input type="hidden" name="act" value="invite" /> <input type="submit" value="Invite Friends" style="margin: 2px 4px; background: #3B5998; border: #D9DFEA 1px solid; color: #FFFFFF; font-family: 'lucida grande', tahoma, verdana, arial, sans-serif; font-size: 11px; text-align: center;" /> </div> </form> </body> </html>

vi /var/www/fb/htf_feed_reader/invite.php


<?php
include_once 'conf.php'; require_once('appinclude.php'); $facebook->require_frame(); $user = $facebook->require_login(); if ($_POST['act'] == 'invite') { // Invite the friends that were selected. $friends = array(); foreach ($_POST as $key => $value) { if (strpos($key,'uid') == 0 && $value == 'on' && count($friends) < 10) { $friends[count($friends)] = substr($key,3,strlen($key)-3); } } $tail = '&next=invite.php?total='.count($friends); $url = $facebook->api_client->notifications_sendRequest($friends, 'HowtoForge RSS Feed Reader', '<fb:name uid="'.$user.'" firstnameonly="true" /> wants you to check out this HowtoForge feed about the newest Linux tutorials!<fb:req-choice url="'.$facebook->get_add_url().'" label="Go for it" />', 'http://fb.howtoforge.com/fb/htf_feed_reader/htf_fb_app_logo_75x75.gif', true); $facebook->redirect($url.$tail); exit; } if ($_GET['sent'] == 1) { // Display a message letting the user know invitations have been successfully sent. ?> <fb:success> <fb:message>Your invitations have been sent</fb:message> You have successfully invited <?php echo htmlspecialchars($_GET['total']); ?> of your friends to the HowtoForge RSS Feed Reader. </fb:success> <?php } else { // Render the friend selector in an iframe. ?> <div style="padding: 20px;"> <h1>Invite your friends to the HowtoForge RSS Feed Reader!</h1> <p>Invite your friends here (max 10 per day).</p> <fb:iframe src="http://fb.howtoforge.com/fb/htf_feed_reader/friendselect.php?<?php echo time(); ?>" width="575px" height="400px" frameborder="0" /> <div style="clear: both;"/> </div> <?php } ?>
Nun müssen wir index.php modifizieren um eine Einladungs-Registerkarte auf unserer Anwendungsseite in Facebook beizufügen, die mit unserer invite.php vernetzt ist:

vi /var/www/fb/htf_feed_reader/index.php


<?php
include('conf.php'); require_once('appinclude.php'); echo '<div style="padding-top:5px;"><fb:tabs> <fb:tab-item href="http://apps.facebook.com/htf_feed_reader/invite.php" title="Invite" selected="true"/> </fb:tabs></div>'; include('rss.php'); $facebook->api_client->profile_setFBML('<fb:ref url="'.$rss_url.'"/>', $user); $facebook->api_client->fbml_refreshRefUrl($rss_url); ?>
Mit <fb:tabs> und <fb:tab-item> können wir Registerkarten auf der Canvas Seite unserer Anwendung definieren. Bitte beachte, dass ich mich mit http://apps.facebook.com/htf_feed_reader/invite.php verlinke, obwohl sich meine invite.php auf http://fb.howtoforge.com/fb/htf_feed_reader/invite.php befindet. Wenn Du zu  http://apps.facebook.com/htf_feed_reader/invite.php gehst, wird der Inhalt automatisch von  http://fb.howtoforge.com/fb/htf_feed_reader/invite.php geholt.

Gehe nun zu der Canvas Seite Deiner Anwendung in Facebook. Dort solltest Du eine Einladungs-Registerkarte sehen:


Wenn Du darauf klickst öffnet sich eine Seite, auf der Du bis zu 10 Freunde auswählen kannst, die die App noch nicht installiert haben. Klicke danach auf "Invite Friends":


Auf der nächsten Seite siehst Du die Mitteilung, die Deinen Freunden geschickt wird. Klicke auf "Send it":


Wenn alles klappt, siehst Du eine Bestätigung, dass eine Einladung für die Anwendung gesendet wurde:


Wenn sich Deine Freunde in ihr Facebook Konto einloggen, sehen sie, dass eine Einladung zu Deinem RSS Reader auf sie wartet (in der oberen rechten Ecke heißt es "1 howtoforge rss feed invitation"):


Wenn sie auf diesen Link klicken, sehen sie die Einladung. Um diese zu akzeptieren und zu installieren, brauchen sie nur auf "Go for it" zu klicken:


Sie werden zur normalen Facebook Application Installation Seite weitergeleitet, auf der sie die Anwendung schließlich installieren können:

10 Die Anwendung dem Anwendungsverzeichnis hinzufügen

Wenn Deine Anwendung fünf oder mehr Benutzer gewonnen hat, kannst Du sie Facebooks Anwendungsverzeichnis hinzufügen, in dem es jeder Facebook Benutzer finden und installieren kann.

Gehe zur "My Applications" Seite in der Facebook Developer Application und klicke auf "Submit Application >>":


Fülle folgendes Formular aus, lade ein 75 x 75px Logo für Deine Anwendung hoch (verwechsle das nicht mit dem Symbol Deiner Anwendung) und klicke auf "Save":

11 Links

0 Kommentar(e)

Zum Posten von Kommentaren bitte