From 4cfac7bbef38fa37df135582034b9a99d93dbde0 Mon Sep 17 00:00:00 2001 From: Dmitriy Simushev Date: Tue, 9 Oct 2012 14:26:20 +0000 Subject: [PATCH] Split chat.js JavaScript's chat.js library split into several logical parts: chatcontroller.js, chatview.js and chatinit.js --- src/messenger/webim/js/164/chat.js | 25 -- src/messenger/webim/js/164/chatcontroller.js | 16 + src/messenger/webim/js/164/chatinit.js | 11 + src/messenger/webim/js/164/chatview.js | 14 + .../js/source/{chat.js => chatcontroller.js} | 360 +----------------- src/messenger/webim/js/source/chatinit.js | 85 +++++ src/messenger/webim/js/source/chatview.js | 287 ++++++++++++++ .../styles/dialogs/default/templates/chat.tpl | 4 +- .../dialogs/original/templates/chat.tpl | 4 +- .../styles/dialogs/silver/templates/chat.tpl | 4 +- .../dialogs/simplicity/templates/chat.tpl | 4 +- 11 files changed, 426 insertions(+), 388 deletions(-) delete mode 100644 src/messenger/webim/js/164/chat.js create mode 100644 src/messenger/webim/js/164/chatcontroller.js create mode 100644 src/messenger/webim/js/164/chatinit.js create mode 100644 src/messenger/webim/js/164/chatview.js rename src/messenger/webim/js/source/{chat.js => chatcontroller.js} (53%) create mode 100644 src/messenger/webim/js/source/chatinit.js create mode 100644 src/messenger/webim/js/source/chatview.js diff --git a/src/messenger/webim/js/164/chat.js b/src/messenger/webim/js/164/chat.js deleted file mode 100644 index 0a8d21c8..00000000 --- a/src/messenger/webim/js/164/chat.js +++ /dev/null @@ -1,25 +0,0 @@ -/* - This file is part of Mibew Messenger project. - http://mibew.org - - Copyright (c) 2005-2011 Mibew Messenger Community - License: http://mibew.org/license.php -*/ -var FrameUtils={options:{},getDocument:function(a){return a.contentDocument?a.contentDocument:a.contentWindow?a.contentWindow.document:a.document?a.document:null},initFrame:function(a){var b=this.getDocument(a);b.open();b.write("");this.options.cssfile&&b.write('');b.write("");b.write("
"); -b.write("");b.close();a.onload=function(){a.myHtml&&(FrameUtils.getDocument(a).getElementById("content").innerHTML+=a.myHtml,FrameUtils.scrollDown(a))}},insertIntoFrame:function(a,b){var c=this.getDocument(a).getElementById("content");null==c?(a.myHtml||(a.myHtml=""),a.myHtml+=b):c.innerHTML+=b},scrollDown:function(a){var b=this.getDocument(a).getElementById("bottom");if("opera"==myAgent)try{a.contentWindow.scrollTo(0,this.getDocument(a).getElementById("content").clientHeight)}catch(c){}b&& -b.scrollIntoView(!1)}};ChatView=Class.create(); -ChatView.prototype={statusTimeout:null,localizedStrings:{},predefinedAnswers:[],messageContainer:null,initialize:function(a,b){this.localizedStrings=a||{};this.predefinedAnswers=b||[];this.messageContainer="safari"==myRealAgent?self.frames[0]:$("chatwnd");FrameUtils.initFrame(this.messageContainer)},getLocaleString:function(a){return"undefined"==typeof this.localizedStrings[a]?!1:this.localizedStrings[a]},enableInput:function(a){var b=$("msgwnd");b&&(b.disabled=!a)},clearInput:function(){var a=$("msgwnd"); -a&&(a.value="",a.focus())},showStatusDiv:function(a){$("engineinfo")&&($("engineinfo").style.display="inline",$("engineinfo").innerHTML=a)},setStatus:function(a){this.statusTimeout&&clearTimeout(this.statusTimeout);this.showStatusDiv(a);this.statusTimeout=setTimeout(this.clearStatus.bind(this),4E3)},clearStatus:function(){$("engineinfo").style.display="none"},showTyping:function(a){$("typingdiv")&&($("typingdiv").style.display=a?"inline":"none")},updateAvatar:function(a,b){var c="";""!=b&&(c='');$("avatarwnd").innerHTML=c},displayMessages:function(a){for(var b=0;b");this.options.cssfile&&b.write('');b.write("");b.write("
"); +b.write("");b.close();a.onload=function(){a.myHtml&&(FrameUtils.getDocument(a).getElementById("content").innerHTML+=a.myHtml,FrameUtils.scrollDown(a))}},insertIntoFrame:function(a,b){var c=this.getDocument(a).getElementById("content");null==c?(a.myHtml||(a.myHtml=""),a.myHtml+=b):c.innerHTML+=b},scrollDown:function(a){var b=this.getDocument(a).getElementById("bottom");if("opera"==myAgent)try{a.contentWindow.scrollTo(0,this.getDocument(a).getElementById("content").clientHeight)}catch(c){}b&& +b.scrollIntoView(!1)}};ChatView=Class.create(); +ChatView.prototype={statusTimeout:null,localizedStrings:{},predefinedAnswers:[],messageContainer:null,initialize:function(a,b){this.localizedStrings=a||{};this.predefinedAnswers=b||[];this.messageContainer="safari"==myRealAgent?self.frames[0]:$("chatwnd");FrameUtils.initFrame(this.messageContainer)},getLocaleString:function(a){return"undefined"==typeof this.localizedStrings[a]?!1:this.localizedStrings[a]},enableInput:function(a){var b=$("msgwnd");b&&(b.disabled=!a)},clearInput:function(){var a=$("msgwnd"); +a&&(a.value="",a.focus())},showStatusDiv:function(a){$("engineinfo")&&($("engineinfo").style.display="inline",$("engineinfo").innerHTML=a)},setStatus:function(a){this.statusTimeout&&clearTimeout(this.statusTimeout);this.showStatusDiv(a);this.statusTimeout=setTimeout(this.clearStatus.bind(this),4E3)},clearStatus:function(){$("engineinfo").style.display="none"},showTyping:function(a){$("typingdiv")&&($("typingdiv").style.display=a?"inline":"none")},updateAvatar:function(a,b){var c="";""!=b&&(c='');$("avatarwnd").innerHTML=c},displayMessages:function(a){for(var b=0;b"); - if (this.options.cssfile) { - doc.write(""); - } - doc.write(""); - doc.write("
"); - doc.write(""); - doc.close(); - frm.onload = function() { - if (frm.myHtml) { - FrameUtils.getDocument(frm).getElementById('content').innerHTML += frm.myHtml; - FrameUtils.scrollDown(frm); - } - }; - }, - - insertIntoFrame: function(frm, htmlcontent) { - var vcontent = this.getDocument(frm).getElementById('content'); - if (vcontent == null) { - if (!frm.myHtml) { - frm.myHtml = ""; - } - frm.myHtml += htmlcontent; - } else { - vcontent.innerHTML += htmlcontent; - } - }, - - scrollDown: function(frm) { - var vbottom = this.getDocument(frm).getElementById('bottom'); - if (myAgent == 'opera') { - try { - frm.contentWindow.scrollTo(0,this.getDocument(frm).getElementById('content').clientHeight); - } catch(e) {} - } - if (vbottom) { - vbottom.scrollIntoView(false); - } - } -}; - -ChatView = Class.create(); -ChatView.prototype = { - /** - * Status timeout identifier - * @type Number - * @private - */ - statusTimeout: null, - - /** - * Contains localized strings. Properties names are language key and - * properties values are localized strings - * @type Object - */ - localizedStrings: {}, - - /** - * Contains predefined answers configurable from administrative interface - * @type Array - */ - predefinedAnswers: [], - - /** - * Messages container DOM element - * @type Object - */ - messageContainer: null, - - /** - * Create an instance of ChatView - * @constructor - */ - initialize: function(localizedStrings, predefinedAnswers) { - this.localizedStrings = localizedStrings || {}; - this.predefinedAnswers = predefinedAnswers || []; - - this.messageContainer = (myRealAgent == 'safari') - ? self.frames[0] - : $("chatwnd"); - FrameUtils.initFrame(this.messageContainer); - }, - - /** - * Get localized string by language key - * @param {String} key Language key - * @returns {Boolean|String} Returns boolean FALSE if string with specified - * key is undefined and localized string otherwise - */ - getLocaleString: function(key) { - if (typeof this.localizedStrings[key] == 'undefined') { - return false; - } - return this.localizedStrings[key]; - }, - - /** - * Enables or disables input field - * @param {Boolean} val Use boolean true for enable input and false - * otherwise - */ - enableInput: function(val) { - var message = $('msgwnd'); - if (message) { - message.disabled = !val; - } - }, - - /** - * Clear message input element and set focus to it - */ - clearInput: function() { - var message = $('msgwnd'); - if(message) { - message.value = ''; - message.focus(); - } - }, - - /** - * Displays status div and sets the status string into it - * @param {String} k Status string - */ - showStatusDiv: function(k) { - if ($("engineinfo")) { - $("engineinfo").style.display = 'inline'; - $("engineinfo").innerHTML = k; - } - }, - - /** - * Sets the status - * @param {String} k Status string - */ - setStatus: function(k) { - if (this.statusTimeout) { - clearTimeout(this.statusTimeout); - } - this.showStatusDiv(k); - this.statusTimeout = setTimeout(this.clearStatus.bind(this), 4000); - }, - - /** - * Hide the status string - */ - clearStatus: function() { - $("engineinfo").style.display='none'; - }, - - /** - * Displays typing status - * @param {Boolean} istyping Indicates the other side of conversation is - * typing a message or not - */ - showTyping: function(istyping) { - if( $("typingdiv") ) { - $("typingdiv").style.display = istyping ? 'inline' : 'none'; - } - }, - - /** - * Updates operator's avatar - * @param {String} root Base path - * @param {String} imageLink New avatar URL - */ - updateAvatar: function(root, imageLink) { - var avatar = ""; - if (imageLink != "") { - avatar = '' + - ''; - } - $("avatarwnd").innerHTML = avatar; - }, - - /** - * Display all messages at the message window - * @param {Array} messages Messages array - */ - displayMessages: function(messages) { - // Output messages - for (var i = 0; i < messages.length; i++) { - this.outputMessage(messages[i]); - } - // There are some new messages - if (messages.length > 0) { - FrameUtils.scrollDown(this.messageContainer); - } - }, - - /** - * Add message to the message window - * @param {String} message HTML message to insert - * @private - */ - outputMessage: function(message) { - FrameUtils.insertIntoFrame(this.messageContainer, message); - }, - - /** - * Show new user name input - */ - showNameField: function() { - $('changename1').style.display='inline'; - $('changename2').style.display='none'; - }, - - /** - * Hide new user name input - */ - hideNameField: function() { - $('changename1').style.display='none'; - $('changename2').style.display='inline'; - }, - - /** - * Update user name in chat window - * @param {String} name New user's name - */ - updateUserName: function(name) { - $('unamelink').innerHTML = htmlescape(name); - }, - - /** - * Change sound button state. - * - * @param {Boolean} enable TRUE if sound enabled and FALSE otherwise - */ - changeSoundButtonState: function(enable) { - var tsound = $('soundimg'); - if (enable) { - tsound.className = "tplimage isound"; - } else { - tsound.className = "tplimage inosound"; - } - var messagePane = $('msgwnd'); - if(messagePane) { - messagePane.focus(); - } - }, - - /** - * Add predefined answer to message input element and set focus to it. - * - * @param {Number} answerIndex Index of predefined answer - */ - displayPredefinedAnswer: function(answerIndex) { - var message = $('msgwnd'); - message.value = this.predefinedAnswers[answerIndex]; - message.focus(); - }, - - /** - * Set selectedIndex property of the select box DOM element passed as - * argument to zero. - * @param {Object} elem Select box DOM element - */ - resetSelectedIndex: function(elem) { - elem.selectedIndex = 0; - } -} - ChatController = Class.create(); ChatController.prototype = { /** @@ -694,82 +414,4 @@ ChatController.prototype = { this.view.changeSoundButtonState(true); } } -} - -Behaviour.register({ - '#postmessage a' : function(el) { - el.onclick = function() { - var message = $('msgwnd'); - if (message) { - chatController.postMessage(message.value); - } - }; - }, - - 'select#predefined' : function(el) { - el.onchange = function() { - chatController.selectPredefinedAnswer(this); - }; - }, - - 'div#changename2 a' : function(el) { - el.onclick = function() { - chatController.showNameField(); - return false; - }; - }, - - 'div#changename1 a' : function(el) { - el.onclick = function() { - chatController.applyName(); - return false; - }; - }, - - 'div#changename1 input#uname' : function(el) { - el.onkeydown = function(e) { - var ev = e || event; - if( ev.keyCode == 13 ) { - chatController.applyName(); - } - }; - }, - - 'a#refresh' : function(el) { - el.onclick = function() { - chatController.refresh(); - }; - }, - - 'a#togglesound' : function(el) { - el.onclick = function() { - chatController.toggleSound(); - }; - }, - - 'a.closethread' : function(el) { - el.onclick = function() { - chatController.closeThread(); - }; - } -}); - -var pluginManager = new PluginManager(); -var chatController; - -EventHelper.register(window, 'onload', function(){ - FrameUtils.options.cssfile = chatParams.cssfile; - var chatServer = new ChatServer(chatParams.serverParams); - var thread = new Thread(chatParams.threadParams); - chatParams.initPlugins(pluginManager, thread, chatServer); - var chatView = new ChatView( - chatParams.localizedStrings, - chatParams.predefinedAnswers || [] - ); - chatController = new ChatController( - chatServer, - chatView, - thread, - {ignorectrl: -1}.extend(chatParams.controllerParams || {}) - ); -}); \ No newline at end of file +} \ No newline at end of file diff --git a/src/messenger/webim/js/source/chatinit.js b/src/messenger/webim/js/source/chatinit.js new file mode 100644 index 00000000..0d048a53 --- /dev/null +++ b/src/messenger/webim/js/source/chatinit.js @@ -0,0 +1,85 @@ +/** + * @preserve This file is part of Mibew Messenger project. + * http://mibew.org + * + * Copyright (c) 2005-2011 Mibew Messenger Community + * License: http://mibew.org/license.php + */ + +var chatController = null; +var pluginManager = new PluginManager(); + +Behaviour.register({ + '#postmessage a' : function(el) { + el.onclick = function() { + var message = $('msgwnd'); + if (message) { + chatController.postMessage(message.value); + } + }; + }, + + 'select#predefined' : function(el) { + el.onchange = function() { + chatController.selectPredefinedAnswer(this); + }; + }, + + 'div#changename2 a' : function(el) { + el.onclick = function() { + chatController.showNameField(); + return false; + }; + }, + + 'div#changename1 a' : function(el) { + el.onclick = function() { + chatController.applyName(); + return false; + }; + }, + + 'div#changename1 input#uname' : function(el) { + el.onkeydown = function(e) { + var ev = e || event; + if( ev.keyCode == 13 ) { + chatController.applyName(); + } + }; + }, + + 'a#refresh' : function(el) { + el.onclick = function() { + chatController.refresh(); + }; + }, + + 'a#togglesound' : function(el) { + el.onclick = function() { + chatController.toggleSound(); + }; + }, + + 'a.closethread' : function(el) { + el.onclick = function() { + chatController.closeThread(); + }; + } +}); + +EventHelper.register(window, 'onload', function(){ + FrameUtils.options.cssfile = chatParams.cssfile; + var chatServer = new ChatServer(chatParams.serverParams); + var thread = new Thread(chatParams.threadParams); + chatParams.initPlugins(pluginManager, thread, chatServer); + var chatView = new ChatView( + chatParams.localizedStrings, + chatParams.predefinedAnswers || [] + ); + chatController = new ChatController( + chatServer, + chatView, + thread, + {ignorectrl: -1}.extend(chatParams.controllerParams || {}) + ); +}); \ No newline at end of file diff --git a/src/messenger/webim/js/source/chatview.js b/src/messenger/webim/js/source/chatview.js new file mode 100644 index 00000000..70cd4c11 --- /dev/null +++ b/src/messenger/webim/js/source/chatview.js @@ -0,0 +1,287 @@ +/** + * @preserve This file is part of Mibew Messenger project. + * http://mibew.org + * + * Copyright (c) 2005-2011 Mibew Messenger Community + * License: http://mibew.org/license.php + */ + +var FrameUtils = { + + options: {}, + + getDocument: function(frm) { + if (frm.contentDocument) { + return frm.contentDocument; + } else if (frm.contentWindow) { + return frm.contentWindow.document; + } else if (frm.document) { + return frm.document; + } else { + return null; + } + }, + + initFrame: function(frm) { + var doc = this.getDocument(frm); + doc.open(); + doc.write(""); + if (this.options.cssfile) { + doc.write(""); + } + doc.write(""); + doc.write("
"); + doc.write(""); + doc.close(); + frm.onload = function() { + if (frm.myHtml) { + FrameUtils.getDocument(frm).getElementById('content').innerHTML += frm.myHtml; + FrameUtils.scrollDown(frm); + } + }; + }, + + insertIntoFrame: function(frm, htmlcontent) { + var vcontent = this.getDocument(frm).getElementById('content'); + if (vcontent == null) { + if (!frm.myHtml) { + frm.myHtml = ""; + } + frm.myHtml += htmlcontent; + } else { + vcontent.innerHTML += htmlcontent; + } + }, + + scrollDown: function(frm) { + var vbottom = this.getDocument(frm).getElementById('bottom'); + if (myAgent == 'opera') { + try { + frm.contentWindow.scrollTo(0,this.getDocument(frm).getElementById('content').clientHeight); + } catch(e) {} + } + if (vbottom) { + vbottom.scrollIntoView(false); + } + } +}; + +ChatView = Class.create(); +ChatView.prototype = { + /** + * Status timeout identifier + * @type Number + * @private + */ + statusTimeout: null, + + /** + * Contains localized strings. Properties names are language key and + * properties values are localized strings + * @type Object + */ + localizedStrings: {}, + + /** + * Contains predefined answers configurable from administrative interface + * @type Array + */ + predefinedAnswers: [], + + /** + * Messages container DOM element + * @type Object + */ + messageContainer: null, + + /** + * Create an instance of ChatView + * @constructor + */ + initialize: function(localizedStrings, predefinedAnswers) { + this.localizedStrings = localizedStrings || {}; + this.predefinedAnswers = predefinedAnswers || []; + + this.messageContainer = (myRealAgent == 'safari') + ? self.frames[0] + : $("chatwnd"); + FrameUtils.initFrame(this.messageContainer); + }, + + /** + * Get localized string by language key + * @param {String} key Language key + * @returns {Boolean|String} Returns boolean FALSE if string with specified + * key is undefined and localized string otherwise + */ + getLocaleString: function(key) { + if (typeof this.localizedStrings[key] == 'undefined') { + return false; + } + return this.localizedStrings[key]; + }, + + /** + * Enables or disables input field + * @param {Boolean} val Use boolean true for enable input and false + * otherwise + */ + enableInput: function(val) { + var message = $('msgwnd'); + if (message) { + message.disabled = !val; + } + }, + + /** + * Clear message input element and set focus to it + */ + clearInput: function() { + var message = $('msgwnd'); + if(message) { + message.value = ''; + message.focus(); + } + }, + + /** + * Displays status div and sets the status string into it + * @param {String} k Status string + */ + showStatusDiv: function(k) { + if ($("engineinfo")) { + $("engineinfo").style.display = 'inline'; + $("engineinfo").innerHTML = k; + } + }, + + /** + * Sets the status + * @param {String} k Status string + */ + setStatus: function(k) { + if (this.statusTimeout) { + clearTimeout(this.statusTimeout); + } + this.showStatusDiv(k); + this.statusTimeout = setTimeout(this.clearStatus.bind(this), 4000); + }, + + /** + * Hide the status string + */ + clearStatus: function() { + $("engineinfo").style.display='none'; + }, + + /** + * Displays typing status + * @param {Boolean} istyping Indicates the other side of conversation is + * typing a message or not + */ + showTyping: function(istyping) { + if( $("typingdiv") ) { + $("typingdiv").style.display = istyping ? 'inline' : 'none'; + } + }, + + /** + * Updates operator's avatar + * @param {String} root Base path + * @param {String} imageLink New avatar URL + */ + updateAvatar: function(root, imageLink) { + var avatar = ""; + if (imageLink != "") { + avatar = '' + + ''; + } + $("avatarwnd").innerHTML = avatar; + }, + + /** + * Display all messages at the message window + * @param {Array} messages Messages array + */ + displayMessages: function(messages) { + // Output messages + for (var i = 0; i < messages.length; i++) { + this.outputMessage(messages[i]); + } + // There are some new messages + if (messages.length > 0) { + FrameUtils.scrollDown(this.messageContainer); + } + }, + + /** + * Add message to the message window + * @param {String} message HTML message to insert + * @private + */ + outputMessage: function(message) { + FrameUtils.insertIntoFrame(this.messageContainer, message); + }, + + /** + * Show new user name input + */ + showNameField: function() { + $('changename1').style.display='inline'; + $('changename2').style.display='none'; + }, + + /** + * Hide new user name input + */ + hideNameField: function() { + $('changename1').style.display='none'; + $('changename2').style.display='inline'; + }, + + /** + * Update user name in chat window + * @param {String} name New user's name + */ + updateUserName: function(name) { + $('unamelink').innerHTML = htmlescape(name); + }, + + /** + * Change sound button state. + * + * @param {Boolean} enable TRUE if sound enabled and FALSE otherwise + */ + changeSoundButtonState: function(enable) { + var tsound = $('soundimg'); + if (enable) { + tsound.className = "tplimage isound"; + } else { + tsound.className = "tplimage inosound"; + } + var messagePane = $('msgwnd'); + if(messagePane) { + messagePane.focus(); + } + }, + + /** + * Add predefined answer to message input element and set focus to it. + * + * @param {Number} answerIndex Index of predefined answer + */ + displayPredefinedAnswer: function(answerIndex) { + var message = $('msgwnd'); + message.value = this.predefinedAnswers[answerIndex]; + message.focus(); + }, + + /** + * Set selectedIndex property of the select box DOM element passed as + * argument to zero. + * @param {Object} elem Select box DOM element + */ + resetSelectedIndex: function(elem) { + elem.selectedIndex = 0; + } +} \ No newline at end of file diff --git a/src/messenger/webim/styles/dialogs/default/templates/chat.tpl b/src/messenger/webim/styles/dialogs/default/templates/chat.tpl index c405d264..6b72cb5a 100644 --- a/src/messenger/webim/styles/dialogs/default/templates/chat.tpl +++ b/src/messenger/webim/styles/dialogs/default/templates/chat.tpl @@ -39,7 +39,9 @@ var chatParams = { //--> - + + +