Skip to content

Commit 51a6265

Browse files
tomFlidrtomFlidr
committed
updates after testing and refactoring
1 parent 3a72f07 commit 51a6265

17 files changed

+493
-404
lines changed

‎README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,9 +17,9 @@ npm update
1717
node server.js
1818
```
1919
- open your first web browser on:
20-
- http://localhost:8000/chat/
20+
- http://localhost:8000/
2121
- login with any user and password located in `./chat/data/login-data.csv`
2222
- open your second web browser on:
23-
- http://localhost:8000/chat/
23+
- http://localhost:8000/
2424
- login with any user and password located in `./chat/data/login-data.csv`
2525
- chat between browsers

‎chat/css/style.css

Lines changed: 51 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -85,13 +85,14 @@ form.login-form input[type=submit]{
8585
margin:10px;
8686
}
8787
.messages{
88-
overflow-y: auto;
89-
position: absolute;
90-
top: 0px;
91-
bottom: 0px;
92-
width: 100%;
93-
height: 100%;
94-
overflow-x: hidden;
88+
overflow-y: auto;
89+
position: absolute;
90+
top: 0px;
91+
bottom: 0px;
92+
width: 100%;
93+
height: calc(100% - 25px);
94+
padding-top: 25px;
95+
overflow-x: hidden;
9596
}
9697

9798
.message.notify{
@@ -104,58 +105,58 @@ form.login-form input[type=submit]{
104105
}
105106
.message.content.current{
106107
float: right;
107-
text-align: right;
108+
text-align: right;
108109
margin: 5px 10px 5px 10px;
109110
}
110111
.message.content.other{
111112
float: left;
112-
text-align: left;
113+
text-align: left;
113114
margin: 5px 0 5px 10px;
114115
}
115116
.message.content{
116117
clear:both;
117118
}
118119
.message.content div{
119120
min-width: calc(100% - 43px);
120-
position: relative;
121-
display: inline-block;
122-
padding: 8px 21px 8px 10px;
123-
text-align: left;
124-
border-radius: 10px;
125-
color: #fff;
126-
vertical-align: top;
121+
position: relative;
122+
display: inline-block;
123+
padding: 8px 21px 8px 10px;
124+
text-align: left;
125+
border-radius: 10px;
126+
color: #fff;
127+
vertical-align: top;
127128
}
128129
.message.content.current div{
129-
box-shadow: inset 0 0 1px #007aff;
130-
background-color: #007aff;
130+
box-shadow: inset 0 0 1px #007aff;
131+
background-color: #007aff;
131132
}
132133
.message.content.other div{
133-
box-shadow: inset 0 0 1px #00a617;
134-
background-color: #00a617;
134+
box-shadow: inset 0 0 1px #00a617;
135+
background-color: #00a617;
135136
}
136137
.message.content div:before{
137-
content: "";
138-
position: absolute;
139-
top: 4px;
140-
width: 0;
141-
height: 0;
142-
border-top: solid transparent;
143-
border-bottom: 4px solid transparent;
138+
content: "";
139+
position: absolute;
140+
top: 4px;
141+
width: 0;
142+
height: 0;
143+
border-top: solid transparent;
144+
border-bottom: 4px solid transparent;
144145
}
145146
.message.content.current div:before{
146-
right: -5px;
147-
border-left: 7px solid #007aff;
147+
right: -5px;
148+
border-left: 7px solid #007aff;
148149
}
149150
.message.content.other div:before{
150-
left: -5px;
151-
border-right: 7px solid #00a617;
151+
left: -5px;
152+
border-right: 7px solid #00a617;
152153
}
153154
.message.content span{
154155
font-weight: normal;
155-
font-size: 10px;
156-
color: #f60;
157-
overflow: hidden;
158-
display: block;
156+
font-size: 10px;
157+
color: #f60;
158+
overflow: hidden;
159+
display: block;
159160
}
160161
.message.notify span{
161162
display: hidden;
@@ -170,10 +171,10 @@ form.message-form{
170171
}
171172
form.message-form .message-cont{
172173
position:absolute;
173-
left:10px;
174-
top:10px;
175-
bottom:50px;
176-
right:calc(20% + 10px + 10px + 10px);
174+
left:10px;
175+
top:10px;
176+
bottom:50px;
177+
right:calc(20% + 10px + 10px + 10px);
177178
}
178179
form.message-form .message-cont textarea{
179180
width:calc(100% - 10px);
@@ -183,14 +184,14 @@ form.message-form .message-cont textarea{
183184
}
184185
form.message-form .recepients{
185186
position: absolute;
186-
color: #fff;
187-
bottom: 13px;
188-
left: 10px;
187+
color: #fff;
188+
bottom: 13px;
189+
left: 10px;
189190
overflow:hidden;
190191
}
191192
form.message-form .recepients div{
192193
float: left;
193-
margin-right: 20px;
194+
margin-right: 20px;
194195
}
195196
form.message-form button{
196197
position:absolute;
@@ -200,18 +201,18 @@ form.message-form button{
200201
width:20%;
201202
border:1px solid #c5c5c9;
202203
border-radius:4px;
203-
font-size:130%;
204+
font-size:130%;
204205
}
205206

206207
audio#msg-sound {
207208
display:none;
208209
}
209210
div.typing-users-cont{
210-
position: absolute;
211-
color: white;
212-
bottom: 10px;
213-
right: 10px;
214-
white-space: nowrap;
215-
font-size: 70%;
211+
position: absolute;
212+
color: white;
213+
bottom: 10px;
214+
right: 10px;
215+
white-space: nowrap;
216+
font-size: 70%;
216217
display: none;
217218
}

‎chat/js/message.mp3 renamed to ‎chat/data/message.mp3

File renamed without changes.

‎favicon.ico renamed to ‎chat/favicon.ico

File renamed without changes.

‎chat/index.html

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -56,12 +56,12 @@
5656

5757
</div>
5858

59-
<audio id="msg-sound" src="js/message.mp3" />
59+
<audio id="msg-sound" src="data/message.mp3" />
6060

61-
<script type="text/javascript" src="js/class.dev.js"></script>
62-
<script type="text/javascript" src="js/ajax.min.js"></script>
63-
<script type="text/javascript" src="js/socket-wrapper.js"></script>
64-
<script type="text/javascript" src="js/client.js"></script>
61+
<script type="text/javascript" src="js/client/class.dev.js"></script>
62+
<script type="text/javascript" src="js/client/ajax.min.js"></script>
63+
<script type="text/javascript" src="js/client/socket-wrapper.js"></script>
64+
<script type="text/javascript" src="js/client/client.js"></script>
6565

6666
</body>
6767
</html>

0 commit comments

Comments
 (0)