preferences + peers + transfers = user dialog

This commit is contained in:
rlx 2016-01-13 12:30:18 +05:30
parent e78c6eebfe
commit dc3d59ca42
4 changed files with 54 additions and 209 deletions

View file

@ -1,79 +1,10 @@
'use strict'; 'use strict';
oml.ui.usersDialog = function() { oml.ui.peersPanel = function() {
var preferences = oml.user.preferences, var ui = oml.user.ui,
ui = oml.user.ui,
that = Ox.Dialog({ preferences = oml.user.preferences,
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({
open: function() {
oml.bindEvent({
peering: peering,
});
},
close: function() {
oml.unbindEvent({
peering: peering,
});
if (ui.page == 'users') {
oml.UI.set({page: ''});
}
},
oml_page: function() {
// ...
}
}),
// FIXME: WRONG!
$users = Ox.Element().css({
background: 'rgb(240, 240, 240)',
overflowX: 'hidden'
}),
$user = Ox.Element(),
$panel = Ox.SplitPanel({
elements: [
{element: $users, size: 256},
{element: $user}
],
orientation: 'horizontal'
}),
users,
peerIds = [],
buttons = [ buttons = [
{id: 'send', title: Ox._('Send')}, {id: 'send', title: Ox._('Send')},
@ -110,9 +41,15 @@ oml.ui.usersDialog = function() {
} }
], ],
$lists = [ peerIds = [],
renderSectionList({id: 'invitations'}).appendTo($users)
], users,
// FIXME: WRONG!
$users = Ox.Element().css({
background: 'rgb(240, 240, 240)',
overflowX: 'hidden'
}),
$folders = folders.map(function(folder) { $folders = folders.map(function(folder) {
return Ox.CollapsePanel({ return Ox.CollapsePanel({
@ -121,6 +58,29 @@ oml.ui.usersDialog = function() {
}) })
.css({width: '256px'}) .css({width: '256px'})
.appendTo($users); .appendTo($users);
}),
$lists = [
renderSectionList({id: 'invitations'}).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() { var peering = Ox.throttle(function() {
@ -466,7 +426,7 @@ oml.ui.usersDialog = function() {
} }
$panel.replaceElement(1, $user); that.replaceElement(1, $user);
} }
@ -610,7 +570,6 @@ oml.ui.usersDialog = function() {
}) })
}); });
that.options({content: $panel});
callback && callback(); callback && callback();
}); });
@ -618,9 +577,6 @@ oml.ui.usersDialog = function() {
} }
that.updateElement = function() { that.updateElement = function() {
that.options({
content: Ox.LoadingScreen().start()
});
updateUsers(); updateUsers();
return that; return that;
}; };

View file

@ -1,9 +1,10 @@
'use strict'; 'use strict';
oml.ui.preferencesDialog = function() { oml.ui.preferencesPanel = function() {
var preferences = oml.user.preferences, var ui = oml.user.ui,
ui = oml.user.ui,
preferences = oml.user.preferences,
items = { items = {
account: [ account: [
@ -237,81 +238,14 @@ oml.ui.preferencesDialog = function() {
}) })
.appendTo($helpElement), .appendTo($helpElement),
$panel = Ox.SplitPanel({ that = Ox.SplitPanel({
elements: [ elements: [
{element: $list, size: 128}, {element: $list, size: 128},
{element: $main} {element: $main}
], ],
orientation: 'horizontal' orientation: 'horizontal'
}),
$usersButton = Ox.Button({
id: 'users',
style: 'squared',
title: Ox._('Users...')
})
.bindEvent({
click: function() {
oml.UI.set({page: 'users'});
}
}),
$notificationsButton = Ox.Button({
id: 'notifications',
style: 'squared',
title: Ox._('Notifications...')
})
.bindEvent({
click: function() {
oml.UI.set({page: 'notifications'});
}
}),
$transfersButton = Ox.Button({
id: 'transfers',
title: Ox._('Transfers...')
})
.bindEvent({
click: function() {
oml.UI.set({page: 'transfers'});
}
}),
that = Ox.Dialog({
buttons: [
$usersButton,
$notificationsButton,
$transfersButton,
{},
Ox.Button({
id: 'done',
style: 'squared',
title: Ox._('Done')
})
.bindEvent({
click: function() {
that.close();
}
})
],
closeButton: true,
content: $panel,
fixedSize: true,
height: 384,
keys: {escape: 'close'},
removeOnClose: true,
title: Ox._('Preferences'),
width: 768
}) })
.bindEvent({ .bindEvent({
open: function() {
$list.gainFocus();
},
close: function() {
if (ui.page == 'preferences') {
oml.UI.set({page: ''});
}
},
'oml_part.preferences': function() { 'oml_part.preferences': function() {
if (ui.page == 'preferences') { if (ui.page == 'preferences') {
that.updateElement(); that.updateElement();
@ -319,6 +253,7 @@ oml.ui.preferencesDialog = function() {
} }
}); });
function displayHelp(item) { function displayHelp(item) {
$helpLabel.options({title: item.title}); $helpLabel.options({title: item.title});
$help.html(Ox._(item.help)); $help.html(Ox._(item.help));
@ -467,10 +402,6 @@ oml.ui.preferencesDialog = function() {
$formElement.append($form); $formElement.append($form);
$helpElement.hide(); $helpElement.hide();
$usersButton[part == 'peering' ? 'show' : 'hide']();
$notificationsButton[part == 'peering' ? 'show' : 'hide']();
$transfersButton[part == 'network' ? 'show' : 'hide']();
return that; return that;
}; };

View file

@ -1,6 +1,6 @@
'use strict'; 'use strict';
oml.ui.transfersDialog = function() { oml.ui.transfersPanel = function() {
var ui = oml.user.ui, var ui = oml.user.ui,
@ -45,16 +45,6 @@ oml.ui.transfersDialog = function() {
unique: 'id' unique: 'id'
}), }),
$statusbar = Ox.Bar({size: 16}),
$panel = Ox.SplitPanel({
elements: [
{element: $list},
{element: $statusbar, size: 16}
],
orientation: 'vertical'
}),
$item = Ox.Element(), $item = Ox.Element(),
$cancelButton = Ox.Button({ $cancelButton = Ox.Button({
@ -76,54 +66,21 @@ oml.ui.transfersDialog = function() {
}) })
.appendTo($item), .appendTo($item),
$content = Ox.SplitPanel({ that = Ox.SplitPanel({
elements: [ elements: [
{element: $panel}, {element: $list},
{element: $item, size: 160} {element: $item, size: 160}
], ],
orientation: 'horizontal' orientation: 'horizontal'
}), });
that = Ox.Dialog({
buttons: [
Ox.Button({
id: 'preferences',
title: Ox._('Network Preferences...')
})
.bindEvent({
click: function() {
oml.UI.set({page: 'transfers'});
}
}),
{},
Ox.Button({
id: 'done',
title: Ox._('Done')
})
.bindEvent({
click: function() {
that.close();
}
})
],
closeButton: true,
content: $content,
height: 384,
title: Ox._('Transfers'),
width: 768
})
.bindEvent({
close: function() {
if (ui.page == 'transfers') {
oml.UI.set({page: ''});
}
}
});
oml.bindEvent({ oml.bindEvent({
transfer: Ox.throttle(function(data) { transfer: Ox.throttle(function(data) {
var current = $list.value(data.id); var current = $list.value(data.id);
if (!Ox.isEmpty(current) && current.transferprogress != data.progress) { if (
!Ox.isEmpty(current)
&& current.transferprogress != data.progress
) {
$list.value(data.id, 'transferprogress', data.progress); $list.value(data.id, 'transferprogress', data.progress);
} }
}, 1000) }, 1000)

View file

@ -49,7 +49,8 @@
"namesDialog.js", "namesDialog.js",
"notificationsButton.js", "notificationsButton.js",
"openButton.js", "openButton.js",
"preferencesDialog.js", "peersPanel.js",
"preferencesPanel.js",
"previewButton.js", "previewButton.js",
"previewDialog.js", "previewDialog.js",
"resetUIDialog.js", "resetUIDialog.js",
@ -61,11 +62,11 @@
"statusbar.js", "statusbar.js",
"titlesDialog.js", "titlesDialog.js",
"toolbar.js", "toolbar.js",
"transfersDialog.js", "transfersPanel.js",
"updateButton.js", "updateButton.js",
"updateDialog.js", "updateDialog.js",
"userButton.js", "userButton.js",
"usersDialog.js", "userDialog.js",
"utils.js", "utils.js",
"viewPanel.js", "viewPanel.js",
"viewer.js", "viewer.js",