From bd88297eb9d7dc973c1f61988bcf1d1d423bf35a Mon Sep 17 00:00:00 2001 From: rolux Date: Wed, 17 Aug 2011 11:39:55 +0000 Subject: [PATCH] use new dialog --- static/js/pandora/ui/account.js | 137 ++++++++++++++++----------- static/js/pandora/ui/filterDialog.js | 5 +- static/js/pandora/ui/menu.js | 6 +- static/js/pandora/ui/placesDialog.js | 6 +- static/png/icon64.png | Bin 0 -> 6091 bytes 5 files changed, 94 insertions(+), 60 deletions(-) create mode 100644 static/png/icon64.png diff --git a/static/js/pandora/ui/account.js b/static/js/pandora/ui/account.js index 86ae076d..8c65bacc 100644 --- a/static/js/pandora/ui/account.js +++ b/static/js/pandora/ui/account.js @@ -2,11 +2,10 @@ pandora.ui.accountDialog = function(action) { var that = Ox.Dialog($.extend({ - height: 256, + fixedSize: true, + height: 192, id: 'accountDialog', - minHeight: 256, - minWidth: 384, - width: 384 + width: 432 }, pandora.ui.accountDialogOptions(action))) .bindEvent({ resize: function(event, data) { @@ -68,25 +67,31 @@ pandora.ui.accountDialogOptions = function(action, value) { title: buttonTitle[type] + '...' }).bindEvent('click', function() { //Ox.print('CLICK EVENT', type) - pandora.$ui.accountDialog.options(ui.accountDialogOptions(type)); + pandora.$ui.accountDialog.options(pandora.ui.accountDialogOptions(type)); }); } } return { - buttons: [ - $.map(buttons[action], function(type) { + buttons: Ox.merge($.map(buttons[action], function(type) { return button(type); - }), - [button('cancel'), button('submit')] - ], + }), [{}, button('cancel'), button('submit')]), content: Ox.Element() .append( - Ox.Element() - .addClass('OxText') - .html(dialogText[action] + '

') + $('') + .attr({src: '/static/png/icon64.png'}) + .css({position: 'absolute', left: '16px', top: '16px', width: '64px', height: '64px'}) ) .append( - pandora.$ui.accountForm = pandora.ui.accountForm(action, value) + Ox.Element() + .css({position: 'absolute', left: '96px', top: '16px', width: '320px'}) + .append( + Ox.Element() + .addClass('OxText') + .html(dialogText[action] + '

') + ) + .append( + pandora.$ui.accountForm = pandora.ui.accountForm(action, value) + ) ), keys: { enter: 'submit' + Ox.toTitleCase(action), @@ -179,7 +184,7 @@ pandora.ui.accountForm = function(action, value) { function item(type, value) { if (type == 'code') { return Ox.Input({ - autovalidate: autovalidateCode, + autovalidate: pandora.autovalidateCode, id: 'code', label: 'Code', labelWidth: 120, @@ -189,17 +194,17 @@ pandora.ui.accountForm = function(action, value) { valid: !!value.length }); }, - width: 352 + width: 320 }); } else if (type == 'email') { return Ox.Input({ - autovalidate: autovalidateEmail, + autovalidate: pandora.autovalidateEmail, id: 'email', label: 'E-Mail Address', labelWidth: 120, type: 'email', validate: pandora.validateUser('email'), - width: 352 + width: 320 }); } else if (type == 'newPassword') { return Ox.Input({ @@ -214,7 +219,7 @@ pandora.ui.accountForm = function(action, value) { valid: value.length > 0 }); }, - width: 352 + width: 320 }); } else if (type == 'newUsername') { return Ox.Input({ @@ -223,7 +228,7 @@ pandora.ui.accountForm = function(action, value) { label: 'Username', labelWidth: 120, validate: pandora.validateUser('username'), - width: 352 + width: 320 }); } else if (type == 'oldUsername') { return Ox.Input({ @@ -232,7 +237,7 @@ pandora.ui.accountForm = function(action, value) { label: 'Username', labelWidth: 120, value: value, - width: 352 + width: 320 }); } else if (type == 'password') { return Ox.Input({ @@ -247,7 +252,7 @@ pandora.ui.accountForm = function(action, value) { valid: value.length > 0 }); }, - width: 352 + width: 320 }); } else if (type == 'username') { return Ox.Input({ @@ -256,7 +261,7 @@ pandora.ui.accountForm = function(action, value) { label: 'Username', labelWidth: 120, validate: pandora.validateUser('username', true), - width: 352 + width: 320 }); } else if (type == 'usernameOrEmail') { return Ox.FormElementGroup({ @@ -269,7 +274,7 @@ pandora.ui.accountForm = function(action, value) { {id: 'email', title: 'E-Mail Address'}, ], overlap: 'right', - width: 120 + width: 128 }) .bindEvent({ change: function(event, data) { @@ -285,7 +290,7 @@ pandora.ui.accountForm = function(action, value) { autovalidate: pandora.autovalidateUsername, id: 'usernameOrEmailInput', validate: pandora.validateUser('username', true), - width: 232 + width: 192 }) ], separators: [ @@ -317,39 +322,59 @@ pandora.ui.accountLogoutDialog = function() { }); }) ], - content: Ox.Element().html('Are you sure you want to logout?'), - height: 160, + 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 you want to logout?') + ), + fixedSize: true, + height: 128, keys: {enter: 'logout', escape: 'cancel'}, title: 'Logout', - width: 300 - }); - return that; -}; -pandora.ui.accountWelcomeDialog = function() { - var that = Ox.Dialog({ - buttons: [ - [ - Ox.Button({ - id: 'preferences', - title: 'Preferences...' - }).bindEvent('click', function() { - that.close(); - }) - ], - [ - Ox.Button({ - id: 'close', - title: 'Close' - }).bindEvent('click', function() { - that.close(); - }) - ] - ], - content: Ox.Element().html('Welcome, ' + pandora.user.username + '!

Your account has been created.'), - height: 160, - keys: {enter: 'close', escape: 'close'}, - title: 'Welcome to ' + pandora.site.site.name, - width: 300 + width: 304 + }); + return that; +}; + +pandora.ui.accountWelcomeDialog = function() { + var that = Ox.Dialog({ + buttons: [ + Ox.Button({ + id: 'preferences', + title: 'Preferences...' + }).bindEvent('click', function() { + that.close(); + }), + {}, + Ox.Button({ + id: 'close', + title: 'Close' + }).bindEvent('click', function() { + that.close(); + }) + ], + 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('Welcome, ' + pandora.user.username + '!

Your account has been created.') + ), + fixedSize: true, + height: 128, + keys: {enter: 'close', escape: 'close'}, + title: 'Welcome to ' + pandora.site.site.name, + width: 304 }); return that; }; diff --git a/static/js/pandora/ui/filterDialog.js b/static/js/pandora/ui/filterDialog.js index 97bb2fb2..c2f8a953 100644 --- a/static/js/pandora/ui/filterDialog.js +++ b/static/js/pandora/ui/filterDialog.js @@ -30,7 +30,10 @@ pandora.ui.filterDialog = function() { } }) ], - content: pandora.$ui.filter = new pandora.ui.filter(), + content: pandora.$ui.filter = new pandora.ui.filter().css({padding: '16px'}), + maxWidth: 648 + Ox.UI.SCROLLBAR_SIZE, + minHeight: 264, + minWidth: 648 + Ox.UI.SCROLLBAR_SIZE, height: 264, keys: {enter: 'save', escape: 'cancel'}, title: 'Advanced Find', diff --git a/static/js/pandora/ui/menu.js b/static/js/pandora/ui/menu.js index 78d9aaee..8feffea4 100644 --- a/static/js/pandora/ui/menu.js +++ b/static/js/pandora/ui/menu.js @@ -688,14 +688,16 @@ pandora.ui.mainMenu = function() { }) ], content: Ox.Element() + .css({padding: '16px'}) .html([ 'Query: ' + JSON.stringify(pandora.Query.toObject()), 'findQuery: ' + JSON.stringify(pandora.user.ui.findQuery), 'listQuery: ' + JSON.stringify(pandora.user.ui.listQuery) ].join('

')), - height: 200, + height: 192, keys: {enter: 'close', escape: 'close'}, - width: 400 + title: 'Query', + width: 384 }).open(); } else if (data.id == 'resetui') { pandora.api.resetUI({}, function() { diff --git a/static/js/pandora/ui/placesDialog.js b/static/js/pandora/ui/placesDialog.js index 0f063872..9863e255 100644 --- a/static/js/pandora/ui/placesDialog.js +++ b/static/js/pandora/ui/placesDialog.js @@ -1,6 +1,6 @@ // vim: et:ts=4:sw=4:sts=4:ft=javascript pandora.ui.placesDialog = function() { - var height = Math.round(window.innerHeight * 0.9), + var height = Math.round((window.innerHeight - 48) * 0.9), width = Math.round(window.innerWidth * 0.9), that = Ox.Dialog({ buttons: [ @@ -13,6 +13,7 @@ pandora.ui.placesDialog = function() { } }) ], + closeButton: true, content: pandora.$ui.placesElement = Ox.ListMap({ height: height - 48, places: function(data, callback) { @@ -43,6 +44,9 @@ pandora.ui.placesDialog = function() { width: width }), height: height, + maximizeButton: true, + minHeight: 256, + minWidth: 512, //keys: {enter: 'done', escape: 'done'}, padding: 0, title: 'Manage Places', diff --git a/static/png/icon64.png b/static/png/icon64.png new file mode 100644 index 0000000000000000000000000000000000000000..60ba47220f02986b133c4f175562a0db513aba86 GIT binary patch literal 6091 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