diff --git a/static/js/pandora/ui/usersDialog.js b/static/js/pandora/ui/usersDialog.js index 170f6d51..e4d24897 100644 --- a/static/js/pandora/ui/usersDialog.js +++ b/static/js/pandora/ui/usersDialog.js @@ -285,7 +285,9 @@ pandora.ui.usersDialog = function() { $userLabel.options({ title: values.username + ' <' + values.email + '>' }); - $user.append(renderUserForm(values)); + $user + .append(renderUserForm(values)) + .append($deleteButton); } else { $userLabel.options({title: 'No user selected'}); } @@ -301,6 +303,57 @@ pandora.ui.usersDialog = function() { $user = Ox.Element({}), + $deleteButton = Ox.Button({ + title: 'Delete User', + width: 96 + }) + .css({position: 'absolute', left: 8, bottom: 8}) + .bindEvent({ + click: function() { + var $dialog = Ox.Dialog({ + buttons: [ + Ox.Button({ + title: 'Cancel' + }) + .bindEvent({ + click: function() { + $dialog.close(); + } + }), + Ox.Button({ + title: 'Delete User' + }) + .bindEvent({ + click: function() { + // ... + $dialog.close(); + } + }) + ], + // fixme: we need a template for this! + content: Ox.Element() + .append( + $('') + .attr({src: '/static/png/icon64.png'}) + .css({position: 'absolute', left: '16px', top: '16px', width: '64px', height: '64px'}) + ) + .append( + Ox.Element() + .css({position: 'absolute', left: '96px', top: '16px', width: '192px'}) + .html( + 'Are you sure that you want do delete the user "' + + $list.value($list.options('selected')[0], 'username') + + '"? This action cannot be undone.' + ) + ), + height: 128, + title: 'Delete User', + width: 304 + }) + .open() + } + }), + that = Ox.Dialog({ buttons: [ Ox.Button({ @@ -363,8 +416,20 @@ pandora.ui.usersDialog = function() { }); function renderUserForm(data) { + var $checkbox; return Ox.Form({ items: [ + $checkbox = Ox.Checkbox({ + checked: !data.disabled, + title: 'Enabled', + width: 240 + }) + .bindEvent({ + change: function(data) { + // fixme: it would be really nice to have "this" here + $checkbox.options({title: data.checked ? 'Enabled' : 'Disabled'}) + } + }), Ox.Select({ items: userLevels.map(function(level) { return {