chat.js 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946
  1. /*
  2. Copyright (c) 2009 Anant Garg (anantgarg.com | inscripts.com)
  3. This script may be used for non-commercial purposes only. For any
  4. commercial purposes, please contact the author at
  5. anant.garg@inscripts.com
  6. Changes and Chamilo Integration: Julio Montoya <gugli100@gmail.com>
  7. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
  8. EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
  9. OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
  10. NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
  11. HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
  12. WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
  13. FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
  14. OTHER DEALINGS IN THE SOFTWARE.
  15. */
  16. var windowFocus = true;
  17. var username;
  18. var currentUserId;
  19. var chatHeartbeatCount = 0;
  20. var minChatHeartbeat = 4000;
  21. var maxChatHeartbeat = 33000;
  22. var chatHeartbeatTime = minChatHeartbeat;
  23. var originalTitle;
  24. var blinkOrder = 0;
  25. var chatboxFocus = new Array();
  26. var newMessages = new Array();
  27. var newMessagesWin = new Array();
  28. var chatBoxes = new Array();
  29. var intervals = new Array();
  30. var timer;
  31. var user_status = 0;
  32. var widthBox = 320; // see css class .chatbox
  33. //var ajax_url = 'chat.php'; // This variable is loaded in the template/layout/head.tpl file
  34. var doubleCheck = '<span class="chatbox_checked"><i class="fa fa-check"></i><i class="fa fa-check"></i></span>';
  35. function set_user_status(status)
  36. {
  37. if (status == 1) {
  38. stopChatHeartBeat();
  39. startChatHeartBeat();
  40. $('.user_status_main').html(online_button);
  41. $('#chatboxtitlemain').html(connect_lang);
  42. } else {
  43. stopChatHeartBeat();
  44. $('.user_status_main').html(offline_button);
  45. $('#chatboxtitlemain').html(disconnect_lang);
  46. }
  47. $.ajax({
  48. url: ajax_url+"?action=set_status",
  49. data: "status="+status,
  50. cache: false,
  51. success: function(data) {
  52. }
  53. });
  54. user_status = status;
  55. }
  56. $(function() {
  57. originalTitle = document.title;
  58. startChatSession();
  59. $([window, document]).blur(function() {
  60. windowFocus = false;
  61. }).focus(function(){
  62. windowFocus = true;
  63. document.title = originalTitle;
  64. });
  65. /* "On" conditions, divs are created dynamically */
  66. // User name header toggle
  67. $('body').on('click', '#chatboxtitlemain', function() {
  68. createMyContactsWindow();
  69. set_user_status(1);
  70. });
  71. // User name header toogle
  72. $('body').on('click', '.chatboxtitle', function(){
  73. chatbox = $(this).parents(".chatbox");
  74. var chat_id = chatbox.attr('id');
  75. chat_id = chat_id.split('_')[1];
  76. toggleChatBoxGrowth(chat_id);
  77. });
  78. // Minimize button
  79. $('body').on('click', '.chatboxhead .togglelink', function(){
  80. var chat_id = $(this).attr('rel');
  81. toggleChatBoxGrowth(chat_id);
  82. });
  83. // Close button
  84. $('body').on('click', '.chatboxhead .closelink', function(){
  85. var chat_id = $(this).attr('rel');
  86. closeWindow(chat_id);
  87. });
  88. // Close main chat
  89. $('body').on('click', '.chatboxhead .close_chat', function(){
  90. closeChat();
  91. });
  92. });
  93. function showChatConnect()
  94. {
  95. if (user_status == 1) {
  96. button = online_button;
  97. label = connect_lang;
  98. } else {
  99. button = offline_button;
  100. label = disconnect_lang;
  101. }
  102. $("<div />").attr("id","chatmain")
  103. .addClass("chatboxmain")
  104. .html('<div class="chatboxheadmain"><div class="user_status_main">'+button+'</div><div id="chatboxtitlemain">'+label+'</div><div class="chatboxoptions"></div></div>')
  105. .appendTo($( "body" ));
  106. }
  107. /**
  108. * Start chat session
  109. */
  110. function startChatSession()
  111. {
  112. /* fix bug BT#5728 whereby users cannot move to the next question in IE9 */
  113. if (typeof ajax_url != 'undefined') {
  114. $.ajax({
  115. url: ajax_url+"?action=startchatsession",
  116. cache: false,
  117. dataType: "json",
  118. success: function(data) {
  119. if (data) {
  120. username = data.me;
  121. currentUserId = data.user_id;
  122. user_status = data.user_status;
  123. showChatConnect();
  124. if (user_status == 1) {
  125. startChatHeartBeat();
  126. } else {
  127. stopChatHeartBeat();
  128. }
  129. $.each(data.items, function(my_user_id, user_items) {
  130. if (currentUserId == my_user_id) {
  131. // show contact list
  132. createMyContactsWindow();
  133. return true;
  134. }
  135. my_items = user_items['items'];
  136. window_user_info = user_items['window_user_info'];
  137. $.each(my_items, function(i, item) {
  138. if (item) {
  139. // fix strange ie bug
  140. if ($("#chatbox_"+my_user_id).length <= 0) {
  141. createChatBox(
  142. my_user_id,
  143. window_user_info.complete_name,
  144. 1,
  145. window_user_info.online,
  146. window_user_info.avatar_small
  147. );
  148. }
  149. createChatBubble(my_user_id, item);
  150. }
  151. });
  152. });
  153. for (i = 0; i < chatBoxes.length; i++) {
  154. my_user_id = chatBoxes[i];
  155. $("#chatbox_"+my_user_id+" .chatboxcontent").scrollTop(
  156. $("#chatbox_"+my_user_id+" .chatboxcontent")[0].scrollHeight
  157. );
  158. }
  159. }
  160. }
  161. });
  162. }
  163. }
  164. function stopChatHeartBeat()
  165. {
  166. clearInterval(timer);
  167. timer = null;
  168. }
  169. function startChatHeartBeat()
  170. {
  171. timer = setInterval(chatHeartbeat, chatHeartbeatTime);
  172. }
  173. /*
  174. * Shows the user messages in all windows
  175. *
  176. * Item array structure :
  177. *
  178. * item.s = type of message: 1 = message, 2 = "sent at" string
  179. * item.f = from_user
  180. *
  181. **/
  182. function chatHeartbeat()
  183. {
  184. var itemsfound = 0;
  185. if (windowFocus == false) {
  186. var blinkNumber = 0;
  187. var titleChanged = 0;
  188. for (x in newMessagesWin) {
  189. if (newMessagesWin[x].status == true) {
  190. ++blinkNumber;
  191. if (blinkNumber >= blinkOrder) {
  192. //document.title = newMessagesWin[x].username+' says...';
  193. //titleChanged = 1;
  194. break;
  195. }
  196. }
  197. }
  198. if (titleChanged == 0) {
  199. document.title = originalTitle;
  200. blinkOrder = 0;
  201. } else {
  202. ++blinkOrder;
  203. }
  204. } else {
  205. for (x in newMessagesWin) {
  206. newMessagesWin[x].status = false;
  207. }
  208. }
  209. for (x in newMessages) {
  210. if (newMessages[x] == true) {
  211. if (chatboxFocus[x] == false) {
  212. //FIXME: add toggle all or none policy, otherwise it looks funny
  213. $('#chatbox_'+x+' .chatboxhead').toggleClass('chatboxblink');
  214. }
  215. }
  216. }
  217. $.ajax({
  218. url: ajax_url+"?action=chatheartbeat",
  219. cache: false,
  220. dataType: "json",
  221. success: function(data) {
  222. $.each(data.items, function(my_user_id, user_items) {
  223. // Each window
  224. my_items = user_items['items'];
  225. userInfo = user_items['window_user_info'];
  226. update_online_user(
  227. my_user_id,
  228. userInfo.user_is_online
  229. );
  230. $.each(my_items, function(i, item) {
  231. if (item) {
  232. // fix strange ie bug
  233. if ($("#chatbox_"+my_user_id).length <= 0) {
  234. createChatBox(
  235. my_user_id,
  236. userInfo.complete_name,
  237. 0,
  238. userInfo.online,
  239. userInfo.avatar_small
  240. );
  241. }
  242. if ($("#chatbox_"+my_user_id).css('display') == 'none') {
  243. $("#chatbox_"+my_user_id).css('display','block');
  244. restructureChatBoxes();
  245. }
  246. newMessages[my_user_id] = {'status':true, 'username':item.username};
  247. newMessagesWin[my_user_id]= {'status':true, 'username':item.username};
  248. var chatBubble = createChatBubble(my_user_id, item);
  249. $("#chatbox_"+my_user_id+" .chatboxcontent").scrollTop(
  250. $("#chatbox_"+my_user_id+" .chatboxcontent")[0].scrollHeight
  251. );
  252. if ($('#chatbox_'+my_user_id+' .chatboxcontent').css('display') == 'none') {
  253. $('#chatbox_'+my_user_id+' .chatboxhead').toggleClass('chatboxblink');
  254. }
  255. itemsfound += 1;
  256. }
  257. });
  258. });
  259. chatHeartbeatCount++;
  260. if (itemsfound > 0) {
  261. chatHeartbeatTime = minChatHeartbeat;
  262. chatHeartbeatCount = 1;
  263. } else if (chatHeartbeatCount >= 10) {
  264. chatHeartbeatTime *= 2;
  265. chatHeartbeatCount = 1;
  266. if (chatHeartbeatTime > maxChatHeartbeat) {
  267. chatHeartbeatTime = maxChatHeartbeat;
  268. }
  269. }
  270. }
  271. }); //ajax
  272. }
  273. /**
  274. * Draws a message bubble
  275. * @param my_user_id
  276. * @param item
  277. * @returns {string}
  278. */
  279. function createChatBubble(my_user_id, item, appendType = 'append')
  280. {
  281. var myDiv = 'chatboxmessage_me';
  282. if (my_user_id == item.from_user_info.id) {
  283. myDiv = 'chatboxmessage';
  284. }
  285. var sentDate = '';
  286. if (moment.unix(item.date).isValid()) {
  287. sentDate = moment.unix(item.date).format('LLL');
  288. }
  289. var check = '';
  290. var unCheckClass = ' check_status';
  291. if (my_user_id != item.from_user_info.id) {
  292. check = '<i class="fa fa-check"></i><i class="fa fa-check"></i>';
  293. if (item.recd == 1) {
  294. unCheckClass = '';
  295. check = doubleCheck;
  296. }
  297. }
  298. var messageObject = $("#chatbox_"+my_user_id+" .chatboxcontent").find('#message_id_' + item.id);
  299. var exists = messageObject.length !== 0;
  300. var messageHeader = '<div id="message_id_'+item.id+'" class="chatbox-common well '+myDiv+'" title="'+sentDate+'" >';
  301. var messageEnd = '</div>';
  302. var message = '';
  303. if (my_user_id == item.from_user_info.id) {
  304. message += '<span class="chatboxmessagefrom">'+item.from_user_info.complete_name+':&nbsp;&nbsp;</span>';
  305. }
  306. message += '<div class="chatboxmessagecontent">'+item.message+'</div>';
  307. message += '<div class="chatbox_checks' + unCheckClass + '">'+check+'</div>';
  308. if (exists) {
  309. messageObject.html(message);
  310. $(messageObject).linkify({
  311. target: "_blank"
  312. });
  313. } else {
  314. message = messageHeader + message + messageEnd;
  315. if (appendType == 'append') {
  316. $("#chatbox_"+my_user_id+" .chatboxcontent").append(message);
  317. } else {
  318. $("#chatbox_"+my_user_id+" .chatboxcontent").prepend(message);
  319. }
  320. $("#chatbox_"+my_user_id+" .chatboxcontent").linkify({
  321. target: "_blank"
  322. });
  323. }
  324. return message;
  325. }
  326. /**
  327. * Disconnect user from chat
  328. */
  329. function closeChat()
  330. {
  331. $.post(
  332. ajax_url + "?action=close", {},
  333. function (data) {
  334. // Disconnects from chat
  335. set_user_status(0);
  336. // Clean cookies
  337. Cookies.set('chatbox_minimized', new Array());
  338. // Delete all windows
  339. $('.chatbox ').remove();
  340. // Reset variables
  341. chatBoxes = new Array();
  342. intervals = new Array();
  343. }
  344. );
  345. }
  346. function closeWindow(user_id)
  347. {
  348. $('#chatbox_'+user_id).css('display','none');
  349. restructureChatBoxes();
  350. $.post(
  351. ajax_url + "?action=close_window",
  352. {
  353. chatbox: user_id
  354. },
  355. function (data) {
  356. }
  357. );
  358. }
  359. function restructureChatBoxes()
  360. {
  361. var align = 0;
  362. for (x in chatBoxes) {
  363. user_id = chatBoxes[x];
  364. if ($("#chatbox_"+user_id).css('display') != 'none') {
  365. if (align == 0) {
  366. $("#chatbox_"+user_id).css('right', '10px');
  367. } else {
  368. width = (align)*(widthBox+7) + 5 + 5;
  369. $("#chatbox_"+user_id).css('right', width+'px');
  370. }
  371. align++;
  372. }
  373. }
  374. }
  375. /**
  376. * Function that fires the chat with an user (creates a chat bloclk)
  377. * @param int user id
  378. * @param string user's firstname + lastname
  379. * @param status
  380. *
  381. **/
  382. function chatWith(user_id, user_name, status, userImage)
  383. {
  384. set_user_status(1);
  385. createChatBox(user_id, user_name, 0, status, userImage);
  386. $("#chatbox_"+user_id+" .chatboxtextarea").focus();
  387. getMoreItems(user_id, 'last');
  388. }
  389. /**
  390. * Creates a div
  391. */
  392. function createMyContactsWindow()
  393. {
  394. var user_id = 'contacts';
  395. var oldChatBox = $("#chatbox_"+user_id);
  396. if (oldChatBox.length > 0) {
  397. // reload contact list
  398. if (oldChatBox.css('display') == 'none') {
  399. oldChatBox.css('display','block');
  400. restructureChatBoxes();
  401. }
  402. chatboxContent = oldChatBox.find('.chatboxcontent');
  403. $.post(ajax_url + "?action=get_contacts", {
  404. to: 'user_id'
  405. }, function (data) {
  406. chatboxContent.html(data);
  407. });
  408. $("#chatbox_"+user_id+" .chatboxtextarea").focus();
  409. return;
  410. }
  411. var chatbox = $('<div>')
  412. .attr({
  413. id: 'chatbox_' + user_id
  414. })
  415. .addClass('chatbox')
  416. .css('bottom', 0);
  417. var chatboxHead = $('<div>')
  418. .addClass('chatboxhead')
  419. .append('');
  420. $('<div>')
  421. .addClass('chatboxtitle')
  422. .append(chatLang)
  423. .appendTo(chatboxHead);
  424. var chatboxoptions = $('<div>')
  425. .addClass('chatboxoptions')
  426. .appendTo(chatboxHead);
  427. $('<a>')
  428. .addClass('btn btn-xs togglelink')
  429. .attr({
  430. href: 'javascript:void(0)',
  431. rel: user_id
  432. })
  433. .html('<em class="fa fa-toggle-down"></em>')
  434. .appendTo(chatboxoptions);
  435. $('<a>')
  436. .addClass('btn btn-xs close_chat')
  437. .attr({
  438. href: 'javascript:void(0)',
  439. rel: user_id
  440. })
  441. .html('<em class="fa fa-close"></em>')
  442. .appendTo(chatboxoptions);
  443. $('<br>')
  444. .attr('clear', 'all')
  445. .appendTo(chatboxHead);
  446. var chatboxContent = $('<div>').addClass('chatboxcontent');
  447. var chatboxInput = $('<div>').addClass('chatboxinput');
  448. $.post(ajax_url + "?action=get_contacts", {
  449. to: 'user_id'
  450. }, function (data) {
  451. $('<div>').html(data).appendTo(chatboxContent);
  452. });
  453. chatbox
  454. .append(chatboxHead)
  455. .append(chatboxContent)
  456. .append(chatboxInput)
  457. .appendTo('body');
  458. var chatBoxeslength = 0;
  459. for (x in chatBoxes) {
  460. if ($("#chatbox_"+chatBoxes[x]).css('display') != 'none') {
  461. chatBoxeslength++;
  462. }
  463. }
  464. if (chatBoxeslength == 0) {
  465. $("#chatbox_"+user_id).css('right', '10px');
  466. } else {
  467. width = (chatBoxeslength)*(widthBox+7) + 5 + 5;
  468. $("#chatbox_"+user_id).css('right', width+'px');
  469. }
  470. chatBoxes.push(user_id);
  471. chatboxFocus[user_id] = false;
  472. $("#chatbox_"+user_id+" .chatboxtextarea").blur(function(){
  473. chatboxFocus[user_id] = false;
  474. $("#chatbox_"+user_id+" .chatboxtextarea").removeClass('chatboxtextareaselected');
  475. }).focus(function(){
  476. chatboxFocus[user_id] = true;
  477. newMessages[user_id] = false;
  478. $('#chatbox_'+user_id+' .chatboxhead').removeClass('chatboxblink');
  479. $("#chatbox_"+user_id+" .chatboxtextarea").addClass('chatboxtextareaselected');
  480. });
  481. $("#chatbox_"+user_id).click(function() {
  482. if ($('#chatbox_'+user_id+' .chatboxcontent').css('display') != 'none') {
  483. $("#chatbox_"+user_id+" .chatboxtextarea").focus();
  484. }
  485. });
  486. $("#chatbox_"+user_id).show();
  487. $("#chatbox_"+user_id+" .chatboxcontent").scroll(function () {
  488. var iCurScrollPos = $(this).scrollTop();
  489. if (iCurScrollPos == 0) {
  490. getMoreItems(user_id);
  491. return false;
  492. }
  493. });
  494. minimizedChatBoxes = new Array();
  495. if (Cookies.get('chatbox_minimized')) {
  496. minimizedChatBoxes = Cookies.getJSON('chatbox_minimized');
  497. minimize = 0;
  498. for (j = 0; j < minimizedChatBoxes.length; j++) {
  499. if (minimizedChatBoxes[j] == user_id) {
  500. minimize = 1;
  501. }
  502. }
  503. if (minimize == 1) {
  504. $('.togglelink').html('<em class="fa fa-toggle-up"></em>');
  505. $('#chatbox_'+user_id+' .chatboxcontent').css('display','none');
  506. $('#chatbox_'+user_id+' .chatboxinput').css('display','none');
  507. }
  508. }
  509. }
  510. /**
  511. * Creates a div
  512. */
  513. function createChatBox(user_id, chatboxtitle, minimizeChatBox, online, userImage)
  514. {
  515. var oldChatBox = $("#chatbox_"+user_id);
  516. if (oldChatBox.length > 0) {
  517. if (oldChatBox.css('display') == 'none') {
  518. oldChatBox.css('display','block');
  519. restructureChatBoxes();
  520. }
  521. $("#chatbox_"+user_id+" .chatboxtextarea").focus();
  522. return;
  523. }
  524. var user_is_online = return_online_user(user_id, online, userImage);
  525. var chatbox = $('<div>')
  526. .attr({
  527. id: 'chatbox_' + user_id
  528. })
  529. .addClass('chatbox')
  530. .css('bottom', 0);
  531. var chatboxHead = $('<div>')
  532. .addClass('chatboxhead')
  533. .append(user_is_online);
  534. $('<div>')
  535. .addClass('chatimage')
  536. .append('<img src="'+userImage+'"/>')
  537. .appendTo(chatboxHead);
  538. $('<div>')
  539. .addClass('chatboxtitle')
  540. .append(chatboxtitle)
  541. .appendTo(chatboxHead);
  542. var chatboxoptions = $('<div>')
  543. .addClass('chatboxoptions')
  544. .appendTo(chatboxHead);
  545. if (!hide_chat_video) {
  546. if (!!Modernizr.prefixed('RTCPeerConnection', window) &&
  547. (online === '1' || online === 1)
  548. ) {
  549. /*$('<a>')
  550. .addClass('btn btn-xs ajax')
  551. .attr({
  552. href: ajax_url + '?action=create_room&to=' + user_id
  553. })
  554. .data({
  555. title: '<em class="fa fa-video-camera"></em>',
  556. size: 'sm'
  557. })
  558. .on('click', function () {
  559. $(this).data('title', $('.chatboxtitle').text());
  560. })
  561. .html('<em class="fa fa-video-camera"></em>')
  562. .appendTo(chatboxoptions);*/
  563. }
  564. }
  565. $('<a>')
  566. .addClass('btn btn-xs togglelink')
  567. .attr({
  568. href: 'javascript:void(0)',
  569. rel: user_id
  570. })
  571. .html('<em class="fa fa-toggle-down"></em>')
  572. .appendTo(chatboxoptions);
  573. $('<a>')
  574. .addClass('btn btn-xs closelink')
  575. .attr({
  576. href: 'javascript:void(0)',
  577. rel: user_id
  578. })
  579. .html('<em class="fa fa-close"></em>')
  580. .appendTo(chatboxoptions);
  581. $('<br>')
  582. .attr('clear', 'all')
  583. .appendTo(chatboxHead);
  584. var chatboxContent = $('<div>').addClass('chatboxcontent');
  585. var chatboxInput = $('<div>').addClass('chatboxinput');
  586. $('<textarea>')
  587. .addClass('chatboxtextarea')
  588. .on('keydown', function(e) {
  589. return checkChatBoxInputKey(e.originalEvent, this, user_id);
  590. })
  591. .appendTo(chatboxInput);
  592. chatbox
  593. .append(chatboxHead)
  594. .append(chatboxContent)
  595. .append(chatboxInput)
  596. .appendTo('body');
  597. var chatBoxeslength = 0;
  598. for (x in chatBoxes) {
  599. if ($("#chatbox_"+chatBoxes[x]).css('display') != 'none') {
  600. chatBoxeslength++;
  601. }
  602. }
  603. if (chatBoxeslength == 0) {
  604. $("#chatbox_"+user_id).css('right', '10px');
  605. } else {
  606. width = (chatBoxeslength)*(widthBox+7) + 5 + 5;
  607. $("#chatbox_"+user_id).css('right', width+'px');
  608. }
  609. chatBoxes.push(user_id);
  610. if (minimizeChatBox == 1) {
  611. minimizedChatBoxes = new Array();
  612. if (Cookies.get('chatbox_minimized')) {
  613. minimizedChatBoxes = Cookies.getJSON('chatbox_minimized');
  614. }
  615. minimize = 0;
  616. for (j = 0; j < minimizedChatBoxes.length; j++) {
  617. if (minimizedChatBoxes[j] == user_id) {
  618. minimize = 1;
  619. }
  620. }
  621. if (minimize == 1) {
  622. $('.togglelink').html('<em class="fa fa-toggle-up"></em>');
  623. $('#chatbox_'+user_id+' .chatboxcontent').css('display','none');
  624. $('#chatbox_'+user_id+' .chatboxinput').css('display','none');
  625. }
  626. }
  627. chatboxFocus[user_id] = false;
  628. $("#chatbox_"+user_id+" .chatboxtextarea").blur(function(){
  629. chatboxFocus[user_id] = false;
  630. $("#chatbox_"+user_id+" .chatboxtextarea").removeClass('chatboxtextareaselected');
  631. }).focus(function(){
  632. chatboxFocus[user_id] = true;
  633. newMessages[user_id] = false;
  634. $('#chatbox_'+user_id+' .chatboxhead').removeClass('chatboxblink');
  635. $("#chatbox_"+user_id+" .chatboxtextarea").addClass('chatboxtextareaselected');
  636. });
  637. $("#chatbox_"+user_id).click(function() {
  638. if ($('#chatbox_'+user_id+' .chatboxcontent').css('display') != 'none') {
  639. //$("#chatbox_"+user_id+" .chatboxtextarea").focus();
  640. }
  641. });
  642. $("#chatbox_"+user_id).show();
  643. $("#chatbox_"+user_id+" .chatboxcontent").scroll(function () {
  644. var iCurScrollPos = $(this).scrollTop();
  645. if (iCurScrollPos == 0) {
  646. getMoreItems(user_id);
  647. return false;
  648. }
  649. });
  650. }
  651. /**
  652. * @param int userId
  653. * @param string scrollType
  654. */
  655. function getMoreItems(userId, scrollType)
  656. {
  657. var visibleMessages = $("#chatbox_"+userId+" .chatboxcontent").find('.chatbox-common').length;
  658. $.ajax({
  659. url: ajax_url+"?action=get_previous_messages&user_id="+userId+"&visible_messages="+visibleMessages,
  660. cache: false,
  661. dataType: "json",
  662. success: function(items) {
  663. items = items.reverse();
  664. $.each(items, function(i, item) {
  665. if (item) {
  666. if ($("#chatbox_"+userId).css('display') == 'none') {
  667. $("#chatbox_"+userId).css('display','block');
  668. restructureChatBoxes();
  669. }
  670. var chatBubble = createChatBubble(userId, item, 'prepend');
  671. if ($('#chatbox_'+userId+' .chatboxcontent').css('display') == 'none') {
  672. $('#chatbox_'+userId+' .chatboxhead').toggleClass('chatboxblink');
  673. }
  674. }
  675. });
  676. }
  677. });
  678. }
  679. /**
  680. * Creates the div user status (green/gray button next to the user name)
  681. * @param int user id
  682. * @param int status 1 or 0
  683. */
  684. function return_online_user(user_id, status, userImage)
  685. {
  686. var div_wrapper = $("<div />" );
  687. var new_div = $("<div />" );
  688. new_div.attr("id","online_"+user_id);
  689. new_div.attr("class","user_status");
  690. if (status == '1' || status == 1) {
  691. new_div.html(online_button);
  692. } else {
  693. new_div.html(offline_button);
  694. }
  695. div_wrapper.append(new_div);
  696. return div_wrapper.html();
  697. }
  698. /**
  699. * Updates the user status (green/gray button next to the user name)
  700. */
  701. function update_online_user(user_id, status)
  702. {
  703. if ($("#online_" +user_id).length > 0) {
  704. if (status == 1) {
  705. $("#online_" +user_id).html(online_button);
  706. } else {
  707. $("#online_" +user_id).html(offline_button);
  708. }
  709. }
  710. }
  711. /**
  712. * @param user_id
  713. */
  714. function toggleChatBoxGrowth(user_id)
  715. {
  716. if ($('#chatbox_'+user_id+' .chatboxcontent').css('display') == 'none') {
  717. // Show box
  718. var minimizedChatBoxes = new Array();
  719. if (Cookies.get('chatbox_minimized')) {
  720. minimizedChatBoxes = Cookies.getJSON('chatbox_minimized');
  721. }
  722. var newCookie = new Array();
  723. for (var i = 0; i < minimizedChatBoxes.length; i++) {
  724. if (minimizedChatBoxes[i] != user_id) {
  725. newCookie.push(minimizedChatBoxes[i]);
  726. }
  727. }
  728. Cookies.set('chatbox_minimized', newCookie);
  729. $('#chatbox_'+user_id+' .chatboxcontent').css('display','block');
  730. $('#chatbox_'+user_id+' .chatboxinput').css('display','block');
  731. $('.togglelink').html('<em class="fa fa-toggle-down"></em>');
  732. } else {
  733. // hide box
  734. if (Cookies.get('chatbox_minimized')) {
  735. newCookie = Cookies.getJSON('chatbox_minimized');
  736. if ($.isArray(newCookie)) {
  737. for (i = 0; i < newCookie.length; i++) {
  738. if (newCookie[i] == user_id) {
  739. newCookie.splice(i, 1);
  740. }
  741. }
  742. newCookie.push(user_id);
  743. } else {
  744. newCookie = new Array();
  745. newCookie.push(user_id);
  746. }
  747. Cookies.set('chatbox_minimized', newCookie);
  748. }
  749. $('#chatbox_'+user_id+' .chatboxcontent').css('display','none');
  750. $('#chatbox_'+user_id+' .chatboxinput').css('display','none');
  751. $('.togglelink').html('<em class="fa fa-toggle-up"></em>');
  752. }
  753. }
  754. function checkMessageStatus(messageId, chatBox)
  755. {
  756. $.ajax({
  757. type: 'GET',
  758. dataType: 'json',
  759. url: ajax_url + "?action=get_message_status",
  760. data: {
  761. message_id: messageId
  762. },
  763. success: function (messageInfo) {
  764. if (messageInfo) {
  765. if (messageInfo.recd == 1) {
  766. $('#message_id_' + messageId + ' .chatbox_checks ').html(doubleCheck);
  767. clearInterval(intervals[messageId]);
  768. }
  769. }
  770. }
  771. });
  772. }
  773. /**
  774. * Sending message
  775. * @param event
  776. * @param chatboxtextarea
  777. * @param user_id
  778. * @returns {boolean}
  779. */
  780. function checkChatBoxInputKey(event, chatboxtextarea, user_id)
  781. {
  782. if(event.keyCode == 13 && event.shiftKey == 0) {
  783. message = $(chatboxtextarea).val();
  784. message = message.replace(/^\s+|\s+$/g,"");
  785. $(chatboxtextarea).val('');
  786. $(chatboxtextarea).focus();
  787. $(chatboxtextarea).css('height','44px');
  788. if (message != '') {
  789. $.post(ajax_url + "?action=sendchat", {
  790. to: user_id,
  791. message: message
  792. }, function (messageId) {
  793. if (messageId > 0) {
  794. message = message.replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/\"/g, "&quot;");
  795. var item = {
  796. from_user_info : {id: currentUserId, complete_name: 'me'},
  797. username: username,
  798. date: moment().unix(),
  799. f: currentUserId,
  800. message: message,
  801. id: messageId
  802. };
  803. createChatBubble(user_id, item);
  804. $("#chatbox_" + user_id + " .chatboxcontent").scrollTop(
  805. $("#chatbox_" + user_id + " .chatboxcontent")[0].scrollHeight
  806. );
  807. intervals[messageId] = setInterval(checkMessageStatus, chatHeartbeatTime, messageId);
  808. } else {
  809. $("#chatbox_" + user_id + " .chatboxcontent").
  810. append('<i class="fa fa-exclamation-triangle" aria-hidden="true"></i><br />');
  811. }
  812. });
  813. }
  814. chatHeartbeatTime = minChatHeartbeat;
  815. chatHeartbeatCount = 1;
  816. return false;
  817. }
  818. var adjustedHeight = chatboxtextarea.clientHeight;
  819. var maxHeight = 94;
  820. if (maxHeight > adjustedHeight) {
  821. adjustedHeight = Math.max(chatboxtextarea.scrollHeight, adjustedHeight);
  822. if (maxHeight)
  823. adjustedHeight = Math.min(maxHeight, adjustedHeight);
  824. if (adjustedHeight > chatboxtextarea.clientHeight)
  825. $(chatboxtextarea).css('height',adjustedHeight+8 +'px');
  826. } else {
  827. $(chatboxtextarea).css('overflow','auto');
  828. }
  829. }