|
@@ -0,0 +1,186 @@
|
|
|
+// Converse.js (A browser based XMPP chat client)
|
|
|
+// http://conversejs.org
|
|
|
+//
|
|
|
+// Copyright (c) 2012-2017, Jan-Carel Brand <jc@opkode.com>
|
|
|
+// Licensed under the Mozilla Public License (MPLv2)
|
|
|
+//
|
|
|
+/*global define */
|
|
|
+
|
|
|
+/* This is a non-core Converse.js plugin which shows a list of currently open
|
|
|
+ * rooms in the "Rooms Panel" of the ControlBox.
|
|
|
+ */
|
|
|
+(function (root, factory) {
|
|
|
+ define(["utils",
|
|
|
+ "converse-core",
|
|
|
+ "converse-muc",
|
|
|
+ "tpl!bookmark",
|
|
|
+ "tpl!rooms_list"
|
|
|
+ ], factory);
|
|
|
+}(this, function (utils, converse, muc, tpl_bookmark, tpl_rooms_list) {
|
|
|
+ var $ = converse.env.jQuery,
|
|
|
+ Backbone = converse.env.Backbone,
|
|
|
+ b64_sha1 = converse.env.b64_sha1,
|
|
|
+ sizzle = converse.env.sizzle,
|
|
|
+ _ = converse.env._;
|
|
|
+
|
|
|
+ converse.plugins.add('converse-roomslist', {
|
|
|
+ initialize: function () {
|
|
|
+ /* The initialize function gets called as soon as the plugin is
|
|
|
+ * loaded by converse.js's plugin machinery.
|
|
|
+ */
|
|
|
+ var _converse = this._converse,
|
|
|
+ __ = _converse.__,
|
|
|
+ ___ = _converse.___;
|
|
|
+
|
|
|
+ _converse.RoomsList = Backbone.Model.extend({
|
|
|
+ defaults: {
|
|
|
+ "toggle-state": _converse.OPENED
|
|
|
+ },
|
|
|
+
|
|
|
+ initialize: function () {
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ _converse.RoomsListView = Backbone.View.extend({
|
|
|
+ tagName: 'div',
|
|
|
+ className: 'open-rooms-list, rooms-list-container',
|
|
|
+ events: {
|
|
|
+ 'click .close-room': 'closeRoom',
|
|
|
+ 'click .open-rooms-toggle': 'toggleRoomsList'
|
|
|
+ },
|
|
|
+
|
|
|
+ initialize: function () {
|
|
|
+ this.model.on('add', this.renderRoomsListElement, this);
|
|
|
+ this.model.on('change:bookmarked', this.renderRoomsListElement, this);
|
|
|
+ this.model.on('change:name', this.renderRoomsListElement, this);
|
|
|
+ this.model.on('remove', this.removeRoomsListElement, this);
|
|
|
+
|
|
|
+ var cachekey = 'converse.roomslist'+_converse.bare_jid;
|
|
|
+ this.list_model = new _converse.RoomsList();
|
|
|
+ this.list_model.id = cachekey;
|
|
|
+ this.list_model.browserStorage = new Backbone.BrowserStorage[_converse.storage](
|
|
|
+ b64_sha1(cachekey)
|
|
|
+ );
|
|
|
+ this.list_model.fetch();
|
|
|
+ this.render();
|
|
|
+ },
|
|
|
+
|
|
|
+ render: function () {
|
|
|
+ this.el.innerHTML =
|
|
|
+ tpl_rooms_list({
|
|
|
+ 'toggle_state': this.list_model.get('toggle-state'),
|
|
|
+ 'desc_rooms': __('Click to toggle the rooms list'),
|
|
|
+ 'label_rooms': __('Open Rooms')
|
|
|
+ })
|
|
|
+ this.hide();
|
|
|
+ if (this.list_model.get('toggle-state') !== _converse.OPENED) {
|
|
|
+ this.$('.open-rooms-list').hide();
|
|
|
+ }
|
|
|
+ this.model.each(this.renderRoomsListElement.bind(this));
|
|
|
+ var controlboxview = _converse.chatboxviews.get('controlbox');
|
|
|
+
|
|
|
+ if (!_.isUndefined(controlboxview) &&
|
|
|
+ !document.body.contains(this.el)) {
|
|
|
+ var container = controlboxview.el.querySelector('#chatrooms');
|
|
|
+ if (!_.isNull(container)) {
|
|
|
+ container.insertBefore(this.el, container.firstChild);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return this.el;
|
|
|
+ },
|
|
|
+
|
|
|
+ hide: function () {
|
|
|
+ this.el.classList.add('hidden');
|
|
|
+ },
|
|
|
+
|
|
|
+ show: function () {
|
|
|
+ this.el.classList.remove('hidden');
|
|
|
+ },
|
|
|
+
|
|
|
+ closeRoom: function (ev) {
|
|
|
+ ev.preventDefault();
|
|
|
+ var name = $(ev.target).data('roomName');
|
|
|
+ var jid = $(ev.target).data('roomJid');
|
|
|
+ if (confirm(__(___("Are you sure you want to leave the room \"%1$s\"?"), name))) {
|
|
|
+ _converse.chatboxviews.get(jid).leave();
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ renderRoomsListElement: function (item) {
|
|
|
+ if (item.get('type') !== 'chatroom') {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.removeRoomsListElement(item);
|
|
|
+
|
|
|
+ var name, bookmark
|
|
|
+ if (item.get('bookmarked')) {
|
|
|
+ bookmark = _.head(_converse.bookmarksview.model.where({'jid': item.get('jid')}));
|
|
|
+ name = bookmark.get('name');
|
|
|
+ } else {
|
|
|
+ name = item.get('name');
|
|
|
+ }
|
|
|
+ var div = document.createElement('div');
|
|
|
+ div.innerHTML = tpl_bookmark(_.extend(item.toJSON(), {
|
|
|
+ 'can_leave_room': true,
|
|
|
+ 'info_leave_room': __('Leave this room'),
|
|
|
+ 'info_remove_bookmark': __('Unbookmark this room'),
|
|
|
+ 'info_title': __('Show more information on this room'),
|
|
|
+ 'name': name,
|
|
|
+ 'open_title': __('Click to open this room')
|
|
|
+ }));
|
|
|
+ this.el.querySelector('.open-rooms-list').appendChild(div.firstChild);
|
|
|
+ this.show();
|
|
|
+ },
|
|
|
+
|
|
|
+ removeRoomsListElement: function (item) {
|
|
|
+ var list_el = this.el.querySelector('.open-rooms-list');
|
|
|
+ var el = _.head(sizzle('.available-chatroom[data-room-jid="'+item.get('jid')+'"]', list_el));
|
|
|
+ if (el) {
|
|
|
+ list_el.removeChild(el);
|
|
|
+ }
|
|
|
+ if (list_el.childElementCount === 0) {
|
|
|
+ this.hide();
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ toggleRoomsList: function (ev) {
|
|
|
+ if (ev && ev.preventDefault) { ev.preventDefault(); }
|
|
|
+ var el = ev.target;
|
|
|
+ if (el.classList.contains("icon-opened")) {
|
|
|
+ this.$('.open-rooms-list').slideUp('fast');
|
|
|
+ this.list_model.save({'toggle-state': _converse.CLOSED});
|
|
|
+ el.classList.remove("icon-opened");
|
|
|
+ el.classList.add("icon-closed");
|
|
|
+ } else {
|
|
|
+ el.classList.remove("icon-closed");
|
|
|
+ el.classList.add("icon-opened");
|
|
|
+ this.$('.open-rooms-list').slideDown('fast');
|
|
|
+ this.list_model.save({'toggle-state': _converse.OPENED});
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ var initRoomsListView = function () {
|
|
|
+ _converse.rooms_list_view = new _converse.RoomsListView(
|
|
|
+ {'model': _converse.chatboxes}
|
|
|
+ );
|
|
|
+ };
|
|
|
+ _converse.on('bookmarksInitialized', initRoomsListView);
|
|
|
+ _converse.on('roomsPanelRendered', function () {
|
|
|
+ if (_converse.allow_bookmarks) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ initRoomsListView();
|
|
|
+ });
|
|
|
+
|
|
|
+ var afterReconnection = function () {
|
|
|
+ if (_.isUndefined(_converse.rooms_list_view)) {
|
|
|
+ initRoomsListView();
|
|
|
+ } else {
|
|
|
+ _converse.rooms_list_view.render();
|
|
|
+ }
|
|
|
+ };
|
|
|
+ _converse.on('reconnected', afterReconnection);
|
|
|
+ }
|
|
|
+ });
|
|
|
+}));
|