private messenger chat

[dj]

I have the standard chat complemented to send private messages.

Type the recipient_NAME in the TO field.
Only you and the recipient can see the message.



Features:
V1.0: do it serversite; todo: add field sendto to make it easier
  1.1: add field sendto to make it easier
  1.2: show when a user leave the chat (Exit); todo: show users in the chat
  1.3: show users in the chat (doubleclick in TO field); todo: show when user changed NAME
  1.4: done all in only one template to make it easier
  1.5: show when user changed NAME
  1.6: mark receipt messages ✓; disable log; todo:choose color
  1.7: choose color (chrome)
  1.8: check Name in use
  2.0: check Name is account (safety)
  2.1: add smileys ☺
  2.2: done with iframe (add New link to chat.htm)
  2.3: group chat (seperate names with ; )
  3.0: without TO field, low traffic, ajax
  3.1: use as guestbook (link to chat.htm?ACCOUNT); show account notes
  4.0: use server push (not IE, beta, todo:smileys)
  4.2: add some ideas from XCanG
  4.3: faster, PM,igno,notify
  4.4: works with IE (fallback to polling)
  4.5: group chat (enter groupname: text)

[dj]

extract the downloaded zip
Add folder from disk (as real folder) in hfs
Navigate to chat.htm in browser

[XCanG]

v3.1

About formatting, it is possible to format:

Code: [Select]

[time] <name> textJust because if I use [ or ] char, text in chat will be adding at end every time it update. I thing problem in regex and in this line in hfs.diff.tpl

Code: [Select]

{. if | {.?delta.} | {:{.regexp|\r?\n|var=chattext|replace=<br>.}{.regexp|(.*){.?delta.}.*|var=chattext|replace=$1.}{.^chattext.}:} .}But I try to think how it work and do not understand. {.^chattext.} at the lasi is the main text (if I don't use it - text don't appear), so may be problem in \r?\n or (.*){.?delta.}.*
First is Enter symbol, second I don't know (because don't know on that replace {.?delta.} string).

Anybody know how it fix for [] character?

[dj]

I don't understand, what you mean with [ or ] char.
Enter  [] character in text field works.
\r?\n is a linebreak (https://en.wikipedia.org/wiki/Newline)

[XCanG]

I don't understand, what you mean with [ or ] char.
Enter  [] character in text field works.
\r?\n is a linebreak (https://en.wikipedia.org/wiki/Newline)

Try this hfs.diff.tpl:

Code: [Select]

{.comment | <!-- Define special:begin -->.}
{.set | pass | !clear .}
{.if | {.regexp|{.?room.};|{.get|accounts.};.}| {:{.set | room |{.?room.}.}:} .}
{.set | chatfile | %folder%chat_{.^room.}.txt .}
{.set | chattext | {.load|{.^chatfile.} .} .}
{.set| maxlength | 10240.}

{.comment | <!-- Limit Length of file and reset it when pass is given -->.}
{.if|{.length | {.^chattext.} .}>{.^maxlength.}|
  {. set | chattext |{.cut||{.div|{.^maxlength.}|2.}|{.^chattext.} .}/set.}
 /if.}
{.if|{.?text={.^pass.}.}|{:{.save | {.^chatfile.}|.}:}.}

{.comment | <!-- Save chat file on hard drive -->.}

{.if| {.and|{.?name.}|{.?text.}|{.not| {.?text={.^pass.}.}.}/and.}
     |{:
          {.set | chattext |</b>&gt; {.?text.}
{.^chattext.}.}
{.if | {.=|{.?name.}|%user%.}| {:{.set | chattext |&#8505;{.^chattext.}.}:} .}
          {.set | chattext |&#91;{.time.}&#93; &lt;<b>{.?name.}{.^chattext.}.}
          {.save | {.^chatfile.}|{.^chattext.} /save.}
      :}
/if.}

{. if | {.?delta.} | {:{.regexp|\r?\n|var=chattext|replace=<br>.}{.regexp|(.*){.?delta.}.*|var=chattext|replace=$1.}{.^chattext.}:} .}
{. if | {.?info.} | {.get account | {.?info.} | notes.} .}
{. if | {.?user.} | %user% .}
{.comment | {. if | {.and|{.?name.}|{.?text.}|{.not| {.?delta.}.}.} | message sent .}.}
{. if | {.?del.} | {:{.regexp|^\s?{.?del.} &#8212; .*$\r?\n?|var=chattext|replace=.}{.save | {.^chatfile.}|{.^chattext.}.}:} .}

[dj]

I tried your template and understand now your problem.
Try first without modifying the time.
You can modify the  --- in line 21 and last line(30). Must both be the same!

[XCanG]

I tried your template and understand now your problem.
Try first without modifying the time.
You can modify the  --- in line 21 and last line(30). Must both be the same!

Before use this variant I use long dash "—" and it's work fine. Just type & # 8 2 1 2 ; on place "---"

[dj]

Added a new version
4.0: use server push (not IE, beta, todo:smileys)

[XCanG]

Hm, no way to save history? May be use chat.txt + history.txt
When user open page he's loading history.txt
Also this is better to use:

Code: [Select]

txt=document.querySelector("input").value+": <span style=\"color:"+encodeURIComponent(col.value)+";\">"+txt+"</span>"
Woops, I writed it for 4.0. But also think about quotes in style=""

For 4.1:

Code: [Select]

txt=document.querySelector("input").value+": "+encodeURIComponent('<span style=\"color:'+col.value+';\">'+txt+"</span>")

[XCanG]

Hm, this method have strange long updating after I send messange and I think this is bad method. Just think: this chat no have history, so users need only reading chat in online, BUT because updating so long (about 5 sec), think if chat using 10 users, so in one second 2 users (No.1 and No.2) send message, in next second send another user (No.3), but some people recieve message one of user in group of first two (No.2>>No.1), read and send answer (No.4), some people in other time request to recieve message and recieve message user No.3 send him answer (No.5). So user No.4 recieve message user No.5, but user No.5 recieve only his message. Just because every new message replace in chat.txt all content.

I think this is bad method, because chat requires instant messaging and staying in chat (no have history), but if users accept the terms, if chat call high speed traffic then it will not cope with this problem. It's like it is not working.

P.S. sorry for my English, I think I write this text bad.

[dj]

Hi  XCanG,
thanks for review.
This is indeed a problem. Fixed with V4.2
It's a beta and should demonstrate Server-Sent Events.
No history. See it positive. No data are saved on the server. No CIA. ☺ (You can look in the log file)

Update: The history is 0.0001days=8.64sec. Change the time in the server tpl to 0.001, then you have 86sec.

[XCanG]

Hi dj, but also think: what chat needed in HFS? Needed chat where users can open chat page (or see in left panel), see that other users or anonymous saying, say something if needed. Users need to be highlighted (like v3.1), so all people can understand this user staying in server or not (one-time random user), PM is also important, it the way saying to server admin some information, that need to transmit (because user don't know how to contact admin by mail, or messenger or other site) and admin can reading his special history file (chat_admin.txt for example). Or just chatting between anon→user or user→user.
About template. I think need to use template rather, than chat.htm, because in template you can use HFS logic. For example (also important note) user nick. If user=anon - he can use input field to come up with nickname, if user logined he/she don't view input, but sending on his own nick.

Just see this logic: (I use it to add registration field if user don't logined)

Code: [Select]

1 <h3><img src="/~img27">{.!Account.}</h3>
2 <div id='login' align="right">
3 {.if| %user% |{:%user%
4 <br/>{.if|{.can change pwd.} |
5 <button onclick='changePwd.call(this)'>{.!Change password.}</button>
6 .} <button onclick='location.href="~login"'>Logout</button>
7 :}
8 | <a href="#" onclick="location.href='~login';">Login</a>
9 <br><div id='registration'><a href="#" title="1 click — extend
2 click — shrink" onclick='regform()'>Register</a>
11 <div id='susp' class='hiddenr popupr'></div></div>
12 <script type="text/javascript">
13 function regform() {
14 var str = '\
15 {.if|{.{.postvar|modid.}=mod.roessi.register.}|{:\
16 {.if|{.and|{.postvar|name.}|{.postvar|password.}.}|{:\
17 {.if|{.{.postvar|password.}={.postvar|confirmpass.}.}|{:\
18 <div>You account:<br>{.postvar|name.} has been created compleately.</div>\
19 {.add to log|%ip% creating account with name {.postvar|name.}.}\
20 {.new account|{.postvar|name.}|password={.postvar|password.}|enabled={.modopt|mod.roessi.register|enabled.}|member of=Autoreg|notes=Autoreg.}\
21 {.for each|#access|{.femodsection|access|/|.}|{:{.set item|{.^#access.}|add access={.postvar|name.}.}:}.}\
22 {.for each|#upload|{.femodsection|upload|/|.}|{:{.set item|{.^#upload.}|add upload={.postvar|name.}.}:}.}\
23 {.for each|#delete|{.femodsection|delete|/|.}|{:{.set item|{.^#delete.}|add delete={.postvar|name.}.}:}.}\
24 :}.}\
25 :}.}\
26 :}.}\
27 {.if not|{.postvar|modid.}|{:\
28 <form method="post" name="register">\
29 Nick:\
30 <input type="text" name="name" class="textbox"><br>\
31 Password:\
32 <input type="password" name="password" class="textbox"><br>\
33 Confirm password:\
34 <input type="password" name="confirmpass" class="textbox">\
35 <input type="hidden" name="modid" value="mod.roessi.register">\
36 <input type="submit" action="" value="Registration">\
37 :}.}\
38 ';
39 document.getElementById('susp').innerHTML = str;
40 }
41 </script>
42 .}
43 </div>And see at line 3,7,8,42. This is simple checking if user logined. You can also write template like that (example later).

Also, I do some changes in chat.htm

...
<body>
   <div>Name <input type="text"><input type="color" style="height: 28px;">
   <span onclick='document.querySelector("input[title=text]").value+="&amp;#"+event.target.textContent.charCodeAt(0)+";"; document.getElementById("text").focus();'>
   <span>&#9786;</span><span>&#9785;</span><span>&hearts;</span></span></div>
   <input id="text" type="text" size="60"  onkeydown="return returnpress(event);" title="text">
   <section>You are joined in chat.</section>

   <script>
function returnpress(event) {if (event.which == 13 || event.keyCode == 13) {send(document.getElementById("text").value); document.getElementById("text").value=""; return false;} return true;}

if(typeof(EventSource) == "undefined") alert("browser don't support SSE")
var t0, sec=document.querySelector("section"), col=document.querySelector("input[type=color]"), source = new EventSource("server/")
source.onmessage = function(event) {show(event.data)}

function send(txt) {
   txt=document.querySelector("input").value+"~=~ "+encodeURIComponent('<span style=\"color:'+col.value+';\">'+txt+"</span>")
   var xhr = new XMLHttpRequest()
   //xhr.onload = function() { }
   xhr.open("GET", "server/?text="+txt)
   //xhr.responseType = ""
   xhr.send()
}

function show(txt) {var d=new Date(); if(txt!=t0) sec.innerHTML="["+("0"+d.getHours().toLocaleString()).slice(-2)+":"+("0"+d.getMinutes().toLocaleString()).slice(-2)+":"+("0"+d.getSeconds().toLocaleString()).slice(-2)+"] \&lt;"+txt.replace(/~=~/g, "&gt;")+"<br/>"+sec.innerHTML; t0=txt}
</script>
</body>
</html>

1) First problem, that I found if I post smile in text field, it can't send if we don't typing nothing else, but if I use Enter checking, it work good.
2) If we click on smiles we lost focus and input can send without our permission, but method 1 solve this problem and I adding focus changing (after we post smile we back to input and can write easely)
3) Change formatting in fast chat (we don't see days, month, year) to this: [HH:mm:ss]. I think we need see y, m and d only if it changing, i.e. if time go to 24:00:00→00:00:00 in chat writed empty string with text: "Date DD.MM.YYYY"
Also please ignore ~=~, \&lt, .replace(/~=~/g, "&gt;"). This is trix to format chat that I need [HH.mm.ss] <nick> text. I say about it earlier.

Now about example. If we use hfs.diff.tpl instread of chat.htm, and use same code, but with some changes:

Code: [Select]

{.if| %user% |{:<div><input type="text" style="display:none;" value="%user%">:}|<div>Name <input type="text">.}<input type="color" style="height: 28px;">(first line after <body>)
See at the result. (Of course you need to test without login and with login.)

[username1565]

I did try to using all versions.
Versions V4.5 and V4.6 not have chat.htm in archive.

Only v2.4 working (from chatneu folder inside):
1. Unzip v2.4.
2. add chatneu folder to HFS as real folder.
3. go to http://IP:port/chatneu/chat.htm
4. name: user, text: "test from user".
Now I can check chat.txt file content, in the added folder "chatneu".

Test public chat:
1. Go from another computer to http://IP:port/chatneu/chat.htm
2. User: testuser, see messages from user.
3. text: "test from testuser".
User and testuser see this. OK.

But in this template I see an "..."-error.

Test private messages:
1. Name: user -> to testuser; text -> "test private message from user to testuser"
2. user see this message, testuser see "..."
3. Response from testuser: test -> "Do not see your message, user!"
4. testuser see his message, user see "..."
Chat history for user:

26.07.2018 19:48:30 --- testuser>> ...
26.07.2018 19:47:47 ---  user>>testuser test private message from user to testuser
26.07.2018 19:46:35 --- testuser> test from testuser
26.07.2018 19:46:26 --- testuser hat den Chat betreten.
26.07.2018 19:45:21 ---  user> test from user
26.07.2018 19:44:57 --- user hat den Chat betreten.

Chat history for testuser:

26.07.2018 19:48:30 --- testuser>>user Do not see your message, user!
26.07.2018 19:47:47 --- user>> ...
26.07.2018 19:46:35 --- testuser> test from testuser
26.07.2018 19:46:26 --- testuser hat den Chat betreten.
26.07.2018 19:45:21 --- user> test from user
26.07.2018 19:44:57 --- user hat den Chat betreten.

chat.txt content in chatneu folder:

26.07.2018 19:39:38 --- <b>testuser</b>&gt;  <span style="color:#000000">Do not see your message, user!</span><br>
 26.07.2018 19:38:46 --- <b>user</b>&gt; >testuser <span style="color:#000000">testing testuser</span><br>
 26.07.2018 19:38:09 --- <b>testuser</b>&gt;  <span style="color:#000000">test message from testuser</span><br>
 26.07.2018 19:37:59 --- <i> testuser hat den Chat betreten.</i><br>
 26.07.2018 19:37:20 --- <b>user</b>&gt;  <span style="color:#000000">test</span><br>
 26.07.2018 19:36:55 --- <i> user hat den Chat betreten.</i><br>

As you can see, when one user write to another user the private message,
this user can see this message, but another user saw "...".
Message not displaying for another user and users cann't read private messages,
but in file chat.txt this data is exists.

I see chat.htm in v3.1, but there is no any TO field, and old chat.htm not working
(cann't fill name and don't see prompt to do this.)
Can anyone fix this?

Also, How to using another versions with chat.htm? This file no found there...
Is this possible?

P.S.:
First idea that I have to display private message - download using XHR,
the file chat.txt from "chatneu" folder, and parse this file on client side using JS.
But in this case anyone can read private messages.

So this can be encrypted by assymetric encryption, using JS NaCl (like toxcore),
and "libsodium" JS library, for example, and saved as hex in the chat.txt.
There can be generated public key by passphrase.
Here you can see static public and secret key from static seed "hello":

Keypair - from seed (Uint8Array) "hello" in HEX:
Secret key: 9B71D224BD62F3785D96D46AD3EA3D73319BFBC2890CAADAE2DFF72519673CA7
Public key: D8333ECF53DAC465D59F3B03878CEFF88947EEC57C965105A049A0F5F1B7A510

And also you can see there and example of assimetryc encryption and decription.
sha256-hash
from username and password (need to add, then),
can be seed string to generate nacl keypair,
and when username connected to the chat, then he can share his public key to anyone else.
In this case, any user who write to him private message, can do encryption of this message,
using public key of this user. Result can be saved as encrypted hex in chat.txt.
Then, user can do client-side JavaScript decryption of this message,
by using his temporary secret private key.

Best regards.