diff --git a/tests_hugo/chat_node/chat_client/chat.html b/tests_hugo/chat_node/chat_client/chat.html index 06a0aa86..de03bc6e 100644 --- a/tests_hugo/chat_node/chat_client/chat.html +++ b/tests_hugo/chat_node/chat_client/chat.html @@ -392,14 +392,9 @@
-
+
diff --git a/tests_hugo/chat_node/chat_client/chat_add_msg.js b/tests_hugo/chat_node/chat_client/chat_add_msg.js index 5cbd2028..cc35d085 100644 --- a/tests_hugo/chat_node/chat_client/chat_add_msg.js +++ b/tests_hugo/chat_node/chat_client/chat_add_msg.js @@ -2,10 +2,6 @@ const add_message = (from, message ) => { const div_thread = document.getElementById('chat_api_msg_thread'); - //console.log("received message:"); - //console.log(`[${message}]`); - - // TODO : find the best and secure way to create element with svelte div_thread.appendChild(build_new_message(from, message)); } @@ -20,9 +16,7 @@ const build_new_message = (from, message) => { p_msg.classList.add("msg"); p_name.appendChild(document.createTextNode(from + " :")); - //p_msg.appendChild(document.createTextNode(message)); - // tmp, bad security practice : - p_msg.innerHTML = message; + p_msg.appendChild(document.createTextNode(message)); div.appendChild(p_name); div.appendChild(p_msg); diff --git a/tests_hugo/chat_node/chat_client/chat_send_msg.js b/tests_hugo/chat_node/chat_client/chat_send_msg.js index 62620ee2..14c0c892 100644 --- a/tests_hugo/chat_node/chat_client/chat_send_msg.js +++ b/tests_hugo/chat_node/chat_client/chat_send_msg.js @@ -1,12 +1,10 @@ function send_msg() { const div_msg = document.getElementById('chat_msg_write'); -//console.log(div_msg.innerHTML); let msg = ""; if (div_msg.localName === "div") { - //msg = div_msg.innerText.trim(); - msg = div_msg.innerHTML; + msg = div_msg.innerText.trim(); div_msg.innerText = ""; } else if (div_msg.localName === "textarea") @@ -16,6 +14,8 @@ function send_msg() } div_msg.focus(); + console.log(msg); + if (msg.length > 0) { socket.emit('sendmsg', msg); add_message("me", msg); @@ -24,92 +24,9 @@ function send_msg() function send_msg_if(evt) { -//console.log("evt:"); -//console.log(evt); - // https://developer.mozilla.org/en-US/docs/Web/Events/Creating_and_triggering_events - /* - let test = new Event('test'); - let test = new evt; - let test = new Event('keypress'); -console.log("test:"); -console.log(test); -// test = evt; - test = structuredClone(evt); -console.log("test:"); -console.log(test); -// test = Object.setPrototypeOf(test, evt); -// test = Object.create(evt); -//console.log("test:"); -//console.log(test); - Object.defineProperty(evt, 'shiftKey', {value: false}); -console.log("evt:"); -console.log(evt); - */ - - // change height of textarea according to content - //evt.target.style.height = evt.target.scrollHeight + "px"; - -/* - if (evt.key !== "Enter") - return; - evt.preventDefault(); - if (evt.shiftKey === false) - send_msg(); - -// alternative: - if (evt.shiftKey === true) - return; - evt.preventDefault(); - send_msg(); -*/ - if (evt.shiftKey && evt.key === "Enter") { evt.preventDefault(); send_msg(); } - -// else -// { -// //console.log(evt.target); -// //console.log(evt.target.value); -// //console.log(evt.target.innerText); -// // https://stackoverflow.com/questions/2490825/how-to-trigger-event-in-javascript/20548330#20548330 -// //evt.target.dispatchEvent(new Event('Enter')); -// //evt.target.dispatchEvent(new CustomEvent('keypress', { -// // charCode: 13, -// // key: "Enter", -// // keyCode: 13, -// //})); -// -// //let start = evt.target.selectionStart; -// //console.log("start:"); -// //console.log(start); -// //let end = evt.target.selectionEnd; -// //console.log("end:"); -// //console.log(end); -// //console.log("evt.selectionStart:"); -// //console.log(evt.selectionStart); -// -// //evt.preventDefault(); -// //console.log("document.getSelection():"); -// //console.log(document.getSelection()); -// //document.getSelection().insertText('\n'); -// -// const range = document.getSelection().getRangeAt(0); -// const div = document.createElement('div'); -// div.innerHTML = '
'; -// range.insertNode(div); -// range.setStartAfter(div); -// range.setEndAfter(div); -// document.getSelection().removeAllRanges(); -// document.getSelection().addRange(range); -// -// /* -// document.execCommand('insertLineBreak'); -// document.execCommand('insertHTML', false, '

'); -// */ -// -// return; -// } } diff --git a/tests_hugo/chat_node/chat_client/style/chat_msg.css b/tests_hugo/chat_node/chat_client/style/chat_msg.css index 5d7180a6..76aa5e16 100644 --- a/tests_hugo/chat_node/chat_client/style/chat_msg.css +++ b/tests_hugo/chat_node/chat_client/style/chat_msg.css @@ -1,3 +1,4 @@ + #chat_box #chat_panel_msg { flex-direction: column-reverse; overflow: scroll; @@ -21,7 +22,6 @@ /* * * * * * * * * * * * * * ALL MSG */ - #chat_box #chat_panel_msg #chat_api_msg_thread .chat_msg { margin-left: 0px; background-color: rgb(210, 210, 210); @@ -47,7 +47,6 @@ /* * * * * * * * * * * * * * MSG PERSO */ - #chat_box #chat_panel_msg #chat_api_msg_thread .chat_msg.me { margin-right: 0px; margin-left: auto; @@ -61,7 +60,6 @@ /* * * * * * * * * * * * * * MSG SERVER */ - #chat_box #chat_panel_msg #chat_api_msg_thread .chat_msg.SERVER { margin-left: auto; background-color: transparent; diff --git a/tests_hugo/chat_node/chat_client/style/chat_write.css b/tests_hugo/chat_node/chat_client/style/chat_write.css index 77188d81..bef5b542 100644 --- a/tests_hugo/chat_node/chat_client/style/chat_write.css +++ b/tests_hugo/chat_node/chat_client/style/chat_write.css @@ -15,18 +15,8 @@ border: 1px solid black; } #chat_box .chat_item#chat_panel_write .text_area * { - /* - margin-left: 0px; - */ display: block ruby; } -/* -#chat_box .chat_item#chat_panel_write .text_area br { - margin-top: 10px; -} -#chat_box .chat_item#chat_panel_write .text_area div { -} -*/ /* if .text_area is a contenteditable div */ #chat_box .chat_item#chat_panel_write .text_area {