'use strict';
oml.ui.peersPanel = function() {
var ui = oml.user.ui,
preferences = oml.user.preferences,
buttons = [
{id: 'send', title: Ox._('Send')},
{id: 'cancel', title: Ox._('Cancel')},
{id: 'accept', title: Ox._('Accept')},
{id: 'reject', title: Ox._('Reject')},
{id: 'remove', title: Ox._('Remove...')}
],
folders = [
{
id: 'peers',
title: Ox._('Your Peers'),
itemTitle: Ox._('No peers'),
text: Ox._('You don\'t have any peers yet.')
},
{
id: 'received',
title: Ox._('Received Requests'),
itemTitle: Ox._('No pending requests'),
text: Ox._('You haven\'t received any peering requests.')
},
{
id: 'sent',
title: Ox._('Sent Requests'),
itemTitle: Ox._('No pending requests'),
text: Ox._('You haven\'t sent any peering requests.')
},
{
id: 'others',
title: Ox._('Other Users'),
itemTitle: Ox._('No other users'),
text: Ox._('There are no other users in your extended network.')
}
],
peerIds = [],
users,
// FIXME: UGLY
$users = Ox.Element().css({
background: {
oxlight: 'rgb(240, 240, 240)',
oxmedium: 'rgb(144, 144, 145)',
oxdark: 'rgb(16, 16, 16)'
}[Ox.Theme()],
overflowX: 'hidden'
}),
$lists = [
renderSectionList({id: 'invitations'}).appendTo($users)
],
$folders = folders.map(function(folder) {
return Ox.CollapsePanel({
collapsed: false,
title: folder.title
})
.css({width: '256px'})
.appendTo($users);
}),
$user = Ox.Element(),
that = Ox.SplitPanel({
elements: [
{element: $users, size: 256},
{element: $user}
],
orientation: 'horizontal'
})
.bindEvent({
oml_page: function(data) {
if (data.value == 'peers') {
oml.bindEvent({peering: peering});
} else if (data.previousValue == 'peers') {
oml.unbindEvent({peering: peering});
}
}
});
var peering = Ox.throttle(function() {
updateUsers();
}, 1000);
if (oml.user.ui.page == 'peers') {
oml.bindEvent({peering: peering});
}
function renderSectionList(folder) {
var $list = Ox.TableList({
columns: [
{
format: function() {
return $('')
.attr({
src: Ox.UI.getImageURL('symbolUser')
})
.css({
width: '10px',
height: '10px',
margin: '2px -2px 2px 0',
opacity: folder.id == 'invitations' ? 1 : 0.5
})
},
id: 'id',
visible: true,
width: 16
},
{
format: function(value) {
return folder.id == 'invitations'
? value
: '' + value + ''
},
id: 'title',
visible: true,
width: 240 - Ox.SCROLLBAR_SIZE
}
],
items: [
{
id: folder.id,
title: folder.id == 'invitations' ? Ox._('Invitations')
: Ox.getObjectById(folders, folder.id).itemTitle
},
],
sort: [{key: 'id', operator: '+'}],
unique: 'id'
})
.css({height: '16px'})
.bindEvent({
select: function(data) {
if (data.ids.length) {
selectItem($list);
renderUser({section: data.ids[0]});
} else {
renderUser();
}
}
});
$list.$body.css({height: '16px'}); // FIXME!
return $list;
}
function renderUser(user) {
var $user = Ox.Element(),
$form = Ox.Element()
.addClass('OxSelectable OxTextPage')
.css({margin: '16px'})
.appendTo($user),
$warning = Ox.Element()
.css({margin: '32px 16px'}) // FIXME: WTF!
.appendTo($user),
$id, $buttons = [], $message, $nickname,
folder;
if (user && user.section) {
folder = Ox.getObjectById(folders, user.section);
}
if (folder) {
$('