Update manifest.json

README.md

@@ -13,10 +13,6 @@ It's a pet bird that hops around your computer, what more could you want?
 
 ### Get it for [Mozilla Firefox](https://addons.mozilla.org/en-US/firefox/addon/pocket-bird/)
 
-### Get it for [Obsidian (beta)](https://github.com/IdreesInc/Pocket-Bird#Obsidian)
-
-### Get it for [TamperMonkey](https://github.com/IdreesInc/Pocket-Bird#Userscript)
-
 #### Join the [Discord](https://discord.gg/6yxE9prcNc) to help me beta test new features and suggest ideas!
 
 ## Features
@@ -41,11 +37,7 @@ It's a pet bird that hops around your computer, what more could you want?
 
 ### Obsidian
 
-1. Install the [Beta Plugin Manager (BRAT)](https://obsidian.md/plugins?id=obsidian42-brat) plugin for Obsidian
+_Coming soon!_
-2. Enable the BRAT plugin and open its settings
-3. In the BRAT settings, click "Add Beta Plugin" and enter the following URL: `https://github.com/IdreesInc/PB-Obsidian-Releases`
-4. Select "Latest version" and click "Add Plugin"
-5. Enjoy a pet bird in your Obsidian notes!
 
 ### Userscript
 
@@ -56,14 +48,6 @@ It's a pet bird that hops around your computer, what more could you want?
 3. Install my Pocket Bird script by going to this link and clicking install: [https://github.com/IdreesInc/Pocket-Bird/raw/refs/heads/main/dist/userscript/birb.user.js](https://github.com/IdreesInc/Pocket-Bird/raw/refs/heads/main/dist/userscript/birb.user.js)
 4. Now any websites you visit will have a little bird hopping around!
 
-### Your Own Website
-
-Pocket Bird can also be embedded directly into your own website! Just include the following code snippet anywhere in your HTML:
-
-```html
-<script src="https://cdn.jsdelivr.net/gh/IdreesInc/Pocket-Bird@main/dist/web/birb.embed.js"></script>
-```
-
 ## FAQ
 
 ### How do I pet the bird?
@@ -90,15 +74,6 @@ Open the Pocket Bird menu by clicking the bird and select "Settings". From there
 
 If you are running Pocket bird on a browser, the extension needs these permissions in order to insert the bird and sticky notes into your webpages. Pocket Bird does not collect any of your data or browsing history and all data is stored locally on your device!
 
-## Sites With Pocket Bird
-
-Here are some websites where you can find Pocket Bird hopping around:
-
-- [https://grepjason.sh](https://grepjason.sh)
-
-*If you've added Pocket Bird to your website, let me know and I'll add it to this list!*
-
-
 ## Getting in Touch
 
 If you'd like to get in touch, check out the [Discord](https://discord.gg/6yxE9prcNc) to suggest features, report bugs, and stay updated on development!

build.js

@@ -12,24 +12,19 @@ const IMAGES_DIR = "./images";
 const FONTS_DIR = "./fonts";
 const DIST_DIR = "./dist";
 
-const WEB_DIR = DIST_DIR + "/web";
+const BROWSER_MANIFEST = "./platform-specific/extension/manifest.json";
+const OBSIDIAN_MANIFEST = "./platform-specific/obsidian/manifest.json";
+const USERSCRIPT_HEADER = "./platform-specific/userscript/header.txt"; 
+const OBSIDIAN_WRAPPER = "./platform-specific/obsidian/wrapper.js";
+
 const USERSCRIPT_DIR = DIST_DIR + "/userscript";
 const EXTENSION_DIR = DIST_DIR + "/extension";
 const OBSIDIAN_DIR = DIST_DIR + "/obsidian";
 
 const STYLESHEET_PATH = SRC_DIR + "/stylesheet.css";
-
+const APPLICATION_ENTRY = SRC_DIR + "/application.js";
-const WEB_ENTRY = SRC_DIR + "/platforms/web/web.js";
+const BUNDLED_OUTPUT = DIST_DIR + "/birb.bundled.js";
-const USERSCRIPT_ENTRY = SRC_DIR + "/platforms/userscript/userscript.js";
+const BIRB_OUTPUT = DIST_DIR + "/birb.js";
-const BROWSER_EXTENSION_ENTRY = SRC_DIR + "/platforms/extension/extension.js";
-const OBSIDIAN_ENTRY = SRC_DIR + "/platforms/obsidian/obsidian.js";
-
-const BROWSER_MANIFEST = SRC_DIR + "/platforms/extension/manifest.json";
-const OBSIDIAN_MANIFEST = SRC_DIR + "/platforms/obsidian/manifest.json";
-const USERSCRIPT_HEADER = SRC_DIR + "/platforms/userscript/header.txt";
-const OBSIDIAN_WRAPPER = SRC_DIR + "/platforms/obsidian/wrapper.js";
-
-const TEMP_BUNDLED_OUTPUT = DIST_DIR + "/birb.bundled.js";
 
 const MONOCRAFT_URL = "https://cdn.jsdelivr.net/gh/idreesinc/Monocraft@99b32ab40612ff2533a69d8f14bd8b3d9e604456/dist/Monocraft.otf";
 
@@ -72,138 +67,119 @@ if (buildCache.version && buildCache.version.startsWith(versionDate)) {
 	}
 }
 
-// const version = `${versionDate}.${buildNumber}`;
+const version = `${versionDate}.${buildNumber}`;
-const version = `${versionDate}`; // Disable build number for now
 
 // Update build cache
 buildCache.version = version;
 writeFileSync(BUILD_CACHE_PATH, JSON.stringify(buildCache), 'utf8');
 
-/**
+// =============================================
- * @param {string} entryPoint
+// Build JavaScript function
- * @param {boolean} [embedFont]
+// =============================================
- * @returns {Promise<string>}
- */
-async function generateCode(entryPoint, embedFont = false) {
-	// Bundle with rollup
-	const bundle = await rollup({
-		input: entryPoint,
-	});
 
-	await bundle.write({
+// Bundle with rollup
-		file: TEMP_BUNDLED_OUTPUT,
+const bundle = await rollup({
+	input: APPLICATION_ENTRY,
+});
+
+await bundle.write({
+	file: BUNDLED_OUTPUT,
 	format: 'iife',
-	});
+});
 
-	await bundle.close();
+await bundle.close();
 
-	let birbJs = readFileSync(TEMP_BUNDLED_OUTPUT, 'utf8');
+let birbJs = readFileSync(BUNDLED_OUTPUT, 'utf8');
 
-	// Delete bundled file
+// Delete bundled file
-	unlinkSync(TEMP_BUNDLED_OUTPUT);
+unlinkSync(BUNDLED_OUTPUT);
 
-	// Replace version placeholder
+// Replace version placeholder
-	birbJs = birbJs.replaceAll(VERSION_KEY, version);
+birbJs = birbJs.replaceAll(VERSION_KEY, version);
 
-	// Compile and insert sprite sheets
+// Compile and insert sprite sheets
-	for (const spriteSheet of spriteSheets) {
+for (const spriteSheet of spriteSheets) {
 	const dataUri = readFileSync(spriteSheet.path, 'base64');
 	birbJs = birbJs.replaceAll(spriteSheet.key, `data:image/png;base64,${dataUri}`);
-	}
-
-	// Insert stylesheet
-	const stylesheetContent = readFileSync(STYLESHEET_PATH, 'utf8');
-	birbJs = birbJs.replace(STYLESHEET_KEY, stylesheetContent);
-
-	if (embedFont) {
-		// Encode font to data URI
-		const monocraftFontData = readFileSync(FONTS_DIR + '/Monocraft.otf', 'base64');
-		const monocraftDataUri = `data:font/otf;base64,${monocraftFontData}`;
-		birbJs = birbJs.replaceAll(MONOCRAFT_SRC_KEY, monocraftDataUri);
-	} else {
-		birbJs = birbJs.replaceAll(MONOCRAFT_SRC_KEY, MONOCRAFT_URL);
-	}
-	return birbJs;
 }
 
-async function buildWeb() {
+// Insert stylesheet
-	const birbJs = await generateCode(WEB_ENTRY);
+const stylesheetContent = readFileSync(STYLESHEET_PATH, 'utf8');
-	mkdirSync(WEB_DIR, { recursive: true });
+birbJs = birbJs.replace(STYLESHEET_KEY, stylesheetContent).replace(MONOCRAFT_SRC_KEY, MONOCRAFT_URL);
-	writeFileSync(WEB_DIR + '/birb.js', birbJs);
-	writeFileSync(WEB_DIR + '/birb.embed.js', birbJs);
-}
 
-async function buildUserscript() {
-	const birbJs = await generateCode(USERSCRIPT_ENTRY);
 
-	// Get userscript header
+// Write bundled JavaScript function
-	const userScriptHeader = readFileSync(USERSCRIPT_HEADER, 'utf8').replaceAll(VERSION_KEY, version);
+writeFileSync(BIRB_OUTPUT, birbJs);
 
-	mkdirSync(USERSCRIPT_DIR, { recursive: true });
+// =============================================
-	const userScript = userScriptHeader + "\n" + birbJs;
+// Build userscript
-	writeFileSync(USERSCRIPT_DIR + '/birb.user.js', userScript);
+// =============================================
-}
 
-async function buildExtension() {
+// Get userscript header
-	const birbJs = await generateCode(BROWSER_EXTENSION_ENTRY);
+const userScriptHeader = readFileSync(USERSCRIPT_HEADER, 'utf8').replaceAll(VERSION_KEY, version);
 
-	mkdirSync(EXTENSION_DIR, { recursive: true });
+mkdirSync(USERSCRIPT_DIR, { recursive: true });
+const userScript = userScriptHeader + "\n" + birbJs;
+writeFileSync(USERSCRIPT_DIR + '/birb.user.js', userScript);
 
-	// Copy birb.js
+// =============================================
-	writeFileSync(EXTENSION_DIR + '/birb.js', birbJs);
+// Build browser extension
+// =============================================
 
-	// Copy manifest.json
+mkdirSync(EXTENSION_DIR, { recursive: true });
-	let browserManifest = readFileSync(BROWSER_MANIFEST, 'utf8');
-	browserManifest = browserManifest.replace(VERSION_KEY, version);
-	writeFileSync(EXTENSION_DIR + '/manifest.json', browserManifest);
 
-	// Copy icons folder
+// Copy birb.js
-	mkdirSync(EXTENSION_DIR + '/images/icons', { recursive: true });
+writeFileSync(EXTENSION_DIR + '/birb.js', birbJs);
-	cpSync(IMAGES_DIR + '/icons/transparent', EXTENSION_DIR + '/images/icons/transparent', { recursive: true });
 
-	// Copy fonts folder
+// Copy manifest.json
-	mkdirSync(EXTENSION_DIR + '/fonts', { recursive: true });
+let browserManifest = readFileSync(BROWSER_MANIFEST, 'utf8');
-	cpSync(FONTS_DIR, EXTENSION_DIR + '/fonts', { recursive: true });
+browserManifest = browserManifest.replace(VERSION_KEY, version);
+writeFileSync(EXTENSION_DIR + '/manifest.json', browserManifest);
 
-	// Compress extension folder into zip
+// Copy icons folder
-	const output = createWriteStream(DIST_DIR + "/extension.zip");
+mkdirSync(EXTENSION_DIR + '/images/icons', { recursive: true });
-	const archive = archiver('zip');
+cpSync(IMAGES_DIR + '/icons/transparent', EXTENSION_DIR + '/images/icons/transparent', { recursive: true });
 
-	output.on('close', () => {
+// Copy fonts folder
+mkdirSync(EXTENSION_DIR + '/fonts', { recursive: true });
+cpSync(FONTS_DIR, EXTENSION_DIR + '/fonts', { recursive: true });
+
+// Compress extension folder into zip
+const output = createWriteStream(DIST_DIR + "/extension.zip");
+const archive = archiver('zip');
+
+output.on('close', () => {
 	console.log(`Created zip file: ${archive.pointer()} total bytes`);
-	});
+});
 
-	archive.on('error', (err) => {
+archive.on('error', (err) => {
 	throw err;
-	});
+});
 
-	archive.pipe(output);
+archive.pipe(output);
-	archive.directory(EXTENSION_DIR + '/', false);
+archive.directory(EXTENSION_DIR + '/', false);
-	archive.finalize();
+archive.finalize();
-}
 
-async function buildObsidian() {
+// =============================================
-	const birbJs = await generateCode(OBSIDIAN_ENTRY, true);
+// Build Obsidian plugin
+// =============================================
 
-	mkdirSync(OBSIDIAN_DIR, { recursive: true });
+mkdirSync(OBSIDIAN_DIR, { recursive: true });
 
-	// Wrap birb.js with plugin boilerplate
+// Wrap birb.js with plugin boilerplate
-	let obsidianPlugin = readFileSync(OBSIDIAN_WRAPPER, 'utf8').replace(VERSION_KEY, version).replace(CODE_KEY, birbJs);
+let obsidianPlugin = readFileSync(OBSIDIAN_WRAPPER, 'utf8').replace(VERSION_KEY, version).replace(CODE_KEY, birbJs);
 
-	// Create main.js with plugin code
+// Encode font to data URI since Obsidian plugins can't have external font files
-	writeFileSync(OBSIDIAN_DIR + '/main.js', obsidianPlugin);
+const monocraftFontData = readFileSync(FONTS_DIR + '/Monocraft.otf', 'base64');
+const monocraftDataUri = `data:font/otf;base64,${monocraftFontData}`;
+obsidianPlugin = obsidianPlugin.replace(MONOCRAFT_URL, monocraftDataUri);
 
-	// Copy manifest.json
+// Create main.js with plugin code
-	let obsidianManifest = readFileSync(OBSIDIAN_MANIFEST, 'utf8');
+writeFileSync(OBSIDIAN_DIR + '/main.js', obsidianPlugin);
-	obsidianManifest = obsidianManifest.replace(/"version":\s*".*"/, `"version": "${version}"`);
-	writeFileSync(OBSIDIAN_DIR + '/manifest.json', obsidianManifest);
-}
 
-console.log("Starting build...");
+// Copy manifest.json
+let obsidianManifest = readFileSync(OBSIDIAN_MANIFEST, 'utf8');
+obsidianManifest = obsidianManifest.replace(/"version":\s*".*"/, `"version": "${version}"`);
+writeFileSync(OBSIDIAN_DIR + '/manifest.json', obsidianManifest);
 
-await buildWeb();
+console.log(`Build complete: ${version}`);
-await buildUserscript();
-await buildExtension();
-await buildObsidian();
-
-console.log("Build completed successfully!");

dist/birb.js

@@ -7,7 +7,6 @@
 	};
 
 	let debugMode = location.hostname === "127.0.0.1";
-	let context = null;
 
 	/**
 	 * @returns {boolean} Whether debug mode is enabled
@@ -23,17 +22,6 @@
 		debugMode = value;
 	}
 
-	function getContext() {
-		if (!context) {
-			throw new Error("Context requested before being set");
-		}
-		return context;
-	}
-
-	function setContext(newContext) {
-		context = newContext;
-	}
-
 	/**
 	 * Create an HTML element with the specified parameters
 	 * @param {string} className
@@ -858,6 +846,7 @@
 	}
 
 	const SAVE_KEY = "birbSaveData";
+	const ROOT_PATH = "";
 
 	/**
 	 * @typedef {import('./application.js').BirbSaveData} BirbSaveData
@@ -868,6 +857,14 @@
 	 */
 	class Context {
 
+		/**
+		 * @abstract
+		 * @returns {boolean} Whether this context is applicable
+		 */
+		isContextActive() {
+			throw new Error("Method not implemented");
+		}
+
 		/**
 		 * @abstract
 		 * @returns {Promise<BirbSaveData|{}>}
@@ -951,6 +948,16 @@
 
 	class LocalContext extends Context {
 
+		/**
+		 * @override
+		 * @returns {boolean}
+		 */
+		isContextActive() {
+			return window.location.hostname === "127.0.0.1"
+				|| window.location.hostname === "localhost"
+				|| window.location.hostname.startsWith("192.168.");
+		}
+
 		/**
 		 * @override
 		 * @returns {Promise<BirbSaveData|{}>}
@@ -976,6 +983,204 @@
 		}
 	}
 
+	class UserScriptContext extends Context {
+
+		/**
+		 * @override
+		 * @returns {boolean}
+		 */
+		isContextActive() {
+			// @ts-expect-error
+			return typeof GM_getValue === "function";
+		}
+
+		/**
+		 * @override
+		 * @returns {Promise<BirbSaveData|{}>}
+		 */
+		async getSaveData() {
+			log("Loading save data from UserScript storage");
+			/** @type {BirbSaveData|{}} */
+			let saveData = {};
+			// @ts-expect-error
+			saveData = GM_getValue(SAVE_KEY, {}) ?? {};
+			return saveData;
+		}
+
+		/**
+		 * @override
+		 * @param {BirbSaveData} saveData
+		 */
+		async putSaveData(saveData) {
+			log("Saving data to UserScript storage");
+			// @ts-expect-error
+			GM_setValue(SAVE_KEY, saveData);
+		}
+
+		/** @override */
+		resetSaveData() {
+			log("Resetting save data in UserScript storage");
+			// @ts-expect-error
+			GM_deleteValue(SAVE_KEY);
+		}
+	}
+
+	class BrowserExtensionContext extends Context {
+
+		/**
+		 * @override
+		 * @returns {boolean}
+		 */
+		isContextActive() {
+			// @ts-expect-error
+			return typeof chrome !== "undefined";
+		}
+
+		/**
+		 * @override
+		 * @returns {Promise<BirbSaveData|{}>}
+		 */
+		async getSaveData() {
+			log("Loading save data from browser extension storage");
+			return new Promise((resolve) => {
+				// @ts-expect-error
+				chrome.storage.sync.get([SAVE_KEY], (result) => {
+					resolve(result[SAVE_KEY] ?? {});
+				});
+			});
+		}
+
+		/**
+		 * @override
+		 * @param {BirbSaveData} saveData
+		 */
+		async putSaveData(saveData) {
+			log("Saving data to browser extension storage");
+			// @ts-expect-error
+			chrome.storage.sync.set({ [SAVE_KEY]: saveData }, function () {
+				// @ts-expect-error
+				if (chrome.runtime.lastError) {
+					// @ts-expect-error
+					console.error(chrome.runtime.lastError);
+				} else {
+					console.log("Settings saved successfully");
+				}
+			});
+		}
+
+		/** @override */
+		resetSaveData() {
+			log("Resetting save data in browser extension storage");
+			// @ts-expect-error
+			chrome.storage.sync.clear();
+		}
+	}
+
+	class ObsidianContext extends Context {
+		/**
+		 * @override
+		 * @returns {boolean}
+		 */
+		isContextActive() {
+			// @ts-expect-error
+			return typeof app !== "undefined" && typeof app.vault !== "undefined";
+		}
+
+		/**
+		 * @override
+		 * @returns {Promise<BirbSaveData|{}>}
+		 */
+		async getSaveData() {
+			return new Promise((resolve) => {
+				// @ts-expect-error
+				OBSIDIAN_PLUGIN.loadData().then((data) => {
+					resolve(data ?? {});
+				});
+			});
+		}
+
+		/**
+		 * @override
+		 * @param {BirbSaveData|{}} saveData
+		 */
+		async putSaveData(saveData) {
+			// @ts-expect-error
+			await OBSIDIAN_PLUGIN.saveData(saveData);
+		}
+
+		/** @override */
+		resetSaveData() {
+			this.putSaveData({});
+		}
+
+		/** @override */
+		getFocusableElements() {
+			const elements = [
+				".workspace-leaf",
+				".cm-callout",
+				".HyperMD-codeblock-begin",
+				".status-bar",
+				".mobile-navbar"
+			];
+			return super.getFocusableElements().concat(elements);
+		}
+
+		/** @override */
+		getPath() {
+			// @ts-expect-error
+			const file = app.workspace.getActiveFile();
+			if (file && this.getActiveEditorElement()) {
+				return file.path;
+			} else {
+				return ROOT_PATH;
+			}
+		}
+
+		/** @override */
+		getActivePage() {
+			if (this.getPath() === ROOT_PATH) {
+				// Root page, use document element
+				return document.documentElement
+			}
+			return this.getActiveEditorElement() ?? document.documentElement;
+		}
+
+		/** @override */
+		isPathApplicable(path) {
+			return path === this.getPath();
+		}
+
+		/** @override */
+		areStickyNotesEnabled() {
+			return this.getPath() !== ROOT_PATH;
+		}
+
+		/** @returns {HTMLElement|null} */
+		getActiveEditorElement() {
+			// @ts-expect-error
+			const activeLeaf = app.workspace.activeLeaf;
+			const leafElement = activeLeaf?.view?.containerEl;
+			return leafElement?.querySelector(".cm-scroller") ?? null;
+		}
+	}
+
+	const CONTEXTS = [
+		new UserScriptContext(),
+		new ObsidianContext(),
+		new BrowserExtensionContext(),
+		new LocalContext()
+	];
+
+	function getContext() {
+		for (const context of CONTEXTS) {
+			if (context.isContextActive()) {
+				return context;
+			}
+		}
+		error("No applicable context found, defaulting to LocalContext");
+		return new LocalContext();
+	}
+
 	/**
 	 * Parse URL parameters into a key-value map
 	 * @param {string} url
@@ -1678,13 +1883,6 @@
 	border: none !important;
 }
 
-.birb-sticky-note-input::placeholder {
-	font-family: "Monocraft", monospace !important;
-	font-size: 14px !important;
-	background-color: transparent !important;
-	color: rgba(0, 0, 0, 0.35) !important;
-}
-
 .birb-sticky-note-input:focus {
 	outline: none !important;
 	box-shadow: none !important;
@@ -1726,24 +1924,68 @@
 	/** @type {Partial<Settings>} */
 	let userSettings = {};
 
-
 	/**
-	 * @param {Context} context
+	 * Load the sprite sheet and return the pixel-map template
+	 * @param {string} dataUri
+	 * @param {boolean} [templateColors]
+	 * @returns {Promise<string[][]>}
 	 */
-	async function initializeApplication(context) {
+	function loadSpriteSheetPixels(dataUri, templateColors = true) {
-		log("birbOS booting up...");
+		return new Promise((resolve, reject) => {
-		setContext(context);
+			const img = new Image();
-		log("Loading sprite sheets...");
+			img.src = dataUri;
-		const birbPixels = await loadSpriteSheetPixels(SPRITE_SHEET);
+			img.onload = () => {
-		const featherPixels = await loadSpriteSheetPixels(FEATHER_SPRITE_SHEET);
+				const canvas = document.createElement('canvas');
-		startApplication(birbPixels, featherPixels);
+				canvas.width = img.width;
+				canvas.height = img.height;
+				const ctx = canvas.getContext('2d');
+				if (!ctx) {
+					reject(new Error('Failed to get canvas context'));
+					return;
+				}
+				ctx.drawImage(img, 0, 0);
+				const imageData = ctx.getImageData(0, 0, img.width, img.height);
+				const pixels = imageData.data;
+				const hexArray = [];
+				for (let y = 0; y < img.height; y++) {
+					const row = [];
+					for (let x = 0; x < img.width; x++) {
+						const index = (y * img.width + x) * 4;
+						const r = pixels[index];
+						const g = pixels[index + 1];
+						const b = pixels[index + 2];
+						const a = pixels[index + 3];
+						if (a === 0) {
+							row.push(Sprite.TRANSPARENT);
+							continue;
+						}
+						const hex = `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`;
+						if (!templateColors) {
+							row.push(hex);
+							continue;
+						}
+						if (SPRITE_SHEET_COLOR_MAP[hex] === undefined) {
+							error(`Unknown color: ${hex}`);
+							row.push(Sprite.TRANSPARENT);
+						}
+						row.push(SPRITE_SHEET_COLOR_MAP[hex]);
+					}
+					hexArray.push(row);
+				}
+				resolve(hexArray);
+			};
+			img.onerror = (err) => {
+				reject(err);
+			};
+		});
 	}
 
-	/**
+	log("Loading sprite sheets...");
-	 * @param {string[][]} birbPixels
+
-	 * @param {string[][]} featherPixels
+	Promise.all([
-	 */
+		loadSpriteSheetPixels(SPRITE_SHEET),
-	function startApplication(birbPixels, featherPixels) {
+		loadSpriteSheetPixels(FEATHER_SPRITE_SHEET)
+	]).then(([birbPixels, featherPixels]) => {
 
 		const SPRITE_SHEET = birbPixels;
 		const FEATHER_SPRITE_SHEET = featherPixels;
@@ -1804,7 +2046,7 @@
 				insertModal(`${birdBirb()} Mode`, message);
 			}),
 			new Separator(),
-			new MenuItem("2026.1.1", () => { alert("Thank you for using Pocket Bird! You are on version: 2026.1.1"); }, false),
+			new MenuItem("2025.11.14.205", () => { alert("Thank you for using Pocket Bird! You are on version: 2025.11.14.205"); }, false),
 		];
 
 		const styleElement = document.createElement("style");
@@ -2420,11 +2662,16 @@
 				return true;
 			});
 			/** @type {HTMLElement[]} */
+			// @ts-expect-error
 			const largeElements = Array.from(visible).filter((img) => img instanceof HTMLElement && img !== focusedElement && img.offsetWidth >= MIN_FOCUS_ELEMENT_WIDTH);
+			// Ensure the bird doesn't land on fixed or sticky elements
+			const fixedAllowed = getContext() instanceof ObsidianContext;
 			const nonFixedElements = largeElements.filter((el) => {
-				{
+				if (fixedAllowed) {
 					return true;
 				}
+				const style = window.getComputedStyle(el);
+				return style.position !== "fixed" && style.position !== "sticky";
 			});
 			if (nonFixedElements.length === 0) {
 				return false;
@@ -2564,64 +2811,8 @@
 		// Run the birb
 		init();
 		draw();
-	}
+	}).catch((e) => {
-
+		error("Error while loading sprite sheets: ", e);
-	/**
-	 * Load the sprite sheet and return the pixel-map template
-	 * @param {string} dataUri
-	 * @param {boolean} [templateColors]
-	 * @returns {Promise<string[][]>}
-	 */
-	function loadSpriteSheetPixels(dataUri, templateColors = true) {
-		return new Promise((resolve, reject) => {
-			const img = new Image();
-			img.src = dataUri;
-			img.onload = () => {
-				const canvas = document.createElement('canvas');
-				canvas.width = img.width;
-				canvas.height = img.height;
-				const ctx = canvas.getContext('2d');
-				if (!ctx) {
-					reject(new Error('Failed to get canvas context'));
-					return;
-				}
-				ctx.drawImage(img, 0, 0);
-				const imageData = ctx.getImageData(0, 0, img.width, img.height);
-				const pixels = imageData.data;
-				const hexArray = [];
-				for (let y = 0; y < img.height; y++) {
-					const row = [];
-					for (let x = 0; x < img.width; x++) {
-						const index = (y * img.width + x) * 4;
-						const r = pixels[index];
-						const g = pixels[index + 1];
-						const b = pixels[index + 2];
-						const a = pixels[index + 3];
-						if (a === 0) {
-							row.push(Sprite.TRANSPARENT);
-							continue;
-						}
-						const hex = `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`;
-						if (!templateColors) {
-							row.push(hex);
-							continue;
-						}
-						if (SPRITE_SHEET_COLOR_MAP[hex] === undefined) {
-							error(`Unknown color: ${hex}`);
-							row.push(Sprite.TRANSPARENT);
-						}
-						row.push(SPRITE_SHEET_COLOR_MAP[hex]);
-					}
-					hexArray.push(row);
-				}
-				resolve(hexArray);
-			};
-			img.onerror = (err) => {
-				reject(err);
-			};
 	});
-	}
-
-	initializeApplication(new LocalContext());
 
 })();

dist/extension/birb.js

@@ -7,7 +7,6 @@
 	};
 
 	let debugMode = location.hostname === "127.0.0.1";
-	let context = null;
 
 	/**
 	 * @returns {boolean} Whether debug mode is enabled
@@ -23,17 +22,6 @@
 		debugMode = value;
 	}
 
-	function getContext() {
-		if (!context) {
-			throw new Error("Context requested before being set");
-		}
-		return context;
-	}
-
-	function setContext(newContext) {
-		context = newContext;
-	}
-
 	/**
 	 * Create an HTML element with the specified parameters
 	 * @param {string} className
@@ -858,6 +846,7 @@
 	}
 
 	const SAVE_KEY = "birbSaveData";
+	const ROOT_PATH = "";
 
 	/**
 	 * @typedef {import('./application.js').BirbSaveData} BirbSaveData
@@ -868,6 +857,14 @@
 	 */
 	class Context {
 
+		/**
+		 * @abstract
+		 * @returns {boolean} Whether this context is applicable
+		 */
+		isContextActive() {
+			throw new Error("Method not implemented");
+		}
+
 		/**
 		 * @abstract
 		 * @returns {Promise<BirbSaveData|{}>}
@@ -949,8 +946,96 @@
 		}
 	}
 
+	class LocalContext extends Context {
+
+		/**
+		 * @override
+		 * @returns {boolean}
+		 */
+		isContextActive() {
+			return window.location.hostname === "127.0.0.1"
+				|| window.location.hostname === "localhost"
+				|| window.location.hostname.startsWith("192.168.");
+		}
+
+		/**
+		 * @override
+		 * @returns {Promise<BirbSaveData|{}>}
+		 */
+		async getSaveData() {
+			log("Loading save data from localStorage");
+			return JSON.parse(localStorage.getItem(SAVE_KEY) ?? "{}");
+		}
+
+		/**
+		 * @override
+		 * @param {BirbSaveData} saveData
+		 */
+		async putSaveData(saveData) {
+			log("Saving data to localStorage");
+			localStorage.setItem(SAVE_KEY, JSON.stringify(saveData));
+		}
+
+		/** @override */
+		resetSaveData() {
+			log("Resetting save data in localStorage");
+			localStorage.removeItem(SAVE_KEY);
+		}
+	}
+
+	class UserScriptContext extends Context {
+
+		/**
+		 * @override
+		 * @returns {boolean}
+		 */
+		isContextActive() {
+			// @ts-expect-error
+			return typeof GM_getValue === "function";
+		}
+
+		/**
+		 * @override
+		 * @returns {Promise<BirbSaveData|{}>}
+		 */
+		async getSaveData() {
+			log("Loading save data from UserScript storage");
+			/** @type {BirbSaveData|{}} */
+			let saveData = {};
+			// @ts-expect-error
+			saveData = GM_getValue(SAVE_KEY, {}) ?? {};
+			return saveData;
+		}
+
+		/**
+		 * @override
+		 * @param {BirbSaveData} saveData
+		 */
+		async putSaveData(saveData) {
+			log("Saving data to UserScript storage");
+			// @ts-expect-error
+			GM_setValue(SAVE_KEY, saveData);
+		}
+
+		/** @override */
+		resetSaveData() {
+			log("Resetting save data in UserScript storage");
+			// @ts-expect-error
+			GM_deleteValue(SAVE_KEY);
+		}
+	}
+
 	class BrowserExtensionContext extends Context {
 
+		/**
+		 * @override
+		 * @returns {boolean}
+		 */
+		isContextActive() {
+			// @ts-expect-error
+			return typeof chrome !== "undefined";
+		}
+
 		/**
 		 * @override
 		 * @returns {Promise<BirbSaveData|{}>}
@@ -976,9 +1061,9 @@
 				// @ts-expect-error
 				if (chrome.runtime.lastError) {
 					// @ts-expect-error
-					error(chrome.runtime.lastError);
+					console.error(chrome.runtime.lastError);
 				} else {
-					log("Settings saved successfully");
+					console.log("Settings saved successfully");
 				}
 			});
 		}
@@ -991,6 +1076,111 @@
 		}
 	}
 
+	class ObsidianContext extends Context {
+		/**
+		 * @override
+		 * @returns {boolean}
+		 */
+		isContextActive() {
+			// @ts-expect-error
+			return typeof app !== "undefined" && typeof app.vault !== "undefined";
+		}
+
+		/**
+		 * @override
+		 * @returns {Promise<BirbSaveData|{}>}
+		 */
+		async getSaveData() {
+			return new Promise((resolve) => {
+				// @ts-expect-error
+				OBSIDIAN_PLUGIN.loadData().then((data) => {
+					resolve(data ?? {});
+				});
+			});
+		}
+
+		/**
+		 * @override
+		 * @param {BirbSaveData|{}} saveData
+		 */
+		async putSaveData(saveData) {
+			// @ts-expect-error
+			await OBSIDIAN_PLUGIN.saveData(saveData);
+		}
+
+		/** @override */
+		resetSaveData() {
+			this.putSaveData({});
+		}
+
+		/** @override */
+		getFocusableElements() {
+			const elements = [
+				".workspace-leaf",
+				".cm-callout",
+				".HyperMD-codeblock-begin",
+				".status-bar",
+				".mobile-navbar"
+			];
+			return super.getFocusableElements().concat(elements);
+		}
+
+		/** @override */
+		getPath() {
+			// @ts-expect-error
+			const file = app.workspace.getActiveFile();
+			if (file && this.getActiveEditorElement()) {
+				return file.path;
+			} else {
+				return ROOT_PATH;
+			}
+		}
+
+		/** @override */
+		getActivePage() {
+			if (this.getPath() === ROOT_PATH) {
+				// Root page, use document element
+				return document.documentElement
+			}
+			return this.getActiveEditorElement() ?? document.documentElement;
+		}
+
+		/** @override */
+		isPathApplicable(path) {
+			return path === this.getPath();
+		}
+
+		/** @override */
+		areStickyNotesEnabled() {
+			return this.getPath() !== ROOT_PATH;
+		}
+
+		/** @returns {HTMLElement|null} */
+		getActiveEditorElement() {
+			// @ts-expect-error
+			const activeLeaf = app.workspace.activeLeaf;
+			const leafElement = activeLeaf?.view?.containerEl;
+			return leafElement?.querySelector(".cm-scroller") ?? null;
+		}
+	}
+
+	const CONTEXTS = [
+		new UserScriptContext(),
+		new ObsidianContext(),
+		new BrowserExtensionContext(),
+		new LocalContext()
+	];
+
+	function getContext() {
+		for (const context of CONTEXTS) {
+			if (context.isContextActive()) {
+				return context;
+			}
+		}
+		error("No applicable context found, defaulting to LocalContext");
+		return new LocalContext();
+	}
+
 	/**
 	 * Parse URL parameters into a key-value map
 	 * @param {string} url
@@ -1693,13 +1883,6 @@
 	border: none !important;
 }
 
-.birb-sticky-note-input::placeholder {
-	font-family: "Monocraft", monospace !important;
-	font-size: 14px !important;
-	background-color: transparent !important;
-	color: rgba(0, 0, 0, 0.35) !important;
-}
-
 .birb-sticky-note-input:focus {
 	outline: none !important;
 	box-shadow: none !important;
@@ -1741,24 +1924,68 @@
 	/** @type {Partial<Settings>} */
 	let userSettings = {};
 
-
 	/**
-	 * @param {Context} context
+	 * Load the sprite sheet and return the pixel-map template
+	 * @param {string} dataUri
+	 * @param {boolean} [templateColors]
+	 * @returns {Promise<string[][]>}
 	 */
-	async function initializeApplication(context) {
+	function loadSpriteSheetPixels(dataUri, templateColors = true) {
-		log("birbOS booting up...");
+		return new Promise((resolve, reject) => {
-		setContext(context);
+			const img = new Image();
-		log("Loading sprite sheets...");
+			img.src = dataUri;
-		const birbPixels = await loadSpriteSheetPixels(SPRITE_SHEET);
+			img.onload = () => {
-		const featherPixels = await loadSpriteSheetPixels(FEATHER_SPRITE_SHEET);
+				const canvas = document.createElement('canvas');
-		startApplication(birbPixels, featherPixels);
+				canvas.width = img.width;
+				canvas.height = img.height;
+				const ctx = canvas.getContext('2d');
+				if (!ctx) {
+					reject(new Error('Failed to get canvas context'));
+					return;
+				}
+				ctx.drawImage(img, 0, 0);
+				const imageData = ctx.getImageData(0, 0, img.width, img.height);
+				const pixels = imageData.data;
+				const hexArray = [];
+				for (let y = 0; y < img.height; y++) {
+					const row = [];
+					for (let x = 0; x < img.width; x++) {
+						const index = (y * img.width + x) * 4;
+						const r = pixels[index];
+						const g = pixels[index + 1];
+						const b = pixels[index + 2];
+						const a = pixels[index + 3];
+						if (a === 0) {
+							row.push(Sprite.TRANSPARENT);
+							continue;
+						}
+						const hex = `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`;
+						if (!templateColors) {
+							row.push(hex);
+							continue;
+						}
+						if (SPRITE_SHEET_COLOR_MAP[hex] === undefined) {
+							error(`Unknown color: ${hex}`);
+							row.push(Sprite.TRANSPARENT);
+						}
+						row.push(SPRITE_SHEET_COLOR_MAP[hex]);
+					}
+					hexArray.push(row);
+				}
+				resolve(hexArray);
+			};
+			img.onerror = (err) => {
+				reject(err);
+			};
+		});
 	}
 
-	/**
+	log("Loading sprite sheets...");
-	 * @param {string[][]} birbPixels
+
-	 * @param {string[][]} featherPixels
+	Promise.all([
-	 */
+		loadSpriteSheetPixels(SPRITE_SHEET),
-	function startApplication(birbPixels, featherPixels) {
+		loadSpriteSheetPixels(FEATHER_SPRITE_SHEET)
+	]).then(([birbPixels, featherPixels]) => {
 
 		const SPRITE_SHEET = birbPixels;
 		const FEATHER_SPRITE_SHEET = featherPixels;
@@ -1819,7 +2046,7 @@
 				insertModal(`${birdBirb()} Mode`, message);
 			}),
 			new Separator(),
-			new MenuItem("2026.1.1", () => { alert("Thank you for using Pocket Bird! You are on version: 2026.1.1"); }, false),
+			new MenuItem("2025.11.14.205", () => { alert("Thank you for using Pocket Bird! You are on version: 2025.11.14.205"); }, false),
 		];
 
 		const styleElement = document.createElement("style");
@@ -2435,11 +2662,16 @@
 				return true;
 			});
 			/** @type {HTMLElement[]} */
+			// @ts-expect-error
 			const largeElements = Array.from(visible).filter((img) => img instanceof HTMLElement && img !== focusedElement && img.offsetWidth >= MIN_FOCUS_ELEMENT_WIDTH);
+			// Ensure the bird doesn't land on fixed or sticky elements
+			const fixedAllowed = getContext() instanceof ObsidianContext;
 			const nonFixedElements = largeElements.filter((el) => {
-				{
+				if (fixedAllowed) {
 					return true;
 				}
+				const style = window.getComputedStyle(el);
+				return style.position !== "fixed" && style.position !== "sticky";
 			});
 			if (nonFixedElements.length === 0) {
 				return false;
@@ -2579,64 +2811,8 @@
 		// Run the birb
 		init();
 		draw();
-	}
+	}).catch((e) => {
-
+		error("Error while loading sprite sheets: ", e);
-	/**
-	 * Load the sprite sheet and return the pixel-map template
-	 * @param {string} dataUri
-	 * @param {boolean} [templateColors]
-	 * @returns {Promise<string[][]>}
-	 */
-	function loadSpriteSheetPixels(dataUri, templateColors = true) {
-		return new Promise((resolve, reject) => {
-			const img = new Image();
-			img.src = dataUri;
-			img.onload = () => {
-				const canvas = document.createElement('canvas');
-				canvas.width = img.width;
-				canvas.height = img.height;
-				const ctx = canvas.getContext('2d');
-				if (!ctx) {
-					reject(new Error('Failed to get canvas context'));
-					return;
-				}
-				ctx.drawImage(img, 0, 0);
-				const imageData = ctx.getImageData(0, 0, img.width, img.height);
-				const pixels = imageData.data;
-				const hexArray = [];
-				for (let y = 0; y < img.height; y++) {
-					const row = [];
-					for (let x = 0; x < img.width; x++) {
-						const index = (y * img.width + x) * 4;
-						const r = pixels[index];
-						const g = pixels[index + 1];
-						const b = pixels[index + 2];
-						const a = pixels[index + 3];
-						if (a === 0) {
-							row.push(Sprite.TRANSPARENT);
-							continue;
-						}
-						const hex = `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`;
-						if (!templateColors) {
-							row.push(hex);
-							continue;
-						}
-						if (SPRITE_SHEET_COLOR_MAP[hex] === undefined) {
-							error(`Unknown color: ${hex}`);
-							row.push(Sprite.TRANSPARENT);
-						}
-						row.push(SPRITE_SHEET_COLOR_MAP[hex]);
-					}
-					hexArray.push(row);
-				}
-				resolve(hexArray);
-			};
-			img.onerror = (err) => {
-				reject(err);
-			};
 	});
-	}
-
-	initializeApplication(new BrowserExtensionContext());
 
 })();

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": "2026.1.1",
+    "version": "2025.11.14.205",
     "homepage_url": "https://idreesinc.com",
     "icons": {
         "48": "images/icons/transparent/48x48x1.png",

dist/obsidian/manifest.json

@@ -1,9 +1,9 @@
 {
     "id": "pocket-bird",
     "name": "Pocket Bird",
-    "version": "2026.1.1",
+    "version": "2025.11.14",
     "minAppVersion": "0.15.0",
-    "description": "Add a pet bird to fly around your notes and keep you company!",
+    "description": "It's a pet bird in your Obsidian, what more could you want?",
     "author": "Idrees Hassan",
     "authorUrl": "https://idreesinc.com",
     "isDesktopOnly": false

dist/userscript/birb.user.js

@@ -1,7 +1,7 @@
 // ==UserScript==
 // @name         Pocket Bird
 // @namespace    https://idreesinc.com
-// @version      2026.1.1
+// @version      2025.11.14.205
 // @description  It's a pet bird in your browser, what more could you want?
 // @author       Idrees
 // @downloadURL  https://github.com/IdreesInc/Pocket-Bird/raw/refs/heads/main/dist/userscript/birb.user.js
@@ -21,7 +21,6 @@
 	};
 
 	let debugMode = location.hostname === "127.0.0.1";
-	let context = null;
 
 	/**
 	 * @returns {boolean} Whether debug mode is enabled
@@ -37,17 +36,6 @@
 		debugMode = value;
 	}
 
-	function getContext() {
-		if (!context) {
-			throw new Error("Context requested before being set");
-		}
-		return context;
-	}
-
-	function setContext(newContext) {
-		context = newContext;
-	}
-
 	/**
 	 * Create an HTML element with the specified parameters
 	 * @param {string} className
@@ -872,6 +860,7 @@
 	}
 
 	const SAVE_KEY = "birbSaveData";
+	const ROOT_PATH = "";
 
 	/**
 	 * @typedef {import('./application.js').BirbSaveData} BirbSaveData
@@ -882,6 +871,14 @@
 	 */
 	class Context {
 
+		/**
+		 * @abstract
+		 * @returns {boolean} Whether this context is applicable
+		 */
+		isContextActive() {
+			throw new Error("Method not implemented");
+		}
+
 		/**
 		 * @abstract
 		 * @returns {Promise<BirbSaveData|{}>}
@@ -963,8 +960,54 @@
 		}
 	}
 
+	class LocalContext extends Context {
+
+		/**
+		 * @override
+		 * @returns {boolean}
+		 */
+		isContextActive() {
+			return window.location.hostname === "127.0.0.1"
+				|| window.location.hostname === "localhost"
+				|| window.location.hostname.startsWith("192.168.");
+		}
+
+		/**
+		 * @override
+		 * @returns {Promise<BirbSaveData|{}>}
+		 */
+		async getSaveData() {
+			log("Loading save data from localStorage");
+			return JSON.parse(localStorage.getItem(SAVE_KEY) ?? "{}");
+		}
+
+		/**
+		 * @override
+		 * @param {BirbSaveData} saveData
+		 */
+		async putSaveData(saveData) {
+			log("Saving data to localStorage");
+			localStorage.setItem(SAVE_KEY, JSON.stringify(saveData));
+		}
+
+		/** @override */
+		resetSaveData() {
+			log("Resetting save data in localStorage");
+			localStorage.removeItem(SAVE_KEY);
+		}
+	}
+
 	class UserScriptContext extends Context {
 
+		/**
+		 * @override
+		 * @returns {boolean}
+		 */
+		isContextActive() {
+			// @ts-expect-error
+			return typeof GM_getValue === "function";
+		}
+
 		/**
 		 * @override
 		 * @returns {Promise<BirbSaveData|{}>}
@@ -996,6 +1039,162 @@
 		}
 	}
 
+	class BrowserExtensionContext extends Context {
+
+		/**
+		 * @override
+		 * @returns {boolean}
+		 */
+		isContextActive() {
+			// @ts-expect-error
+			return typeof chrome !== "undefined";
+		}
+
+		/**
+		 * @override
+		 * @returns {Promise<BirbSaveData|{}>}
+		 */
+		async getSaveData() {
+			log("Loading save data from browser extension storage");
+			return new Promise((resolve) => {
+				// @ts-expect-error
+				chrome.storage.sync.get([SAVE_KEY], (result) => {
+					resolve(result[SAVE_KEY] ?? {});
+				});
+			});
+		}
+
+		/**
+		 * @override
+		 * @param {BirbSaveData} saveData
+		 */
+		async putSaveData(saveData) {
+			log("Saving data to browser extension storage");
+			// @ts-expect-error
+			chrome.storage.sync.set({ [SAVE_KEY]: saveData }, function () {
+				// @ts-expect-error
+				if (chrome.runtime.lastError) {
+					// @ts-expect-error
+					console.error(chrome.runtime.lastError);
+				} else {
+					console.log("Settings saved successfully");
+				}
+			});
+		}
+
+		/** @override */
+		resetSaveData() {
+			log("Resetting save data in browser extension storage");
+			// @ts-expect-error
+			chrome.storage.sync.clear();
+		}
+	}
+
+	class ObsidianContext extends Context {
+		/**
+		 * @override
+		 * @returns {boolean}
+		 */
+		isContextActive() {
+			// @ts-expect-error
+			return typeof app !== "undefined" && typeof app.vault !== "undefined";
+		}
+
+		/**
+		 * @override
+		 * @returns {Promise<BirbSaveData|{}>}
+		 */
+		async getSaveData() {
+			return new Promise((resolve) => {
+				// @ts-expect-error
+				OBSIDIAN_PLUGIN.loadData().then((data) => {
+					resolve(data ?? {});
+				});
+			});
+		}
+
+		/**
+		 * @override
+		 * @param {BirbSaveData|{}} saveData
+		 */
+		async putSaveData(saveData) {
+			// @ts-expect-error
+			await OBSIDIAN_PLUGIN.saveData(saveData);
+		}
+
+		/** @override */
+		resetSaveData() {
+			this.putSaveData({});
+		}
+
+		/** @override */
+		getFocusableElements() {
+			const elements = [
+				".workspace-leaf",
+				".cm-callout",
+				".HyperMD-codeblock-begin",
+				".status-bar",
+				".mobile-navbar"
+			];
+			return super.getFocusableElements().concat(elements);
+		}
+
+		/** @override */
+		getPath() {
+			// @ts-expect-error
+			const file = app.workspace.getActiveFile();
+			if (file && this.getActiveEditorElement()) {
+				return file.path;
+			} else {
+				return ROOT_PATH;
+			}
+		}
+
+		/** @override */
+		getActivePage() {
+			if (this.getPath() === ROOT_PATH) {
+				// Root page, use document element
+				return document.documentElement
+			}
+			return this.getActiveEditorElement() ?? document.documentElement;
+		}
+
+		/** @override */
+		isPathApplicable(path) {
+			return path === this.getPath();
+		}
+
+		/** @override */
+		areStickyNotesEnabled() {
+			return this.getPath() !== ROOT_PATH;
+		}
+
+		/** @returns {HTMLElement|null} */
+		getActiveEditorElement() {
+			// @ts-expect-error
+			const activeLeaf = app.workspace.activeLeaf;
+			const leafElement = activeLeaf?.view?.containerEl;
+			return leafElement?.querySelector(".cm-scroller") ?? null;
+		}
+	}
+
+	const CONTEXTS = [
+		new UserScriptContext(),
+		new ObsidianContext(),
+		new BrowserExtensionContext(),
+		new LocalContext()
+	];
+
+	function getContext() {
+		for (const context of CONTEXTS) {
+			if (context.isContextActive()) {
+				return context;
+			}
+		}
+		error("No applicable context found, defaulting to LocalContext");
+		return new LocalContext();
+	}
+
 	/**
 	 * Parse URL parameters into a key-value map
 	 * @param {string} url
@@ -1698,13 +1897,6 @@
 	border: none !important;
 }
 
-.birb-sticky-note-input::placeholder {
-	font-family: "Monocraft", monospace !important;
-	font-size: 14px !important;
-	background-color: transparent !important;
-	color: rgba(0, 0, 0, 0.35) !important;
-}
-
 .birb-sticky-note-input:focus {
 	outline: none !important;
 	box-shadow: none !important;
@@ -1746,24 +1938,68 @@
 	/** @type {Partial<Settings>} */
 	let userSettings = {};
 
-
 	/**
-	 * @param {Context} context
+	 * Load the sprite sheet and return the pixel-map template
+	 * @param {string} dataUri
+	 * @param {boolean} [templateColors]
+	 * @returns {Promise<string[][]>}
 	 */
-	async function initializeApplication(context) {
+	function loadSpriteSheetPixels(dataUri, templateColors = true) {
-		log("birbOS booting up...");
+		return new Promise((resolve, reject) => {
-		setContext(context);
+			const img = new Image();
-		log("Loading sprite sheets...");
+			img.src = dataUri;
-		const birbPixels = await loadSpriteSheetPixels(SPRITE_SHEET);
+			img.onload = () => {
-		const featherPixels = await loadSpriteSheetPixels(FEATHER_SPRITE_SHEET);
+				const canvas = document.createElement('canvas');
-		startApplication(birbPixels, featherPixels);
+				canvas.width = img.width;
+				canvas.height = img.height;
+				const ctx = canvas.getContext('2d');
+				if (!ctx) {
+					reject(new Error('Failed to get canvas context'));
+					return;
+				}
+				ctx.drawImage(img, 0, 0);
+				const imageData = ctx.getImageData(0, 0, img.width, img.height);
+				const pixels = imageData.data;
+				const hexArray = [];
+				for (let y = 0; y < img.height; y++) {
+					const row = [];
+					for (let x = 0; x < img.width; x++) {
+						const index = (y * img.width + x) * 4;
+						const r = pixels[index];
+						const g = pixels[index + 1];
+						const b = pixels[index + 2];
+						const a = pixels[index + 3];
+						if (a === 0) {
+							row.push(Sprite.TRANSPARENT);
+							continue;
+						}
+						const hex = `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`;
+						if (!templateColors) {
+							row.push(hex);
+							continue;
+						}
+						if (SPRITE_SHEET_COLOR_MAP[hex] === undefined) {
+							error(`Unknown color: ${hex}`);
+							row.push(Sprite.TRANSPARENT);
+						}
+						row.push(SPRITE_SHEET_COLOR_MAP[hex]);
+					}
+					hexArray.push(row);
+				}
+				resolve(hexArray);
+			};
+			img.onerror = (err) => {
+				reject(err);
+			};
+		});
 	}
 
-	/**
+	log("Loading sprite sheets...");
-	 * @param {string[][]} birbPixels
+
-	 * @param {string[][]} featherPixels
+	Promise.all([
-	 */
+		loadSpriteSheetPixels(SPRITE_SHEET),
-	function startApplication(birbPixels, featherPixels) {
+		loadSpriteSheetPixels(FEATHER_SPRITE_SHEET)
+	]).then(([birbPixels, featherPixels]) => {
 
 		const SPRITE_SHEET = birbPixels;
 		const FEATHER_SPRITE_SHEET = featherPixels;
@@ -1824,7 +2060,7 @@
 				insertModal(`${birdBirb()} Mode`, message);
 			}),
 			new Separator(),
-			new MenuItem("2026.1.1", () => { alert("Thank you for using Pocket Bird! You are on version: 2026.1.1"); }, false),
+			new MenuItem("2025.11.14.205", () => { alert("Thank you for using Pocket Bird! You are on version: 2025.11.14.205"); }, false),
 		];
 
 		const styleElement = document.createElement("style");
@@ -2440,11 +2676,16 @@
 				return true;
 			});
 			/** @type {HTMLElement[]} */
+			// @ts-expect-error
 			const largeElements = Array.from(visible).filter((img) => img instanceof HTMLElement && img !== focusedElement && img.offsetWidth >= MIN_FOCUS_ELEMENT_WIDTH);
+			// Ensure the bird doesn't land on fixed or sticky elements
+			const fixedAllowed = getContext() instanceof ObsidianContext;
 			const nonFixedElements = largeElements.filter((el) => {
-				{
+				if (fixedAllowed) {
 					return true;
 				}
+				const style = window.getComputedStyle(el);
+				return style.position !== "fixed" && style.position !== "sticky";
 			});
 			if (nonFixedElements.length === 0) {
 				return false;
@@ -2584,64 +2825,8 @@
 		// Run the birb
 		init();
 		draw();
-	}
+	}).catch((e) => {
-
+		error("Error while loading sprite sheets: ", e);
-	/**
-	 * Load the sprite sheet and return the pixel-map template
-	 * @param {string} dataUri
-	 * @param {boolean} [templateColors]
-	 * @returns {Promise<string[][]>}
-	 */
-	function loadSpriteSheetPixels(dataUri, templateColors = true) {
-		return new Promise((resolve, reject) => {
-			const img = new Image();
-			img.src = dataUri;
-			img.onload = () => {
-				const canvas = document.createElement('canvas');
-				canvas.width = img.width;
-				canvas.height = img.height;
-				const ctx = canvas.getContext('2d');
-				if (!ctx) {
-					reject(new Error('Failed to get canvas context'));
-					return;
-				}
-				ctx.drawImage(img, 0, 0);
-				const imageData = ctx.getImageData(0, 0, img.width, img.height);
-				const pixels = imageData.data;
-				const hexArray = [];
-				for (let y = 0; y < img.height; y++) {
-					const row = [];
-					for (let x = 0; x < img.width; x++) {
-						const index = (y * img.width + x) * 4;
-						const r = pixels[index];
-						const g = pixels[index + 1];
-						const b = pixels[index + 2];
-						const a = pixels[index + 3];
-						if (a === 0) {
-							row.push(Sprite.TRANSPARENT);
-							continue;
-						}
-						const hex = `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`;
-						if (!templateColors) {
-							row.push(hex);
-							continue;
-						}
-						if (SPRITE_SHEET_COLOR_MAP[hex] === undefined) {
-							error(`Unknown color: ${hex}`);
-							row.push(Sprite.TRANSPARENT);
-						}
-						row.push(SPRITE_SHEET_COLOR_MAP[hex]);
-					}
-					hexArray.push(row);
-				}
-				resolve(hexArray);
-			};
-			img.onerror = (err) => {
-				reject(err);
-			};
 	});
-	}
-
-	initializeApplication(new UserScriptContext());
 
 })();

manifest.json

@@ -1,7 +1,7 @@
 {
     "id": "pocket-bird",
     "name": "Pocket Bird",
-    "version": "__VERSION__",
+    "version": "2025.11.14.205",
     "minAppVersion": "0.15.0",
     "description": "Add a pet bird to fly around your notes and keep you company!",
     "author": "Idrees Hassan",

platform-specific/obsidian/manifest.json

@@ -0,0 +1,10 @@
+{
+    "id": "pocket-bird",
+    "name": "Pocket Bird",
+    "version": "__VERSION__",
+    "minAppVersion": "0.15.0",
+    "description": "It's a pet bird in your Obsidian, what more could you want?",
+    "author": "Idrees Hassan",
+    "authorUrl": "https://idreesinc.com",
+    "isDesktopOnly": false
+}

preview/index.html

@@ -26,6 +26,6 @@
     </div>
     <div id="spacer"></div>
     <!-- <script type="module" src="spritesheet-compiler.js"></script> -->
-    <script src="../dist/web/birb.js"></script>
+    <script src="../dist/birb.js"></script>
 </body>
 </html>

src/application.js

@@ -2,11 +2,9 @@ import Frame from './frame.js';
 import Layer from './layer.js';
 import Anim from './anim.js';
 import { Birb, Animations } from './birb.js';
-import { Context, ObsidianContext } from './context.js';
+import { getContext, ObsidianContext } from './context.js';
 
 import {
-	getContext,
-	setContext,
 	Directions,
 	isDebug,
 	setDebug,
@@ -111,24 +109,68 @@ const MIN_FOCUS_ELEMENT_WIDTH = 100;
 /** @type {Partial<Settings>} */
 let userSettings = {};
 
-
 /**
- * @param {Context} context
+ * Load the sprite sheet and return the pixel-map template
+ * @param {string} dataUri
+ * @param {boolean} [templateColors]
+ * @returns {Promise<string[][]>}
  */
-export async function initializeApplication(context) {
+function loadSpriteSheetPixels(dataUri, templateColors = true) {
-	log("birbOS booting up...");
+	return new Promise((resolve, reject) => {
-	setContext(context);
+		const img = new Image();
-	log("Loading sprite sheets...");
+		img.src = dataUri;
-	const birbPixels = await loadSpriteSheetPixels(SPRITE_SHEET);
+		img.onload = () => {
-	const featherPixels = await loadSpriteSheetPixels(FEATHER_SPRITE_SHEET);
+			const canvas = document.createElement('canvas');
-	startApplication(birbPixels, featherPixels);
+			canvas.width = img.width;
+			canvas.height = img.height;
+			const ctx = canvas.getContext('2d');
+			if (!ctx) {
+				reject(new Error('Failed to get canvas context'));
+				return;
+			}
+			ctx.drawImage(img, 0, 0);
+			const imageData = ctx.getImageData(0, 0, img.width, img.height);
+			const pixels = imageData.data;
+			const hexArray = [];
+			for (let y = 0; y < img.height; y++) {
+				const row = [];
+				for (let x = 0; x < img.width; x++) {
+					const index = (y * img.width + x) * 4;
+					const r = pixels[index];
+					const g = pixels[index + 1];
+					const b = pixels[index + 2];
+					const a = pixels[index + 3];
+					if (a === 0) {
+						row.push(Sprite.TRANSPARENT);
+						continue;
+					}
+					const hex = `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`;
+					if (!templateColors) {
+						row.push(hex);
+						continue;
+					}
+					if (SPRITE_SHEET_COLOR_MAP[hex] === undefined) {
+						error(`Unknown color: ${hex}`);
+						row.push(Sprite.TRANSPARENT);
+					}
+					row.push(SPRITE_SHEET_COLOR_MAP[hex]);
+				}
+				hexArray.push(row);
+			}
+			resolve(hexArray);
+		};
+		img.onerror = (err) => {
+			reject(err);
+		};
+	});
 }
 
-/**
+log("Loading sprite sheets...");
- * @param {string[][]} birbPixels
+
- * @param {string[][]} featherPixels
+Promise.all([
- */
+	loadSpriteSheetPixels(SPRITE_SHEET),
-function startApplication(birbPixels, featherPixels) {
+	loadSpriteSheetPixels(FEATHER_SPRITE_SHEET)
+]).then(([birbPixels, featherPixels]) => {
 
 	const SPRITE_SHEET = birbPixels;
 	const FEATHER_SPRITE_SHEET = featherPixels;
@@ -809,11 +851,10 @@ function startApplication(birbPixels, featherPixels) {
 			return true;
 		});
 		/** @type {HTMLElement[]} */
+		// @ts-expect-error
 		const largeElements = Array.from(visible).filter((img) => img instanceof HTMLElement && img !== focusedElement && img.offsetWidth >= MIN_FOCUS_ELEMENT_WIDTH);
 		// Ensure the bird doesn't land on fixed or sticky elements
-		// const fixedAllowed = getContext() instanceof ObsidianContext;
+		const fixedAllowed = getContext() instanceof ObsidianContext;
-		// TODO: FIX
-		const fixedAllowed = true;
 		const nonFixedElements = largeElements.filter((el) => {
 			if (fixedAllowed) {
 				return true;
@@ -967,60 +1008,6 @@ function startApplication(birbPixels, featherPixels) {
 	// Run the birb
 	init();
 	draw();
-}
+}).catch((e) => {
-
+	error("Error while loading sprite sheets: ", e);
-/**
+});
- * Load the sprite sheet and return the pixel-map template
- * @param {string} dataUri
- * @param {boolean} [templateColors]
- * @returns {Promise<string[][]>}
- */
-function loadSpriteSheetPixels(dataUri, templateColors = true) {
-	return new Promise((resolve, reject) => {
-		const img = new Image();
-		img.src = dataUri;
-		img.onload = () => {
-			const canvas = document.createElement('canvas');
-			canvas.width = img.width;
-			canvas.height = img.height;
-			const ctx = canvas.getContext('2d');
-			if (!ctx) {
-				reject(new Error('Failed to get canvas context'));
-				return;
-			}
-			ctx.drawImage(img, 0, 0);
-			const imageData = ctx.getImageData(0, 0, img.width, img.height);
-			const pixels = imageData.data;
-			const hexArray = [];
-			for (let y = 0; y < img.height; y++) {
-				const row = [];
-				for (let x = 0; x < img.width; x++) {
-					const index = (y * img.width + x) * 4;
-					const r = pixels[index];
-					const g = pixels[index + 1];
-					const b = pixels[index + 2];
-					const a = pixels[index + 3];
-					if (a === 0) {
-						row.push(Sprite.TRANSPARENT);
-						continue;
-					}
-					const hex = `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`;
-					if (!templateColors) {
-						row.push(hex);
-						continue;
-					}
-					if (SPRITE_SHEET_COLOR_MAP[hex] === undefined) {
-						error(`Unknown color: ${hex}`);
-						row.push(Sprite.TRANSPARENT);
-					}
-					row.push(SPRITE_SHEET_COLOR_MAP[hex]);
-				}
-				hexArray.push(row);
-			}
-			resolve(hexArray);
-		};
-		img.onerror = (err) => {
-			reject(err);
-		};
-	});
-}

src/context.js

@@ -1,8 +1,7 @@
 import { debug, log, error } from "./shared.js";
 
-export const SAVE_KEY = "birbSaveData";
+const SAVE_KEY = "birbSaveData";
 const ROOT_PATH = "";
-const SET_CONTEXT = "__CONTEXT__"
 
 /**
  * @typedef {import('./application.js').BirbSaveData} BirbSaveData
@@ -13,6 +12,14 @@ const SET_CONTEXT = "__CONTEXT__"
  */
 export class Context {
 
+	/**
+	 * @abstract
+	 * @returns {boolean} Whether this context is applicable
+	 */
+	isContextActive() {
+		throw new Error("Method not implemented");
+	}
+
 	/**
 	 * @abstract
 	 * @returns {Promise<BirbSaveData|{}>}
@@ -96,6 +103,16 @@ export class Context {
 
 export class LocalContext extends Context {
 
+	/**
+	 * @override
+	 * @returns {boolean}
+	 */
+	isContextActive() {
+		return window.location.hostname === "127.0.0.1"
+			|| window.location.hostname === "localhost"
+			|| window.location.hostname.startsWith("192.168.");
+	}
+
 	/**
 	 * @override
 	 * @returns {Promise<BirbSaveData|{}>}
@@ -123,6 +140,15 @@ export class LocalContext extends Context {
 
 export class UserScriptContext extends Context {
 
+	/**
+	 * @override
+	 * @returns {boolean}
+	 */
+	isContextActive() {
+		// @ts-expect-error
+		return typeof GM_getValue === "function";
+	}
+
 	/**
 	 * @override
 	 * @returns {Promise<BirbSaveData|{}>}
@@ -154,7 +180,16 @@ export class UserScriptContext extends Context {
 	}
 }
 
-export class BrowserExtensionContext extends Context {
+class BrowserExtensionContext extends Context {
+
+	/**
+	 * @override
+	 * @returns {boolean}
+	 */
+	isContextActive() {
+		// @ts-expect-error
+		return typeof chrome !== "undefined";
+	}
 
 	/**
 	 * @override
@@ -181,9 +216,9 @@ export class BrowserExtensionContext extends Context {
 			// @ts-expect-error
 			if (chrome.runtime.lastError) {
 				// @ts-expect-error
-				error(chrome.runtime.lastError);
+				console.error(chrome.runtime.lastError);
 			} else {
-				log("Settings saved successfully");
+				console.log("Settings saved successfully");
 			}
 		});
 	}
@@ -197,6 +232,14 @@ export class BrowserExtensionContext extends Context {
 }
 
 export class ObsidianContext extends Context {
+	/**
+	 * @override
+	 * @returns {boolean}
+	 */
+	isContextActive() {
+		// @ts-expect-error
+		return typeof app !== "undefined" && typeof app.vault !== "undefined";
+	}
 
 	/**
 	 * @override
@@ -276,6 +319,23 @@ export class ObsidianContext extends Context {
 	}
 }
 
+const CONTEXTS = [
+	new UserScriptContext(),
+	new ObsidianContext(),
+	new BrowserExtensionContext(),
+	new LocalContext()
+];
+
+export function getContext() {
+	for (const context of CONTEXTS) {
+		if (context.isContextActive()) {
+			return context;
+		}
+	}
+	error("No applicable context found, defaulting to LocalContext");
+	return new LocalContext();
+}
+
 /**
  * Parse URL parameters into a key-value map
  * @param {string} url

src/platforms/extension/extension.js

@@ -1,4 +0,0 @@
-import { initializeApplication } from "../../application.js";
-import { BrowserExtensionContext } from "../../context.js";
-
-initializeApplication(new BrowserExtensionContext());

src/platforms/obsidian/obsidian.js

@@ -1,4 +0,0 @@
-import { initializeApplication } from "../../application.js";
-import { ObsidianContext } from "../../context.js";
-
-initializeApplication(new ObsidianContext());

src/platforms/userscript/userscript.js

@@ -1,4 +0,0 @@
-import { initializeApplication } from "../../application.js";
-import { UserScriptContext } from "../../context.js";
-
-initializeApplication(new UserScriptContext());

src/platforms/web/web.js

@@ -1,4 +0,0 @@
-import { initializeApplication } from "../../application.js";
-import { LocalContext } from "../../context.js";
-
-initializeApplication(new LocalContext());

src/shared.js

@@ -4,7 +4,6 @@ export const Directions = {
 };
 
 let debugMode = location.hostname === "127.0.0.1";
-let context = null;
 
 /**
  * @returns {boolean} Whether debug mode is enabled
@@ -20,17 +19,6 @@ export function setDebug(value) {
 	debugMode = value;
 }
 
-export function getContext() {
-	if (!context) {
-		throw new Error("Context requested before being set");
-	}
-	return context;
-}
-
-export function setContext(newContext) {
-	context = newContext;
-}
-
 /**
  * Create an HTML element with the specified parameters
  * @param {string} className

src/stickyNotes.js

@@ -1,9 +1,9 @@
 import {
-	getContext,
 	makeElement,
 	makeDraggable,
 	makeClosable
 } from './shared.js';
+import { getContext } from './context.js';
 
 /**
  * @typedef {Object} SavedStickyNote

src/stylesheet.css

@@ -357,13 +357,6 @@
 	border: none !important;
 }
 
-.birb-sticky-note-input::placeholder {
-	font-family: "Monocraft", monospace !important;
-	font-size: 14px !important;
-	background-color: transparent !important;
-	color: rgba(0, 0, 0, 0.35) !important;
-}
-
 .birb-sticky-note-input:focus {
 	outline: none !important;
 	box-shadow: none !important;