'use strict'; oml.ui.usersDialog = function() { var preferences = oml.user.preferences, ui = oml.user.ui, that = Ox.Dialog({ buttons: [ Ox.Button({ id: 'preferences', title: Ox._('Peering Preferences...') }) .bindEvent({ click: function() { oml.UI.set({ page: 'preferences', 'part.preferences': 'peering' }); } }), {}, Ox.Button({ id: 'done', title: Ox._('Done') }) .bindEvent({ click: function() { that.close(); } }) ], closeButton: true, content: Ox.Element(), fixedSize: true, height: 384, title: Ox._('Users'), width: 768 }) .bindEvent({ close: function() { if (ui.page == 'users') { oml.UI.set({page: ''}); } }, oml_page: function() { // ... } }), // FIXME: WRONG! $users = Ox.Element().css({background: 'rgb(240, 240, 240)'}), $user = Ox.Element(), $panel = Ox.SplitPanel({ elements: [ {element: $users, size: 256}, {element: $user} ], orientation: 'horizontal' }), users, 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: '...' }, { id: 'sent', title: Ox._('Sent Requests'), itemTitle: Ox._('No pending requests'), text: '...' }, { id: 'others', title: Ox._('Other Users'), itemTitle: Ox._('No other users'), text: Ox._('There are no other users in your extended network.') } ], $lists = [ renderSectionList({id: 'invitations'}).appendTo($users) ], $folders = folders.map(function(folder) { return Ox.CollapsePanel({ collapsed: false, title: folder.title }) .css({width: '256px'}) .appendTo($users); }); 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 } ], 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) { Ox.print('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, folder; if (user && user.section) { folder = Ox.getObjectById(folders, user.section); } if (folder) { $('