Skip to content
Browse files

MDL-31901: Filepicker: Moved HTML for loginform into renderer

  • Loading branch information...
1 parent b5e7b63 commit 5ce13292b5c10f2c7554b41ea371808ec644acf0 @marinaglancy marinaglancy committed Mar 30, 2012
Showing with 146 additions and 21 deletions.
  1. +83 −21 repository/filepicker.js
  2. +63 −0 repository/renderer.php
View
104 repository/filepicker.js
@@ -839,7 +839,68 @@ M.core_filepicker.init = function(Y, options) {
var login_button_id = 'fp-form-login-button-'+client_id;
var popup_button_id = 'fp-form-popup-button-'+client_id;
- var str = '<div class="fp-login-form">';
+ var loginform_node = Y.Node.create(M.core_filepicker.templates.loginform);
+ loginform_node.one('form').set('id', form_id);
+ this.fpnode.one('.fp-content').setContent('').appendChild(loginform_node);
+ var templates = {
+ 'popup' : loginform_node.one('.fp-login-popup'),
+ 'textarea' : loginform_node.one('.fp-login-textarea'),
+ 'select' : loginform_node.one('.fp-login-select'),
+ 'text' : loginform_node.one('.fp-login-text'),
+ 'radio' : loginform_node.one('.fp-login-radio'),
+ 'checkbox' : loginform_node.one('.fp-login-checkbox'),
+ 'input' : loginform_node.one('.fp-login-input')
+ };
+ var container;
+ for (var i in templates) {
+ if (templates[i]) {
+ container = templates[i].get('parentNode');
+ container.removeChild(templates[i])
+ }
+ }
+
+ for(var k in l) {
+ if (templates[l[k].type]) {
+ var node = templates[l[k].type].cloneNode(true);
+ } else {
+ node = templates['input'].cloneNode(true);
+ }
+ if (l[k].type == 'popup') {
+ node.one('button').set('id', popup_button_id);
+ loginform_node.all('.fp-login-submit').remove();
+ action = 'popup';
+ }else if(l[k].type=='textarea') {
+ // textarea element
+ if (node.one('label')) { node.one('label').set('for', l[k].id).setContent(l[k].label) }
+ node.one('textarea').set('id', l[k].id).set('name', l[k].name);
+ }else if(l[k].type=='select') {
+ // select element
+ if (node.one('label')) { node.one('label').set('for', l[k].id).setContent(l[k].label) }
+ node.one('select').set('id', l[k].id).set('name', l[k].name).setContent('');
+ for (i in l[k].options) {
+ node.one('select').appendChild(
+ Y.Node.create('<option/>').
+ set('value', l[k].options[i].value).
+ setContent(l[k].options[i].label))
+ }
+ }else if(l[k].type=='radio') {
+ // radio input element
+ //node.one('label').set('for', l[k].id).setContent(l[k].label)
+ //node.one('input').set('id', l[k].id).set('name', l[k].name).set('value', l[k].value)
+ // TODO
+ }else {
+ // input element
+ if (node.one('label')) { node.one('label').set('for', l[k].id).setContent(l[k].label) }
+ node.one('input').
+ set('type', l[k].type).
+ set('id', l[k].id).
+ set('name', l[k].name).
+ set('value', l[k].value?l[k].value:'')
+ }
+ container.appendChild(node);
+ }
+
+/* var str = '<div class="fp-login-form">';
str += '<form id="'+form_id+'">';
var has_pop = false;
str +='<table width="100%">';
@@ -900,39 +961,31 @@ M.core_filepicker.init = function(Y, options) {
}
str +='</table>';
str += '</form>';
-
+*/
// custom lable text
- var btn_label = data['login_btn_label']?data['login_btn_label']:M.str.repository.submit;
if (action != 'popup') {
- str += '<p><input type="button" id="';
+ if (data['login_btn_label']) {
+ loginform_node.one('.fp-login-submit').setContent(data['login_btn_label'])
+ }
+ var button_id = login_button_id;
switch (action) {
case 'search':
- str += search_button_id;
+ button_id = search_button_id;
break;
case 'download':
- str += download_button_id;
- break;
- default:
- str += login_button_id;
+ button_id = download_button_id;
break;
}
- str += '" value="'+btn_label+'" /></p>';
+ loginform_node.one('.fp-login-submit').set('id', button_id);
}
- str += '</div>';
-
- // insert login form
- try {
- panel.set('innerHTML', str);
- } catch(e) {
- alert(M.str.repository.xhtmlerror);
- }
// register buttons
// process login action
var login_button = Y.one('#'+login_button_id);
var scope = this;
if (login_button) {
- login_button.on('click', function(){
+ login_button.on('click', function(e){
+ e.preventDefault();
// collect form data
var data = this.logindata;
var scope = this;
@@ -964,7 +1017,8 @@ M.core_filepicker.init = function(Y, options) {
}
var search_button = Y.one('#'+search_button_id);
if (search_button) {
- search_button.on('click', function(){
+ search_button.on('click', function(e){
+ e.preventDefault();
var data = this.logindata;
var params = {};
@@ -997,6 +1051,7 @@ M.core_filepicker.init = function(Y, options) {
}, true);
}, this);
}
+ // TODO not used code?
var download_button = Y.one('#'+download_button_id);
if (download_button) {
download_button.on('click', function(){
@@ -1011,7 +1066,7 @@ M.core_filepicker.init = function(Y, options) {
e.preventDefault();
}, this);
}
- var elform = Y.one('#'+form_id);
+ var elform = loginform_node.one('form');
elform.on('keydown', function(e) {
if (e.keyCode == 13) {
switch (action) {
@@ -1032,6 +1087,13 @@ M.core_filepicker.init = function(Y, options) {
// highlight the current repository in repositories list
scope.fpnode.all('.fp-repo.active').removeClass('active');
scope.fpnode.all('#fp-repo-'+scope.options.client_id+'-'+obj.repo_id).addClass('active')
+ // add class repository_REPTYPE to the filepicker (for repository-specific styles)
+ for (var i in scope.options.repositories) {
+ scope.fpnode.removeClass('repository_'+scope.options.repositories[i].type)
+ }
+ if (obj.repo_id && scope.options.repositories[obj.repo_id]) {
+ scope.fpnode.addClass('repository_'+scope.options.repositories[obj.repo_id].type)
+ }
// display response
if (obj.login) {
scope.viewbar_set_enabled(false);
View
63 repository/renderer.php
@@ -75,6 +75,8 @@ class core_repository_renderer extends plugin_renderer_base {
* wrap-{TOOLSEARCHID}, wrap-{TOOLREFRESHID}, wrap-{TOOLLOGOUTID}, wrap-{TOOLMANAGEID} and
* wrap-{TOOLHELPID} will have class 'enabled' or 'disabled' when applicable or not for
* the current repository view;
+ *
+ * @return string
*/
public function js_template_generallayout() {
$rv = '
@@ -128,6 +130,8 @@ public function js_template_generallayout() {
* the width of element with class 'fp-filename' will be set to the repository thumbnail width
* (unless min-width is set in css) and the content of an element will be replaced with filename
* supplied by repository;
+ *
+ * @return string
*/
public function js_template_iconview() {
$rv = '<div class="fp-iconview">
@@ -157,6 +161,8 @@ public function js_template_iconview() {
*
* Elements with ids 'wrap-{LINKEXTID}', 'wrap-{AUTHORID}' and 'wrap-{LICENSEID}' may be
* assigned with class 'uneditable' if not applicable for particular repository;
+ *
+ * @return string
*/
public function js_template_selectlayout() {
$rv = '<div class="{!}fp-select"><form>
@@ -190,6 +196,8 @@ public function js_template_selectlayout() {
* {BUTUPLOADID} (any element type, will hold onclick event)
*
* Please note that some fields may be hidden using CSS if this is part of quickupload form
+ *
+ * @return string
*/
public function js_template_uploadform() {
return '<div class="fp-upload-form mdl-align">
@@ -219,6 +227,8 @@ public function js_template_uploadform() {
/**
* Content to display during loading process in filepicker (inside element with class 'fp-content').
+ *
+ * @return string
*/
public function js_template_loading() {
return '<div style="text-align:center">
@@ -233,6 +243,8 @@ public function js_template_loading() {
* must have element with class 'fp-error', its content will be replaced with error text
* and the error code will be assigned as additional class to this element
* used errors: invalidjson, nofilesavailable
+ *
+ * @return string
*/
public function js_template_error() {
$rv = '<div class="{!}fp-error" />';
@@ -249,6 +261,8 @@ public function js_template_error() {
* content of element with class 'fp-msg-text' will be replaced with error/info text;
*
* element with class 'fp-msg-butok' will hold onclick event
+ *
+ * @return string
*/
public function js_template_message() {
$rv = '<div class="{!}fp-msg">
@@ -270,6 +284,8 @@ public function js_template_message() {
*
* content of element with class 'fp-dlg-butrename' will be substituted with appropriate string
* (Note that it may have long text)
+ *
+ * @return string
*/
public function js_template_processexistingfile() {
$rv = '<div class="{!}fp-dlg"><div class="{!}fp-dlg-text"></div>
@@ -281,6 +297,53 @@ public function js_template_processexistingfile() {
}
/**
+ * Template for repository login form including templates for each element type
+ *
+ * Elements with classes 'fp-login-popup', 'fp-login-textarea', 'fp-login-select' and
+ * 'fp-login-input' are templates for displaying respective login form elements. Inside
+ * there must be exactly one element with type <button>, <textarea>, <select> or <input>
+ * (i.e. fp-login-popup should have <button>, fp-login-textarea should have <textarea>, etc.);
+ * They may also contain the <label> element and it's content will be substituted with
+ * label;
+ *
+ * You can also define elements with classes 'fp-login-checkbox', 'fp-login-text',
+ * 'fp-login-radio' but if they are not found, 'fp-login-input' will be used;
+ *
+ * Element with class 'fp-login-submit' will hold on click mouse event (form submission). It
+ * will be removed if at least one popup element is present;
+ *
+ * @return string
+ */
+ public function js_template_loginform() {
+ $rv = '
+<div class="fp-login-form">
+ <form>
+ <table width="100%">
+ <tr class="{!}fp-login-popup">
+ <td colspan="2">
+ <label>'.get_string('popup', 'repository').'</label>
+ <p class="fp-popup"><button class="{!}fp-login-popup-but">'.get_string('login', 'repository').'</button></p>
+ </td>
+ </tr>
+ <tr class="{!}fp-login-textarea">
+ <td colspan="2"><p><textarea></textarea></p></td>
+ </tr>
+ <tr class="{!}fp-login-select">
+ <td align="right"><label></label></td>
+ <td align="left"><select></select></td>
+ </tr>
+ <tr class="{!}fp-login-input">
+ <td align="right" width="30%" valign="center"><label /></td>
+ <td align="left"><input/></td>
+ </tr>
+ </table>
+ <p><button class="{!}fp-login-submit">'.get_string('submit', 'repository').'</button></p>
+ </form>
+</div>';
+ return preg_replace('/\{\!\}/', '', $rv);
+ }
+
+ /**
* Returns all Javascript templates as an array.
*
* @return array

0 comments on commit 5ce1329

Please sign in to comment.
Something went wrong with that request. Please try again.