... | ... |
@@ -9,10 +9,14 @@ class Xmpp.Views.Chat.MessageView extends Backbone.View |
9 | 9 |
|
10 | 10 |
@user = parts.user |
11 | 11 |
@dateSent = parts.date |
12 |
+ @fromMe = parts.fromMe |
|
12 | 13 |
@message = parts.message |
13 | 14 |
|
14 | 15 |
render: -> |
15 | 16 |
$(@el).html(@template(username: @user.get('name'), avatar: @user.get('avatar'), date: @formatTime(), message: @message)) |
17 |
+ if @fromMe |
|
18 |
+ $(@el).addClass('me') |
|
19 |
+ |
|
16 | 20 |
return this |
17 | 21 |
|
18 | 22 |
formatTime: -> |
... | ... |
@@ -71,10 +71,10 @@ class Xmpp.Views.Chat.WindowView extends Backbone.View |
71 | 71 |
# @log(eventView) if logMe == true |
72 | 72 |
|
73 | 73 |
appendMessage: (user, date, msg) -> |
74 |
- messageView = new Xmpp.Views.Chat.MessageView(user: user, date: date, message: msg) |
|
74 |
+ messageView = new Xmpp.Views.Chat.MessageView(user: user, date: date, message: msg, fromMe: user.get('jid') == App.Models.me.get('jid')) |
|
75 | 75 |
$(@el).find('.messages').append(messageView.render().el) |
76 |
- App.UI.resizeMessages() |
|
77 | 76 |
@log(messageView) |
77 |
+ Backbone.Events.trigger('resizeWorkspace') |
|
78 | 78 |
|
79 | 79 |
log: (view) -> |
80 | 80 |
if (@historyStack.length + 1 >= @maxHistoryLength) |
... | ... |
@@ -166,10 +166,8 @@ |
166 | 166 |
|
167 | 167 |
.avatar { |
168 | 168 |
float: left; |
169 |
- |
|
170 | 169 |
height: 32px; |
171 | 170 |
width: 32px; |
172 |
- |
|
173 | 171 |
margin-right: 8px; |
174 | 172 |
|
175 | 173 |
&.bigger { |
... | ... |
@@ -214,7 +212,7 @@ |
214 | 214 |
|
215 | 215 |
img { |
216 | 216 |
height: 32px; |
217 |
- |
|
217 |
+ border-radius: 5px; |
|
218 | 218 |
margin: 0 auto; |
219 | 219 |
display: block; |
220 | 220 |
} |
... | ... |
@@ -503,7 +501,7 @@ |
503 | 503 |
} |
504 | 504 |
|
505 | 505 |
.message-box { |
506 |
- width: 75%; |
|
506 |
+ width: 580px; |
|
507 | 507 |
color: #393939; |
508 | 508 |
background: $bg-roster; |
509 | 509 |
border: 1px solid $gray-light; |
... | ... |
@@ -513,6 +511,11 @@ |
513 | 513 |
margin-left: 45px; |
514 | 514 |
position: relative; |
515 | 515 |
|
516 |
+ &.me { |
|
517 |
+ border-right: 4px solid $app-color; |
|
518 |
+ width: 577px; |
|
519 |
+ } |
|
520 |
+ |
|
516 | 521 |
&::after, &::before { |
517 | 522 |
content: ''; |
518 | 523 |
display: block; |