preferences + peers + transfers = user dialog
This commit is contained in:
parent
e78c6eebfe
commit
dc3d59ca42
4 changed files with 54 additions and 209 deletions
|
@ -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;
|
||||||
};
|
};
|
||||||
|
|
|
@ -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;
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
|
@ -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)
|
||||||
|
|
|
@ -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",
|
||||||
|
|
Loading…
Reference in a new issue