Skip to content
This repository has been archived by the owner on Jan 12, 2022. It is now read-only.

Commit

Permalink
fixes Bug 640376 - Add user feedback UI for all async actions
Browse files Browse the repository at this point in the history
  • Loading branch information
seanmonstar committed May 19, 2011
2 parents 9695999 + c86986b commit 28ccf98
Show file tree
Hide file tree
Showing 3 changed files with 102 additions and 58 deletions.
5 changes: 3 additions & 2 deletions media/jetpack/js/FileTree.js
Expand Up @@ -215,11 +215,12 @@ FileTree = new Class({
label.set('text', text);

li.set('name', text);
li.set('path', text);
li.set('title', text);
var path = this.getFullPath(li)
li.set('path', path);


this.fireEvent('renameComplete', [li, this.getFullPath(li)]);
this.fireEvent('renameComplete', [li, path]);
return false;
}

Expand Down
133 changes: 86 additions & 47 deletions media/jetpack/js/Package.js
Expand Up @@ -67,7 +67,8 @@ var Package = new Class({
this.instantiate_folders();
this.instantiate_dependencies();
// hook event to menu items
$('revisions_list').addEvent('click', this.show_revision_list);
this.revision_list_btn = $('revisions_list')
this.revision_list_btn.addEvent('click', this.show_revision_list);
if (this.isAddon()) {
this.boundTestAddon = this.testAddon.bind(this);
this.options.test_url = $(this.options.test_el).getElement('a').get('href');
Expand Down Expand Up @@ -137,6 +138,8 @@ var Package = new Class({
}
new Request.JSON({
url: this.options.copy_url,
useSpinner: true,
spinnerTarget: this.options.copy_el,
onSuccess: function(response) {
window.location.href = response.view_url;
}
Expand All @@ -158,9 +161,11 @@ var Package = new Class({
filename: this.options.name
};
new Request.JSON({
url: this.options.download_url,
data: data,
onSuccess: fd.downloadXPI
url: this.options.download_url,
useSpinner: true,
spinnerTarget: el,
data: data,
onSuccess: fd.downloadXPI
}).send();
},

Expand Down Expand Up @@ -190,16 +195,19 @@ var Package = new Class({
},

installAddon: function() {
fd.tests[this.options.hashtag] = {
spinner: new Spinner(
$(this.options.test_el).getParent('div')).show()
var spinner = new Spinner($(this.options.test_el).getParent('div')).show()
fd.tests[this.options.hashtag] = {
spinner: spinner
};
var data = this.data || {};
data['hashtag'] = this.options.hashtag;
new Request.JSON({
url: this.options.test_url,
data: data,
onSuccess: fd.testXPI
onSuccess: fd.testXPI,
onFailure: function() {
spinner.destroy();
}
}).send();
},

Expand Down Expand Up @@ -264,9 +272,10 @@ var Package = new Class({
show_revision_list: function(e) {
if (e) e.stop();
var that = fd.getItem();
$log(that);
new Request({
method: 'get',
useSpinner: true,
spinnerTarget: that.revision_list_btn,
url: that.options.revisions_list_html_url.substitute(that.options),
onSuccess: function(html) {
fd.displayModal(html);
Expand Down Expand Up @@ -469,10 +478,21 @@ var Attachment = new Class({
+this.options.filename
+'</a>';
if (this.is_image()) {
template_middle += '<p><img src="'+this.options.get_url
+'"/></p>';
template_middle += '<p></p>';
var img = new Element('img', { src: this.options.get_url });
var spinner;
img.addEvent('load', function() {
if (spinner) spinner.destroy();
modal.position();
});
}
var modal = this.attachmentWindow = fd.displayModal(template_start+template_middle+template_end);
var target = $(this.attachmentWindow).getElement('.UI_Modal_Section p');
if (target) {
spinner = new Spinner(target);
spinner.show();
target.grab(img);
}
this.attachmentWindow = fd.displayModal(template_start+template_middle+template_end);
}
},

Expand Down Expand Up @@ -783,6 +803,8 @@ Package.Edit = new Class({
$('jetpack_core_sdk_version').addEvent('change', function() {
new Request.JSON({
url: this.options.switch_sdk_url,
useSpinner: true,
spinnerTarget: 'core_library_lib',
data: {'id': $('jetpack_core_sdk_version').get('value')},
onSuccess: function(response) {
// set the redirect data to view_url of the new revision
Expand Down Expand Up @@ -855,7 +877,7 @@ Package.Edit = new Class({

uploadAttachment: function(files, renameAfterLoad) {
var self = this;
self.spinner = new Spinner($('attachments')).show();
var spinner = new Spinner($('attachments')).show();
// renameAfterLoad is falsy or callable
var file = files[0];

Expand All @@ -866,14 +888,16 @@ Package.Edit = new Class({
if (xhr.readyState === 4) {
try {
var response = JSON.decode(xhr.responseText);
} catch(ex) { /* ignored */ }
} catch(ex) {
$log(ex);
return;
}


if(xhr.status >= 200 && xhr.status < 300 && response) {
//onSuccess

$log(response)
if (self.spinner) self.spinner.destroy();
fd.message.alert(response.message_title, response.message);
var attachment = new Attachment(self,{
append: true,
Expand All @@ -888,13 +912,13 @@ Package.Edit = new Class({
});
self.registerRevision(response);
self.attachments[response.uid] = attachment;
if (self.spinner) self.spinner.destroy();
if (spinner) spinner.destroy();
$log('FD: all files uploaded');
Function.from(renameAfterLoad)(attachment);
} else {
//onError

if (self.spinner) self.spinner.destroy();
if (spinner) spinner.destroy();
if (xhr) {
fd.error.alert(
'Error {status}'.substitute(xhr),
Expand Down Expand Up @@ -935,6 +959,8 @@ Package.Edit = new Class({
new Request.JSON({
url: url,
data: data,
useSpinner: true,
spinnerTarget: 'attachments',
onSuccess: function(response) {
fd.setURIRedirect(response.view_url);
that.registerRevision(response);
Expand All @@ -955,19 +981,27 @@ Package.Edit = new Class({
},

renameAttachment: function(uid, newName, quiet) {
var that = this;
var that = this,
att = this.attachments[uid],
filename = newName;

// break off an extension from the filename
var ext = newName.getFileExtension() || '';
var ext = filename.getFileExtension() || '';
if (ext) {
newName = newName.getFileName();
filename = filename.getFileName();
}

var spinnerEl = fd.sidebar.getBranchFromPath(newName, 'data');
console.log(att, spinnerEl);


new Request.JSON({
url: that.options.rename_attachment_url,
useSpinner: true,
spinnerTarget: spinnerEl,
data: {
uid: uid,
new_filename: newName,
new_filename: filename,
new_ext: ext
},
onSuccess: function(response) {
Expand Down Expand Up @@ -1002,6 +1036,8 @@ Package.Edit = new Class({
var self = this;
new Request.JSON({
url: self.options.remove_attachment_url,
useSpinner: true,
spinnerTarget: fd.sidebar.getBranchFromFile(attachment),
data: {uid: attachment.options.uid},
onSuccess: function(response) {
fd.setURIRedirect(response.view_url);
Expand All @@ -1013,32 +1049,11 @@ Package.Edit = new Class({
}).send();
},

removeAttachments: function(pathname) {
new Request.JSON({
url: this.options.remove_folder_url,
data: {
name: path,
root_dir: 'data'
},
onSuccess: function(response) {
fd.setURIRedirect(response.view_url);
this.registerRevision(response);
fd.message.alert(response.message_title, response.message);
response.removed_attachments.forEach(function(uid) {
this.attachments[uid].destroy();
}, this);

response.removed_dirs.forEach(function(name) {
fd.sidebar.removeFile(name, 'd')
}, this);

}.bind(this)
}).send();
},

addModule: function(filename) {
new Request.JSON({
url: this.options.add_module_url,
useSpinner: true,
spinnerTarget: 'modules',
data: {'filename': filename},
onSuccess: function(response) {
// set the redirect data to view_url of the new revision
Expand All @@ -1064,8 +1079,12 @@ Package.Edit = new Class({

renameModule: function(oldName, newName) {
newName = newName.replace(/\..*$/, '');
var el = fd.sidebar.getBranchFromPath(newName+'.js', 'lib');
console.log(newName+'.js', el);
new Request.JSON({
url: this.options.rename_module_url,
useSpinner: true,
spinnerTarget: el,
data: {
old_filename: oldName,
new_filename: newName
Expand All @@ -1092,9 +1111,11 @@ Package.Edit = new Class({
},

removeModule: function(module) {
$log(module);
var el = fd.sidebar.getBranchFromFile(module);
new Request.JSON({
url: this.options.remove_module_url,
useSpinner: true,
spinnerTarget: el,
data: module.options,
onSuccess: function(response) {
fd.setURIRedirect(response.view_url);
Expand All @@ -1106,12 +1127,15 @@ Package.Edit = new Class({
},

removeAttachments: function(path) {
var el = fd.sidebar.getBranchFromPath(path, 'data');
new Request.JSON({
url: this.options.remove_folder_url,
data: {
name: path,
root_dir: 'data'
},
useSpinner: true,
spinnerTarget: el,
onSuccess: function(response) {
fd.setURIRedirect(response.view_url);
this.registerRevision(response);
Expand All @@ -1128,9 +1152,12 @@ Package.Edit = new Class({
},

removeModules: function(path) {
var el = fd.sidebar.getBranchFromPath(path, 'lib');
new Request.JSON({
url: this.options.remove_module_url,
data: {filename: path+'/'},
useSpinner: true,
spinnerTarget: el,
onSuccess: function(response) {
fd.setURIRedirect(response.view_url);
this.registerRevision(response);
Expand All @@ -1147,12 +1174,16 @@ Package.Edit = new Class({
},

addFolder: function(name, root_dir) {
new Request.JSON({
var el = root_dir == Folder.ROOT_DIR_LIB ?
'modules' : 'attachments';
new Request.JSON({
url: this.options.add_folder_url,
data: {
name: name,
root_dir: root_dir
},
useSpinner: true,
spinnerTarget: el,
onSuccess: function(response) {
fd.setURIRedirect(response.view_url);
this.registerRevision(response);
Expand All @@ -1173,6 +1204,8 @@ Package.Edit = new Class({
name: folder.options.name,
root_dir: folder.options.root_dir
},
useSpinner: true,
spinnerTarget: fd.sidebar.getBranchFromFile(folder),
onSuccess: function(response) {
fd.setURIRedirect(response.view_url);
this.registerRevision(response);
Expand All @@ -1187,6 +1220,8 @@ Package.Edit = new Class({
new Request.JSON({
url: this.options.assign_library_url,
data: {'id_number': library_id},
useSpinner: true,
spinnerTarget: 'plugins',
onSuccess: function(response) {
// set the redirect data to view_url of the new revision
fd.setURIRedirect(response.view_url);
Expand Down Expand Up @@ -1216,7 +1251,7 @@ Package.Edit = new Class({
'revision': lib.retrieveNewVersion().revision
},
useSpinner: true,
spinerTarget: $$('#PluginsTree ul')[0],
spinerTarget: 'plugins',
onSuccess: function(response) {
fd.setURIRedirect(response.view_url);
this.registerRevision(response);
Expand Down Expand Up @@ -1269,6 +1304,8 @@ Package.Edit = new Class({
new Request.JSON({
url: this.options.remove_library_url,
data: {'id_number': lib.options.id_number},
useSpinner: true,
spinnerTarget: fd.sidebar.getBranchFromFile(lib),
onSuccess: function(response) {
fd.setURIRedirect(response.view_url);
this.registerRevision(response);
Expand Down Expand Up @@ -1396,6 +1433,8 @@ Package.Edit = new Class({
new Request.JSON({
url: this.options.save_url,
data: this.data,
useSpinner: true,
spinnerTarget: this.options.save_el,
onSuccess: function(response) {
// set the redirect data to view_url of the new revision
$log('response success')
Expand Down

0 comments on commit 28ccf98

Please sign in to comment.