0x2620/pandora
2
1
Fork 1
Code Issues 1.3k Pull requests Releases Wiki Activity

use iconDialog

Browse source
This commit is contained in:
rolux 2013-03-03 11:04:44 +05:30
parent 112f4f98c8
commit 90a0fc6309
11 changed files with 126 additions and 278 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
static/js/pandora/annotationDialog.js
View file

@ -3,25 +3,25 @@
pandora.ui.annotationDialog = function(layer) {
var isEditor = pandora.user.ui.itemView == 'editor',
$dialog = Ox.Dialog({
that = pandora.ui.iconDialog({
buttons: [].concat(
isEditor ? [
Ox.Button({title: 'Sign Up...'}).bindEvent({
click: function() {
$dialog.close();
that.close();
pandora.$ui.accountDialog = pandora.ui.accountDialog('signup').open();
}
}),
Ox.Button({title: 'Sign In...'}).bindEvent({
click: function() {
$dialog.close();
that.close();
pandora.$ui.accountDialog = pandora.ui.accountDialog('signin').open();
}
})
] : [
Ox.Button({title: 'Switch to Editor'}).bindEvent({
click: function() {
$dialog.close();
that.close();
pandora.UI.set({itemView: 'editor'});
}
})
@ -30,32 +30,17 @@ pandora.ui.annotationDialog = function(layer) {
{},
Ox.Button({title: 'Not Now'}).bindEvent({
click: function() {
$dialog.close();
that.close();
}
})
]
),
content: Ox.Element()
.append(
$('<img>')
.attr({src: '/static/png/icon.png'})
.css({position: 'absolute', left: '16px', top: '16px', width: '64px', height: '64px'})
)
.append(
$('<div>')
.css({position: 'absolute', left: '96px', top: '16px', width: '192px'})
.html(
'To add or edit ' + layer + ', ' + (
isEditor ? 'please sign up or sign in.'
text: 'To add or edit ' + layer + ', ' + (
isEditor
? 'please sign up or sign in.'
: 'just switch to the editor.'
)
)
),
fixedSize: true,
height: 128,
removeOnClose: true,
width: 304,
title: Ox.toTitleCase(layer)
});
return $dialog;
return that;
};

19
static/js/pandora/contactForm.js
View file

@ -105,7 +105,7 @@ pandora.ui.contactForm = function() {
message: data.message,
receipt: $receiptCheckbox.value()
}, function(result) {
var $dialog = Ox.Dialog({
var $dialog = pandora.ui.iconDialog({
buttons: [
Ox.Button({
id: 'close',
@ -117,22 +117,9 @@ pandora.ui.contactForm = function() {
}
})
],
content: Ox.Element()
.append(
$('<img>')
.attr({src: '/static/png/icon.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('Thanks for your message!<br/><br/>We will get back to you as soon as possible.')
),
fixedSize: true,
height: 128,
keys: {enter: 'close', escape: 'close'},
title: 'Message Sent',
width: 304
text: 'Thanks for your message!<br/><br/>We will get back to you as soon as possible.',
title: 'Message Sent'
})
.open();
});

27
static/js/pandora/deleteListDialog.js
View file

@ -3,13 +3,14 @@
'use strict';
pandora.ui.deleteListDialog = function(list) {
var ui = pandora.user.ui,
folderItems = ui.section == 'items' ? 'Lists' : Ox.toTitleCase(ui.section),
folderItem = folderItems.slice(0, -1);
var listData = pandora.getListData(list),
folderItem = folderItems.slice(0, -1),
listData = pandora.getListData(list),
$folderList = pandora.$ui.folderList[listData.folder],
that = Ox.Dialog({
that = pandora.ui.iconDialog({
buttons: [
Ox.Button({
id: 'keep',
@ -49,23 +50,11 @@ pandora.ui.deleteListDialog = function(list) {
}
})
],
content: Ox.Element()
.append(
$('<img>')
.attr({src: '/static/png/icon.png'})
.css({position: 'absolute', left: '16px', top: '16px', width: '64px', height: '64px'})
)
.append(
$('<div>')
.css({position: 'absolute', left: '96px', top: '16px', width: '192px'})
.html('Are you sure you want to delete the ' + folderItem.toLowerCase() + ' "' + listData.name + '"?')
),
height: 128,
keys: {enter: 'delete', escape: 'keep'},
title: 'Delete List',
width: 304
text: 'Are you sure you want to delete the ' + folderItem.toLowerCase() + ' "' + listData.name + '"?',
title: 'Delete ' + folderItem
});
return that;
}
};

92
static/js/pandora/error.js
View file

@ -1,92 +0,0 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript
'use strict';
pandora.ui.errorDialog = function(data) {
var that, error;
//dont open dialog on unload or if antoher error is open
//fixme: error dialog should updated instead
if ($('.OxErrorDialog').length || pandora.isUnloading) {
return;
}
if (data.status.code == 401 || data.status.code == 403) {
that = Ox.Dialog({
buttons: [
Ox.Button({
id: 'close',
title: 'Close'
})
.bindEvent({
click: function() {
that.close();
}
})
],
content: Ox.Element()
.append(
$('<img>')
.attr({src: '/static/png/icon.png'})
.css({position: 'absolute', left: '16px', top: '16px', width: '64px', height: '64px'})
)
.append(
Ox.Element()
.css({position: 'absolute', left: '96px', top: '16px', width: '256px'})
.html('Sorry, you have made an unauthorized request.')
),
fixedSize: true,
height: 192,
keys: {enter: 'close', escape: 'close'},
removeOnClose: true,
title: Ox.toTitleCase(data.status.text),
width: 368
})
.addClass('OxErrorDialog')
.open();
} else {
// 0 (timeout) or 500 (error)
var error = data.status.code == 0 ? 'timeout' : 'error';
// on window unload, pending request will time out, so
// in order to keep the dialog from appearing, delay it
setTimeout(function() {
if ($('.OxErrorDialog').length == 0 && !pandora.isUnloading) {
that = Ox.Dialog({
buttons: [
Ox.Button({
id: 'close',
title: 'Close'
})
.bindEvent({
click: function() {
that.close();
}
})
],
content: Ox.Element()
.append(
$('<img>')
.attr({src: '/static/png/icon.png'})
.css({position: 'absolute', left: '16px', top: '16px', width: '64px', height: '64px'})
)
.append(
Ox.Element()
.css({position: 'absolute', left: '96px', top: '16px', width: '256px'})
.html(
'Sorry, a server ' + error
+ ' occured while handling your request. To help us find out what went wrong, you may want to report this error to an administrator. Otherwise, please try again later.'
)
),
fixedSize: true,
height: 192,
keys: {enter: 'close', escape: 'close'},
removeOnClose: true,
title: 'Server ' + Ox.toTitleCase(error),
width: 368
})
.addClass('OxErrorDialog')
.open();
}
}, 250);
}
};

65
static/js/pandora/errorDialog.js Normal file
View file

@ -0,0 +1,65 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript
'use strict';
pandora.ui.errorDialog = function(data) {
var that, error;
//dont open dialog on unload or if antoher error is open
//fixme: error dialog should updated instead
if ($('.OxErrorDialog').length || pandora.isUnloading) {
return;
}
if (data.status.code == 401 || data.status.code == 403) {
that = pandora.ui.iconDialog({
buttons: [
Ox.Button({
id: 'close',
title: 'Close'
})
.bindEvent({
click: function() {
that.close();
}
})
],
keys: {enter: 'close', escape: 'close'},
text: 'Sorry, you have made an unauthorized request.',
title: Ox.toTitleCase(data.status.text)
})
.addClass('OxErrorDialog')
.open();
} else {
// 0 (timeout) or 500 (error)
error = data.status.code == 0 ? 'timeout' : 'error';
// on window unload, pending request will time out, so
// in order to keep the dialog from appearing, delay it
setTimeout(function() {
if ($('.OxErrorDialog').length == 0 && !pandora.isUnloading) {
that = pandora.ui.iconDialog({
buttons: [
Ox.Button({
id: 'close',
title: 'Close'
})
.bindEvent({
click: function() {
that.close();
}
})
],
keys: {enter: 'close', escape: 'close'},
text: 'Sorry, a server ' + error
+ ' occured while handling your request.'
+ ' To help us find out what went wrong,'
+ ' you may want to report this error to an administrator.'
+ ' Otherwise, please try again later.',
title: 'Server ' + Ox.toTitleCase(error)
})
.addClass('OxErrorDialog')
.open();
}
}, 250);
}
};

18
static/js/pandora/folders.js
View file

@ -312,7 +312,7 @@ pandora.ui.folders = function() {
type: 'image'
}).bindEvent({
click: function() {
var $dialog = Ox.Dialog({
var $dialog = pandora.ui.iconDialog({
buttons: title != 'Featured Lists' ? [
Ox.Button({title: 'Sign Up...'}).bindEvent({
click: function() {
@ -339,21 +339,7 @@ pandora.ui.folders = function() {
}
})
],
content: Ox.Element()
.append(
$('<img>')
.attr({src: '/static/png/icon.png'})
.css({position: 'absolute', left: '16px', top: '16px', width: '64px', height: '64px'})
)
.append(
$('<div>')
.css({position: 'absolute', left: '96px', top: '16px', width: '192px'})
.html(text)
),
fixedSize: true,
height: 128,
removeOnClose: true,
width: 304,
text: text,
title: title
}).open();
}

3
static/js/pandora/iconDialog.js
View file

@ -8,11 +8,12 @@ pandora.ui.iconDialog = function(options) {
keys: null,
text: '',
title: '',
width: 368,
width: 304,
}, options),
that = Ox.Dialog({
buttons: options.buttons,
closeButton: options.closeButton,
content: Ox.Element()
.append(
$('<img>')

26
static/js/pandora/makeListPrivateDialog.js
View file

@ -2,7 +2,7 @@
pandora.ui.makeListPrivateDialog = function(name, subscribers, callback) {
var that = Ox.Dialog({
var that = pandora.ui.iconDialog({
buttons: [
Ox.Button({
id: 'keep',
@ -23,27 +23,13 @@ pandora.ui.makeListPrivateDialog = function(name, subscribers, callback) {
}
})
],
content: Ox.Element()
.append(
$('<img>')
.attr({src: '/static/png/icon.png'})
.css({position: 'absolute', left: '16px', top: '16px', width: '64px', height: '64px'})
)
.append(
$('<div>')
.css({position: 'absolute', left: '96px', top: '16px', width: '192px'})
.html(
'Are you sure you want to make the list "'
keys: {enter: 'make', escape: 'keep'},
text: 'Are you sure you want to make the list "'
+ name + '" private and lose its '
+ (subscribers == 1 ? 'subscriber' : subscribers + ' subscribers')
+ '?'
)
),
height: 128,
keys: {enter: 'make', escape: 'keep'},
title: 'Make List Private',
width: 304
})
+ '?',
title: 'Make List Private'
});
return that;

53
static/js/pandora/metadataDialog.js
View file

@ -41,7 +41,7 @@ pandora.ui.metadataDialog = function(data) {
data.imdbId && getMetadata();
function idDialog() {
return Ox.Dialog({
return pandora.ui.iconDialog({
buttons: [
Ox.Button({
id: 'close',
@ -64,27 +64,11 @@ pandora.ui.metadataDialog = function(data) {
}
})
],
content: Ox.Element()
.append(
$('<img>')
.attr({src: '/static/png/icon.png'})
.css({position: 'absolute', left: '16px', top: '16px', width: '64px', height: '64px'})
)
.append(
$('<div>')
.css({position: 'absolute', left: '96px', top: '16px', width: '192px'})
.html(
'To update the metadata for this '
+ pandora.site.itemName.singular.toLowerCase()
+ ', please enter its IMDb ID.'
)
),
fixedSize: true,
height: 128,
keyboard: {enter: 'update', escape: 'close'},
removeOnClose: true,
title: 'Update Metadata',
width: 304
text: 'To update the metadata for this '
+ pandora.site.itemName.singular.toLowerCase()
+ ', please enter its IMDb ID.',
title: 'Update Metadata'
});
}
@ -138,7 +122,7 @@ pandora.ui.metadataDialog = function(data) {
}
function confirmDialog() {
return Ox.Dialog({
return pandora.ui.iconDialog({
buttons: [
Ox.Button({
id: 'cancel',
@ -160,17 +144,9 @@ pandora.ui.metadataDialog = function(data) {
}
})
],
content: Ox.Element()
.append(
$('<img>')
.attr({src: '/static/png/icon.png'})
.css({position: 'absolute', left: '16px', top: '16px', width: '64px', height: '64px'})
)
.append(
$('<div>')
.css({position: 'absolute', left: '96px', top: '16px', width: '192px'})
.html(
'Are you sure you want to update the value'
height: 192,
keyboard: {enter: 'update', escape: 'cancel'},
text: 'Are you sure you want to update the value'
+ (updateKeys.length == 1 ? '' : 's')
+ ' for ' + updateKeys.map(function(key, index) {
return (
@ -178,15 +154,8 @@ pandora.ui.metadataDialog = function(data) {
: index < updateKeys.length - 1 ? ', '
: ' and '
) + getTitle(key)
}).join('') + '?'
)
),
fixedSize: true,
height: 128,
keyboard: {enter: 'update', escape: 'cancel'},
removeOnClose: true,
title: 'Update Metadata',
width: 304
}).join('') + '?',
title: 'Update Metadata'
});
}

20
static/js/pandora/resetUIDialog.js
View file

@ -3,11 +3,11 @@
pandora.ui.resetUIDialog = function(data) {
var that = Ox.Dialog({
var that = pandora.ui.iconDialog({
buttons: [
Ox.Button({
id: 'cancel',
title: 'Cancel'
title: 'Don\'t Reset'
})
.bindEvent({
click: function() {
@ -26,21 +26,9 @@ pandora.ui.resetUIDialog = function(data) {
}
})
],
content: Ox.Element()
.append(
$('<img>')
.attr({src: '/static/png/icon.png'})
.css({position: 'absolute', left: '16px', top: '16px', width: '64px', height: '64px'})
)
.append(
$('<div>')
.css({position: 'absolute', left: '96px', top: '16px', width: '192px'})
.html('Are you sure you want to reset all UI settings?')
),
height: 128,
keys: {enter: 'reset', escape: 'cancel'},
title: 'Reset UI Settings',
width: 304
text: 'Are you sure you want to reset all UI settings?',
title: 'Reset UI Settings'
});
return that;

30
static/js/pandora/usersDialog.js
View file

@ -866,13 +866,7 @@ pandora.ui.usersDialog = function() {
message: getFormItemById('message').value(),
receipt: getFormItemById('receipt').value()
}, function(result) {
var title = result.status.code == 200
? 'Message Sent'
: 'Application Error',
message = result.status.code == 200
? 'Your message has been sent.'
: 'Your message could not be sent. Please try again.',
$dialog = Ox.Dialog({
var $dialog = pandora.ui.iconDialog({
buttons: [
Ox.Button({
id: 'close',
@ -884,23 +878,13 @@ pandora.ui.usersDialog = function() {
}
})
],
// FIXME: we need a template for this type of dialog
content: Ox.Element()
.append(
$('<img>')
.attr({src: '/static/png/icon.png'})
.css({position: 'absolute', left: '16px', top: '16px', width: '64px', height: '64px'})
)
.append(
$('<div>')
.css({position: 'absolute', left: '96px', top: '16px', width: '192px'})
.html(message)
),
height: 128,
keys: {enter: 'close', escape: 'close'},
removeOnClose: true,
title: title,
width: 304
text: result.status.code == 200
? 'Your message has been sent.'
: 'Your message could not be sent. Please try again.',
title: result.status.code == 200
? 'Message Sent'
: 'Application Error'
}).open();
$sendButton.options({title: 'Send', disabled: false});
});