MDL-31901: brushing the filepicker code

- use the same function for displaying request result for list/search/login/logout commands since sometimes we can not predict what kind of result is going to be returned
- prevent default behaviour for links, so ### does not appear in URL
- use flag issearchresult as received in the response from repository because we can't guess it right sometimes
- do not make excessive AJAX request when user switches to list view
This commit is contained in:
Marina Glancy
2012-05-21 11:57:51 +08:00
parent 6723372514
commit 4adecd7beb
+110 -231
View File
@@ -46,19 +46,6 @@ M.core_filepicker = M.core_filepicker || {};
M.core_filepicker.instances = M.core_filepicker.instances || {};
M.core_filepicker.active_filepicker = null;
/**
* Set selected file info
*
* @parma object file info
*/
M.core_filepicker.select_file = function(file) {
var fileinfo = {};
fileinfo['title'] = file.title;
fileinfo['source'] = file.reference;
fileinfo['thumbnail'] = file.thumbnail;
M.core_filepicker.active_filepicker.select_file(fileinfo);
}
/**
* Init and show file picker
*/
@@ -381,25 +368,19 @@ M.core_filepicker.init = function(Y, options) {
tmpNode.isLeaf = true;
}
},
view_files: function(page) {
var p= page?page:null;
view_files: function() {
if (this.active_repo.issearchresult) {
// list view is desiged to display treeview
// it is not working well with search result
this.view_as_icons();
} else {
if (this.objecttag) {
// handle cancle action for repo using iframe
this.create_object_container(this.objecttag);
this.viewbar.set('disabled', false);
if (this.viewmode == 1) {
this.view_as_icons();
} else if (this.viewmode == 2) {
this.view_as_list();
} else {
this.viewbar.set('disabled', false);
if (this.viewmode == 1) {
this.view_as_icons();
} else if (this.viewmode == 2) {
this.view_as_list(p);
} else {
this.view_as_icons();
}
this.view_as_icons();
}
}
},
@@ -414,7 +395,6 @@ M.core_filepicker.init = function(Y, options) {
path:node.path?node.path:'',
page:node.page?args.page:'',
callback: function(id, obj, args) {
obj.issearchresult = false;
var list = obj.list;
scope.viewbar.set('disabled', false);
scope.parse_repository_options(obj);
@@ -425,70 +405,46 @@ M.core_filepicker.init = function(Y, options) {
}
}, false);
},
view_as_list: function(p) {
view_as_list: function() {
var scope = this;
var page = null;
if (!p) {
if (scope.active_repo.page) {
page = scope.active_repo.page;
}
} else {
page = p;
var client_id = scope.options.client_id;
var dynload = scope.active_repo.dynload;
var list = this.filelist;
var panel_id = '#panel-'+client_id;
scope.viewmode = 2;
Y.one(panel_id).set('innerHTML', '');
scope.print_header();
var html = '<div class="fp-tree-panel" id="treeview-'+client_id+'">';
if (list && list.length==0) {
html += '<div class="fp-emptylist mdl-align">' +M.str.repository.nofilesavailable+'</div>';
}
scope.request({
action:'list',
client_id: scope.options.client_id,
repository_id: scope.active_repo.id,
path:'',
page:page,
callback: function(id, obj, args) {
scope.parse_repository_options(obj);
if (obj.login) {
scope.viewbar.set('disabled', true);
scope.print_login(obj);
return;
}
var client_id = scope.options.client_id;
var dynload = scope.active_repo.dynload;
var list = obj.list;
var panel_id = '#panel-'+client_id;
scope.viewmode = 2;
Y.one(panel_id).set('innerHTML', '');
html += '</div>';
scope.print_header();
var tree = Y.Node.create(html);
Y.one(panel_id).appendChild(tree);
if (!list || list.length==0) {
return;
}
var html = '<div class="fp-tree-panel" id="treeview-'+client_id+'">';
if (list && list.length==0) {
html += '<div class="fp-emptylist mdl-align">' +M.str.repository.nofilesavailable+'</div>';
}
html += '</div>';
scope.treeview = new YAHOO.widget.TreeView('treeview-'+client_id);
if (dynload) {
scope.treeview.setDynamicLoad(scope.treeview_dynload, 1);
}
var tree = Y.Node.create(html);
Y.one(panel_id).appendChild(tree);
if (!list || list.length==0) {
return;
}
scope.treeview = new YAHOO.widget.TreeView('treeview-'+client_id);
if (dynload) {
scope.treeview.setDynamicLoad(scope.treeview_dynload, 1);
}
for(k in list) {
scope.build_tree(list[k], scope.treeview.getRoot());
}
scope.treeview.subscribe('clickEvent', function(e){
if(e.node.isLeaf){
var fileinfo = {};
fileinfo['title'] = e.node.data.filename;
fileinfo['source'] = e.node.data.source;
fileinfo['thumbnail'] = e.node.data.thumbnail;
scope.select_file(fileinfo);
}
});
scope.treeview.draw();
for(k in list) {
scope.build_tree(list[k], scope.treeview.getRoot());
}
scope.treeview.subscribe('clickEvent', function(e){
if(e.node.isLeaf){
var fileinfo = {};
fileinfo['title'] = e.node.data.filename;
fileinfo['source'] = e.node.data.source;
fileinfo['thumbnail'] = e.node.data.thumbnail;
scope.select_file(fileinfo);
}
}, true);
});
scope.treeview.draw();
},
view_as_icons: function() {
var scope = this;
@@ -564,6 +520,7 @@ M.core_filepicker.init = function(Y, options) {
var dynload = this.active_repo.dynload;
if(node.children) {
y_file.on('click', function(e, p) {
e.preventDefault();
if(dynload) {
var params = {'path':p.path};
scope.list(params);
@@ -573,6 +530,7 @@ M.core_filepicker.init = function(Y, options) {
}
}, this, node);
y_title.on('click', function(e, p, id){
e.preventDefault();
var icon = Y.one(id);
icon.simulate('click');
}, this, node, '#'+link.id);
@@ -584,9 +542,11 @@ M.core_filepicker.init = function(Y, options) {
fileinfo['haslicense'] = list[k].haslicense?true:false;
fileinfo['hasauthor'] = list[k].hasauthor?true:false;
y_title.on('click', function(e, args) {
e.preventDefault();
this.select_file(args);
}, this, fileinfo);
y_file.on('click', function(e, args) {
e.preventDefault();
this.select_file(args);
}, this, fileinfo);
}
@@ -612,7 +572,6 @@ M.core_filepicker.init = function(Y, options) {
path.setStyle('display', 'none');
}
var panel = Y.one('#panel-'+client_id);
panel.set('innerHTML', '');
var form_id = 'fp-rename-form-'+client_id;
var html = '<div class="fp-rename-form" id="'+form_id+'">';
html += '<p><img src="'+args.thumbnail+'" /></p>';
@@ -622,28 +581,16 @@ M.core_filepicker.init = function(Y, options) {
var le_checked = '';
var le_style = '';
var returntypes = this.options.repositories[this.active_repo.id].return_types;
if (returntypes == 1) {
// support link only
html += '<input type="checkbox" id="linkexternal-'+client_id+'" style="display:none" value="checked" checked />';
} else if (returntypes == 4) {
html += '<input type="checkbox" id="filereference-'+client_id+'" style="display:none" value="checked" checked />';
} else {
if (((returntypes & 1) == 1) && ((this.options.return_types & 1) == 1)) {
// support external links
html += '<tr><td></td><td class="mdl-left"><input type="checkbox" id="linkexternal-'+client_id+'" value="" />'+M.str.repository.linkexternal+'</td></tr>';
}
// form element support file reference and repository support it too
if (((returntypes & 4) == 4) && ((this.options.return_types & 4) == 4)) {
// file reference
html += '<tr><td></td><td class="mdl-left"><input type="checkbox" id="filereference-'+client_id+'" value="" />'+M.str.repository.uselatestfile+'</td></tr>';
}
if (((returntypes & 4) != 4) && ((returntypes & 1) != 1)) {
html += '<input type="checkbox" id="linkexternal-'+client_id+'" style="display:none" value="checked" />';
html += '<input type="checkbox" id="filereference-'+client_id+'" style="display:none" value="checked" />';
}
if (this.options.repositories[this.active_repo.id].return_types == 1) {
// support external links only
le_checked = 'checked';
le_style = ' style="display:none;"';
} else if(this.options.repositories[this.active_repo.id].return_types == 2) {
// support internal files only
le_style = ' style="display:none;"';
}
if ((this.options.externallink && this.options.env == 'editor' && this.options.return_types != 1)) {
html += '<tr'+le_style+'><td></td><td class="mdl-left"><input type="checkbox" id="linkexternal-'+client_id+'" value="" '+le_checked+' />'+M.str.repository.linkexternal+'</td></tr>';
}
if (!args.hasauthor) {
@@ -704,7 +651,7 @@ M.core_filepicker.init = function(Y, options) {
// in editor, images are stored in '/' only
params.savepath = '/';
// when image or media button is clicked
if (this.options.return_types != 1) {
if ( this.options.return_types != 1 ) {
var linkexternal = Y.one('#linkexternal-'+client_id);
if (linkexternal && linkexternal.get('checked')) {
params['linkexternal'] = 'yes';
@@ -719,15 +666,6 @@ M.core_filepicker.init = function(Y, options) {
params['linkexternal'] = 'yes';
}
if (this.options.return_types != 4) {
var usefilereference = Y.one('#filereference-'+client_id);
if (usefilereference && usefilereference.get('checked')) {
params['usefilereference'] = 'yes';
}
} else {
params['usefilereference'] = 'yes';
}
this.wait('download', title);
this.request({
action:'download',
@@ -832,15 +770,19 @@ M.core_filepicker.init = function(Y, options) {
// adding buttons
var view_icons = {label: M.str.repository.iconview, value: 't', 'checked': true,
onclick: {
fn: function(){
scope.view_as_icons();
fn: function(e){
e.preventDefault();
scope.viewmode = 1;
scope.view_files();
}
}
};
var view_listing = {label: M.str.repository.listview, value: 'l',
onclick: {
fn: function(){
scope.view_as_list();
fn: function(e){
e.preventDefault();
scope.viewmode = 2;
scope.view_files();
}
}
};
@@ -868,6 +810,7 @@ M.core_filepicker.init = function(Y, options) {
list.append('<li id="'+id+'"><a class="fp-repo-name" id="'+link_id+'" href="###">'+repository.name+'</a></li>');
Y.one('#'+link_id).prepend('<img src="'+repository.icon+'" width="16" height="16" />&nbsp;');
Y.one('#'+link_id).on('click', function(e, scope, repository_id) {
e.preventDefault();
YAHOO.util.Cookie.set('recentrepository', repository_id);
scope.repository_id = repository_id;
this.list({'repo_id':repository_id});
@@ -886,9 +829,8 @@ M.core_filepicker.init = function(Y, options) {
parse_repository_options: function(data) {
this.filelist = data.list?data.list:null;
this.filepath = data.path?data.path:null;
this.objecttag = data.object?data.object:null;
this.active_repo = {};
this.active_repo.issearchresult = Boolean(data.issearchresult);
this.active_repo.issearchresult = data.issearchresult?true:false;
this.active_repo.dynload = data.dynload?data.dynload:false;
this.active_repo.pages = Number(data.pages?data.pages:null);
this.active_repo.page = Number(data.page?data.page:null);
@@ -1035,10 +977,7 @@ M.core_filepicker.init = function(Y, options) {
'path': '',
'client_id': client_id,
'repository_id': repository_id,
'callback': function(id, o, args) {
scope.parse_repository_options(o);
scope.view_files();
}
'callback': this.display_response
}, true);
}, this);
}
@@ -1072,11 +1011,7 @@ M.core_filepicker.init = function(Y, options) {
client_id: client_id,
repository_id: repository_id,
form: {id: 'fp-form-'+scope.options.client_id,upload:false,useDisabled:true},
callback: function(id, o, args) {
o.issearchresult = true;
scope.parse_repository_options(o);
scope.view_files();
}
callback: scope.display_response
}, true);
}, this);
}
@@ -1110,94 +1045,47 @@ M.core_filepicker.init = function(Y, options) {
}, this);
},
search: function(args) {
var data = this.logindata;
var params = {};
display_response: function(id, obj, args) {
var scope = args.scope
// highlight the current repository in repositories list
Y.all('#fp-list-'+scope.options.client_id+' li a').setStyle('backgroundColor', 'transparent');
var el = Y.one('#repository-'+scope.options.client_id+'-'+obj.repo_id+'-link');
if (el) {
el.setStyle('backgroundColor', '#AACCEE');
}
// display response
if (obj.login) {
scope.viewbar.set('disabled', true);
scope.print_login(obj);
} else if (obj.upload) {
scope.viewbar.set('disabled', true);
scope.parse_repository_options(obj);
scope.create_upload_form(obj);
} else if (obj.iframe) {
for (var k in data) {
if(data[k].type!='popup') {
var el = document.getElementsByName(data[k].name)[0];
params[data[k].name] = '';
if(el.type == 'checkbox') {
params[data[k].name] = el.checked;
} else if(el.type == 'radio') {
var tmp = document.getElementsByName(data[k].name);
for(var i in tmp) {
if (tmp[i].checked) {
params[data[k].name] = tmp[i].value;
}
}
} else {
params[data[k].name] = el.value;
}
}
} else if (obj.list) {
scope.viewbar.set('disabled', false);
scope.parse_repository_options(obj);
scope.view_files();
}
this.request({
scope: scope,
action:'search',
client_id: client_id,
repository_id: repository_id,
form: {id: 'fp-form-'+scope.options.client_id,upload:false,useDisabled:true},
callback: function(id, o, args) {
o.issearchresult = true;
scope.parse_repository_options(o);
scope.view_files();
}
}, true);
},
list: function(args) {
var scope = this;
if (!args) {
args = {};
}
if (!args.repo_id) {
args.repo_id = scope.active_repo.id;
args.repo_id = this.active_repo.id;
}
scope.request({
action:'list',
client_id: scope.options.client_id,
this.request({
action: 'list',
client_id: this.options.client_id,
repository_id: args.repo_id,
path:args.path?args.path:'',
page:args.page?args.page:'',
callback: function(id, obj, args) {
Y.all('#fp-list-'+scope.options.client_id+' li a').setStyle('backgroundColor', 'transparent');
var el = Y.one('#repository-'+scope.options.client_id+'-'+obj.repo_id+'-link');
if (el) {
el.setStyle('backgroundColor', '#AACCEE');
}
if (obj.login) {
scope.viewbar.set('disabled', true);
scope.print_login(obj);
} else if (obj.upload) {
scope.viewbar.set('disabled', true);
scope.parse_repository_options(obj);
scope.create_upload_form(obj);
} else if (obj.object) {
M.core_filepicker.active_filepicker = scope;
scope.viewbar.set('disabled', true);
scope.parse_repository_options(obj);
scope.create_object_container(obj.object);
} else if (obj.list) {
obj.issearchresult = false;
scope.viewbar.set('disabled', false);
scope.parse_repository_options(obj);
scope.view_files();
}
}
path: args.path,
page: args.page,
scope: this,
callback: this.display_response
}, true);
},
create_object_container: function(data) {
var client_id = this.options.client_id;
Y.one('#panel-'+client_id).set('innerHTML', '');
var types = this.options.accepted_types;
var panel = Y.one('#panel-'+client_id);
var str = '<object data="'+data.src+'" type="'+data.type+'" width="98%" height="98%" id="container_object" class="fp-object-container mdl-align">';
str += '</object>';
var container = Y.Node.create(str);
Y.one('#panel-'+client_id).appendChild(container);
},
create_upload_form: function(data) {
var client_id = this.options.client_id;
Y.one('#panel-'+client_id).set('innerHTML', '');
@@ -1303,7 +1191,8 @@ M.core_filepicker.init = function(Y, options) {
if(!r.nosearch) {
var html = '<a href="###"><img src="'+M.util.image_url('a/search')+'" /> '+M.str.repository.search+'</a>';
var search = Y.Node.create(html);
search.on('click', function() {
search.on('click', function(e) {
e.preventDefault();
scope.request({
scope: scope,
action:'searchform',
@@ -1345,10 +1234,7 @@ M.core_filepicker.init = function(Y, options) {
client_id: client_id,
repository_id: repository_id,
form: {id: 'fp-search-form',upload:false,useDisabled:true},
callback: function(id, o, args) {
scope.parse_repository_options(o);
scope.view_files();
}
callback: scope.display_response
}, true);
search_dialog.cancel();
}
@@ -1391,7 +1277,8 @@ M.core_filepicker.init = function(Y, options) {
if(!r.norefresh) {
var html = '<a href="###"><img src="'+M.util.image_url('a/refresh')+'" /> '+M.str.repository.refresh+'</a>';
var refresh = Y.Node.create(html);
refresh.on('click', function() {
refresh.on('click', function(e) {
e.preventDefault();
this.list();
}, this);
toolbar.appendChild(refresh);
@@ -1400,16 +1287,14 @@ M.core_filepicker.init = function(Y, options) {
var label = r.logouttext?r.logouttext:M.str.repository.logout;
var html = '<a href="###"><img src="'+M.util.image_url('a/logout')+'" /> '+label+'</a>';
var logout = Y.Node.create(html);
logout.on('click', function() {
logout.on('click', function(e) {
e.preventDefault();
this.request({
action:'logout',
client_id: client_id,
repository_id: repository_id,
path:'',
callback: function(id, obj, args) {
scope.viewbar.set('disabled', true);
scope.print_login(obj);
}
callback: this.display_response
}, true);
}, this);
toolbar.appendChild(logout);
@@ -1503,6 +1388,7 @@ M.core_filepicker.init = function(Y, options) {
Y.all('#fp-header-'+client_id+' .fp-paging a').each(
function(node, id) {
node.on('click', function(e) {
e.preventDefault();
var id = node.get('id');
var re = new RegExp("repo-page-(\\d+)", "i");
var result = id.match(re);
@@ -1515,19 +1401,11 @@ M.core_filepicker.init = function(Y, options) {
client_id: client_id,
repository_id: r.id,
params: {'page':result[1]},
callback: function(id, o, args) {
o.issearchresult = true;
scope.parse_repository_options(o);
scope.view_files(result[1]);
}
callback: scope.display_response
}, true);
} else {
if (scope.viewmode == 2) {
scope.view_as_list(result[1]);
} else {
scope.list(args);
}
scope.list(args);
}
});
});
@@ -1549,7 +1427,8 @@ M.core_filepicker.init = function(Y, options) {
var sep = Y.Node.create('<span>/</span>');
path.appendChild(link);
path.appendChild(sep);
Y.one('#'+link.id).on('click', function(Y, path){
Y.one('#'+link.id).on('click', function(e, path){
e.preventDefault();
this.list({'path':path});
}, this, link_path)
}