weekly release 2.4dev
[moodle.git] / mod / chat / gui_ajax / module.js
CommitLineData
2daed78a
PS
1
2/*
3 * NOTE: the /mod/chat/gui_header_js/ is not a real plugin,
4 * ideally this code should be in /mod/chat/module.js
5 */
6
7/**
8 * @namespace M.mod_chat_ajax
9 */
10M.mod_chat_ajax = M.mod_chat_ajax || {};
11
579a4976 12/**
2daed78a
PS
13 * Init ajax based Chat UI.
14 * @namespace M.mod_chat_ajax
15 * @function
16 * @param {YUI} Y
17 * @param {Object} cfg configuration data
579a4976 18 */
2daed78a
PS
19M.mod_chat_ajax.init = function(Y, cfg) {
20
21 var gui_ajax = {
579a4976
SH
22
23 // Properties
467902f2 24 api : M.cfg.wwwroot+'/mod/chat/chat_ajax.php?sesskey='+M.cfg.sesskey, // The path to the ajax callback script
579a4976
SH
25 cfg : {}, // A configuration variable
26 interval : null, // The interval object for refreshes
27 layout : null, // A reference to the layout used in this module
28 messages : [], // An array of messages
29 scrollable : true, // True is scrolling should occur
30 thememenu : null, // A reference to the menu for changing themes
31
32 // Elements
33 messageinput : null,
34 sendbutton : null,
35 messagebox : null,
36
2daed78a 37 init : function(cfg) {
579a4976
SH
38 this.cfg = cfg;
39 this.cfg.req_count = this.cfg.req_count || 0;
69ccc32d 40 this.layout = new Y.YUI2.widget.Layout({
579a4976
SH
41 units : [
42 {position: 'right', width: 180, resize: true, gutter: '5px', scroll: true, body: 'chat-userlist', animate: false},
43 {position: 'bottom', height: 42, resize: false, body: 'chat-input-area', gutter: '5px', collapse: false, resize: false},
44 {position: 'center', body: 'chat-messages', gutter: '5px', scroll: true}
45 ]
46 });
47
48 this.layout.on('render', function() {
7d2975c1
DC
49 var unit = this.getUnitByPosition('right');
50 if (unit) {
51 unit.on('close', function() {
52 closeLeft();
53 });
54 }
579a4976
SH
55 }, this.layout);
56 this.layout.render();
57
58 // Gather the general elements
59 this.messageinput = Y.one('#input-message');
60 this.sendbutton = Y.one('#button-send');
61 this.messagebox = Y.one('#chat-messages');
62
63 // Attach the default events for this module
64 this.sendbutton.on('click', this.send, this);
2daed78a
PS
65 this.messagebox.on('mouseenter', function() {
66 this.scrollable = false;
67 }, this);
68 this.messagebox.on('mouseleave', function() {
69 this.scrollable = true;
70 }, this);
579a4976
SH
71
72 // Send the message when the enter key is pressed
73 Y.on('key', this.send, this.messageinput, 'press:13', this);
74
75 document.title = this.cfg.chatroom_name;
76
77 // Prepare and execute the first AJAX request of information
78 Y.io(this.api,{
79 method : 'POST',
80 data : build_querystring({
81 action : 'init',
82 chat_init : 1,
83 chat_sid : this.cfg.sid,
84 theme : this.theme
85 }),
86 on : {
87 success : function(tid, outcome) {
5be94998 88 this.messageinput.removeAttribute('disabled');
579a4976 89 this.messageinput.set('value', '');
c67a139c 90 this.messageinput.focus();
579a4976
SH
91 try {
92 var data = Y.JSON.parse(outcome.responseText);
93 } catch (ex) {
94 return;
95 }
96 this.update_users(data.users);
97 }
98 },
99 context : this
100 });
101
c67a139c
DC
102 var scope = this;
103 this.interval = setInterval(function() {
104 scope.update_messages();
579a4976
SH
105 }, this.cfg.timer, this);
106
107 // Create and initalise theme changing menu
108 /*
109 this.thememenu = new Y.Overlay({
110 bodyContent : '<div class="menuitem"><a href="'+this.cfg.chaturl+'&theme=bubble">Bubble</a></div><div class="menuitem"><a href="'+this.cfg.chaturl+'&theme=compact">Compact</a></div>',
111 visible : false,
112 zIndex : 2,
113 align : {
114 node : '#choosetheme',
115 points : [Y.WidgetPositionExt.BL, Y.WidgetPositionExt.BR]
116 }
117 });
118 this.thememenu.render(document.body);
119 Y.one('#choosetheme').on('click', function(e){
120 this.show();
121 this.get('boundingBox').setStyle('visibility', 'visible');
122 }, this.thememenu);
123
124 return;
125 */
69ccc32d 126 this.thememenu = new Y.YUI2.widget.Menu('basicmenu', {xy:[0,0]});
579a4976
SH
127 this.thememenu.addItems([
128 {text: "Bubble", url: this.cfg.chaturl+'&theme=bubble'},
129 {text: "Compact", url: this.cfg.chaturl+'&theme=compact'}
130 ]);
131 this.thememenu.render(document.body);
132 Y.one('#choosetheme').on('click', function(e){
133 this.moveTo((e.pageX-20), (e.pageY-20));
134 this.show();
135 }, this.thememenu);
136 },
137
138 append_message : function(key, message, row) {
139 var item = Y.Node.create('<li id="mdl-chat-entry-'+key+'">'+message.message+'</li>');
140 item.addClass((message.mymessage)?'mdl-chat-my-entry':'mdl-chat-entry');
141 Y.one('#messages-list').append(item);
142 if (message.type && message.type == 'beep') {
143 Y.one('#chat-notify').setContent('<embed src="../beep.wav" autostart="true" hidden="true" name="beep" />');
144 }
145 },
146
147 send : function(e, beep) {
148 this.sendbutton.set('value', M.str.chat.sending);
149
150 var data = {
2daed78a
PS
151 chat_message : (!beep)?this.messageinput.get('value'):'',
152 chat_sid : this.cfg.sid,
153 theme : this.cfg.theme
154 };
155 if (beep) {
156 data.beep = beep
157 }
467902f2 158 data.action = 'chat';
579a4976 159
467902f2 160 Y.io(this.api, {
2daed78a
PS
161 method : 'POST',
162 data : build_querystring(data),
163 on : {
164 success : this.send_callback
165 },
166 context : this
579a4976
SH
167 });
168 },
169
170 send_callback : function(tid, outcome, args) {
529817c8
DC
171 try {
172 var data = Y.JSON.parse(outcome.responseText);
173 } catch (ex) {
174 return;
579a4976 175 }
529817c8
DC
176 this.sendbutton.set('value', M.str.chat.send);
177 this.messageinput.set('value', '');
579a4976
SH
178 clearInterval(this.interval);
179 this.update_messages();
58f3f058
DC
180 var scope = this;
181 this.interval = setInterval(function() {
182 scope.update_messages();
579a4976
SH
183 }, this.cfg.timer, this);
184 },
185
e8a4928d 186 talkto: function (e, name) {
579a4976
SH
187 this.messageinput.set('value', "To "+name+": ");
188 this.messageinput.focus();
189 },
190
191 update_messages : function() {
192 this.cfg.req_count++;
467902f2 193 Y.io(this.api, {
579a4976
SH
194 method : 'POST',
195 data : build_querystring({
467902f2 196 action: 'update',
579a4976
SH
197 chat_lastrow : this.cfg.chat_lastrow || false,
198 chat_lasttime : this.cfg.chat_lasttime,
199 chat_sid : this.cfg.sid,
200 theme : this.cfg.theme
201 }),
202 on : {
203 success : this.update_messages_callback
204 },
205 context : this
206 });
207 },
208
209 update_messages_callback : function(tid, outcome) {
210 try {
211 var data = Y.JSON.parse(outcome.responseText);
212 } catch (ex) {
213 return;
214 }
215 if (data.error) {
a8e3b008
DC
216 clearInterval(this.interval);
217 alert(data.error);
218 window.location = this.cfg.home;
579a4976
SH
219 }
220 this.cfg.chat_lasttime = data.lasttime;
221 this.cfg.chat_lastrow = data.lastrow;
222 // Update messages
223 for (var key in data.msgs){
2daed78a 224 if (!M.util.in_array(key, this.messages)) {
579a4976
SH
225 this.messages.push(key);
226 this.append_message(key, data.msgs[key], data.lastrow);
227 }
228 }
229 // Update users
230 this.update_users(data.users);
231 // Scroll to the bottom of the message list
232 if (this.scrollable) {
233 Y.Node.getDOMNode(this.messagebox).parentNode.scrollTop+=500;
234 }
235 this.messageinput.focus();
236 },
237
238 update_users : function(users) {
2daed78a 239 if (!users) {
579a4976
SH
240 return;
241 }
242 var list = Y.one('#users-list');
243 list.get('children').remove();
244 for (var i in users) {
245 var li = Y.Node.create('<li><table><tr><td>'+users[i].picture+'</td><td></td></tr></table></li>');
246 if (users[i].id == this.cfg.userid) {
247 li.all('td').item(1).append(Y.Node.create('<strong><a target="_blank" href="'+users[i].url+'">'+ users[i].name+'</a></strong>'));
248 } else {
249 li.all('td').item(1).append(Y.Node.create('<div><a target="_blank" href="'+users[i].url+'">'+users[i].name+'</a></div>'));
9d3b8b24 250 var talk = Y.Node.create('<a href="###">'+M.str.chat.talk+'</a>');
e8a4928d
DC
251 talk.on('click', this.talkto, this, users[i].name);
252 var beep = Y.Node.create('<a href="###">'+M.str.chat.beep+'</a>');
253 beep.on('click', this.send, this, users[i].id);
9d3b8b24 254 li.all('td').item(1).append(Y.Node.create('<div></div>').append(talk).append('&nbsp;').append(beep));
579a4976
SH
255 }
256 list.append(li);
257 }
258 }
2daed78a
PS
259
260 };
261
262 gui_ajax.init(cfg);
263};