Permalink
Browse files

MDL-31901: FileManager uses more YUI3 windows and more renderers

- Add folder dialog in FileManager now uses YUI3 and renderer;
- Fixed bug with remembering current folder in Tree view;
- Display error messages in FileManager using YUI3 and not using 'alert'
  • Loading branch information...
1 parent 23b8300 commit 694beb548ccb09536ca11a95374aa79baab10a99 @marinaglancy marinaglancy committed May 3, 2012
Showing with 99 additions and 26 deletions.
  1. +32 −0 files/renderer.php
  2. +67 −26 lib/form/filemanager.js
View
@@ -266,6 +266,38 @@ private function fm_js_template_listfilename() {
}
/**
+ * FileManager JS template for displaying 'Make new folder' dialog.
+ *
+ * Must be wrapped in an element, CSS for this element must define width and height of the window;
+ *
+ * Must have one input element with type="text" (for users to enter the new folder name);
+ *
+ * content of element with class 'fp-dlg-curpath' will be replaced with current path where
+ * new folder is about to be created;
+ * elements with classes 'fp-dlg-butcreate' and 'fp-dlg-butcancel' will hold onclick events;
+ *
+ * @return string
+ */
+ private function fm_js_template_mkdir() {
+ $rv = '<div class="fp-mkdir-dlg">
+ <span class="{!}fp-dlg-curpath"></span>
+ <input type="text">
+ <button class="{!}fp-dlg-butcreate">'.get_string('create').'</button><button class="{!}fp-dlg-butcancel">'.get_string('cancel').'</button>
+</div>';
+ return preg_replace('/\{\!\}/', '', $rv);
+ }
+
+ /**
+ * FileManager JS template for error/info message displayed as a separate popup window.
+ *
+ * @see fp_js_template_message()
+ * @return string
+ */
+ private function fm_js_template_message() {
+ return $this->fp_js_template_message();
+ }
+
+ /**
* FileManager JS template for window with file information/actions.
*
* All content must be enclosed in an element with class 'fp-select', CSS for this class
View
@@ -118,7 +118,7 @@ M.form_filemanager.init = function(Y, options) {
this.refresh(this.currentpath); // MDL-31113 get latest list from server
},
- wait: function(client_id) {
+ wait: function() {
this.filemanager.addClass('fm-updating');
},
request: function(args, redraw) {
@@ -150,7 +150,7 @@ M.form_filemanager.init = function(Y, options) {
data = Y.JSON.parse(o.responseText);
} catch(e) {
// TODO display error
- //scope.print_msg(M.str.repository.invalidjson, 'error');
+ scope.print_msg(M.str.repository.invalidjson, 'error');
//scope.display_error(M.str.repository.invalidjson+'<pre>'+stripHTML(o.responseText)+'</pre>', 'invalidjson')
return;
}
@@ -174,7 +174,7 @@ M.form_filemanager.init = function(Y, options) {
}
Y.io(api, cfg);
if (redraw) {
- this.wait(this.client_id);
+ this.wait();
}
},
filepicker_callback: function(obj) {
@@ -212,6 +212,36 @@ M.form_filemanager.init = function(Y, options) {
}
}, true);
},
+ /** displays message in a popup */
+ print_msg: function(msg, type) {
+ var header = M.str.moodle.error;
+ if (type != 'error') {
+ type = 'info'; // one of only two types excepted
+ header = M.str.moodle.info;
+ }
+ if (!this.msg_dlg) {
+ var node = Y.Node.create(M.form_filemanager.templates.message);
+ this.filemanager.appendChild(node);
+
+ this.msg_dlg = new Y.Panel({
+ srcNode : node,
+ zIndex : 800000,
+ centered : true,
+ modal : true,
+ visible : false,
+ render : true
+ });
+ node.one('.fp-msg-butok').on('click', function(e) {
+ e.preventDefault();
+ this.msg_dlg.hide();
+ }, this);
+ }
+
+ this.msg_dlg.set('headerContent', header);
+ this.filemanager.one('.fp-msg').removeClass('fp-msg-info').removeClass('fp-msg-error').addClass('fp-msg-'+type)
+ this.filemanager.one('.fp-msg .fp-msg-text').setContent(msg);
+ this.msg_dlg.show();
+ },
setup_buttons: function() {
var button_download = this.filemanager.one('.fp-btn-download');
var button_create = this.filemanager.one('.fp-btn-mkdir');
@@ -235,9 +265,11 @@ M.form_filemanager.init = function(Y, options) {
e.preventDefault();
var scope = this;
// a function used to perform an ajax request
- function perform_action(e) {
- var foldername = Y.one('#fm-newname').get('value');
+ var perform_action = function(e) {
+ e.preventDefault();
+ var foldername = Y.one('#fm-newname-'+scope.client_id).get('value');
if (!foldername) {
+ scope.mkdir_dialog.hide();
return;
}
scope.request({
@@ -247,31 +279,35 @@ M.form_filemanager.init = function(Y, options) {
var filepath = obj.filepath;
scope.mkdir_dialog.hide();
scope.refresh(filepath);
- Y.one('#fm-newname').set('value', '');
+ Y.one('#fm-newname-'+scope.client_id).set('value', '');
if (typeof M.core_formchangechecker != 'undefined') {
M.core_formchangechecker.set_form_changed();
}
}
});
}
- if (!Y.one('#fm-mkdir-dlg')) {
- var dialog = Y.Node.create('<div id="fm-mkdir-dlg"><div class="hd">'+M.str.repository.entername+'</div><div class="bd"><input type="text" id="fm-newname" /></div></div>');
- Y.one(document.body).appendChild(dialog);
- this.mkdir_dialog = new YAHOO.widget.Dialog("fm-mkdir-dlg", {
- width: "300px",
- visible: true,
- x:e.pageX,
- y:e.pageY,
- constraintoviewport : true
- });
-
+ if (!this.mkdir_dialog) {
+ var node = Y.Node.create(M.form_filemanager.templates.mkdir);
+ this.filemanager.appendChild(node);
+ this.mkdir_dialog = new Y.Panel({
+ srcNode : node,
+ zIndex : 800000,
+ centered : true,
+ modal : true,
+ visible : false,
+ render : true
+ });
+ node.one('.fp-dlg-butcreate').on('click', perform_action, this);
+ node.one('input').set('id', 'fm-newname-'+this.client_id).
+ on('keydown', function(e){
+ if (e.keyCode == 13) {Y.bind(perform_action, this)(e);}
+ }, this);
+ node.all('.fp-dlg-butcancel').on('click', function(e){e.preventDefault();this.mkdir_dialog.hide();}, this);
+ node.all('.fp-dlg-curpath').set('id', 'fm-curpath-'+this.client_id);
}
- var buttons = [ { text:M.str.moodle.ok, handler:perform_action, isDefault:true },
- { text:M.str.moodle.cancel, handler:function(){this.cancel();}}];
-
- this.mkdir_dialog.cfg.queueProperty("buttons", buttons);
- this.mkdir_dialog.render();
this.mkdir_dialog.show();
+ Y.one('#fm-newname-'+scope.client_id).focus();
+ Y.all('#fm-curpath-'+scope.client_id).setContent(this.currentpath)
}, this);
} else {
this.filemanager.addClass('fm-nomkdir');
@@ -291,10 +327,10 @@ M.form_filemanager.init = function(Y, options) {
scope.refresh(obj.filepath);
var win = window.open(obj.fileurl, 'fm-download-folder');
if (!win) {
- alert(M.str.repository.popupblockeddownload);
+ scope.print_msg(M.str.repository.popupblockeddownload, 'error');
}
} else {
- alert(M.str.repository.draftareanofiles);
+ scope.print_msg(M.str.repository.draftareanofiles, 'error');
}
}
});
@@ -376,10 +412,12 @@ M.form_filemanager.init = function(Y, options) {
}
if (cb != null) { // (in manual mode do not update current path)
scope.options = obj;
+ scope.currentpath = node.path?node.path:'/';
}
node.highlight(false);
node.origlist = obj.list?obj.list:null;
node.origpath = obj.path?obj.path:null;
+ node.origcurrentpath = node.path?node.path:'/';
node.children = [];
for(k in list) {
if (list[k].type == 'folder' && retrieved_children[list[k].filepath]) {
@@ -447,11 +485,13 @@ M.form_filemanager.init = function(Y, options) {
this.options.list = e.node.parent.origlist;
this.print_path();
}
+ this.currentpath = node.filepath;
this.select_file(node);
} else {
// save current path and filelist (in case we want to jump to other viewmode)
this.options.path = e.node.origpath;
this.options.list = e.node.origlist;
+ this.currentpath = e.node.origcurrentpath;
this.print_path();
//this.content_scrolled();
}
@@ -531,10 +571,11 @@ M.form_filemanager.init = function(Y, options) {
scope: this,
params: params,
callback: function(id, obj, args) {
- args.scope.selectui.hide();
if (obj == false) {
- alert(M.str.repository.fileexists); // TODO!
+ selectnode.removeClass('loading');
+ args.scope.print_msg(M.str.repository.fileexists, 'error');
} else {
+ args.scope.selectui.hide();
args.scope.refresh(obj.filepath);
if (typeof M.core_formchangechecker != 'undefined') {
M.core_formchangechecker.set_form_changed();

0 comments on commit 694beb5

Please sign in to comment.