做social game的,总是要想尽办法推广好自己的应用,而病毒式的邀请好友则是经常用到的一个推广方法。
在人人或者facebook上,他们为邀请好友提供了一个非常好友的好友选择器,让用户在邀请好友的时候一目了然,然而在大部分的opensocial平台上是没有的,只是提供一个简单的邀请好友的接口,有时候用户自己都不知道该邀请谁或者有谁能邀请,所以想想还是自己动手写了一个类似于facebook的一个好友选择器,功能跟facebook差不多,下面贴张截图:
代码下次再贴上来,如果有想要这个好友选择器的朋友请留言或者发邮件给我。
今天对样式进行了一下调整:
贴出代码:
1 /**
2 * For to invite friends, you should implement selectFriends.inviteFriends.
3 * All selected friends were storaged in the selectFriends.selected_friends by array.
4 *
5 * Author by: Jun
6 * Date:2010.4.4
7 * @return
8 */
9 friendsSelector = function() {};
10 friendsSelector.friends_list = new Array();
11 friendsSelector.g_debug = false;
12 friendsSelector.index = 0;
13 friendsSelector.total_friends = 0;
14 friendsSelector.max = 12;
15 friendsSelector.selected_friends = new Array();
16 friendsSelector.showFriendsPage = function (div_Id) {
17 var friends_html = friendsSelector.generateFriendsPage();
18 //output(friends_html);
19 document.getElementById(div_Id).innerHTML = friends_html;
20 friendsSelector.getViewerFriendsByIndex(0);
21 gadgets.window.adjustHeight();
22 }
23 friendsSelector.getViewerFriendsByIndex = function (index) {
24 var start = index*friendsSelector.max;
25 if(index == null || start > friendsSelector.total_friends) return;
26 //set index to 0 default
27 friendsSelector.index = (index >= 0) ? index : friendsSelector.index;
28 var req = opensocial.newDataRequest();
29 var params = {
30 "first" : start,
31 "max" : friendsSelector.max
32 };
33 friendsSelector.debug(params);
34 req.add(req.newFetchPeopleRequest(opensocial.DataRequest.Group.VIEWER_FRIENDS, params), "viewerFriends");
35 req.send(function (data) {
36 if(data.hadError()) {
37 alert("Please refresh your page to load game again!");
38 friendsSelector.debug(data.get('viewerFriends').getErrorMessage());
39 }else {
40 // friendsSelector.debug(data.get('viewerFriends').getData());
41 friendsSelector.total_friends = data.get('viewerFriends').getData().totalSize_;
42 // friendsSelector.debug(friendsSelector.total_friends);
43
44 friendsSelector.friends_list = [];
45 data.get('viewerFriends').getData().each(function(person) {
46 var friends_info = new Array();
47 friends_info[0] = person.getId();
48 friends_info[1] = person.getDisplayName();
49 friends_info[2] = person.getField('profileUrl');
50 friends_info[3] = person.getField(opensocial.Person.Field.THUMBNAIL_URL);
51 friendsSelector.friends_list[friends_info[0]] = friends_info;
52 delete friends_info;
53
54 });
55 friendsSelector.debug(friendsSelector.friends_list);
56 var friends_html = ''
57 for(var i in friendsSelector.friends_list) {
58 friends_html += friendsSelector.generateFriendHtml(friendsSelector.friends_list[i]);
59 }
60 friendsSelector.debug("Total friends:"+friendsSelector.total_friends+"and max friends:" + friendsSelector.max);
61 var times = Math.floor(friendsSelector.total_friends / friendsSelector.max);
62 friendsSelector.debug("Total times:"+times+"and current time:" + friendsSelector.index);
63 var next_index = times > friendsSelector.index ? (friendsSelector.index+1): null;
64 var previous_index = friendsSelector.index < 1 ? null:(friendsSelector.index-1)
65 friends_html += '<div style=" width: auto; position: relative; right: 80px;clear:both;text-align:right;"><span onclick="friendsSelector.getViewerFriendsByIndex( '+ previous_index + ');" onmouseover="friendsSelector.inviteButtonHover(\'hover\',this);" onmouseout="friendsSelector.inviteButtonHover(\'out\',this);" style="cursor:pointer;background-color:#2f2f2f;padding: 2px 9px 2px 9px;" title="上一页"><<</span><span> </span><span onclick="friendsSelector.getViewerFriendsByIndex( '+ next_index + ');" onmouseover="friendsSelector.inviteButtonHover(\'hover\',this);" onmouseout="friendsSelector.inviteButtonHover(\'out\',this);" style="cursor:pointer;background-color:#2f2f2f;padding: 2px 9px 2px 9px;" title="下一页">>></span></div>';
66 document.getElementById("all_friends").innerHTML = friends_html;
67
68 //change background image
69 for(var i in friendsSelector.selected_friends) {
70 if(friendsSelector.friends_list[friendsSelector.selected_friends[i]]) {
71 // friendsSelector.debug(friendsSelector.friends_list[friendsSelector.selected_friends[i]][0]);
72 friendsSelector.changeImage(friendsSelector.friends_list[friendsSelector.selected_friends[i]][0]);
73 }
74 }
75 }
76 });
77 }
78 friendsSelector.generateFriendsPage = function() {
79 var pageHtml = '';
80 pageHtml += '<div style="margin: 0px; padding: 3px 4px; display: block; background-color: #1F1F1F;width:795px !important;width:785px;font-size: 12px;color:#ffffff">';
81 pageHtml += '<div style=" margin: auto; width: 780px; height: auto;border:1px #eeeeee solid;background-color:#2F2F2F;overflow:hidden;padding:6px !important; padding:10px;">'
82 pageHtml += '<div style="border-bottom:1px solid #eeeeee;height: 31px; clear: both;"><ul style="float: left;">'
83 pageHtml += '<li >);