Send notification when user is writing a message

assets/js/common/date.js

@@ -4,7 +4,7 @@
  * @author Pierre HUBERT
  */
 
-ComunicWeb.common.date = {
+const ComunicDate = {
 	/**
 	 * Get current timestamp
 	 * 
@@ -99,4 +99,6 @@ ComunicWeb.common.date = {
 	timeDiffToStr: function(time){
 		return this.diffToStr(this.time() - time);
 	},
-}
+}
+
+ComunicWeb.common.date = ComunicDate;

assets/js/components/conversations/chatWindows.js

@@ -146,6 +146,9 @@ const ConvChatWindow = {
 		});
 		inputText.maxLength = ServerConfig.conf.max_conversation_message_len;
 
+		// Notify other users when this user is writing a message
+		ConversationsUtils.listenToInputChangeEvents(inputText, infosBox.conversationID)
+
 		//Enable textarea 2.0 on the message
 		var textarea2 = new ComunicWeb.components.textarea();
 		textarea2.init({

assets/js/components/conversations/utils.js

@@ -284,6 +284,30 @@ const ConversationsUtils = {
 
 		await ConversationsInterface.sendNewConversationImage(convID, input);
 	},
+
+	/**
+	 * Automatically listen to change events of an input
+	 * to notify other users current user is writing a message
+	 * 
+	 * @param {HTMLInputElement} input
+	 * @param {number} convID
+	 */
+	listenToInputChangeEvents: async function(input, convID) {
+		let last_update = 0;
+
+		input.addEventListener("keyup", e => {
+			if(input.value == "")
+				return;
+
+			const t = ComunicDate.time();
+			if (t - last_update < ServerConfig.conf.conversation_writing_event_interval)
+				return;
+
+			last_update = t;
+			ws("conversations/writing", {convID: convID});
+		});
+	},
+
 }
 
 ComunicWeb.components.conversations.utils = ConversationsUtils;

assets/js/pages/conversations/conversation.js

@@ -465,6 +465,9 @@ const ConversationPageConvPart = {
 		inputText.maxLength = ServerConfig.conf.max_conversation_message_len;
 		inputText.focus();
 
+		// Notify other users when this user is writing a message
+		ConversationsUtils.listenToInputChangeEvents(inputText, this._conv_info.id)
+
 
 		//Enable textarea 2.0 on the message
 		var textarea2 = new ComunicWeb.components.textarea();

assets/js/typings/ServerConfig.d.ts

@@ -36,4 +36,6 @@ declare interface StaticServerConfig {
     max_conversation_message_len: number,
     allowed_conversation_files_type: String[],
     conversation_files_max_size: number,
+    conversation_writing_event_interval: number,
+    conversation_writing_event_lifetime: number,
 }