fixed issues in Cordova text chat code sample

Author: Igor Khomenko

samples/chat/index.html

@@ -17,7 +17,7 @@
                     <span class="sr-only">Toggle navigation</span>
                     <span class="glyphicon glyphicon-cog"></span>
                 </button>
-            
+
                 <a href="https://quickblox.com/developers/Chat">
                     <img src="images/logo-quickblox.png" id="logo">
                 </a>
@@ -51,48 +51,52 @@
         <div class="panel panel-primary">
           <div class="panel-body">
             <div class="row">
+
               <div class="col-md-4">
                 <div class="list-header">
                   <h4 class="list-header-title">History</h4>
                 </div>
                 <div class="list-group pre-scrollable nice-scroll" id="dialogs-list">
-                <!-- list of chat dialogs will be here -->
+
+                  <!-- list of chat dialogs will be here -->
+
                 </div>
               </div>
-                <div id="mcs_container" class="col-md-8 nice-scroll">
-                  <div class="customScrollBox">
-                    <div class="container del-style">
-                      <div class="content list-group pre-scrollable nice-scroll" id="messages-list">
-                        <!-- list of chat messages will be here -->
-                      </div>
-                    </div>
+              <div id="mcs_container" class="col-md-8">
+                <div class="container del-style">
+                  <div class="content list-group pre-scrollable nice-scroll" id="messages-list">
+
+                    <!-- list of chat messages will be here -->
+
                   </div>
-                    <div><img src="images/ajax-loader.gif" class="load-msg"></div>
-                    <form class="form-inline" role="form" method="POST" action="" onsubmit="return submit_handler(this)">
-	                  <div class="input-group">
-		                  <span class="input-group-btn input-group-btn_change_load">
-			              <input id="load-img" type="file">
-			                <button type="button" id="attach_btn" class="btn btn-default" onclick="$('#load-img').click();">
-				              <i class="icon-photo"></i>
-			                </button>
-		                  </span>
-		                  <span class="input-group-btn input-group-btn_change_load">
-			                <button type="button" id="stickers_btn" class="btn btn-default" onclick="">
-				              <i class="icon-sticker"></i>
-			                </button>
-		                  </span>
-
-		                  <span class="input-group-btn" style="width: 100%;">
-			                 <input type="text" class="form-control" id="message_text" placeholder="Enter message">
-		                  </span>
-
-		                  <span class="input-group-btn">
-			                <button  type="submit" id="send_btn" class="btn btn-default" onclick="clickSendMessage()">Send</button>
-		                  </span>
-	                    </div>
-                      <img src="images/ajax-loader.gif" id="progress">
-                    </form>
                 </div>
+
+                <div><img src="images/ajax-loader.gif" class="load-msg"></div>
+                <form class="form-inline" role="form" method="POST" action="" onsubmit="return submit_handler(this)">
+                  <div class="input-group">
+                    <span class="input-group-btn input-group-btn_change_load">
+  	                  <input id="load-img" type="file">
+  	                <button type="button" id="attach_btn" class="btn btn-default" onclick="$('#load-img').click();">
+  		              <i class="icon-photo"></i>
+  	                </button>
+                    </span>
+                    <span class="input-group-btn input-group-btn_change_load">
+  	                <button type="button" id="stickers_btn" class="btn btn-default" onclick="">
+  		              <i class="icon-sticker"></i>
+  	                </button>
+                    </span>
+
+                    <span class="input-group-btn" style="width: 100%;">
+  	                 <input type="text" class="form-control" id="message_text" placeholder="Enter message">
+                    </span>
+
+                    <span class="input-group-btn">
+  	                   <button  type="submit" id="send_btn" class="btn btn-default" onclick="clickSendMessage()">Send</button>
+                    </span>
+                    </div>
+                  <img src="images/ajax-loader.gif" id="progress">
+                </form>
+              </div>
               </div>
             </div>
           </div>

samples/chat/js/messages.js

@@ -31,7 +31,7 @@ function onMessage(userId, msg) {
   if (isMessageForCurrentDialog(userId, msg.dialog_id)){
     dialogsMessages.push(msg);
 
-    if (msg.markable === 1) {
+    if (msg.markable === 1 && userId != currentUser.id) {
       sendReadStatus(userId, msg.id, msg.dialog_id);
     }
 
@@ -61,10 +61,19 @@ function sendReadStatus(userId, messageId, dialogId) {
 }
 
 function onDeliveredStatusListener(messageId) {
-  $('#delivered_'+messageId).fadeIn(200);
+  showDeliveredСheckmark(messageId)
 }
 
 function onReadStatusListener(messageId) {
+  showReadСheckmark(messageId)
+}
+
+function showDeliveredСheckmark(messageId){
+  $('#read_'+messageId).fadeOut(100);
+  $('#delivered_'+messageId).fadeIn(200);
+}
+
+function showReadСheckmark(messageId){
   $('#delivered_'+messageId).fadeOut(100);
   $('#read_'+messageId).fadeIn(200);
 }
@@ -123,11 +132,9 @@ function retrieveChatMessages(dialog, beforeDateSent){
 
           // Show delivered statuses
           if (item.read_ids.length > 1 && messageSenderId === currentUser.id) {
-            $('#delivered_'+messageId).fadeOut(100);
-            $('#read_'+messageId).fadeIn(200);
+            showReadСheckmark(messageId);
           } else if (item.delivered_ids.length > 1 && messageSenderId === currentUser.id) {
-            $('#delivered_'+messageId).fadeIn(100);
-            $('#read_'+messageId).fadeOut(200);
+            showDeliveredСheckmark(messageId);
           }
 
           if (i > 5) {$('#messages-list').scrollTop($('#messages-list').prop('scrollHeight'));}
@@ -191,14 +198,14 @@ function sendMessage(text, attachmentFileId) {
         },
         markable: 1
     };
-  
+
     if(attachmentFileId !== null){
         msg['extension']['attachments'] = [{id: attachmentFileId, type: 'photo'}];
     }
 
     if (currentDialog.type === 3) {
         opponentId = QB.chat.helpers.getRecipientId(currentDialog.occupants_ids, currentUser.id);
-        
+
         QB.chat.send(opponentId, msg);
 
         $('.list-group-item.active .list-group-item-text')