My plan is to create a simple chat website. I'm using asp.net web pages with razor and signalR for the chat. I have the default page and chat room page done but I dont know how to "dynamically" create multiple instances of the chat room page so that /chatroom/1 is a different chatroom than /chatroom/2. 2 instances of chat room page
I'm assuming that this could be done by making 10 chatroom pages and naming them from 1-10 but I believe thats bad practice. I've done routing already so that /room/[number] opens an instance of the chatroom page but I dont know how to make them separate from each other. If code is needed I can upload it to github.
EDIT: Github
Routing:
@using System.Web.Routing;
@{
RouteTable.Routes.MapWebPageRoute("{chatroom}/{number}", "~/room.cshtml",
constraints: new { chatroom = "room", number = "[1-9]"});
}
room.cshtml
@{
Layout = "~/_Layout.cshtml";
string s = Request.Url.AbsolutePath;
var RoomNumber = s.Substring(s.LastIndexOf("/") +1);
}
<div id="chat">
<textarea id="chatBox" rows="40" cols="50" readonly="readonly"></textarea>
<input type="text" id="message" placeholder="Your message"/>
<input type="button" id="msgSend" value="Send" />
</div>
<script type="text/javascript">
//simulate msgSend button with enter press when textbox focused
$('#message').bind('keyup', function (e) {
if (e.keyCode === 13) { // 13 is enter key
$('#msgSend').click();
}
});
$(function () {
// Declare a proxy to reference the hub.
var chat = $.connection.chatHub;
// Create a function that the hub can call to broadcast messages.
chat.client.broadcastMessage = function (message) {
// Html encode display message.
var encodedMsg = $('<div />').text(message).html();
//get current time
var currentdate = new Date();
var datetime =
+currentdate.getHours() + ":"
+ currentdate.getMinutes() + ":"
+ currentdate.getSeconds();
// Add the message to the page.
$('#chatBox').append('\n'+datetime+" "+encodedMsg);
};
// Set initial focus to message input box.
$('#message').focus();
// Start the connection.
$.connection.hub.start().done(function () {
$('#msgSend').click(function () {
// Call the Send method on the hub.
chat.server.send($('#message').val());
// Clear text box and reset focus for next comment.
$('#message').val('').focus();
});
});
});
</script>
