Skip to content

C
converse.js
Commit 550cc517 authored by JC Brand's avatar JC Brand
Browse files
Options

Some work on removing jQuery from converse-rosterview

parent 0d256dba
Hide whitespace changes
Inline Side-by-side
Showing with 54 additions and 46 deletions
src/config.js
View file @ 550cc517
......@@ -163,6 +163,7 @@ require.config({
"room_item": "src/templates/room_item",
"room_panel": "src/templates/room_panel",
"roster": "src/templates/roster",
"roster_filter": "src/templates/roster_filter",
"roster_item": "src/templates/roster_item",
"search_contact": "src/templates/search_contact",
"select_option": "src/templates/select_option",
......
src/converse-rosterview.js
View file @ 550cc517
......@@ -12,6 +12,7 @@
"tpl!pending_contact",
"tpl!requesting_contact",
"tpl!roster",
"tpl!roster_filter",
"tpl!roster_item"
], factory);
}(this, function (
......@@ -20,6 +21,7 @@
tpl_pending_contact,
tpl_requesting_contact,
tpl_roster,
tpl_roster_filter,
tpl_roster_item) {
"use strict";
var $ = converse.env.jQuery,
......@@ -145,7 +147,7 @@
},
render: function () {
this.$el.html(tpl_roster(
this.el.innerHTML = tpl_roster_filter(
_.extend(this.model.toJSON(), {
placeholder: __('Filter'),
label_contacts: LABEL_CONTACTS,
......@@ -158,8 +160,7 @@
label_away: __('Away'),
label_xa: __('Extended Away'),
label_offline: __('Offline')
})
));
}));
this.renderClearButton();
return this.$el;
},
......@@ -182,7 +183,7 @@
changeChatStateFilter: function (ev) {
if (ev && ev.preventDefault) { ev.preventDefault(); }
this.model.save({
'chat_state': this.$('.state-type').val()
'chat_state': this.el.querySelector('.state-type').value
});
},
......@@ -192,20 +193,20 @@
if (type === 'state') {
this.model.save({
'filter_type': type,
'chat_state': this.$('.state-type').val()
'chat_state': this.el.querySelector('.state-type').value
});
} else {
this.model.save({
'filter_type': type,
'filter_text': this.$('.roster-filter').val(),
'filter_text': this.el.querySelector('.roster-filter').value
});
}
},
liveFilter: _.debounce(function (ev) {
this.model.save({
'filter_type': this.$('.filter-type').val(),
'filter_text': this.$('.roster-filter').val()
'filter_type': this.el.querySelector('.filter-type').value,
'filter_text': this.el.querySelector('.roster-filter').value
});
}, 250),
......@@ -234,7 +235,7 @@
hide: function () {
if (!this.$el.is(':visible')) { return this; }
if (this.$('.roster-filter').val().length > 0) {
if (this.el.querySelector('.roster-filter').value.length > 0) {
// Don't hide if user is currently filtering.
return;
}
......@@ -276,16 +277,21 @@
},
render: function () {
this.$roster = $('<dl class="roster-contacts" style="display: none;"></dl>');
this.renderRoster();
this.$el.html(this.filter_view.render());
if (!_converse.allow_contact_requests) {
// XXX: if we ever support live editing of config then
// we'll need to be able to remove this class on the fly.
this.$el.addClass('no-contact-requests');
this.el.classList.add('no-contact-requests');
}
return this;
},
renderRoster: function () {
this.$roster = $(tpl_roster());
this.roster = this.$roster[0];
},
createRosterFilter: function () {
// Create a model on which we can store filter properties
var model = new _converse.RosterFilter();
......@@ -320,7 +326,7 @@
},
update: _.debounce(function () {
if (this.$roster.parent().length === 0) {
if (_.isNull(this.roster.parentElement)) {
this.$el.append(this.$roster.show());
}
return this.showHideFilter();
......@@ -366,7 +372,7 @@
reset: function () {
_converse.roster.reset();
this.removeAll();
this.$roster = $('<dl class="roster-contacts" style="display: none;"></dl>');
this.renderRoster();
this.render().update();
return this;
},
......@@ -576,7 +582,7 @@
_.each(classes_to_remove,
function (cls) {
if (_.includes(that.el.className, cls)) {
that.$el.removeClass(cls);
that.el.classList.remove(cls);
}
});
this.$el.addClass(chat_status).data('status', chat_status);
......@@ -593,7 +599,7 @@
*
* So in both cases the user is a "pending" contact.
*/
this.$el.addClass('pending-xmpp-contact');
this.el.classList.add('pending-xmpp-contact');
this.$el.html(tpl_pending_contact(
_.extend(item.toJSON(), {
'desc_remove': __('Click to remove this contact'),
......@@ -601,7 +607,7 @@
})
));
} else if (requesting === true) {
this.$el.addClass('requesting-xmpp-contact');
this.el.classList.add('requesting-xmpp-contact');
this.$el.html(tpl_requesting_contact(
_.extend(item.toJSON(), {
'desc_accept': __("Click to accept this contact request"),
......@@ -610,7 +616,7 @@
})
));
} else if (subscription === 'both' || subscription === 'to') {
this.$el.addClass('current-xmpp-contact');
this.el.classList.add('current-xmpp-contact');
this.$el.removeClass(_.without(['both', 'to'], subscription)[0]).addClass(subscription);
this.$el.html(tpl_roster_item(
_.extend(item.toJSON(), {
......@@ -734,7 +740,7 @@
},
render: function () {
this.$el.attr('data-group', this.model.get('name'));
this.el.setAttribute('data-group', this.model.get('name'));
this.$el.html(
$(tpl_group_header({
label_group: this.model.get('name'),
......
src/templates/roster.html
View file @ 550cc517
<form class="pure-form roster-filter-form input-button-group">
<input value="{{filter_text}}" class="roster-filter"
placeholder="{{placeholder}}"
{[ if (filter_type === 'state') { ]} style="display: none" {[ } ]} >
<select class="state-type" {[ if (filter_type !== 'state') { ]} style="display: none" {[ } ]} >
<option value="">{{label_any}}</option>
<option {[ if (chat_state === 'online') { ]} selected="selected" {[ } ]}
value="online">{{label_online}}</option>
<option {[ if (chat_state === 'chat') { ]} selected="selected" {[ } ]}
value="chat">{{label_chatty}}</option>
<option {[ if (chat_state === 'dnd') { ]} selected="selected" {[ } ]}
value="dnd">{{label_busy}}</option>
<option {[ if (chat_state === 'away') { ]} selected="selected" {[ } ]}
value="away">{{label_away}}</option>
<option {[ if (chat_state === 'xa') { ]} selected="selected" {[ } ]}
value="xa">{{label_xa}}</option>
<option {[ if (chat_state === 'offline') { ]} selected="selected" {[ } ]}
value="offline">{{label_offline}}</option>
</select>
<select class="filter-type">
<option {[ if (filter_type === 'contacts') { ]} selected="selected" {[ } ]}
value="contacts">{{label_contacts}}</option>
<option {[ if (filter_type === 'groups') { ]} selected="selected" {[ } ]}
value="groups">{{label_groups}}</option>
<option {[ if (filter_type === 'state') { ]} selected="selected" {[ } ]}
value="state">{{label_state}}</option>
</select>
</form>
<dl class="roster-contacts" style="display: none;"></dl>
src/templates/roster_filter.html 0 → 100644
View file @ 550cc517
<form class="pure-form roster-filter-form input-button-group">
<input value="{{filter_text}}" class="roster-filter"
placeholder="{{placeholder}}"
{[ if (filter_type === 'state') { ]} style="display: none" {[ } ]} >
<select class="state-type" {[ if (filter_type !== 'state') { ]} style="display: none" {[ } ]} >
<option value="">{{label_any}}</option>
<option {[ if (chat_state === 'online') { ]} selected="selected" {[ } ]}
value="online">{{label_online}}</option>
<option {[ if (chat_state === 'chat') { ]} selected="selected" {[ } ]}
value="chat">{{label_chatty}}</option>
<option {[ if (chat_state === 'dnd') { ]} selected="selected" {[ } ]}
value="dnd">{{label_busy}}</option>
<option {[ if (chat_state === 'away') { ]} selected="selected" {[ } ]}
value="away">{{label_away}}</option>
<option {[ if (chat_state === 'xa') { ]} selected="selected" {[ } ]}
value="xa">{{label_xa}}</option>
<option {[ if (chat_state === 'offline') { ]} selected="selected" {[ } ]}
value="offline">{{label_offline}}</option>
</select>
<select class="filter-type">
<option {[ if (filter_type === 'contacts') { ]} selected="selected" {[ } ]}
value="contacts">{{label_contacts}}</option>
<option {[ if (filter_type === 'groups') { ]} selected="selected" {[ } ]}
value="groups">{{label_groups}}</option>
<option {[ if (filter_type === 'state') { ]} selected="selected" {[ } ]}
value="state">{{label_state}}</option>
</select>
</form>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7