Add focusing on obsidian elements

build.js

@@ -163,8 +163,10 @@ const obsidianPlugin = `
 const { Plugin, Notice } = require('obsidian');
 module.exports = class PocketBird extends Plugin {
 	onload() {
+		console.log("Loading Pocket Bird version ${version}...");
 		const OBSIDIAN_PLUGIN = this;
 		${birbJs}
+		console.log("Pocket Bird loaded!");
 	}
 
 	onunload() {

dist/birb.js

@@ -881,6 +881,17 @@
 			throw new Error("Method not implemented");
 		}
 
+		/**
+		 * @returns {string[]} A list of CSS selectors for focusable elements
+		 */
+		getFocusableElements() {
+			return ["img", "video", ".birb-sticky-note"];
+		}
+
+		getFocusElementTopMargin() {
+			return 80;
+		}
+
 		/**
 		 * @returns {string} The current path of the active page in this context
 		 */
@@ -1084,6 +1095,21 @@
 			this.putSaveData({});
 		}
 
+		/** @override */
+		getFocusElementTopMargin() {
+			return 10;
+		}
+
+		/** @override */
+		getFocusableElements() {
+			const elements = [
+				".workspace-leaf",
+				".cm-callout",
+				".HyperMD-codeblock-begin"
+			];
+			return super.getFocusableElements().concat(elements);
+		}
+
 		/** @override */
 		areStickyNotesEnabled() {
 			return false;
@@ -1795,7 +1821,6 @@
 
 	// Focus element constraints
 	const MIN_FOCUS_ELEMENT_WIDTH = 100;
-	const MIN_FOCUS_ELEMENT_TOP = 80;
 
 	/** @type {Partial<Settings>} */
 	let userSettings = {};
@@ -1924,7 +1949,7 @@
 				insertModal(`${birdBirb()} Mode`, message);
 			}),
 			new Separator(),
-			new MenuItem("2025.11.13.16", () => { alert("Thank you for using Pocket Bird! You are on version: 2025.11.13.16"); }, false),
+			new MenuItem("2025.11.13.27", () => { alert("Thank you for using Pocket Bird! You are on version: 2025.11.13.27"); }, false),
 		];
 
 		const styleElement = document.createElement("style");
@@ -2551,7 +2576,8 @@
 			if (frozen) {
 				return false;
 			}
-			const elements = document.querySelectorAll("img, video, .birb-sticky-note");
+			const MIN_FOCUS_ELEMENT_TOP = getContext().getFocusElementTopMargin();
+			const elements = document.querySelectorAll(getContext().getFocusableElements().join(", "));
 			const inWindow = Array.from(elements).filter((img) => {
 				const rect = img.getBoundingClientRect();
 				return rect.left >= 0 && rect.top >= MIN_FOCUS_ELEMENT_TOP && rect.right <= window.innerWidth && rect.top <= getWindowHeight();

dist/extension/birb.js

@@ -881,6 +881,17 @@
 			throw new Error("Method not implemented");
 		}
 
+		/**
+		 * @returns {string[]} A list of CSS selectors for focusable elements
+		 */
+		getFocusableElements() {
+			return ["img", "video", ".birb-sticky-note"];
+		}
+
+		getFocusElementTopMargin() {
+			return 80;
+		}
+
 		/**
 		 * @returns {string} The current path of the active page in this context
 		 */
@@ -1084,6 +1095,21 @@
 			this.putSaveData({});
 		}
 
+		/** @override */
+		getFocusElementTopMargin() {
+			return 10;
+		}
+
+		/** @override */
+		getFocusableElements() {
+			const elements = [
+				".workspace-leaf",
+				".cm-callout",
+				".HyperMD-codeblock-begin"
+			];
+			return super.getFocusableElements().concat(elements);
+		}
+
 		/** @override */
 		areStickyNotesEnabled() {
 			return false;
@@ -1795,7 +1821,6 @@
 
 	// Focus element constraints
 	const MIN_FOCUS_ELEMENT_WIDTH = 100;
-	const MIN_FOCUS_ELEMENT_TOP = 80;
 
 	/** @type {Partial<Settings>} */
 	let userSettings = {};
@@ -1924,7 +1949,7 @@
 				insertModal(`${birdBirb()} Mode`, message);
 			}),
 			new Separator(),
-			new MenuItem("2025.11.13.16", () => { alert("Thank you for using Pocket Bird! You are on version: 2025.11.13.16"); }, false),
+			new MenuItem("2025.11.13.27", () => { alert("Thank you for using Pocket Bird! You are on version: 2025.11.13.27"); }, false),
 		];
 
 		const styleElement = document.createElement("style");
@@ -2551,7 +2576,8 @@
 			if (frozen) {
 				return false;
 			}
-			const elements = document.querySelectorAll("img, video, .birb-sticky-note");
+			const MIN_FOCUS_ELEMENT_TOP = getContext().getFocusElementTopMargin();
+			const elements = document.querySelectorAll(getContext().getFocusableElements().join(", "));
 			const inWindow = Array.from(elements).filter((img) => {
 				const rect = img.getBoundingClientRect();
 				return rect.left >= 0 && rect.top >= MIN_FOCUS_ELEMENT_TOP && rect.right <= window.innerWidth && rect.top <= getWindowHeight();

dist/extension/manifest.json

@@ -2,7 +2,7 @@
     "manifest_version": 3,
     "name": "Pocket Bird",
     "description": "It's a pet bird in your browser, what more could you want?",
-    "version": "2025.11.13.16",
+    "version": "2025.11.13.27",
     "homepage_url": "https://idreesinc.com",
     "icons": {
         "48": "images/icons/transparent/48x48x1.png",

dist/obsidian/main.js

@@ -2,6 +2,7 @@
 const { Plugin, Notice } = require('obsidian');
 module.exports = class PocketBird extends Plugin {
 	onload() {
+		console.log("Loading Pocket Bird version 2025.11.13.27...");
 		const OBSIDIAN_PLUGIN = this;
 		(function () {
 	'use strict';
@@ -886,6 +887,17 @@ module.exports = class PocketBird extends Plugin {
 			throw new Error("Method not implemented");
 		}
 
+		/**
+		 * @returns {string[]} A list of CSS selectors for focusable elements
+		 */
+		getFocusableElements() {
+			return ["img", "video", ".birb-sticky-note"];
+		}
+
+		getFocusElementTopMargin() {
+			return 80;
+		}
+
 		/**
 		 * @returns {string} The current path of the active page in this context
 		 */
@@ -1089,6 +1101,21 @@ module.exports = class PocketBird extends Plugin {
 			this.putSaveData({});
 		}
 
+		/** @override */
+		getFocusElementTopMargin() {
+			return 10;
+		}
+
+		/** @override */
+		getFocusableElements() {
+			const elements = [
+				".workspace-leaf",
+				".cm-callout",
+				".HyperMD-codeblock-begin"
+			];
+			return super.getFocusableElements().concat(elements);
+		}
+
 		/** @override */
 		areStickyNotesEnabled() {
 			return false;
@@ -1800,7 +1827,6 @@ module.exports = class PocketBird extends Plugin {
 
 	// Focus element constraints
 	const MIN_FOCUS_ELEMENT_WIDTH = 100;
-	const MIN_FOCUS_ELEMENT_TOP = 80;
 
 	/** @type {Partial<Settings>} */
 	let userSettings = {};
@@ -1929,7 +1955,7 @@ module.exports = class PocketBird extends Plugin {
 				insertModal(`${birdBirb()} Mode`, message);
 			}),
 			new Separator(),
-			new MenuItem("2025.11.13.16", () => { alert("Thank you for using Pocket Bird! You are on version: 2025.11.13.16"); }, false),
+			new MenuItem("2025.11.13.27", () => { alert("Thank you for using Pocket Bird! You are on version: 2025.11.13.27"); }, false),
 		];
 
 		const styleElement = document.createElement("style");
@@ -2556,7 +2582,8 @@ module.exports = class PocketBird extends Plugin {
 			if (frozen) {
 				return false;
 			}
-			const elements = document.querySelectorAll("img, video, .birb-sticky-note");
+			const MIN_FOCUS_ELEMENT_TOP = getContext().getFocusElementTopMargin();
+			const elements = document.querySelectorAll(getContext().getFocusableElements().join(", "));
 			const inWindow = Array.from(elements).filter((img) => {
 				const rect = img.getBoundingClientRect();
 				return rect.left >= 0 && rect.top >= MIN_FOCUS_ELEMENT_TOP && rect.right <= window.innerWidth && rect.top <= getWindowHeight();
@@ -2720,6 +2747,7 @@ module.exports = class PocketBird extends Plugin {
 
 })();
 
+		console.log("Pocket Bird loaded!");
 	}
 
 	onunload() {

dist/obsidian/manifest.json

@@ -1,7 +1,7 @@
 {
     "id": "pocket-bird",
     "name": "Pocket Bird",
-    "version": "2025.11.13.16",
+    "version": "2025.11.13.27",
     "minAppVersion": "0.15.0",
     "description": "It's a pet bird in your Obsidian, what more could you want?",
     "author": "Idrees Hassan",

dist/userscript/birb.user.js

@@ -1,7 +1,7 @@
 // ==UserScript==
 // @name         Pocket Bird
 // @namespace    https://idreesinc.com
-// @version      2025.11.13.16
+// @version      2025.11.13.27
 // @description  It's a bird that hops around your web browser, the future is here 
 // @author       Idrees
 // @downloadURL  https://github.com/IdreesInc/Pocket-Bird/raw/refs/heads/main/dist/userscript/birb.user.js
@@ -895,6 +895,17 @@
 			throw new Error("Method not implemented");
 		}
 
+		/**
+		 * @returns {string[]} A list of CSS selectors for focusable elements
+		 */
+		getFocusableElements() {
+			return ["img", "video", ".birb-sticky-note"];
+		}
+
+		getFocusElementTopMargin() {
+			return 80;
+		}
+
 		/**
 		 * @returns {string} The current path of the active page in this context
 		 */
@@ -1098,6 +1109,21 @@
 			this.putSaveData({});
 		}
 
+		/** @override */
+		getFocusElementTopMargin() {
+			return 10;
+		}
+
+		/** @override */
+		getFocusableElements() {
+			const elements = [
+				".workspace-leaf",
+				".cm-callout",
+				".HyperMD-codeblock-begin"
+			];
+			return super.getFocusableElements().concat(elements);
+		}
+
 		/** @override */
 		areStickyNotesEnabled() {
 			return false;
@@ -1809,7 +1835,6 @@
 
 	// Focus element constraints
 	const MIN_FOCUS_ELEMENT_WIDTH = 100;
-	const MIN_FOCUS_ELEMENT_TOP = 80;
 
 	/** @type {Partial<Settings>} */
 	let userSettings = {};
@@ -1938,7 +1963,7 @@
 				insertModal(`${birdBirb()} Mode`, message);
 			}),
 			new Separator(),
-			new MenuItem("2025.11.13.16", () => { alert("Thank you for using Pocket Bird! You are on version: 2025.11.13.16"); }, false),
+			new MenuItem("2025.11.13.27", () => { alert("Thank you for using Pocket Bird! You are on version: 2025.11.13.27"); }, false),
 		];
 
 		const styleElement = document.createElement("style");
@@ -2565,7 +2590,8 @@
 			if (frozen) {
 				return false;
 			}
-			const elements = document.querySelectorAll("img, video, .birb-sticky-note");
+			const MIN_FOCUS_ELEMENT_TOP = getContext().getFocusElementTopMargin();
+			const elements = document.querySelectorAll(getContext().getFocusableElements().join(", "));
 			const inWindow = Array.from(elements).filter((img) => {
 				const rect = img.getBoundingClientRect();
 				return rect.left >= 0 && rect.top >= MIN_FOCUS_ELEMENT_TOP && rect.right <= window.innerWidth && rect.top <= getWindowHeight();

src/application.js

@@ -104,7 +104,6 @@ const PET_FEATHER_BOOST = 2;
 
 // Focus element constraints
 const MIN_FOCUS_ELEMENT_WIDTH = 100;
-const MIN_FOCUS_ELEMENT_TOP = 80;
 
 /** @type {Partial<Settings>} */
 let userSettings = {};
@@ -864,7 +863,8 @@ Promise.all([
 		if (frozen) {
 			return false;
 		}
-		const elements = document.querySelectorAll("img, video, .birb-sticky-note");
+		const MIN_FOCUS_ELEMENT_TOP = getContext().getFocusElementTopMargin();
+		const elements = document.querySelectorAll(getContext().getFocusableElements().join(", "));
 		const inWindow = Array.from(elements).filter((img) => {
 			const rect = img.getBoundingClientRect();
 			return rect.left >= 0 && rect.top >= MIN_FOCUS_ELEMENT_TOP && rect.right <= window.innerWidth && rect.top <= getWindowHeight();

src/context.js

@@ -42,6 +42,17 @@ export class Context {
 		throw new Error("Method not implemented");
 	}
 
+	/**
+	 * @returns {string[]} A list of CSS selectors for focusable elements
+	 */
+	getFocusableElements() {
+		return ["img", "video", ".birb-sticky-note"];
+	}
+
+	getFocusElementTopMargin() {
+		return 80;
+	}
+
 	/**
 	 * @returns {string} The current path of the active page in this context
 	 */
@@ -245,6 +256,21 @@ class ObsidianContext extends Context {
 		this.putSaveData({});
 	}
 
+	/** @override */
+	getFocusElementTopMargin() {
+		return 10;
+	}
+
+	/** @override */
+	getFocusableElements() {
+		const elements = [
+			".workspace-leaf",
+			".cm-callout",
+			".HyperMD-codeblock-begin"
+		];
+		return super.getFocusableElements().concat(elements);
+	}
+
 	/** @override */
 	areStickyNotesEnabled() {
 		return false;