Refactor bookmark plugins

Mainly moving functions and methods to utils
This commit is contained in:
JC Brand 2021-05-07 11:55:33 +02:00
parent 18e3b618b4
commit c8f0406c84
9 changed files with 122 additions and 128 deletions

View File

@ -7,7 +7,6 @@ import { getOpenPromise } from '@converse/openpromise';
import { initStorage } from '@converse/headless/shared/utils.js';
const { Strophe, $iq, sizzle } = converse.env;
const u = converse.env.utils;
const Bookmarks = {

View File

@ -11,30 +11,13 @@ import log from "@converse/headless/log.js";
import { Collection } from "@converse/skeletor/src/collection";
import { Model } from '@converse/skeletor/src/model.js';
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;
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) {
if (sizzle(`event[xmlns="${Strophe.NS.PUBSUB}#event"] items[node="${Strophe.NS.BOOKMARKS}"]`, message).length) {
api.waitUntil('bookmarksInitialized')

View File

@ -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
* for this groupchat and return it.

View File

@ -1,10 +1,10 @@
import log from '@converse/headless/log';
import tpl_bookmarks_list from './templates/list.js';
import { ElementView } from '@converse/skeletor/src/element.js';
import { _converse, api, converse } from '@converse/headless/core';
import { initStorage } from '@converse/headless/shared/utils.js';
import { render } from 'lit';
const { Strophe } = converse.env;
const u = converse.env.utils;
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, '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 });
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 () {
const is_hidden = b => !!(api.settings.get('hide_open_bookmarks') && _converse.chatboxes.get(b.get('jid')));
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),
'toggle_state': this.model.get('toggle-state')
}), 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) {
if (ev && ev.preventDefault) {
ev.preventDefault();

View File

@ -1,5 +1,4 @@
/**
* @module converse-bookmark-views
* @description Converse.js plugin which adds views for XEP-0048 bookmarks
* @copyright 2020, the Converse.js contributors
* @license Mozilla Public License (MPLv2)
@ -7,10 +6,9 @@
import '@converse/headless/plugins/muc/index.js';
import BookmarkForm from './form.js';
import BookmarksView from './bookmarks-list.js';
import { __ } from 'i18n';
import { _converse, api, converse } from '@converse/headless/core';
import { bookmarkableChatRoomView, eventMethods } from './mixins.js';
import { checkBookmarksSupport } from '@converse/headless/plugins/bookmarks/utils';
import { bookmarkableChatRoomView } from './mixins.js';
import { getHeadingButtons, removeBookmarkViaEvent, addBookmarkViaEvent } from './utils.js';
import './styles/bookmarks.scss';
@ -23,8 +21,6 @@ converse.plugins.add('converse-bookmark-views', {
* 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
* 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'],
@ -37,34 +33,15 @@ converse.plugins.add('converse-bookmark-views', {
hide_open_bookmarks: true
});
Object.assign(_converse, eventMethods);
_converse.removeBookmarkViaEvent = removeBookmarkViaEvent;
_converse.addBookmarkViaEvent = addBookmarkViaEvent;
Object.assign(_converse.ChatRoomView.prototype, bookmarkableChatRoomView);
_converse.MUCBookmarkForm = BookmarkForm;
_converse.BookmarksView = BookmarksView;
/************************ BEGIN Event Handlers ************************/
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('getHeadingButtons', getHeadingButtons);
api.listen.on('chatRoomViewInitialized', view => view.setBookmarkState());
}
});

View File

@ -1,7 +1,4 @@
import invokeMap from 'lodash-es/invokeMap';
import { Model } from '@converse/skeletor/src/model.js';
import { __ } from 'i18n';
import { _converse, api, converse } from '@converse/headless/core';
import { _converse, converse } from '@converse/headless/core';
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);
}
}

View 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>
`;
}

View File

@ -1,38 +1,22 @@
import { html } from "lit";
import bookmark_item from './item.js';
import { __ } from 'i18n';
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>
`;
}
import { _converse } from '@converse/headless/core.js';
import { html } from "lit";
export default (o) => {
const is_collapsed = _converse.bookmarks.getUnopenedBookmarks().length ? true : false;
const desc_bookmarks = __('Click to toggle the bookmarks list');
const label_bookmarks = __('Bookmarks');
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"
title="${desc_bookmarks}"
@click=${o.toggleBookmarksList}>
title="${desc_bookmarks}"
@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>
<div class="items-list bookmarks rooms-list ${ (o.toggle_state !== o._converse.OPENED) ? 'hidden' : '' }">
${ o.bookmarks.map(bm => bookmark_item(Object.assign({bm}, o))) }
<div class="items-list bookmarks rooms-list ${ (o.toggle_state !== _converse.OPENED) ? 'hidden' : '' }">
${ _converse.bookmarks.map(bm => bookmark_item(Object.assign({bm}, o))) }
</div>
</div>
`;

View 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);
}