Skip to content

Commit 5259505

Browse files
sampaiodiegosampaiodiego
committed
Merge pull request #9 from RocketChat/new-room-types
New room types
2 parents 91ae2fb + 5a0b787 commit 5259505

32 files changed

Lines changed: 522 additions & 154 deletions

‎client/stylesheets/base.less‎

Lines changed: 73 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
@import url(http://fonts.googleapis.com/css?family=Muli:400,300,500);
77
@footer-min-height: 70px;
88
@header-min-height: 60px;
9-
@rooms-box-width: 220px;
9+
@rooms-box-width: 260px;
1010
@primary-background-color: #0b1628;
1111
@secondary-background-color: #F4F4F4;
1212
@tertiary-background-color: #E9E9E9;
@@ -993,6 +993,78 @@ a.github-fork {
993993
direction: ltr;
994994
padding-left: 8px;
995995
}
996+
.nav-flex {
997+
background-color: lighten(@primary-background-color, 15%);
998+
position: fixed;
999+
top: 0;
1000+
left: 0;
1001+
z-index: 1000;
1002+
// padding-top: 15px;
1003+
width: @rooms-box-width;
1004+
// .calc(width, @rooms-box-width ~' - 10px');
1005+
.calc(height, ~'100% - ' @footer-min-height);
1006+
.transition(transform .3s cubic-bezier(.5, 0, .1, 1));
1007+
&._hidden {
1008+
.transform(translateX(-100%));
1009+
}
1010+
&.private-group-flex {
1011+
// background-color: #FFFFFF;
1012+
}
1013+
.close-nav-flex {
1014+
background-color: transparent;
1015+
border: none;
1016+
float: right;
1017+
color: #FFFFFF;
1018+
cursor: pointer;
1019+
line-height: @header-min-height;
1020+
}
1021+
h4 {
1022+
color: #FFFFFF;
1023+
text-align: center;
1024+
line-height: @header-min-height;
1025+
background-color: lighten(@primary-background-color, 10%);
1026+
}
1027+
.wrapper {
1028+
padding: 1em;
1029+
1030+
label {
1031+
color: #FFFFFF;
1032+
margin-top: 1em;
1033+
display: inline-block;
1034+
}
1035+
1036+
.selected-users {
1037+
min-height: 1em;
1038+
li {
1039+
background-color: #FFF;
1040+
display: inline-block;
1041+
border-radius: 3px;
1042+
padding: 4px;
1043+
margin: 1px 0;
1044+
i {
1045+
color: #000000;
1046+
cursor: pointer;
1047+
}
1048+
}
1049+
}
1050+
1051+
.buttons {
1052+
text-align: center;
1053+
margin-top: 1em;
1054+
}
1055+
}
1056+
}
1057+
h3 {
1058+
&.add-room {
1059+
&:hover {
1060+
color: #AAA;
1061+
}
1062+
i {
1063+
float: right;
1064+
margin-right: 0.5em;
1065+
}
1066+
}
1067+
}
9961068
}
9971069
.header {
9981070
position: absolute;

‎client/views/app/asideNav/channels.coffee‎

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
Template.channels.helpers
2+
tRoomMembers: ->
3+
return t('chatRooms.Members_placeholder')
4+
5+
rooms: ->
6+
return ChatSubscription.find { uid: Meteor.userId(), t: { $in: ['c']}, f: { $ne: true } }, { sort: 'rn': 1 }
7+
8+
selectedUsers: ->
9+
return Template.instance().selectedUsers.get()
10+
11+
name: ->
12+
return Template.instance().selectedUserNames[this.valueOf()]
13+
14+
autocompleteSettings: ->
15+
return {
16+
limit: 10
17+
# inputDelay: 300
18+
rules: [
19+
{
20+
# @TODO maybe change this 'collection' and/or template
21+
collection: 'UserAndRoom'
22+
subscription: 'roomSearch'
23+
field: 'name'
24+
template: Template.roomSearch
25+
noMatchTemplate: Template.roomSearchEmpty
26+
matchAll: true
27+
filter:
28+
type: 'u'
29+
$and: [
30+
{ _id: { $ne: Meteor.userId() } }
31+
{ _id: { $nin: Template.instance().selectedUsers.get() } }
32+
]
33+
sort: 'name'
34+
}
35+
]
36+
}
37+
38+
Template.channels.events
39+
'click .add-room': (e, instance) ->
40+
$('.channel-flex').removeClass('_hidden')
41+
42+
instance.clearForm()
43+
$('#channel-name').focus()
44+
45+
'click .close-nav-flex': ->
46+
$('.channel-flex').addClass('_hidden')
47+
48+
'autocompleteselect #channel-members': (event, instance, doc) ->
49+
instance.selectedUsers.set instance.selectedUsers.get().concat doc._id
50+
51+
instance.selectedUserNames[doc._id] = doc.name
52+
53+
event.currentTarget.value = ''
54+
event.currentTarget.focus()
55+
56+
'click .remove-room-member': (e, instance) ->
57+
self = @
58+
59+
users = Template.instance().selectedUsers.get()
60+
users = _.reject Template.instance().selectedUsers.get(), (_id) ->
61+
return _id is self.valueOf()
62+
63+
Template.instance().selectedUsers.set(users)
64+
65+
$('#channel-members').focus()
66+
67+
'click .cancel-channel': (e, instance) ->
68+
$('.channel-flex').addClass('_hidden')
69+
70+
'click .save-channel': (e, instance) ->
71+
Meteor.call 'createChannel', instance.find('#channel-name').value, instance.selectedUsers.get(), (err, result) ->
72+
if err
73+
return toastr.error err.reason
74+
75+
$('.channel-flex').addClass('_hidden')
76+
77+
instance.clearForm()
78+
79+
Router.go 'room', { _id: result.rid }
80+
81+
Template.channels.onCreated ->
82+
instance = this
83+
instance.selectedUsers = new ReactiveVar []
84+
instance.selectedUserNames = {}
85+
86+
instance.clearForm = ->
87+
instance.selectedUsers.set([])
88+
instance.find('#channel-name').value = ''
89+
instance.find('#channel-members').value = ''

‎client/views/app/asideNav/channels.html‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
<template name="channels">
2+
<h3 class="add-room">
3+
{{_ "chatRooms.Channels"}}
4+
<i class="icon-plus-circled"></i>
5+
</h3>
6+
7+
<ul>
8+
{{#each rooms}}
9+
{{> chatRoomItem }}
10+
{{/each}}
11+
</ul>
12+
13+
<div class="nav-flex channel-flex _hidden">
14+
<button class="close-nav-flex"><i class="icon-left-open"></i></button>
15+
<h4>{{_ "chatRooms.Channels"}}</h4>
16+
17+
<div class="wrapper">
18+
<label for="channel-name">{{_ "chatRooms.Name"}}</label>
19+
<input type="text" id="channel-name" placeholder="room-name">
20+
21+
<label for="channel-members">{{_ "chatRooms.Members" }}</label>
22+
{{> inputAutocomplete settings=autocompleteSettings id="channel-members" class="search" placeholder=tRoomMembers autocomplete="off"}}
23+
24+
<label>{{_ "chatRooms.Selected_users" }}</label>
25+
<ul class="selected-users">
26+
{{#each selectedUsers}}
27+
<li>{{name}} <i class="icon-cancel remove-room-member"></i></li>
28+
{{/each}}
29+
</ul>
30+
31+
<div class="buttons">
32+
<button class="-btn primary save-channel">{{_ "chatRooms.Save" }}</button>
33+
<button class="-btn cancel-channel">{{_ "chatRooms.Cancel" }}</button>
34+
</div>
35+
</div>
36+
</div>
37+
</template>

‎client/views/app/asideNav/chatRoomItem.coffee‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,8 @@ Template.chatRoomItem.helpers
2121
roomIcon: ->
2222
switch this.t
2323
when 'd' then return 'icon-at'
24-
when 'g' then return 'icon-hash'
24+
when 'c' then return 'icon-hash'
25+
when 'p' then return 'icon-lock'
2526

2627
active: ->
2728
return 'active' if Router.current().params._id? and Router.current().params._id is this.rid

‎client/views/app/asideNav/chatRoomItem.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<i class="{{roomIcon}} {{userStatus}}"></i>
88
<span>{{name}}</span>
99
<span class='opt'>
10-
<i class="icon-cancel-circled hide-room" title="{{_ "chatRoomItem.Hide_room"}}"></i>
10+
{{!-- <i class="icon-cancel-circled hide-room" title="{{_ "chatRoomItem.Hide_room"}}"></i> --}}
1111
{{#if canLeave}}
1212
<i class="icon-logout leave-room" title="{{_ "chatRoomItem.Leave_room"}}"></i>
1313
{{/if}}

‎client/views/app/asideNav/chatRooms.coffee‎

Lines changed: 0 additions & 26 deletions
This file was deleted.

‎client/views/app/asideNav/directMessages.coffee‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
Template.directMessages.helpers
2+
rooms: ->
3+
return ChatSubscription.find { uid: Meteor.userId(), t: { $in: ['d']}, f: { $ne: true } }, { sort: 'rn': 1 }

‎client/views/app/asideNav/directMessages.html‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<template name="directMessages">
2+
<h3 class="add-room">
3+
{{_ "chatRooms.Direct_Messages"}}
4+
<i class="icon-plus-circled"></i>
5+
</h3>
6+
7+
<ul>
8+
{{#each rooms}}
9+
{{> chatRoomItem }}
10+
{{/each}}
11+
</ul>
12+
</template>

‎client/views/app/asideNav/privateGroups.coffee‎

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
Template.privateGroups.helpers
2+
tRoomMembers: ->
3+
return t('chatRooms.Members_placeholder')
4+
5+
rooms: ->
6+
return ChatSubscription.find { uid: Meteor.userId(), t: { $in: ['p']}, f: { $ne: true } }, { sort: 'rn': 1 }
7+
8+
selectedUsers: ->
9+
return Template.instance().selectedUsers.get()
10+
11+
name: ->
12+
return Template.instance().selectedUserNames[this.valueOf()]
13+
14+
autocompleteSettings: ->
15+
return {
16+
limit: 10
17+
# inputDelay: 300
18+
rules: [
19+
{
20+
# @TODO maybe change this 'collection' and/or template
21+
collection: 'UserAndRoom'
22+
subscription: 'roomSearch'
23+
field: 'name'
24+
template: Template.roomSearch
25+
noMatchTemplate: Template.roomSearchEmpty
26+
matchAll: true
27+
filter:
28+
type: 'u'
29+
$and: [
30+
{ _id: { $ne: Meteor.userId() } }
31+
{ _id: { $nin: Template.instance().selectedUsers.get() } }
32+
]
33+
sort: 'name'
34+
}
35+
]
36+
}
37+
38+
Template.privateGroups.events
39+
'click .add-room': (e, instance) ->
40+
$('.private-group-flex').removeClass('_hidden')
41+
42+
instance.clearForm()
43+
$('#pvt-group-name').focus()
44+
45+
'click .close-nav-flex': ->
46+
$('.private-group-flex').addClass('_hidden')
47+
48+
'autocompleteselect #pvt-group-members': (event, instance, doc) ->
49+
instance.selectedUsers.set instance.selectedUsers.get().concat doc._id
50+
51+
instance.selectedUserNames[doc._id] = doc.name
52+
53+
event.currentTarget.value = ''
54+
event.currentTarget.focus()
55+
56+
'click .remove-room-member': (e, instance) ->
57+
self = @
58+
59+
users = Template.instance().selectedUsers.get()
60+
users = _.reject Template.instance().selectedUsers.get(), (_id) ->
61+
return _id is self.valueOf()
62+
63+
Template.instance().selectedUsers.set(users)
64+
65+
$('#pvt-group-members').focus()
66+
67+
'click .cancel-pvt-group': (e, instance) ->
68+
$('.private-group-flex').addClass('_hidden')
69+
70+
'click .save-pvt-group': (e, instance) ->
71+
Meteor.call 'createPrivateGroup', instance.find('#pvt-group-name').value, instance.selectedUsers.get(), (err, result) ->
72+
if err
73+
return toastr.error err.reason
74+
75+
$('.private-group-flex').addClass('_hidden')
76+
77+
instance.clearForm()
78+
79+
Router.go 'room', { _id: result.rid }
80+
81+
Template.privateGroups.onCreated ->
82+
instance = this
83+
instance.selectedUsers = new ReactiveVar []
84+
instance.selectedUserNames = {}
85+
86+
instance.clearForm = ->
87+
instance.selectedUsers.set([])
88+
instance.find('#pvt-group-name').value = ''
89+
instance.find('#pvt-group-members').value = ''

0 commit comments

Comments
 (0)