Update manifest.json

README.md

@@ -9,14 +9,10 @@
 
 It's a pet bird that hops around your computer, what more could you want?
 
-### Get it for [Google Chrome](https://chromewebstore.google.com/detail/pocket-bird/lbbdngkbbgaecefacpnhnhleggabghak) 
+### Get it for [Google Chrome](https://chromewebstore.google.com/detail/pocket-bird/lbbdngkbbgaecefacpnhnhleggabghak)
 
 ### 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
-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!
+_Coming soon!_
 
 ### 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 WEB_ENTRY = SRC_DIR + "/platforms/web/web.js";
-const USERSCRIPT_ENTRY = SRC_DIR + "/platforms/userscript/userscript.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 APPLICATION_ENTRY = SRC_DIR + "/application.js";
+const BUNDLED_OUTPUT = DIST_DIR + "/birb.bundled.js";
+const BIRB_OUTPUT = DIST_DIR + "/birb.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}`; // Disable build number for now
+const version = `${versionDate}.${buildNumber}`;
 
 // Update build cache
 buildCache.version = version;
 writeFileSync(BUILD_CACHE_PATH, JSON.stringify(buildCache), 'utf8');
 
-/**
- * @param {string} entryPoint
- * @param {boolean} [embedFont]
- * @returns {Promise<string>}
- */
-async function generateCode(entryPoint, embedFont = false) {
-	// Bundle with rollup
-	const bundle = await rollup({
-		input: entryPoint,
-	});
+// =============================================
+// Build JavaScript function
+// =============================================
 
-	await bundle.write({
-		file: TEMP_BUNDLED_OUTPUT,
-		format: 'iife',
-	});
+// Bundle with rollup
+const bundle = await rollup({
+	input: APPLICATION_ENTRY,
+});
 
-	await bundle.close();
+await bundle.write({
+	file: BUNDLED_OUTPUT,
+	format: 'iife',
+});
 
-	let birbJs = readFileSync(TEMP_BUNDLED_OUTPUT, 'utf8');
+await bundle.close();
 
-	// Delete bundled file
-	unlinkSync(TEMP_BUNDLED_OUTPUT);
+let birbJs = readFileSync(BUNDLED_OUTPUT, 'utf8');
 
-	// Replace version placeholder
-	birbJs = birbJs.replaceAll(VERSION_KEY, version);
+// Delete bundled file
+unlinkSync(BUNDLED_OUTPUT);
 
-	// Compile and insert sprite sheets
-	for (const spriteSheet of spriteSheets) {
-		const dataUri = readFileSync(spriteSheet.path, 'base64');
-		birbJs = birbJs.replaceAll(spriteSheet.key, `data:image/png;base64,${dataUri}`);
-	}
+// Replace version placeholder
+birbJs = birbJs.replaceAll(VERSION_KEY, version);
 
-	// 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;
+// Compile and insert sprite sheets
+for (const spriteSheet of spriteSheets) {
+	const dataUri = readFileSync(spriteSheet.path, 'base64');
+	birbJs = birbJs.replaceAll(spriteSheet.key, `data:image/png;base64,${dataUri}`);
 }
 
-async function buildWeb() {
-	const birbJs = await generateCode(WEB_ENTRY);
-	mkdirSync(WEB_DIR, { recursive: true });
-	writeFileSync(WEB_DIR + '/birb.js', birbJs);
-	writeFileSync(WEB_DIR + '/birb.embed.js', birbJs);
-}
+// Insert stylesheet
+const stylesheetContent = readFileSync(STYLESHEET_PATH, 'utf8');
+birbJs = birbJs.replace(STYLESHEET_KEY, stylesheetContent).replace(MONOCRAFT_SRC_KEY, MONOCRAFT_URL);
 
-async function buildUserscript() {
-	const birbJs = await generateCode(USERSCRIPT_ENTRY);
 
-	// Get userscript header
-	const userScriptHeader = readFileSync(USERSCRIPT_HEADER, 'utf8').replaceAll(VERSION_KEY, version);
+// Write bundled JavaScript function
+writeFileSync(BIRB_OUTPUT, birbJs);
 
-	mkdirSync(USERSCRIPT_DIR, { recursive: true });
-	const userScript = userScriptHeader + "\n" + birbJs;
-	writeFileSync(USERSCRIPT_DIR + '/birb.user.js', userScript);
-}
+// =============================================
+// Build userscript
+// =============================================
 
-async function buildExtension() {
-	const birbJs = await generateCode(BROWSER_EXTENSION_ENTRY);
+// Get userscript header
+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
-	let browserManifest = readFileSync(BROWSER_MANIFEST, 'utf8');
-	browserManifest = browserManifest.replace(VERSION_KEY, version);
-	writeFileSync(EXTENSION_DIR + '/manifest.json', browserManifest);
+mkdirSync(EXTENSION_DIR, { recursive: true });
 
-	// Copy icons folder
-	mkdirSync(EXTENSION_DIR + '/images/icons', { recursive: true });
-	cpSync(IMAGES_DIR + '/icons/transparent', EXTENSION_DIR + '/images/icons/transparent', { recursive: true });
+// Copy birb.js
+writeFileSync(EXTENSION_DIR + '/birb.js', birbJs);
 
-	// Copy fonts folder
-	mkdirSync(EXTENSION_DIR + '/fonts', { recursive: true });
-	cpSync(FONTS_DIR, EXTENSION_DIR + '/fonts', { recursive: true });
+// Copy manifest.json
+let browserManifest = readFileSync(BROWSER_MANIFEST, 'utf8');
+browserManifest = browserManifest.replace(VERSION_KEY, version);
+writeFileSync(EXTENSION_DIR + '/manifest.json', browserManifest);
 
-	// Compress extension folder into zip
-	const output = createWriteStream(DIST_DIR + "/extension.zip");
-	const archive = archiver('zip');
+// Copy icons folder
+mkdirSync(EXTENSION_DIR + '/images/icons', { recursive: true });
+cpSync(IMAGES_DIR + '/icons/transparent', EXTENSION_DIR + '/images/icons/transparent', { recursive: true });
 
-	output.on('close', () => {
-		console.log(`Created zip file: ${archive.pointer()} total bytes`);
-	});
+// Copy fonts folder
+mkdirSync(EXTENSION_DIR + '/fonts', { recursive: true });
+cpSync(FONTS_DIR, EXTENSION_DIR + '/fonts', { recursive: true });
 
-	archive.on('error', (err) => {
-		throw err;
-	});
+// Compress extension folder into zip
+const output = createWriteStream(DIST_DIR + "/extension.zip");
+const archive = archiver('zip');
 
-	archive.pipe(output);
-	archive.directory(EXTENSION_DIR + '/', false);
-	archive.finalize();
-}
+output.on('close', () => {
+	console.log(`Created zip file: ${archive.pointer()} total bytes`);
+});
 
-async function buildObsidian() {
-	const birbJs = await generateCode(OBSIDIAN_ENTRY, true);
+archive.on('error', (err) => {
+	throw err;
+});
 
-	mkdirSync(OBSIDIAN_DIR, { recursive: true });
+archive.pipe(output);
+archive.directory(EXTENSION_DIR + '/', false);
+archive.finalize();
 
-	// Wrap birb.js with plugin boilerplate
-	let obsidianPlugin = readFileSync(OBSIDIAN_WRAPPER, 'utf8').replace(VERSION_KEY, version).replace(CODE_KEY, birbJs);
+// =============================================
+// Build Obsidian plugin
+// =============================================
 
-	// Create main.js with plugin code
-	writeFileSync(OBSIDIAN_DIR + '/main.js', obsidianPlugin);
+mkdirSync(OBSIDIAN_DIR, { recursive: true });
 
-	// Copy manifest.json
-	let obsidianManifest = readFileSync(OBSIDIAN_MANIFEST, 'utf8');
-	obsidianManifest = obsidianManifest.replace(/"version":\s*".*"/, `"version": "${version}"`);
-	writeFileSync(OBSIDIAN_DIR + '/manifest.json', obsidianManifest);
-}
+// Wrap birb.js with plugin boilerplate
+let obsidianPlugin = readFileSync(OBSIDIAN_WRAPPER, 'utf8').replace(VERSION_KEY, version).replace(CODE_KEY, birbJs);
 
-console.log("Starting build...");
+// Encode font to data URI since Obsidian plugins can't have external font files
+const monocraftFontData = readFileSync(FONTS_DIR + '/Monocraft.otf', 'base64');
+const monocraftDataUri = `data:font/otf;base64,${monocraftFontData}`;
+obsidianPlugin = obsidianPlugin.replace(MONOCRAFT_URL, monocraftDataUri);
 
-await buildWeb();
-await buildUserscript();
-await buildExtension();
-await buildObsidian();
+// Create main.js with plugin code
+writeFileSync(OBSIDIAN_DIR + '/main.js', obsidianPlugin);
 
-console.log("Build completed successfully!");
+// Copy manifest.json
+let obsidianManifest = readFileSync(OBSIDIAN_MANIFEST, 'utf8');
+obsidianManifest = obsidianManifest.replace(/"version":\s*".*"/, `"version": "${version}"`);
+writeFileSync(OBSIDIAN_DIR + '/manifest.json', obsidianManifest);
+
+console.log(`Build complete: ${version}`);

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) {
-		log("birbOS booting up...");
-		setContext(context);
-		log("Loading sprite sheets...");
-		const birbPixels = await loadSpriteSheetPixels(SPRITE_SHEET);
-		const featherPixels = await loadSpriteSheetPixels(FEATHER_SPRITE_SHEET);
-		startApplication(birbPixels, featherPixels);
+	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);
+			};
+		});
 	}
 
-	/**
-	 * @param {string[][]} birbPixels
-	 * @param {string[][]} featherPixels
-	 */
-	function startApplication(birbPixels, featherPixels) {
+	log("Loading sprite sheets...");
+
+	Promise.all([
+		loadSpriteSheetPixels(SPRITE_SHEET),
+		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();
-	}
-
-	/**
-	 * 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());
+	}).catch((e) => {
+		error("Error while loading sprite sheets: ", e);
+	});
 
 })();

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) {
-		log("birbOS booting up...");
-		setContext(context);
-		log("Loading sprite sheets...");
-		const birbPixels = await loadSpriteSheetPixels(SPRITE_SHEET);
-		const featherPixels = await loadSpriteSheetPixels(FEATHER_SPRITE_SHEET);
-		startApplication(birbPixels, featherPixels);
+	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);
+			};
+		});
 	}
 
-	/**
-	 * @param {string[][]} birbPixels
-	 * @param {string[][]} featherPixels
-	 */
-	function startApplication(birbPixels, featherPixels) {
+	log("Loading sprite sheets...");
+
+	Promise.all([
+		loadSpriteSheetPixels(SPRITE_SHEET),
+		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();
-	}
-
-	/**
-	 * 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());
+	}).catch((e) => {
+		error("Error while loading sprite sheets: ", e);
+	});
 
 })();

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) {
-		log("birbOS booting up...");
-		setContext(context);
-		log("Loading sprite sheets...");
-		const birbPixels = await loadSpriteSheetPixels(SPRITE_SHEET);
-		const featherPixels = await loadSpriteSheetPixels(FEATHER_SPRITE_SHEET);
-		startApplication(birbPixels, featherPixels);
+	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);
+			};
+		});
 	}
 
-	/**
-	 * @param {string[][]} birbPixels
-	 * @param {string[][]} featherPixels
-	 */
-	function startApplication(birbPixels, featherPixels) {
+	log("Loading sprite sheets...");
+
+	Promise.all([
+		loadSpriteSheetPixels(SPRITE_SHEET),
+		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();
-	}
-
-	/**
-	 * 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());
+	}).catch((e) => {
+		error("Error while loading sprite sheets: ", e);
+	});
 
 })();

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) {
-	log("birbOS booting up...");
-	setContext(context);
-	log("Loading sprite sheets...");
-	const birbPixels = await loadSpriteSheetPixels(SPRITE_SHEET);
-	const featherPixels = await loadSpriteSheetPixels(FEATHER_SPRITE_SHEET);
-	startApplication(birbPixels, featherPixels);
+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);
+		};
+	});
 }
 
-/**
- * @param {string[][]} birbPixels
- * @param {string[][]} featherPixels
- */
-function startApplication(birbPixels, featherPixels) {
+log("Loading sprite sheets...");
+
+Promise.all([
+	loadSpriteSheetPixels(SPRITE_SHEET),
+	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;
-		// TODO: FIX
-		const fixedAllowed = true;
+		const fixedAllowed = getContext() instanceof ObsidianContext;
 		const nonFixedElements = largeElements.filter((el) => {
 			if (fixedAllowed) {
 				return true;
@@ -967,60 +1008,6 @@ function startApplication(birbPixels, featherPixels) {
 	// Run the birb
 	init();
 	draw();
-}
-
-/**
- * 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);
-		};
-	});
-}
+}).catch((e) => {
+	error("Error while loading sprite sheets: ", e);
+});

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;