Merge pull request #217 from NodeBB/group-chat

Group chat
main
Barış Soner Uşaklı 9 years ago
commit fb022fea61

@ -41,7 +41,7 @@
}
.username {
font-size: 18px;
font-size: 14px;
&:after {
display: inline-block;
@ -54,9 +54,6 @@
.teaser-timestamp {
font-size: 10px;
position: absolute;
top: 8px;
right: 24px;
}
a {

@ -17,7 +17,6 @@
img, .user-icon {
.user-icon-style(@border-radius: 50%);
float: left;
}
a {

@ -2,12 +2,12 @@ define('persona/chats', ['components', 'forum/chats'], function(components, core
var Chats = {};
Chats.init = function() {
components.get('chat/recent').off('click').on('click', 'li', function(e) {
components.get('chat/recent').off('click').on('click', '[component="chat/recent/room"]', function(e) {
var env = utils.findBootstrapEnvironment();
if (env === 'xs' || env === 'sm') {
app.openChat($(this).attr('data-username'), $(this).attr('data-uid'));
app.openChat($(this).attr('data-roomid'));
} else {
coreChats.switchChat(parseInt($(this).attr('data-uid'), 10), $(this).attr('data-username'));
coreChats.switchChat($(this).attr('data-roomid'));
}
});
};

@ -2,15 +2,17 @@
<div id="chat-modal" class="chat-modal hide" tabindex="-1" role="dialog" aria-labelledby="Chat" aria-hidden="true" data-backdrop="none">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button id="chat-close-btn" type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<button type="button" class="close" data-action="maximize"><span aria-hidden="true"><i class="fa fa-expand"></i></span><span class="sr-only">[[modules:chat.maximize]]</span></button>
<h4>
<i component="user/status" class="fa fa-circle status offline" title="[[global:offline]]"></i>
[[modules:chat.chatting_with]]
<span class="user-typing hide"><i class="fa fa-keyboard-o fa-fw"></i></span>
</h4>
<h4>[[modules:chat.chatting_with]]</h4>
<div class="users-tag-container inline-block">
<input class="users-tag-input" type="text" class="form-control" placeholder="enter users here" tabindex="4"/>
</div>
</div>
<div class="modal-body">
<span class="since-bar">
<a href="#" class="selected" data-since="recent">[[recent:title]]</a> &bull; <a href="#" data-since="week">[[modules:chat.seven_days]]</a> &bull; <a href="#" data-since="month">[[modules:chat.thirty_days]]</a> &bull; <a href="#" data-since="threemonths">[[modules:chat.three_months]]</a></span>

@ -4,12 +4,23 @@
<div class="row">
<div class="col-md-4">
<ul component="chat/recent" class="chats-list" data-nextstart="{nextStart}">
<!-- BEGIN chats -->
<!-- IMPORT partials/chat_contact.tpl -->
<!-- END chats -->
<!-- BEGIN contacts -->
<!-- IMPORT partials/chat_contact.tpl -->
<!-- END contacts -->
<!-- BEGIN rooms -->
<li component="chat/recent/room" data-roomid="{rooms.roomId}" class="<!-- IF ../unread -->unread<!-- ENDIF ../unread -->">
<div data-username="{rooms.lastUser.username}" data-uid="{rooms.lastUser.uid}">
<!-- IF rooms.lastUser.picture -->
<img class="user-img" src="{rooms.lastUser.picture}">
<!-- ELSE -->
<div class="user-icon user-img" style="background-color: {rooms.lastUser.icon:bgColor};">{rooms.lastUser.icon:text}</div>
<!-- ENDIF rooms.lastUser.picture -->
<i component="user/status" title="[[global:{rooms.lastUser.status}]]" class="fa fa-circle status {rooms.lastUser.status}"></i>
<span class="username">{rooms.usernames}</span>
</div>
<span class="teaser-content">{rooms.teaser.content}</span>
<span class="teaser-timestamp timeago pull-right" title="{rooms.teaser.timestampISO}"></span>
</li>
<!-- END rooms -->
</ul>
</div>
@ -19,12 +30,15 @@
[[error:chat-restricted]]
</div>
<!-- ENDIF !allowed -->
<!-- IF meta -->
<div component="chat/messages" class="expanded-chat" data-uid="{meta.uid}" data-username="{meta.username}">
<!-- IF roomId -->
<div component="chat/messages" class="expanded-chat" data-roomid="{roomId}">
<button type="button" class="close" data-action="pop-out"><span aria-hidden="true"><i class="fa fa-compress"></i></span><span class="sr-only">[[modules:chat.pop-out]]</span></button>
<h1 component="chat/title">{meta.username}</h1>
<h4 component="chat/title">[[modules:chat.chatting_with]]</h4>
<div class="users-tag-container">
<input class="users-tag-input" type="text" class="form-control" placeholder="enter users here" tabindex="4"/>
</div>
<span class="since-bar"><a href="#" class="selected" data-since="recent">[[recent:title]]</a> &bull; <a href="#" data-since="week">[[modules:chat.seven_days]]</a> &bull; <a href="#" data-since="month">[[modules:chat.thirty_days]]</a> &bull; <a href="#" data-since="threemonths">[[modules:chat.three_months]]</a></span>
<ul class="chat-content">
@ -41,6 +55,6 @@
<div class="alert alert-info">
[[modules:chat.no-messages]]
</div>
<!-- ENDIF meta -->
<!-- ENDIF roomId -->
</div>
</div>

@ -1,4 +1,4 @@
<li data-username="{../username}" data-uid="{../uid}" class="<!-- IF ../unread -->unread<!-- ENDIF ../unread -->">
<div data-username="{../username}" data-uid="{../uid}">
<!-- IF ../picture -->
<img class="user-img" src="{../picture}">
<!-- ELSE -->
@ -6,6 +6,5 @@
<!-- ENDIF ../picture -->
<i component="user/status" title="[[global:{../status}]]" class="fa fa-circle status {../status}"></i>
<span class="username">{../username}</span>
<span class="teaser-content">{../teaser.content}</span>
<span class="teaser-timestamp timeago" title="{../teaser.timestampISO}"></span>
</li>
</div>
Loading…
Cancel
Save