VAR/VAR.WebFormsCore
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Chat: Basic styling, and user differentiation

Browse Source
This commit is contained in:
Valeriano A.R.
2015-05-27 07:49:43 +02:00
parent 413af6ca2c
commit f100b4b038
3 changed files with 55 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
Scrummer/Code/Controls/ChatControl.cs
View File

@@ -28,6 +28,9 @@ namespace Scrummer.Code.Controls
var divChat = new Panel { ID = "divChat", CssClass = "divChat" };
Controls.Add(divChat);
var hidUserName = new HiddenField { ID = "hidUserName", Value = "VAR" };
Controls.Add(hidUserName);
var hidIDMessage = new HiddenField { ID = "hidIDMessage", Value = "0" };
Controls.Add(hidIDMessage);
@@ -36,12 +39,13 @@ namespace Scrummer.Code.Controls
var btnSend = new Button { ID = "btnSend", Text = "Send", CssClass = "chatButton" };
Controls.Add(btnSend);
btnSend.Attributes.Add("onclick", String.Format("SendChat('{0}',{1}); return false;", txtText.ClientID, _idBoard));
btnSend.Attributes.Add("onclick", String.Format("SendChat('{0}',{1}, '{2}'); return false;",
txtText.ClientID, _idBoard, hidUserName.ClientID));
LiteralControl litScript = new LiteralControl();
litScript.Text = String.Format("<script>RunChat('{0}',{1},'{2}');</script>",
divChat.ClientID, _idBoard, hidIDMessage.ClientID);
litScript.Text = String.Format("<script>RunChat('{0}',{1},'{2}','{3}');</script>",
divChat.ClientID, _idBoard, hidIDMessage.ClientID, hidUserName.ClientID);
Controls.Add(litScript);
}
}

18
Scrummer/Scripts/10. Chat.js
View File

@@ -1,10 +1,15 @@
function RunChat(divContainer, idBoard, hidIDMessage) {
function RunChat(divContainer, idBoard, hidIDMessage, hidUserName) {
divContainer = GetElement(divContainer);
hidIDMessage = GetElement(hidIDMessage);
hidUserName = GetElement(hidUserName);
var CreateMessageDOM = function (message) {
var CreateMessageDOM = function (message, selfMessage) {
var divMessageRow = document.createElement("DIV");
divMessageRow.className = "messageRow";
if (selfMessage) {
divMessageRow.className = "selfMessageRow";
} else {
divMessageRow.className = "messageRow";
}
var divMessage = document.createElement("DIV");
divMessage.className = "message";
@@ -38,7 +43,7 @@
if (idMessage < msg.IDMessage) {
hidIDMessage.value = msg.IDMessage;
idMessage = msg.IDMessage;
var elemMessage = CreateMessageDOM(msg);
var elemMessage = CreateMessageDOM(msg, (msg.UserName == hidUserName.value));
frag.appendChild(elemMessage);
}
}
@@ -65,12 +70,13 @@
RequestChatData();
}
function SendChat(txtText, idBoard) {
function SendChat(txtText, idBoard, hidUserName) {
txtText = GetElement(txtText);
hidUserName = GetElement(hidUserName);
var data = {
"text": txtText.value,
"idBoard": idBoard,
"userName": "VAR"
"userName": hidUserName.value
};
txtText.value = "";
SendData("ChatHandler", data, null, null);

36
Scrummer/Styles/10. Chat.css
View File

@@ -2,3 +2,39 @@
overflow: auto;
height: 300px;
}
.messageRow,
.selfMessageRow{
vertical-align:top;
display:block;
}
.messageRow {
text-align: left;
}
.selfMessageRow {
text-align: right;
}
.message{
display:inline-block;
vertical-align:top;
border: solid 1px rgb(32,32,32);
background-color:rgb(220,220,220);
border-radius:5px;
box-shadow: 0 0 10px rgb(0,0,0),
inset 0 2px 5px rgb(255,255,255),
inset 0 -2px 5px rgb(128,128,128);
margin:5px;
padding:5px;
font-family: Arial, 'Liberation Sans', 'DejaVu Sans', sans-serif;
}
.message .user{
color:rgb(64,64,64);
text-shadow: 0 0 1px rgba(0,0,0,0.3);
font-size:10px;
font-weight:bold;
}
.message .text{
color:rgb(32,32,32);
text-shadow: 0 0 1px rgba(0,0,0,0.3);
font-size:12px;
}