diff --git a/repo/emoji-sets/client.mjs b/repo/emoji-sets/client.mjs index d355f15..b67fb26 100644 --- a/repo/emoji-sets/client.mjs +++ b/repo/emoji-sets/client.mjs @@ -11,7 +11,7 @@ export default async function ({ web, env }, db) { imgEmojiSelector = '.notion-emoji:not([data-emoji-sets-unsupported])', imgEmojiOverlaySelector = `${imgEmojiSelector} + [src*="notion-emojis"]`; - await web.whenReady(); + await Promise.any([web.whenReady([nativeEmojiSelector]), web.whenReady([imgEmojiSelector])]); const nativeEmojis = document.querySelectorAll(nativeEmojiSelector).length, imgEmojis = document.querySelectorAll(imgEmojiSelector).length; diff --git a/repo/registry.json b/repo/registry.json index 0c137df..96b6ef4 100644 --- a/repo/registry.json +++ b/repo/registry.json @@ -25,5 +25,6 @@ "indentation-lines", "focus-mode", "word-counter", - "emoji-sets" + "emoji-sets", + "topbar-icons" ] diff --git a/repo/topbar-icons/client.mjs b/repo/topbar-icons/client.mjs new file mode 100644 index 0000000..75fea46 --- /dev/null +++ b/repo/topbar-icons/client.mjs @@ -0,0 +1,57 @@ +/* + * notion-enhancer: topbar icons + * (c) 2020 CloudHill (https://github.com/CloudHill) + * (c) 2021 dragonwocky (https://dragonwocky.me/) + * (https://notion-enhancer.github.io/) under the MIT license + */ + +'use strict'; + +export default async function ({ web, components }, db) { + await web.whenReady(['.notion-topbar-action-buttons']); + + if ((await db.get(['share'])) === true) { + const $share = document.querySelector('.notion-topbar-share-menu'); + $share.innerHTML = await components.feather('share-2', { + style: 'width:16px;height:16px;color:var(--theme--icon);', + }); + } + + const styleTextButton = ($btn) => { + $btn.style.width = 'auto'; + $btn.style.fontSize = '14px'; + $btn.style.lineHeight = '1.2'; + $btn.style.paddingLeft = '8px'; + $btn.style.paddingRight = '8px'; + }; + + if ((await db.get(['comments'])) === false) { + const $comments = document.querySelector('.notion-topbar-comments-button'); + styleTextButton($comments); + $comments.innerHTML = 'Comments'; + } + + if ((await db.get(['updates'])) === false) { + const $updates = document.querySelector('.notion-topbar-updates-button'); + styleTextButton($updates); + $updates.innerHTML = 'Updates'; + } + + if ((await db.get(['favorite'])) === false) { + const $favorite = document.querySelector( + '.notion-topbar-updates-button + [aria-label^="Fav"]' + ); + styleTextButton($favorite); + $favorite.innerHTML = $favorite.ariaLabel; + $favorite.addEventListener('click', async () => { + await new Promise((res, rej) => requestAnimationFrame(res)); + $favorite.innerHTML = $favorite.ariaLabel; + }); + } + + if ((await db.get(['more'])) === false) { + const $more = document.querySelector('.notion-topbar-more-button'); + styleTextButton($more); + $more.innerHTML = 'More'; + } +} diff --git a/repo/topbar-icons/mod.json b/repo/topbar-icons/mod.json new file mode 100644 index 0000000..ae1d093 --- /dev/null +++ b/repo/topbar-icons/mod.json @@ -0,0 +1,56 @@ +{ + "name": "topbar icons", + "id": "e0700ce3-a9ae-45f5-92e5-610ded0e348d", + "version": "0.3.0", + "description": "choose between text or icons for the topbar buttons.", + "tags": ["extension", "customisation"], + "authors": [ + { + "name": "CloudHill", + "email": "rh.cloudhill@gmail.com", + "homepage": "https://github.com/CloudHill", + "avatar": "https://avatars.githubusercontent.com/u/54142180" + } + ], + "js": { + "client": ["client.mjs"] + }, + "css": {}, + "options": [ + { + "type": "toggle", + "key": "share", + "label": "share", + "tooltip": "**on = icon, off = text**", + "value": false + }, + { + "type": "toggle", + "key": "comments", + "label": "comments", + "tooltip": "**on = icon, off = text**", + "value": true + }, + { + "type": "toggle", + "key": "updates", + "label": "updates", + "tooltip": "**on = icon, off = text**", + "value": true + }, + { + "type": "toggle", + "key": "favorite", + "label": "favorite", + "tooltip": "**on = icon, off = text**", + "value": true + }, + { + "type": "toggle", + "key": "more", + "label": "more (3 dots)", + "tooltip": "**on = icon, off = text**", + "value": true + } + ] +}