From c8f0406c84ae8bd964df08429d33bf03b9ab53cb Mon Sep 17 00:00:00 2001 From: JC Brand Date: Fri, 7 May 2021 11:55:33 +0200 Subject: [PATCH] Refactor bookmark plugins Mainly moving functions and methods to utils --- src/headless/plugins/bookmarks/collection.js | 1 - src/headless/plugins/bookmarks/index.js | 19 +------ src/headless/plugins/bookmarks/utils.js | 17 +++++++ src/plugins/bookmark-views/bookmarks-list.js | 34 ++++--------- src/plugins/bookmark-views/index.js | 35 +++---------- src/plugins/bookmark-views/mixins.js | 31 +----------- src/plugins/bookmark-views/templates/item.js | 24 +++++++++ src/plugins/bookmark-views/templates/list.js | 36 ++++--------- src/plugins/bookmark-views/utils.js | 53 ++++++++++++++++++++ 9 files changed, 122 insertions(+), 128 deletions(-) create mode 100644 src/plugins/bookmark-views/templates/item.js create mode 100644 src/plugins/bookmark-views/utils.js diff --git a/src/headless/plugins/bookmarks/collection.js b/src/headless/plugins/bookmarks/collection.js index 73fce81a5..d83e31c9b 100644 --- a/src/headless/plugins/bookmarks/collection.js +++ b/src/headless/plugins/bookmarks/collection.js @@ -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 = { diff --git a/src/headless/plugins/bookmarks/index.js b/src/headless/plugins/bookmarks/index.js index 44749d74b..46e2a4d8c 100644 --- a/src/headless/plugins/bookmarks/index.js +++ b/src/headless/plugins/bookmarks/index.js @@ -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') diff --git a/src/headless/plugins/bookmarks/utils.js b/src/headless/plugins/bookmarks/utils.js index 0717461ed..1167083a4 100644 --- a/src/headless/plugins/bookmarks/utils.js +++ b/src/headless/plugins/bookmarks/utils.js @@ -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. diff --git a/src/plugins/bookmark-views/bookmarks-list.js b/src/plugins/bookmark-views/bookmarks-list.js index 26b89fea9..5fb2389ba 100644 --- a/src/plugins/bookmark-views/bookmarks-list.js +++ b/src/plugins/bookmark-views/bookmarks-list.js @@ -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(); diff --git a/src/plugins/bookmark-views/index.js b/src/plugins/bookmark-views/index.js index b69a58ae0..f631f72b0 100644 --- a/src/plugins/bookmark-views/index.js +++ b/src/plugins/bookmark-views/index.js @@ -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()); } }); diff --git a/src/plugins/bookmark-views/mixins.js b/src/plugins/bookmark-views/mixins.js index 65902203c..63d2f006e 100644 --- a/src/plugins/bookmark-views/mixins.js +++ b/src/plugins/bookmark-views/mixins.js @@ -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); - } -} diff --git a/src/plugins/bookmark-views/templates/item.js b/src/plugins/bookmark-views/templates/item.js new file mode 100644 index 000000000..6d9da6f3d --- /dev/null +++ b/src/plugins/bookmark-views/templates/item.js @@ -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` + + `; +} diff --git a/src/plugins/bookmark-views/templates/list.js b/src/plugins/bookmark-views/templates/list.js index f96effbbe..1511d096f 100644 --- a/src/plugins/bookmark-views/templates/list.js +++ b/src/plugins/bookmark-views/templates/list.js @@ -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` -
- ${o.bm.getDisplayName()} - - -
- `; -} +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` -
+
+ title="${desc_bookmarks}" + @click=${o.toggleBookmarksList}> - + ${label_bookmarks} -
- ${ o.bookmarks.map(bm => bookmark_item(Object.assign({bm}, o))) } +
+ ${ _converse.bookmarks.map(bm => bookmark_item(Object.assign({bm}, o))) }
`; diff --git a/src/plugins/bookmark-views/utils.js b/src/plugins/bookmark-views/utils.js new file mode 100644 index 000000000..788821109 --- /dev/null +++ b/src/plugins/bookmark-views/utils.js @@ -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); +}