diff --git a/comment/comment.js b/comment/comment.js index dbde6423497..a3302b7fe02 100644 --- a/comment/comment.js +++ b/comment/comment.js @@ -1,197 +1,326 @@ -/** - * Javascript for comments 2.0 - */ +// This file is part of Moodle - http://moodle.org/ +// +// Moodle is free software: you can redistribute it and/or modify +// it under the terms of the GNU General Public License as published by +// the Free Software Foundation, either version 3 of the License, or +// (at your option) any later version. +// +// Moodle is distributed in the hope that it will be useful, +// but WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +// GNU General Public License for more details. +// +// You should have received a copy of the GNU General Public License +// along with Moodle. If not, see . -function cmt_replace(client_id,list,newcmt) { - var ret = {}; - ret.ids = []; - var template = document.getElementById('cmt-tmpl'); - var html = ''; - for(var i in list) { - var htmlid = 'comment-'+list[i].id+'-'+client_id; - var val = template.innerHTML; - val = val.replace('___name___', list[i].username); - if (list[i]['delete']||newcmt) { - list[i].content = '
' + list[i].content; - } - val = val.replace('___time___', list[i].time); - val = val.replace('___picture___', list[i].avatar); - val = val.replace('___content___', list[i].content); - val = '
  • '+val+'
  • '; - ret.ids.push(htmlid); - html = (val+html); +/** + * Comment Helper + * @author Dongsheng Cai + */ +// initialize commenting system +M.core_comment = (function(){ + function core_comment (args) { + core_comment.superclass.constructor.apply(this, arguments); } - ret.html = html; - return ret; -} -function cmt_load(cid) { - var container = document.getElementById('comment-list-'+cid); - container.innerHTML = '
    '; -} -function get_comments(client_id, area, itemid, page) { - var url = M.cfg.wwwroot + '/comment/comment_ajax.php'; - var data = { - 'courseid': comment_params.courseid, - 'contextid': comment_params.contextid, - 'area': area, - 'itemid': itemid, - 'page': page, - 'client_id': client_id, - 'sesskey': M.cfg.sesskey - } - this.cb = { - success: function(o) { - var ret = json_decode(o.responseText); - if (!comment_check_response(ret)) { - return; + core_comment.NAME = "COMMENT"; + core_comment.ATTRS = { + options: {}, + lang: {} + }; + Y.extend(core_comment, Y.Base, { + api: M.cfg.wwwroot+'/comment/comment_ajax.php', + initializer: function(args) { + var scope = this; + this.client_id = args.client_id; + this.itemid = args.itemid; + this.commentarea = args.commentarea; + this.courseid = args.courseid; + this.contextid = args.contextid; + if (args.autostart) { + this.view(args.page); } - var linktext = document.getElementById('comment-link-text-'+ret.client_id); - linktext.innerHTML = mstr.moodle.comments + ' ('+ret.count+')'; - var container = document.getElementById('comment-list-'+ret.client_id); - var pagination = document.getElementById('comment-pagination-'+ret.client_id); - if (ret.pagination) { - pagination.innerHTML = ret.pagination; + if (args.notoggle) { + Y.one('#comment-link-'+this.client_id).setStyle('display', 'none'); + } + // load comments + Y.one('#comment-link-'+this.client_id).on('click', function(e) { + e.preventDefault(); + this.view(0); + return false; + }, this); + Y.one('#comment-action-cancel'+this.client_id).on('click', function(e) { + e.preventDefault(); + this.view(0); + return false; + }, this); + // add new comment + Y.one('#comment-action-post-'+this.client_id).on('click', function(e) { + e.preventDefault(); + this.post(); + return false; + }, this); + }, + post: function() { + var ta = Y.one('#dlg-content-'+this.client_id); + var scope = this; + var value = ta.get('value'); + if (value && value != mstr.moodle.addcomment) { + this.request({ + action: 'add', + scope: scope, + form: {id:'comment-form-'+this.client_id}, + callback: function(id, obj, args) { + var scope = args.scope; + var cid = scope.client_id; + var ta = Y.one('#dlg-content-'+cid); + ta.set('value', ''); + var container = Y.one('#comment-list-'+cid); + var result = scope.render([obj], true); + var newcomment = Y.Node.create(result.html); + container.appendChild(newcomment); + var ids = result.ids; + var linktext = Y.one('#comment-link-text-'+cid); + linktext.set('innerHTML', mstr.moodle.comments + ' ('+obj.count+')'); + for(var i in ids) { + var attributes = { + color: { to: '#06e' }, + backgroundColor: { to: '#FFE390' } + }; + var anim = new YAHOO.util.ColorAnim(ids[i], attributes); + anim.animate(); + } + } + }, true); } else { - //empty paging bar - pagination.innerHTML = ''; + var attributes = { + backgroundColor: { from: '#FFE390', to:'#FFFFFF' } + }; + var anim = new YAHOO.util.ColorAnim('dlg-content-'+cid, attributes); + anim.animate(); } - var result = cmt_replace(ret.client_id, ret.list); - container.innerHTML = result.html; - } - } - cmt_load(client_id); - var trans = YAHOO.util.Connect.asyncRequest('POST', - url+'?action=get', this.cb, build_querystring(data)); -} -function post_comment(cid) { - this.cb = { - success: function(o) { - var resp = json_decode(o.responseText); - if (!comment_check_response(resp)) { - return; + }, + request: function(args, redraw) { + var params = {}; + var scope = this; + if (args['scope']) { + scope = args['scope']; } - if(resp) { - var cid = resp.client_id; - var ta = document.getElementById('dlg-content-'+cid); - ta.value = ''; - var container = document.getElementById('comment-list-'+cid); - var result = cmt_replace(cid,[resp], true); - container.innerHTML += result.html; - var ids = result.ids; - var linktext = document.getElementById('comment-link-text-'+resp.client_id); - linktext.innerHTML = mstr.moodle.comments + ' ('+resp.count+')'; - for(var i in ids) { - var attributes = { - color: { to: '#06e' }, - backgroundColor: { to: '#FFE390' } - }; - var anim = new YAHOO.util.ColorAnim(ids[i], attributes); - anim.animate(); + //params['page'] = args.page?args.page:''; + params['env'] = ''; + // the form element only accept certain file types + params['sesskey'] = M.cfg.sesskey; + params['action'] = args.action?args.action:''; + params['client_id'] = this.client_id; + params['itemid'] = this.itemid; + params['area'] = this.commentarea; + params['courseid'] = this.courseid; + params['contextid'] = this.contextid; + if (args['params']) { + for (i in args['params']) { + params[i] = args['params'][i]; } } - } - } - var ta = document.getElementById('dlg-content-'+cid); - if (ta.value && ta.value != mstr.moodle.addcomment) { - var url = M.cfg.wwwroot + '/comment/comment_ajax.php'; - var formObject = document.getElementById('comment-form-'+cid); - YAHOO.util.Connect.setForm(formObject); - var trans = YAHOO.util.Connect.asyncRequest('POST', url+'?action=add', this.cb); - } else { - var attributes = { - backgroundColor: { from: '#FFE390', to:'#FFFFFF' } - }; - var anim = new YAHOO.util.ColorAnim('dlg-content-'+cid, attributes); - anim.animate(); - } -} -function delete_comment(client_id, comment_id) { - var url = M.cfg.wwwroot + '/comment/comment_ajax.php'; - var data = { - 'courseid': comment_params.courseid, - 'contextid': comment_params.contextid, - 'commentid': comment_id, - 'client_id': client_id, - 'sesskey': M.cfg.sesskey - } - this.cb = { - success: function(o) { - var resp = json_decode(o.responseText); - if (!comment_check_response(resp)) { - return; - } - var htmlid= 'comment-'+resp.commentid+'-'+resp.client_id; - this.el = document.getElementById(htmlid); - this.el.style.overflow = 'hidden'; - var attributes = { - width:{to:0}, - height:{to:0} + var cfg = { + method: 'POST', + on: { + complete: function(id,o,p) { + if (!o) { + alert('IO FATAL'); + return; + } + var data = json_decode(o.responseText); + args.callback(id,data,p); + } + }, + arguments: { + scope: scope + }, + headers: { + 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8', + 'User-Agent': 'MoodleComment/3.0' + }, + data: build_querystring(params) }; - var anim = new YAHOO.util.Anim(htmlid, attributes, 1, YAHOO.util.Easing.easeOut); - anim.onComplete.subscribe(this.remove_dom, [], this); - anim.animate(); + if (args.form) { + cfg.form = args.form; + } + Y.io(this.api, cfg); + if (!redraw) { + this.wait(); + } }, - remove_dom: function() { - this.el.parentNode.removeChild(this.el); + render: function(list, newcmt) { + var ret = {}; + ret.ids = []; + var template = Y.one('#cmt-tmpl'); + var html = ''; + for(var i in list) { + var htmlid = 'comment-'+list[i].id+'-'+this.client_id; + var val = template.get('innerHTML'); + val = val.replace('___name___', list[i].username); + if (list[i]['delete']||newcmt) { + list[i].content = '
    ' + list[i].content; + } + val = val.replace('___time___', list[i].time); + val = val.replace('___picture___', list[i].avatar); + val = val.replace('___content___', list[i].content); + val = '
  • '+val+'
  • '; + ret.ids.push(htmlid); + html = (val+html); + } + ret.html = html; + return ret; + }, + load: function(page) { + var scope = this; + var container = Y.one('#comment-ctrl-'+this.client_id); + var params = { + 'page': page, + } + this.request({ + scope: scope, + params: params, + callback: function(id, ret, args) { + var linktext = Y.one('#comment-link-text-'+scope.client_id); + linktext.set('innerHTML', mstr.moodle.comments + ' ('+ret.count+')'); + var container = Y.one('#comment-list-'+scope.client_id); + var pagination = Y.one('#comment-pagination-'+scope.client_id); + if (ret.pagination) { + pagination.set('innerHTML', ret.pagination); + } else { + //empty paging bar + pagination.set('innerHTML', ''); + } + var result = scope.render(ret.list); + container.set('innerHTML', result.html); + args.scope.register_pagination(); + args.scope.register_delete_buttons(); + } + }); + }, + delete: function(id) { + var scope = this; + var params = {'commentid': id}; + + function remove_dom(type, anmi, cmt) { + cmt.remove(); + } + this.request({ + action: 'delete', + scope: scope, + params: params, + callback: function(id, resp, args) { + var htmlid= 'comment-'+resp.commentid+'-'+resp.client_id; + var attributes = { + width:{to:0}, + height:{to:0} + }; + var cmt = Y.one('#'+htmlid); + cmt.setStyle('overflow', 'hidden'); + var anim = new YAHOO.util.Anim(htmlid, attributes, 1, YAHOO.util.Easing.easeOut); + anim.onComplete.subscribe(remove_dom, cmt, this); + anim.animate(); + } + }); + this.cb = { + success: function(o) { + var resp = json_decode(o.responseText); + if (!comment_check_response(resp)) { + return; + } + var htmlid= 'comment-'+resp.commentid+'-'+resp.client_id; + this.el = document.getElementById(htmlid); + this.el.style.overflow = 'hidden'; + var attributes = { + width:{to:0}, + height:{to:0} + }; + var anim = new YAHOO.util.Anim(htmlid, attributes, 1, YAHOO.util.Easing.easeOut); + anim.onComplete.subscribe(this.remove_dom, [], this); + anim.animate(); + }, + } + }, + register_delete_buttons: function() { + var scope = this; + // page buttons + Y.all('div.comment-content a').each( + function(node, id) { + node.on('click', function(e, node) { + var id = node.get('id'); + var re = new RegExp("comment-delete-"+this.client_id+"-(\\d+)", "i"); + var result = id.match(re); + if (result[1]) { + this.delete(result[1]); + } + //this.load(result[1]); + }, scope, node); + } + ); + }, + register_pagination: function() { + var scope = this; + // page buttons + Y.all('#comment-paging-'+this.client_id+' a').each( + function(node, id) { + node.on('click', function(e, node) { + var id = node.get('id'); + var re = new RegExp("comment-page-"+this.client_id+"-(\\d+)", "i"); + var result = id.match(re); + this.load(result[1]); + }, scope, node); + } + ); + }, + view: function(page) { + var container = Y.one('#comment-ctrl-'+this.client_id); + var ta = Y.one('#dlg-content-'+this.client_id); + var img = Y.one('#comment-img-'+this.client_id); + var d = container.getStyle('display'); + if (d=='none'||d=='') { + // show + this.load(page); + container.setStyle('display', 'block'); + img.src=M.cfg.wwwroot+'/pix/t/expanded.png'; + } else { + // hide + container.setStyle('display', 'none'); + img.src=M.cfg.wwwroot+'/pix/t/collapsed.png'; + ta.set('value',''); + } + //toggle_textarea.apply(ta, [false]); + //// reset textarea size + ta.on('click', function() { + this.toggle_textarea(true); + }, this) + //ta.onkeypress = function() { + //if (this.scrollHeight > this.clientHeight && !window.opera) + //this.rows += 1; + //} + ta.on('blur', function() { + this.toggle_textarea(false); + }, this); + return false; + }, + toggle_textarea: function(focus) { + var t = Y.one('#dlg-content-'+this.client_id); + if (focus) { + if (t.get('value') == mstr.moodle.addcomment) { + t.set('value', ''); + t.setStyle('color', 'black'); + } + }else{ + if (t.get('value') == '') { + t.set('value', mstr.moodle.addcomment); + t.setStyle('color','grey'); + t.set('rows', 1); + } + } + }, + wait: function() { + var container = Y.one('#comment-list-'+this.client_id); + container.set('innerHTML', '
    '); } - } - var trans = YAHOO.util.Connect.asyncRequest('POST', - url+'?action=delete', this.cb, build_querystring(data)); -} -function view_comments(client_id, area, itemid, page) { - var container = document.getElementById('comment-ctrl-'+client_id); - var ta = document.getElementById('dlg-content-'+client_id); - var img = document.getElementById('comment-img-'+client_id); - if (container.style.display=='none'||container.style.display=='') { - // show - get_comments(client_id, area, itemid, page); - container.style.display = 'block'; - img.src=M.cfg.wwwroot+'/pix/t/expanded.png'; - } else { - // hide - container.style.display = 'none'; - img.src=M.cfg.wwwroot+'/pix/t/collapsed.png'; - ta.value = ''; - } - toggle_textarea.apply(ta, [false]); - // reset textarea size - ta.onclick = function() { - toggle_textarea.apply(this, [true]); - } - ta.onkeypress = function() { - if (this.scrollHeight > this.clientHeight && !window.opera) - this.rows += 1; - } - ta.onblur = function() { - toggle_textarea.apply(this, [false]); - } - return false; -} -function comment_hide_link(cid) { - var link = document.getElementById('comment-link-'+cid); - if(link){ - link.style.display='none'; - } else { - } -} -function toggle_textarea(focus) { - if (focus) { - if (this.value == mstr.moodle.addcomment) { - this.value = ''; - this.style.color = 'black'; - } - }else{ - if (this.value == '') { - this.value = mstr.moodle.addcomment; - this.style.color = 'grey'; - this.rows = 1; - } - } -} -function comment_check_response(data) { - if (data.error) { - alert(data.error); - return false; - } - return true; -} + }); + return core_comment; +})(); diff --git a/lib/ajax/ajaxlib.php b/lib/ajax/ajaxlib.php index 480f9b76273..048e7762bda 100644 --- a/lib/ajax/ajaxlib.php +++ b/lib/ajax/ajaxlib.php @@ -349,6 +349,9 @@ class page_requirements_manager { } else if($name === 'core_filemanager') { $pathtofilemanager = $CFG->httpswwwroot.'/lib/form/filemanager.js'; $module = array('fullpath'=>$pathtofilemanager, 'requires' => array('base', 'io', 'node', 'json', 'yui2-button', 'yui2-container', 'yui2-layout', 'yui2-menu', 'yui2-treeview')); + } else if($name === 'core_comment') { + $pathtocomment = $CFG->httpswwwroot.'/comment/comment.js'; + $module = array('fullpath'=>$pathtocomment, 'requires' => array('base', 'io', 'node', 'json', 'yui2-animation')); } } else { //TODO: look for plugin info? diff --git a/lib/commentlib.php b/lib/commentlib.php index 3295b75c781..917bb616937 100644 --- a/lib/commentlib.php +++ b/lib/commentlib.php @@ -178,13 +178,6 @@ EOD; self::$comment_context = optional_param('comment_context', '', PARAM_INT); self::$comment_area = optional_param('comment_area', '', PARAM_ALPHAEXT); - $PAGE->requires->yui2_lib('yahoo'); - $PAGE->requires->yui2_lib('dom'); - $PAGE->requires->yui2_lib('event'); - $PAGE->requires->yui2_lib('animation'); - $PAGE->requires->yui2_lib('json'); - $PAGE->requires->yui2_lib('connection'); - $PAGE->requires->js('/comment/comment.js')->in_head(); $PAGE->requires->string_for_js('addcomment', 'moodle'); $PAGE->requires->string_for_js('deletecomment', 'moodle'); $PAGE->requires->string_for_js('comments', 'moodle'); @@ -259,6 +252,7 @@ EOD; public function init($return = true) { global $CFG, $COURSE, $PAGE; + $this->link = qualified_me(); $murl = new moodle_url($this->link); $murl->remove_params('nonjscomment'); @@ -268,12 +262,21 @@ EOD; $murl->param('comment_area', $this->options->commentarea); $murl->remove_params('page'); $this->link = $murl->out(); - if ($this->env === 'block_comments') { - // auto expends comments - $PAGE->requires->js_function_call('view_comments', array($this->cid, $this->commentarea, $this->itemid, 0))->on_dom_ready(); - $PAGE->requires->js_function_call('comment_hide_link', array($this->cid))->on_dom_ready(); + $options = new stdclass; + $options->client_id = $this->cid; + $options->commentarea = $this->commentarea; + $options->itemid = $this->itemid; + $options->page = 0; + $options->courseid = $this->course->id; + $options->contextid = $this->contextid; + if ($this->env == 'block_comments') { + $options->autostart = true; + $options->notoggle = true; } + $PAGE->requires->js_module('core_comment'); + $PAGE->requires->js_function_call('initialize_comment', array($options))->on_dom_ready(); + if (!empty(self::$nonjs)) { return $this->print_comments($this->page, $return); } @@ -298,7 +301,7 @@ EOD; // print commenting icon and tooltip $html = << - + {$this->linktext} {$this->linktext} {$this->count} @@ -327,12 +330,12 @@ EOD;
    - {$strsubmit} + {$strsubmit} EOD; if ($this->env != 'block_comments') { $html .= << | - {$strcancel} + {$strcancel} EOD; } @@ -434,13 +437,13 @@ EOD; } else { // return ajax paging bar $str = ''; - $str .= '
    '; + $str .= '
    '; for ($p=0; $p<$pages; $p++) { $extra = ''; if ($p == $page) { $extra = ' style="border:1px solid grey" '; } - $str .= ''.($p+1).' '; + $str .= ''.($p+1).' '; } $str .= '
    '; } diff --git a/lib/javascript-static.js b/lib/javascript-static.js index 6f605daa915..a3e462b4c05 100644 --- a/lib/javascript-static.js +++ b/lib/javascript-static.js @@ -14,10 +14,6 @@ M.yui.add_module = function(modules) { } }; - - -// old JS functions, to be converted soon - function launch_filemanager(options) { Y.use('core_filemanager', function() { var client_id = options.client_id; @@ -28,6 +24,14 @@ function launch_filemanager(options) { }); } +function initialize_comment(options) { + Y.use('core_comment', function() { + new M.core_comment(options); + }); +} + +// old JS functions, to be converted soon + // === old legacy JS code, hopefully to be replaced soon by M.xx.yy and YUI3 code === function popupchecker(msg) { @@ -1424,4 +1428,4 @@ function get_image_url(imagename, component) { function submitFormById(id) { submit_form_by_id(null, {id: id}); -} \ No newline at end of file +}