Chat: Use configurator pattern on client side code.

This commit is contained in:
2015-05-31 06:19:32 +02:00
parent 7a3d8bc739
commit be5900a3e0
3 changed files with 62 additions and 38 deletions

View File

@@ -1,10 +1,11 @@
using System; using System;
using System.Text;
using System.Web.UI; using System.Web.UI;
using System.Web.UI.WebControls; using System.Web.UI.WebControls;
namespace Scrummer.Code.Controls namespace Scrummer.Code.Controls
{ {
public class ChatControl : Control public class ChatControl : Control, INamingContainer
{ {
#region Declarations #region Declarations
@@ -18,6 +19,7 @@ namespace Scrummer.Code.Controls
private Unit _height = new Unit(300, UnitType.Pixel); private Unit _height = new Unit(300, UnitType.Pixel);
private Panel _divChatWindow = null; private Panel _divChatWindow = null;
private Panel _divChatContainer = null;
#endregion #endregion
@@ -47,9 +49,9 @@ namespace Scrummer.Code.Controls
set set
{ {
_width = value; _width = value;
if (_divChatWindow != null) if (_divChatContainer != null)
{ {
_divChatWindow.Width = value; _divChatContainer.Width = value;
} }
} }
} }
@@ -60,9 +62,9 @@ namespace Scrummer.Code.Controls
set set
{ {
_height = value; _height = value;
if (_divChatWindow != null) if (_divChatContainer != null)
{ {
_divChatWindow.Height = value; _divChatContainer.Height = value;
} }
} }
} }
@@ -87,16 +89,21 @@ namespace Scrummer.Code.Controls
private void InitializeControls() private void InitializeControls()
{ {
string strCfgName = string.Format("{0}_cfg", this.ClientID);
_divChatWindow = new Panel { ID = "divChatWindow", CssClass = "divChatWindow" }; _divChatWindow = new Panel { ID = "divChatWindow", CssClass = "divChatWindow" };
Controls.Add(_divChatWindow); Controls.Add(_divChatWindow);
_divChatWindow.Width = _width;
_divChatWindow.Height = _height; _divChatContainer = new Panel { ID = "divChatContainer", CssClass = "divChatContainer" };
_divChatWindow.Controls.Add(_divChatContainer);
_divChatContainer.Width = _width;
_divChatContainer.Height = _height;
var divChat = new Panel { ID = "divChat", CssClass = "divChat" }; var divChat = new Panel { ID = "divChat", CssClass = "divChat" };
_divChatWindow.Controls.Add(divChat); _divChatContainer.Controls.Add(divChat);
var divChatControls = new Panel { ID = "divChatControls", CssClass = "divChatControls" }; var divChatControls = new Panel { ID = "divChatControls", CssClass = "divChatControls" };
_divChatWindow.Controls.Add(divChatControls); _divChatContainer.Controls.Add(divChatControls);
var hidUserName = new HiddenField { ID = "hidUserName", Value = _userName }; var hidUserName = new HiddenField { ID = "hidUserName", Value = _userName };
divChatControls.Controls.Add(hidUserName); divChatControls.Controls.Add(hidUserName);
@@ -113,13 +120,29 @@ namespace Scrummer.Code.Controls
var btnSend = new Button { ID = "btnSend", Text = "Send", CssClass = "chatButton" }; var btnSend = new Button { ID = "btnSend", Text = "Send", CssClass = "chatButton" };
divChatControls.Controls.Add(btnSend); divChatControls.Controls.Add(btnSend);
btnSend.Attributes.Add("onclick", String.Format("SendChat('{0}', '{1}', {2}, '{3}'); return false;", btnSend.Attributes.Add("onclick", String.Format("SendChat({0}); return false;", strCfgName));
_serviceUrl, txtText.ClientID, _idBoard, hidUserName.ClientID));
LiteralControl litScript = new LiteralControl(); StringBuilder sbCfg = new StringBuilder();
litScript.Text = String.Format("<script>RunChat('{0}', '{1}', '{2}', '{3}', '{4}', '{5}');</script>", sbCfg.AppendFormat("<script>\n");
_serviceUrl, divChat.ClientID, _idBoard, hidIDMessage.ClientID, hidUserName.ClientID, hidLastUser.ClientID); sbCfg.AppendFormat("var {0} = {{\n", strCfgName);
Controls.Add(litScript); sbCfg.AppendFormat(" divChatWindow: \"{0}\",\n", _divChatWindow.ClientID);
sbCfg.AppendFormat(" divChatTitleBar: \"{0}\",\n", _divChatTitleBar.ClientID);
sbCfg.AppendFormat(" lblTitle: \"{0}\",\n", lblTitle.ClientID);
sbCfg.AppendFormat(" divChatContainer: \"{0}\",\n", _divChatContainer.ClientID);
sbCfg.AppendFormat(" divChat: \"{0}\",\n", divChat.ClientID);
sbCfg.AppendFormat(" hidUserName: \"{0}\",\n", hidUserName.ClientID);
sbCfg.AppendFormat(" hidIDMessage: \"{0}\",\n", hidIDMessage.ClientID);
sbCfg.AppendFormat(" hidLastUser: \"{0}\",\n", hidLastUser.ClientID);
sbCfg.AppendFormat(" hidStatus: \"{0}\",\n", hidStatus.ClientID);
sbCfg.AppendFormat(" txtText: \"{0}\",\n", txtText.ClientID);
sbCfg.AppendFormat(" btnSend: \"{0}\",\n", btnSend.ClientID);
sbCfg.AppendFormat(" IDBoard: {0},\n", _idBoard);
sbCfg.AppendFormat(" ServiceUrl: \"{0}\"\n", _serviceUrl);
sbCfg.AppendFormat("}};\n");
sbCfg.AppendFormat("RunChat({0});\n", strCfgName);
sbCfg.AppendFormat("</script>\n");
LiteralControl liScript = new LiteralControl(sbCfg.ToString());
Controls.Add(liScript);
} }
#endregion #endregion

View File

@@ -19,6 +19,7 @@ namespace Scrummer.Code.Pages
Controls.Add(lblTest); Controls.Add(lblTest);
ChatControl chatControl = new ChatControl(); ChatControl chatControl = new ChatControl();
chatControl.ID = "ctrChat";
chatControl.IDBoard = _idBoard; chatControl.IDBoard = _idBoard;
chatControl.UserName = Convert.ToString(new Random().Next()); chatControl.UserName = Convert.ToString(new Random().Next());
Controls.Add(chatControl); Controls.Add(chatControl);

View File

@@ -1,8 +1,8 @@
function RunChat(serviceUrl, divContainer, idBoard, hidIDMessage, hidUserName, hidLastUser) { function RunChat(cfg) {
divContainer = GetElement(divContainer); cfg.divChat = GetElement(cfg.divChat);
hidIDMessage = GetElement(hidIDMessage); cfg.hidIDMessage = GetElement(cfg.hidIDMessage);
hidUserName = GetElement(hidUserName); cfg.hidUserName = GetElement(cfg.hidUserName);
hidLastUser = GetElement(hidLastUser); cfg.hidLastUser = GetElement(cfg.hidLastUser);
var CreateMessageDOM = function (message, selfMessage, showUserName) { var CreateMessageDOM = function (message, selfMessage, showUserName) {
var divMessageRow = document.createElement("DIV"); var divMessageRow = document.createElement("DIV");
@@ -36,27 +36,27 @@
}; };
var RequestChatData = function () { var RequestChatData = function () {
var requestUrl = serviceUrl + "?idBoard=" + idBoard + "&idMessage=" + hidIDMessage.value; var requestUrl = cfg.ServiceUrl + "?idBoard=" + cfg.IDBoard + "&idMessage=" + cfg.hidIDMessage.value;
var ReciveChatData = function (responseText) { var ReciveChatData = function (responseText) {
recvMsgs = JSON.parse(responseText); recvMsgs = JSON.parse(responseText);
if (recvMsgs) { if (recvMsgs) {
var idMessage = parseInt(hidIDMessage.value); var idMessage = parseInt(cfg.hidIDMessage.value);
var frag = document.createDocumentFragment(); var frag = document.createDocumentFragment();
for (var i = 0, n = recvMsgs.length; i < n; i++) { for (var i = 0, n = recvMsgs.length; i < n; i++) {
var msg = recvMsgs[i]; var msg = recvMsgs[i];
if (idMessage < msg.IDMessage) { if (idMessage < msg.IDMessage) {
hidIDMessage.value = msg.IDMessage; cfg.hidIDMessage.value = msg.IDMessage;
idMessage = msg.IDMessage; idMessage = msg.IDMessage;
var elemMessage = CreateMessageDOM(msg, var elemMessage = CreateMessageDOM(msg,
(msg.UserName == hidUserName.value), (msg.UserName == cfg.hidUserName.value),
(hidLastUser.value !== msg.UserName)); (cfg.hidLastUser.value !== msg.UserName));
hidLastUser.value = msg.UserName; cfg.hidLastUser.value = msg.UserName;
frag.appendChild(elemMessage); frag.appendChild(elemMessage);
} }
} }
divContainer.appendChild(frag); cfg.divChat.appendChild(frag);
divContainer.scrollTop = divContainer.scrollHeight; cfg.divChat.scrollTop = cfg.divChat.scrollHeight;
} }
// Reset pool // Reset pool
@@ -78,20 +78,20 @@
RequestChatData(); RequestChatData();
} }
function SendChat(serviceUrl, txtText, idBoard, hidUserName) { function SendChat(cfg) {
txtText = GetElement(txtText); cfg.txtText = GetElement(cfg.txtText);
hidUserName = GetElement(hidUserName); cfg.hidUserName = GetElement(cfg.hidUserName);
if (txtText.value.trim() == "") { if (cfg.txtText.value.trim() == "") {
return; return;
} }
var data = { var data = {
"text": txtText.value, "text": cfg.txtText.value,
"idBoard": idBoard, "idBoard": cfg.IDBoard,
"userName": hidUserName.value "userName": cfg.hidUserName.value
}; };
txtText.value = ""; cfg.txtText.value = "";
SendData(serviceUrl, data, null, null); SendData(cfg.ServiceUrl, data, null, null);
txtText.focus(); cfg.txtText.focus();
} }