[Code] Tạo Widget Friends List
Trang 1 trong tổng số 1 trang • Share
[Code] Tạo Widget Friends List
Demo:
[You must be registered and logged in to see this image.]
Hướng dẫn:
Tạo 1 widget mới (Modules > Forum widgets management)
[You must be registered and logged in to see this image.]
Widget name : Friends list
Use a table type : Yes
Widget title : Friends list
Widget source :
[You must be registered and logged in to see this image.]
[You must be registered and logged in to see this image.]
Hướng dẫn:
Tạo 1 widget mới (Modules > Forum widgets management)
[You must be registered and logged in to see this image.]
Widget name : Friends list
Use a table type : Yes
Widget title : Friends list
Widget source :
- Code:
<!--
DEVELOPED BY ANGE TUTEUR
NO DISTRIBUTION WITHOUT CONSENT OF THE AUTHOR
ORIGIN : http://fmdesign.forumotion.com/t394-widget-friends-list#3129
--><style type="text/css">
#fa_friends_widget { font-size:12px; font-family:Arial, Helvetica, Verdana, Sans-serif; }
#fa_friends_stats { text-align:center; }
#fa_friends_list { max-height:200px; overflow-y:auto; }
.fa_friend_row { margin:10px 0; }
.fa_friend_info { float:left; overflow: hidden; text-overflow:ellipsis; white-space:nowrap; width:90px; }
.fa_friend_online, a.fa_friend_username { color:#999 !important; text-decoration:none; }
.fa_friend_avatar { background:#FFF; border:2px solid #999; height:30px; width:30px; vertical-align:top; margin-right:6px; display:block; float:left; }
.fa_friend_avatar img { height:30px; width:30px; }
.fa_friend_row:hover .fa_friend_online, .fa_friend_row:hover a.fa_friend_username { color:#777 !important; }
.now_online .fa_friend_avatar { border-color:#69C; }
.now_online .fa_friend_online, .now_online a.fa_friend_username { color:#69C !important; }
.fa_friend_row.now_online:hover .fa_friend_online, .fa_friend_row.now_online:hover a.fa_friend_username { color:#47A !important; }
#fa_friends_actions { color:#666; background:#FFF; border:1px solid #CCC; position:absolute; padding:3px 0; z-index:99999; }
#fa_friends_actions a { color:#333; text-decoration:none; padding:4px 12px; display:block; }
#fa_friends_actions a:hover { color:#FFF; background:#38F; }
#fa_friends_actions a.danger:hover { background:#F33; }
#fa_friends_actions .danger { border-top:1px solid #CCC; margin-top:3px; }
</style>
<div id="fa_friends_widget">
<div id="fa_friends_stats">
</div>
<div id="fa_friends_list">
<div id="fa_friends_online">
</div>
</div>
<div style="display:none" id="fa_friends_actions">
</div>
</div>
<script type="text/javascript">//<![CDATA[
(function() {
window.fafl = {
cache : 5*60*1000,
lang : {
online : 'Online',
offline : 'Offline',
loading : 'Đang tải danh sách bạn bè..',
stats : '%{ONLINE} trong tổng số %{TOTAL} bạn bè đang online',
send_message : 'Gửi tin nhắn',
view_profile : 'Xem thông tin',
view_topics : 'Xem chủ đề',
view_posts : 'Xem bài viết',
remove : 'Xóa bạn bè',
delete_friend : 'Bạn có chắc chắn muốn xóa %{NAME} từ danh sách bạn bè của bạn ?',
no_friends : 'Bạn chưa có bạn bè nào.'
},
node : {
widget : document.getElementById('fa_friends_widget'),
list : document.getElementById('fa_friends_list'),
stats : document.getElementById('fa_friends_stats'),
online : document.getElementById('fa_friends_online'),
actions : document.getElementById('fa_friends_actions')
},
lastNode : null,
toggleActions : function(node) {
if (fafl.lastNode == node && !/none/.test(fafl.node.actions.style.display)) {
fafl.node.actions.style.display = 'none';
fafl.lastNode = null;
} else {
var offset = jQuery(node).offset(),
id = node.href.replace(/.*?\/u(\d+).*/, function(M, S1) { return S1 }),
name = jQuery(node).text();
fafl.lastNode = node;
fafl.node.actions.innerHTML = '<a href="/u' + id + '">' + fafl.lang.view_profile + '</a><a href="/st/' + name + '">' + fafl.lang.view_topics + '</a><a href="/spa/' + name + '">' + fafl.lang.view_posts + '</a><a href="/privmsg?mode=post&u=' + id + '">' + fafl.lang.send_message + '</a><a class="danger" href="/profile?mode=editprofile&page_profil=friendsfoes&remove=' + id + '" onclick="fafl.remove(this, \'' + name + '\');return false;">' + fafl.lang.remove + '</a>';
fafl.node.actions.style.left = offset.left + 'px';
fafl.node.actions.style.top = offset.top + 20 + 'px';
fafl.node.actions.style.display = 'block';
}
},
bindActionEvents : function() {
jQuery(document).on('click', function(e) {
if (/fa_friend_username/.test(e.target.className)) {
e.preventDefault();
fafl.toggleActions(e.target);
} else if (/block/.test(fafl.node.actions.style.display)) {
fafl.node.actions.style.display = 'none';
}
});
jQuery(fafl.node.actions).mouseleave(function() {
this.style.display = 'none';
});
},
remove : function(node, name) {
var del = confirm(fafl.lang.delete_friend.replace(/%\{NAME\}/, name));
if (del) {
if (storage) {
storage.removeItem('faFriendsWidgetExp');
}
window.location.href = node.href;
}
},
processed : 0,
quota : 0
};
var storage = window.localStorage;
if (storage && storage.faFriendsWidget && storage.faFriendsIdent == _userdata.user_id && storage.faFriendsWidgetExp > +new Date - fafl.cache) {
fafl.node.widget.innerHTML = storage.faFriendsWidget;
fafl.node.actions = document.getElementById('fa_friends_actions');
fafl.bindActionEvents();
}
else {
fafl.node.stats.innerHTML = fafl.lang.loading;
jQuery.get('/profile?mode=editprofile&page_profil=friendsfoes', function(d) {
for (var a = jQuery('div:has(> a[href*="page_profil=friendsfoes&remove"]) a:first-child', d), i = 0, j = a.length, container = document.createElement('DIV'), temp, row; i < j; i++) {
temp = document.createElement('DIV');
temp.id = 'fa_friend_u' + a[i].href.replace(/.*?\/u(\d+).*/, function(M, S1) { return S1 });
temp.className = 'fa_friend_row';
temp.innerHTML = '<a href="' + a[i].href + '" class="fa_friend_avatar"><img src="http://2img.net/i/fa/invision/pp-blank-thumb.png"/></a><div class="fa_friend_info"><a href="' + a[i].href + '" class="fa_friend_username">' + jQuery(a[i]).text() + '</a><br/><span class="fa_friend_online">' + fafl.lang.offline + '</span></div><div class="clear"></div>';
container.appendChild(temp);
}
if (!j) {
fafl.node.stats.innerHTML = fafl.lang.no_friends;
return false;
}
container.id = 'fa_friends_offline';
fafl.node.offline = container;
fafl.node.list.appendChild(container);
fafl.bindActionEvents();
row = jQuery('.fa_friend_row', container);
fafl.quota = row.length;
row.each(function() {
var t = this;
jQuery.get('/' + t.id.slice(10), function(d) {
var ava = jQuery('#profile-advanced-right .module:first div img:first,.forumline td.row1.gensmall:first > img:first, .frm-set.profile-view.left dd img,dl.left-box.details:first dd img, .row1 b .gen:first img, .real_avatar img', d)[0];
jQuery('.fa_friend_avatar img', t).attr('src', ava ? ava.src : 'http://2img.net/i/fa/invision/pp-blank-thumb.png');
if (jQuery('#profile-advanced-right em, .module-title em', d)[0]) {
t.className += ' now_online';
jQuery('.fa_friend_online', t).text(fafl.lang.online);
fafl.node.online.appendChild(t);
}
if (++fafl.processed == fafl.quota) {
var online = jQuery('.fa_friend_row', fafl.node.online).length;
fafl.node.stats.innerHTML = fafl.lang.stats.replace(/%\{ONLINE\}/g, online).replace(/%\{TOTAL\}/g, online + jQuery('.fa_friend_row', fafl.node.offline).length);
if (storage) {
storage.faFriendsIdent = _userdata.user_id;
storage.faFriendsWidget = fafl.node.widget.innerHTML;
storage.faFriendsWidgetExp = +new Date;
}
}
});
});
});
}
}());
// par ange tuteur
//]]></script>
[You must be registered and logged in to see this image.]
FMDESIGN [You must be registered and logged in to see this image.]
HelpsFMvi- Ban Quản Trị FMvi
- Số bài : 104
HelpsPoints : 15318
Likes : 33
Ngày tham gia : 10/03/2016
Trạng thái :Online Offline
Tuổi : 26
Location : Ninh Thuận
[Click để xem tài sản HelpsFMvi]
Similar topics
» [Code] Tạo Widget Đồng Hồ
» [Code] Tạo Widget Notepad
» [Code] Widget: Nhóm
» [Code] Widget Chủ Đề Tương Tự
» [Code] Trang trí các thẻ trong Widget KEYWORDS
» [Code] Tạo Widget Notepad
» [Code] Widget: Nhóm
» [Code] Widget Chủ Đề Tương Tự
» [Code] Trang trí các thẻ trong Widget KEYWORDS
Trang 1 trong tổng số 1 trang
Permissions in this forum:
Bạn không có quyền trả lời bài viết
|
|