Refactor bookmark plugins
Mainly moving functions and methods to utils
This commit is contained in:
parent
18e3b618b4
commit
c8f0406c84
@ -7,7 +7,6 @@ import { getOpenPromise } from '@converse/openpromise';
|
|||||||
import { initStorage } from '@converse/headless/shared/utils.js';
|
import { initStorage } from '@converse/headless/shared/utils.js';
|
||||||
|
|
||||||
const { Strophe, $iq, sizzle } = converse.env;
|
const { Strophe, $iq, sizzle } = converse.env;
|
||||||
const u = converse.env.utils;
|
|
||||||
|
|
||||||
|
|
||||||
const Bookmarks = {
|
const Bookmarks = {
|
||||||
|
@ -11,30 +11,13 @@ import log from "@converse/headless/log.js";
|
|||||||
import { Collection } from "@converse/skeletor/src/collection";
|
import { Collection } from "@converse/skeletor/src/collection";
|
||||||
import { Model } from '@converse/skeletor/src/model.js';
|
import { Model } from '@converse/skeletor/src/model.js';
|
||||||
import { _converse, api, converse } from "@converse/headless/core";
|
import { _converse, api, converse } from "@converse/headless/core";
|
||||||
import { checkBookmarksSupport, getNicknameFromBookmark } from './utils.js';
|
import { initBookmarks, getNicknameFromBookmark } from './utils.js';
|
||||||
|
|
||||||
const { Strophe, sizzle } = converse.env;
|
const { Strophe, sizzle } = converse.env;
|
||||||
|
|
||||||
Strophe.addNamespace('BOOKMARKS', 'storage:bookmarks');
|
Strophe.addNamespace('BOOKMARKS', 'storage:bookmarks');
|
||||||
|
|
||||||
|
|
||||||
async function initBookmarks () {
|
|
||||||
if (!api.settings.get('allow_bookmarks')) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (await checkBookmarksSupport()) {
|
|
||||||
_converse.bookmarks = new _converse.Bookmarks();
|
|
||||||
await _converse.bookmarks.fetchBookmarks();
|
|
||||||
/**
|
|
||||||
* Triggered once the _converse.Bookmarks collection
|
|
||||||
* has been created and cached bookmarks have been fetched.
|
|
||||||
* @event _converse#bookmarksInitialized
|
|
||||||
* @example _converse.api.listen.on('bookmarksInitialized', () => { ... });
|
|
||||||
*/
|
|
||||||
api.trigger('bookmarksInitialized');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function handleBookmarksPush (message) {
|
function handleBookmarksPush (message) {
|
||||||
if (sizzle(`event[xmlns="${Strophe.NS.PUBSUB}#event"] items[node="${Strophe.NS.BOOKMARKS}"]`, message).length) {
|
if (sizzle(`event[xmlns="${Strophe.NS.PUBSUB}#event"] items[node="${Strophe.NS.BOOKMARKS}"]`, message).length) {
|
||||||
api.waitUntil('bookmarksInitialized')
|
api.waitUntil('bookmarksInitialized')
|
||||||
|
@ -10,6 +10,23 @@ export async function checkBookmarksSupport () {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export async function initBookmarks () {
|
||||||
|
if (!api.settings.get('allow_bookmarks')) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (await checkBookmarksSupport()) {
|
||||||
|
_converse.bookmarks = new _converse.Bookmarks();
|
||||||
|
await _converse.bookmarks.fetchBookmarks();
|
||||||
|
/**
|
||||||
|
* Triggered once the _converse.Bookmarks collection
|
||||||
|
* has been created and cached bookmarks have been fetched.
|
||||||
|
* @event _converse#bookmarksInitialized
|
||||||
|
* @example _converse.api.listen.on('bookmarksInitialized', () => { ... });
|
||||||
|
*/
|
||||||
|
api.trigger('bookmarksInitialized');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Check if the user has a bookmark with a saved nickanme
|
* Check if the user has a bookmark with a saved nickanme
|
||||||
* for this groupchat and return it.
|
* for this groupchat and return it.
|
||||||
|
@ -1,10 +1,10 @@
|
|||||||
|
import log from '@converse/headless/log';
|
||||||
import tpl_bookmarks_list from './templates/list.js';
|
import tpl_bookmarks_list from './templates/list.js';
|
||||||
import { ElementView } from '@converse/skeletor/src/element.js';
|
import { ElementView } from '@converse/skeletor/src/element.js';
|
||||||
import { _converse, api, converse } from '@converse/headless/core';
|
import { _converse, api, converse } from '@converse/headless/core';
|
||||||
import { initStorage } from '@converse/headless/shared/utils.js';
|
import { initStorage } from '@converse/headless/shared/utils.js';
|
||||||
import { render } from 'lit';
|
import { render } from 'lit';
|
||||||
|
|
||||||
const { Strophe } = converse.env;
|
|
||||||
const u = converse.env.utils;
|
const u = converse.env.utils;
|
||||||
|
|
||||||
export default class BookmarksView extends ElementView {
|
export default class BookmarksView extends ElementView {
|
||||||
@ -18,40 +18,26 @@ export default class BookmarksView extends ElementView {
|
|||||||
this.listenTo(_converse.chatboxes, 'add', this.render);
|
this.listenTo(_converse.chatboxes, 'add', this.render);
|
||||||
this.listenTo(_converse.chatboxes, 'remove', this.render);
|
this.listenTo(_converse.chatboxes, 'remove', this.render);
|
||||||
|
|
||||||
const id = `converse.room-bookmarks${_converse.bare_jid}-list-model`;
|
const id = `converse.bookmarks-list-model-${_converse.bare_jid}`;
|
||||||
this.model = new _converse.BookmarksList({ id });
|
this.model = new _converse.BookmarksList({ id });
|
||||||
initStorage(this.model, id);
|
initStorage(this.model, id);
|
||||||
this.model.fetch({ 'success': () => this.render(), 'error': () => this.render() });
|
|
||||||
|
this.model.fetch({
|
||||||
|
'success': () => this.render(),
|
||||||
|
'error': (model, err) => {
|
||||||
|
log.error(err);
|
||||||
|
this.render();
|
||||||
|
}
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
render () {
|
render () {
|
||||||
const is_hidden = b => !!(api.settings.get('hide_open_bookmarks') && _converse.chatboxes.get(b.get('jid')));
|
|
||||||
render(tpl_bookmarks_list({
|
render(tpl_bookmarks_list({
|
||||||
'_converse': _converse,
|
|
||||||
'bookmarks': _converse.bookmarks,
|
|
||||||
'hidden': _converse.bookmarks.getUnopenedBookmarks().length && true,
|
|
||||||
'is_hidden': is_hidden,
|
|
||||||
'openRoom': ev => this.openRoom(ev),
|
|
||||||
'removeBookmark': ev => this.removeBookmark(ev),
|
|
||||||
'toggleBookmarksList': ev => this.toggleBookmarksList(ev),
|
'toggleBookmarksList': ev => this.toggleBookmarksList(ev),
|
||||||
'toggle_state': this.model.get('toggle-state')
|
'toggle_state': this.model.get('toggle-state')
|
||||||
}), this);
|
}), this);
|
||||||
}
|
}
|
||||||
|
|
||||||
openRoom (ev) { // eslint-disable-line class-methods-use-this
|
|
||||||
ev.preventDefault();
|
|
||||||
const name = ev.target.textContent;
|
|
||||||
const jid = ev.target.getAttribute('data-room-jid');
|
|
||||||
const data = {
|
|
||||||
'name': name || Strophe.unescapeNode(Strophe.getNodeFromJid(jid)) || jid
|
|
||||||
};
|
|
||||||
api.rooms.open(jid, data, true);
|
|
||||||
}
|
|
||||||
|
|
||||||
removeBookmark (ev) { // eslint-disable-line class-methods-use-this
|
|
||||||
_converse.removeBookmarkViaEvent(ev);
|
|
||||||
}
|
|
||||||
|
|
||||||
toggleBookmarksList (ev) {
|
toggleBookmarksList (ev) {
|
||||||
if (ev && ev.preventDefault) {
|
if (ev && ev.preventDefault) {
|
||||||
ev.preventDefault();
|
ev.preventDefault();
|
||||||
|
@ -1,5 +1,4 @@
|
|||||||
/**
|
/**
|
||||||
* @module converse-bookmark-views
|
|
||||||
* @description Converse.js plugin which adds views for XEP-0048 bookmarks
|
* @description Converse.js plugin which adds views for XEP-0048 bookmarks
|
||||||
* @copyright 2020, the Converse.js contributors
|
* @copyright 2020, the Converse.js contributors
|
||||||
* @license Mozilla Public License (MPLv2)
|
* @license Mozilla Public License (MPLv2)
|
||||||
@ -7,10 +6,9 @@
|
|||||||
import '@converse/headless/plugins/muc/index.js';
|
import '@converse/headless/plugins/muc/index.js';
|
||||||
import BookmarkForm from './form.js';
|
import BookmarkForm from './form.js';
|
||||||
import BookmarksView from './bookmarks-list.js';
|
import BookmarksView from './bookmarks-list.js';
|
||||||
import { __ } from 'i18n';
|
|
||||||
import { _converse, api, converse } from '@converse/headless/core';
|
import { _converse, api, converse } from '@converse/headless/core';
|
||||||
import { bookmarkableChatRoomView, eventMethods } from './mixins.js';
|
import { bookmarkableChatRoomView } from './mixins.js';
|
||||||
import { checkBookmarksSupport } from '@converse/headless/plugins/bookmarks/utils';
|
import { getHeadingButtons, removeBookmarkViaEvent, addBookmarkViaEvent } from './utils.js';
|
||||||
|
|
||||||
import './styles/bookmarks.scss';
|
import './styles/bookmarks.scss';
|
||||||
|
|
||||||
@ -23,8 +21,6 @@ converse.plugins.add('converse-bookmark-views', {
|
|||||||
* If the setting "strict_plugin_dependencies" is set to true,
|
* If the setting "strict_plugin_dependencies" is set to true,
|
||||||
* an error will be raised if the plugin is not found. By default it's
|
* an error will be raised if the plugin is not found. By default it's
|
||||||
* false, which means these plugins are only loaded opportunistically.
|
* false, which means these plugins are only loaded opportunistically.
|
||||||
*
|
|
||||||
* NB: These plugins need to have already been loaded via require.js.
|
|
||||||
*/
|
*/
|
||||||
dependencies: ['converse-chatboxes', 'converse-muc', 'converse-muc-views'],
|
dependencies: ['converse-chatboxes', 'converse-muc', 'converse-muc-views'],
|
||||||
|
|
||||||
@ -37,34 +33,15 @@ converse.plugins.add('converse-bookmark-views', {
|
|||||||
hide_open_bookmarks: true
|
hide_open_bookmarks: true
|
||||||
});
|
});
|
||||||
|
|
||||||
Object.assign(_converse, eventMethods);
|
_converse.removeBookmarkViaEvent = removeBookmarkViaEvent;
|
||||||
|
_converse.addBookmarkViaEvent = addBookmarkViaEvent;
|
||||||
|
|
||||||
Object.assign(_converse.ChatRoomView.prototype, bookmarkableChatRoomView);
|
Object.assign(_converse.ChatRoomView.prototype, bookmarkableChatRoomView);
|
||||||
|
|
||||||
_converse.MUCBookmarkForm = BookmarkForm;
|
_converse.MUCBookmarkForm = BookmarkForm;
|
||||||
_converse.BookmarksView = BookmarksView;
|
_converse.BookmarksView = BookmarksView;
|
||||||
|
|
||||||
/************************ BEGIN Event Handlers ************************/
|
api.listen.on('getHeadingButtons', getHeadingButtons);
|
||||||
api.listen.on('getHeadingButtons', (view, buttons) => {
|
|
||||||
if (_converse.allow_bookmarks && view.model.get('type') === _converse.CHATROOMS_TYPE) {
|
|
||||||
const bookmarked = view.model.get('bookmarked');
|
|
||||||
const data = {
|
|
||||||
'i18n_title': bookmarked ? __('Unbookmark this groupchat') : __('Bookmark this groupchat'),
|
|
||||||
'i18n_text': bookmarked ? __('Unbookmark') : __('Bookmark'),
|
|
||||||
'handler': ev => view.toggleBookmark(ev),
|
|
||||||
'a_class': 'toggle-bookmark',
|
|
||||||
'icon_class': 'fa-bookmark',
|
|
||||||
'name': 'bookmark'
|
|
||||||
};
|
|
||||||
const names = buttons.map(t => t.name);
|
|
||||||
const idx = names.indexOf('details');
|
|
||||||
const data_promise = checkBookmarksSupport().then(s => (s ? data : ''));
|
|
||||||
return idx > -1
|
|
||||||
? [...buttons.slice(0, idx), data_promise, ...buttons.slice(idx)]
|
|
||||||
: [data_promise, ...buttons];
|
|
||||||
}
|
|
||||||
return buttons;
|
|
||||||
});
|
|
||||||
|
|
||||||
api.listen.on('chatRoomViewInitialized', view => view.setBookmarkState());
|
api.listen.on('chatRoomViewInitialized', view => view.setBookmarkState());
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -1,7 +1,4 @@
|
|||||||
import invokeMap from 'lodash-es/invokeMap';
|
import { _converse, converse } from '@converse/headless/core';
|
||||||
import { Model } from '@converse/skeletor/src/model.js';
|
|
||||||
import { __ } from 'i18n';
|
|
||||||
import { _converse, api, converse } from '@converse/headless/core';
|
|
||||||
|
|
||||||
const { u } = converse.env;
|
const { u } = converse.env;
|
||||||
|
|
||||||
@ -43,29 +40,3 @@ export const bookmarkableChatRoomView = {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
export const eventMethods = {
|
|
||||||
|
|
||||||
removeBookmarkViaEvent (ev) {
|
|
||||||
/* Remove a bookmark as determined by the passed in
|
|
||||||
* event.
|
|
||||||
*/
|
|
||||||
ev.preventDefault();
|
|
||||||
const name = ev.target.getAttribute('data-bookmark-name');
|
|
||||||
const jid = ev.target.getAttribute('data-room-jid');
|
|
||||||
if (confirm(__('Are you sure you want to remove the bookmark "%1$s"?', name))) {
|
|
||||||
invokeMap(_converse.bookmarks.where({ 'jid': jid }), Model.prototype.destroy);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
async addBookmarkViaEvent (ev) {
|
|
||||||
/* Add a bookmark as determined by the passed in
|
|
||||||
* event.
|
|
||||||
*/
|
|
||||||
ev.preventDefault();
|
|
||||||
const jid = ev.target.getAttribute('data-room-jid');
|
|
||||||
const room = await api.rooms.open(jid, { 'bring_to_foreground': true });
|
|
||||||
room.session.save('view', converse.MUC.VIEWS.BOOKMARK);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
24
src/plugins/bookmark-views/templates/item.js
Normal file
24
src/plugins/bookmark-views/templates/item.js
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
import { __ } from 'i18n';
|
||||||
|
import { _converse, api } from '@converse/headless/core.js';
|
||||||
|
import { html } from "lit";
|
||||||
|
import { openRoomViaEvent, removeBookmarkViaEvent } from '../utils.js';
|
||||||
|
|
||||||
|
export default (o) => {
|
||||||
|
const jid = o.bm.get('jid');
|
||||||
|
const is_hidden = !!(api.settings.get('hide_open_bookmarks') && _converse.chatboxes.get(jid));
|
||||||
|
const info_remove_bookmark = __('Unbookmark this groupchat');
|
||||||
|
const open_title = __('Click to open this groupchat');
|
||||||
|
return html`
|
||||||
|
<div class="list-item controlbox-padded room-item available-chatroom d-flex flex-row ${ is_hidden ? 'hidden' : ''}" data-room-jid="${jid}">
|
||||||
|
<a class="list-item-link open-room w-100" data-room-jid="${jid}"
|
||||||
|
title="${open_title}"
|
||||||
|
@click=${openRoomViaEvent}>${o.bm.getDisplayName()}</a>
|
||||||
|
|
||||||
|
<a class="list-item-action remove-bookmark fa fa-bookmark align-self-center ${ o.bm.get('bookmarked') ? 'button-on' : '' }"
|
||||||
|
data-room-jid="${jid}"
|
||||||
|
data-bookmark-name="${o.bm.getDisplayName()}"
|
||||||
|
title="${info_remove_bookmark}"
|
||||||
|
@click=${removeBookmarkViaEvent}></a>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
}
|
@ -1,38 +1,22 @@
|
|||||||
import { html } from "lit";
|
import bookmark_item from './item.js';
|
||||||
import { __ } from 'i18n';
|
import { __ } from 'i18n';
|
||||||
|
import { _converse } from '@converse/headless/core.js';
|
||||||
|
import { html } from "lit";
|
||||||
const bookmark_item = (o) => {
|
|
||||||
const info_remove_bookmark = __('Unbookmark this groupchat');
|
|
||||||
const open_title = __('Click to open this groupchat');
|
|
||||||
return html`
|
|
||||||
<div class="list-item controlbox-padded room-item available-chatroom d-flex flex-row ${ (o.is_hidden(o.bm)) ? 'hidden' : ''}" data-room-jid="${o.bm.get('jid')}">
|
|
||||||
<a class="list-item-link open-room w-100" data-room-jid="${o.bm.get('jid')}"
|
|
||||||
title="${open_title}"
|
|
||||||
@click=${o.openRoom}>${o.bm.getDisplayName()}</a>
|
|
||||||
|
|
||||||
<a class="list-item-action remove-bookmark fa fa-bookmark align-self-center ${ o.bm.get('bookmarked') ? 'button-on' : '' }"
|
|
||||||
data-room-jid="${o.bm.get('jid')}"
|
|
||||||
data-bookmark-name="${o.bm.getDisplayName()}"
|
|
||||||
title="${info_remove_bookmark}"
|
|
||||||
@click=${o.removeBookmark}></a>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
}
|
|
||||||
|
|
||||||
export default (o) => {
|
export default (o) => {
|
||||||
|
const is_collapsed = _converse.bookmarks.getUnopenedBookmarks().length ? true : false;
|
||||||
const desc_bookmarks = __('Click to toggle the bookmarks list');
|
const desc_bookmarks = __('Click to toggle the bookmarks list');
|
||||||
const label_bookmarks = __('Bookmarks');
|
const label_bookmarks = __('Bookmarks');
|
||||||
return html`
|
return html`
|
||||||
<div class="list-container list-container--bookmarks ${ !o.hidden && 'hidden' || '' }">
|
<div class="list-container list-container--bookmarks ${ !is_collapsed && 'hidden' || '' }">
|
||||||
<a class="list-toggle bookmarks-toggle controlbox-padded"
|
<a class="list-toggle bookmarks-toggle controlbox-padded"
|
||||||
title="${desc_bookmarks}"
|
title="${desc_bookmarks}"
|
||||||
@click=${o.toggleBookmarksList}>
|
@click=${o.toggleBookmarksList}>
|
||||||
|
|
||||||
<span class="fa ${(o.toggle_state === o._converse.OPENED) ? 'fa-caret-down' : 'fa-caret-right' }">
|
<span class="fa ${(o.toggle_state === _converse.OPENED) ? 'fa-caret-down' : 'fa-caret-right' }">
|
||||||
</span> ${label_bookmarks}</a>
|
</span> ${label_bookmarks}</a>
|
||||||
<div class="items-list bookmarks rooms-list ${ (o.toggle_state !== o._converse.OPENED) ? 'hidden' : '' }">
|
<div class="items-list bookmarks rooms-list ${ (o.toggle_state !== _converse.OPENED) ? 'hidden' : '' }">
|
||||||
${ o.bookmarks.map(bm => bookmark_item(Object.assign({bm}, o))) }
|
${ _converse.bookmarks.map(bm => bookmark_item(Object.assign({bm}, o))) }
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
|
53
src/plugins/bookmark-views/utils.js
Normal file
53
src/plugins/bookmark-views/utils.js
Normal file
@ -0,0 +1,53 @@
|
|||||||
|
import { checkBookmarksSupport } from '@converse/headless/plugins/bookmarks/utils';
|
||||||
|
import invokeMap from 'lodash-es/invokeMap';
|
||||||
|
import { Model } from '@converse/skeletor/src/model.js';
|
||||||
|
import { _converse, api, converse } from '@converse/headless/core';
|
||||||
|
import { __ } from 'i18n';
|
||||||
|
|
||||||
|
|
||||||
|
export function getHeadingButtons (view, buttons) {
|
||||||
|
if (_converse.allow_bookmarks && view.model.get('type') === _converse.CHATROOMS_TYPE) {
|
||||||
|
const bookmarked = view.model.get('bookmarked');
|
||||||
|
const data = {
|
||||||
|
'i18n_title': bookmarked ? __('Unbookmark this groupchat') : __('Bookmark this groupchat'),
|
||||||
|
'i18n_text': bookmarked ? __('Unbookmark') : __('Bookmark'),
|
||||||
|
'handler': ev => view.toggleBookmark(ev),
|
||||||
|
'a_class': 'toggle-bookmark',
|
||||||
|
'icon_class': 'fa-bookmark',
|
||||||
|
'name': 'bookmark'
|
||||||
|
};
|
||||||
|
const names = buttons.map(t => t.name);
|
||||||
|
const idx = names.indexOf('details');
|
||||||
|
const data_promise = checkBookmarksSupport().then(s => (s ? data : ''));
|
||||||
|
return idx > -1 ? [...buttons.slice(0, idx), data_promise, ...buttons.slice(idx)] : [data_promise, ...buttons];
|
||||||
|
}
|
||||||
|
return buttons;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function removeBookmarkViaEvent (ev) {
|
||||||
|
ev.preventDefault();
|
||||||
|
const name = ev.target.getAttribute('data-bookmark-name');
|
||||||
|
const jid = ev.target.getAttribute('data-room-jid');
|
||||||
|
if (confirm(__('Are you sure you want to remove the bookmark "%1$s"?', name))) {
|
||||||
|
invokeMap(_converse.bookmarks.where({ jid }), Model.prototype.destroy);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function addBookmarkViaEvent (ev) {
|
||||||
|
ev.preventDefault();
|
||||||
|
const jid = ev.target.getAttribute('data-room-jid');
|
||||||
|
const room = await api.rooms.open(jid, { 'bring_to_foreground': true });
|
||||||
|
room.session.save('view', converse.MUC.VIEWS.BOOKMARK);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
export function openRoomViaEvent (ev) {
|
||||||
|
ev.preventDefault();
|
||||||
|
const { Strophe } = converse.env;
|
||||||
|
const name = ev.target.textContent;
|
||||||
|
const jid = ev.target.getAttribute('data-room-jid');
|
||||||
|
const data = {
|
||||||
|
'name': name || Strophe.unescapeNode(Strophe.getNodeFromJid(jid)) || jid
|
||||||
|
};
|
||||||
|
api.rooms.open(jid, data, true);
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user