Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on Sep 16th, 2012  |  syntax: None  |  size: 2.91 KB  |  hits: 5  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. $(document).ready(function () {
  2.         var chat = new chatR.chatViewModel();
  3.         var users = new chatR.connectedUsersViewModel();
  4.         var currentUser = new chatR.user(@Html.Raw(Json.Encode(Model))); // The username chose by the user is stored in the model
  5.  
  6.         // Proxy creation
  7.         var chatHub = $.connection.chatHub; // chatHub is the name of the Hub as declared in server side code
  8.         chatHub.username = currentUser.username; // This is the round-trip state
  9.  
  10.         // Client-side event handlers, as declared inside the  Hub
  11.         chatHub.onMessageReceived = function (message) {
  12.             var date = new Date();
  13.             date.setISO8601(message.Timestamp);
  14.             chat.messages.push(new chatR.chatMessage(message.Username, message.Content, date));//new Date(message.Timestamp)));
  15.             $("#chat-list").scrollTo('max');
  16.         }
  17.        
  18.         chatHub.leaves = function (connectionId, username, timestamp) {
  19.             var disconnectedUser = new chatR.user(username, connectionId);
  20.             users.customRemove(disconnectedUser);
  21.         }
  22.  
  23.         chatHub.joins = function (connectionId, username, timestamp) {
  24.             var connectedUser = new chatR.user(username, connectionId);
  25.             users.contacts.push(connectedUser);
  26.         }
  27.  
  28.         function sendMessageContent() {
  29.             var content = $("#compose-box").val();
  30.             if (content != "" && content != null) {
  31.                 var msg = new chatR.chatMessage(currentUser.username, content);
  32.                 chatHub.send(msg).done(function () {
  33.                     $("#compose-box").val("");
  34.                 }).fail(function (e) {
  35.                     alert("Could not connect to server");
  36.                 });
  37.             }
  38.         }
  39.  
  40.         $("#send-btn").click(function () {
  41.             sendMessageContent();
  42.         });
  43.  
  44.         // Handles Enter keystroke press event
  45.         $('#compose-box').keypress(function (e) {
  46.             if (e.which == 13) {
  47.                 sendMessageContent();
  48.             }
  49.         });
  50.  
  51.         ko.applyBindings(users, $("#users-list")[0]);
  52.         ko.applyBindings(chat, $("#chat-list")[0]);
  53.  
  54.         // Step 1: Start the connection
  55.         // Step 2: Get all currenlty connected users
  56.         // Step 3: Join to the chat and nmotify all the clients (me included) that there is a new user connected
  57.         $.connection.hub.start()
  58.                     .done(function () {
  59.                         chatHub.getConnectedUsers()
  60.                                     .done(function (connectedUsers) {
  61.                                         ko.utils.arrayForEach(connectedUsers, function (item) {
  62.                                             users.contacts.push(new chatR.user(item.Username, item.Id));
  63.                                         });
  64.                                     }).done(function () {
  65.                                         chatHub.joined();
  66.                                     });
  67.                     });
  68.     });