diff --git a/manifest.json b/manifest.json index 605a733..cc77b65 100644 --- a/manifest.json +++ b/manifest.json @@ -1,7 +1,7 @@ { "id": "plugins-annotations", "name": "Plugins Annotations", - "version": "1.6.4", + "version": "1.6.5", "minAppVersion": "1.5.0", "description": "Allows adding personal comments to each installed plugin.", "author": "Andrea Alberti", diff --git a/src/main.ts b/src/main.ts index 1098a31..8dbebd9 100644 --- a/src/main.ts +++ b/src/main.ts @@ -40,6 +40,8 @@ export default class PluginsAnnotations extends Plugin { \ '; + private lockIcon: HTMLDivElement | null = null; + private mutationObserver: MutationObserver | null = null; private observedTab: SettingTab | null = null; private vaultPath: string | null = null; @@ -48,7 +50,7 @@ export default class PluginsAnnotations extends Plugin { private saveTimeout: number | null = null; private savePromise: Promise | null = null; private resolveSavePromise: (() => void) | null = null; - + async onload() { // console.clear(); @@ -440,31 +442,36 @@ export default class PluginsAnnotations extends Plugin { } async addIcon(tab: SettingTab) { + // This should not be necessary, but just in case, remove the icon if it was there + this.removeIcon(); + // Add new icon to the existing icons container const headingContainer = tab.containerEl.querySelector('.setting-item-heading .setting-item-control'); if (headingContainer) { - const newIcon = document.createElement('div'); - newIcon.classList.add('clickable-icon', 'extra-setting-button'); + this.lockIcon = document.createElement('div'); + + const lockIcon = this.lockIcon; + lockIcon.classList.add('clickable-icon', 'extra-setting-button'); if(this.settings.editable) { - newIcon.setAttribute('aria-label', 'Click to lock personal annotations'); - newIcon.innerHTML = this.svg_unlocked; + lockIcon.setAttribute('aria-label', 'Click to lock personal annotations'); + lockIcon.innerHTML = this.svg_unlocked; } else { - newIcon.setAttribute('aria-label', 'Click to be able to edit personal annotations'); - newIcon.innerHTML = this.svg_locked; + lockIcon.setAttribute('aria-label', 'Click to be able to edit personal annotations'); + lockIcon.innerHTML = this.svg_locked; } - newIcon.addEventListener('click', (event:MouseEvent) => { + lockIcon.addEventListener('click', (event:MouseEvent) => { this.settings.editable = !this.settings.editable; this.debouncedSaveAnnotations(); if(this.settings.editable) { - newIcon.setAttribute('aria-label', 'Click to lock personal annotations'); - newIcon.innerHTML = this.svg_unlocked; + lockIcon.setAttribute('aria-label', 'Click to lock personal annotations'); + lockIcon.innerHTML = this.svg_unlocked; } else { - newIcon.setAttribute('aria-label', 'Click to unlock personal annotations'); - newIcon.innerHTML = this.svg_locked; + lockIcon.setAttribute('aria-label', 'Click to unlock personal annotations'); + lockIcon.innerHTML = this.svg_locked; } const plugins = tab.containerEl.querySelectorAll('.plugin-comment-annotation'); @@ -500,7 +507,14 @@ export default class PluginsAnnotations extends Plugin { }); }); - headingContainer.appendChild(newIcon); + headingContainer.appendChild(lockIcon); + } + } + + removeIcon() { + if(this.lockIcon) { + this.lockIcon.remove(); + this.lockIcon = null; } } @@ -597,6 +611,9 @@ export default class PluginsAnnotations extends Plugin { // Just in case, disconnect observers if they still exist this.disconnectObservers(); + + // Remove icons + this.removeIcon(); } getUninstalledPlugins(): PluginAnnotationDict {