My Notes — Chrome extension for simple note taking. Available on Web Store.
Features
-
All notes quickly accessible (see How to open)
-
All notes saved automatically
-
Edited notes updated in every open window
-
Can paste HTML
-
Great as a Clipboard
-
Can send text between computers (see Context menu or Google Drive Sync)
-
Can store notes to Google Drive (see Google Drive Sync)
-
Can edit notes from other computers (see Google Drive Sync)
-
Works offline
Installation
Available on Web Store.
Icon
How to open
There are 3 ways to open My Notes:
- Click on the icon (added to the toolbar)
- In every new tab (see Options)
- Keyboard shortcut (see Options)
Options
There are 3 ways to open Options:
- Right click on the icon (added to the toolbar) and select Options
- Click on Options link in the main page
- Keyboard shortcut (see Options)
Options on Appearance:
- Font type (Serif, Sans Serif, Monospace, Google Fonts)
- Font size
- Theme (Light, or Dark)
- Enable Focus mode
Options on Convenience:
- Hotkeys
Options on Behavior:
- Open My Notes in every New Tab (see Permissions)
- Indent text on Tab
Options on Additional functionality:
- Enable Google Drive Sync (see Permissions)
Clipboard
Clipboard — a note that can receive the text sent by the Context menu. Can be edited just like any other note as well, but cannot be renamed or deleted because of its function.
Context menu
Context menu — installed with My Notes and displayed only when a text is selected to quickly Copy and Paste the text to Clipboard.
Save selection — Saves the text to Clipboard in your current computer
Save selection to other devices — Saves the text to Clipboard in your other computer (My Notes needs to be open, same Google Account needs to be used)
Google Drive Sync
Google Drive Sync (see Options) is an automatic two-way synchronization of your notes between My Notes and your Google Drive.
This gives you:
- backup (notes can be restored in future)
- can modify the notes in both sources (Google Drive, My Notes, and vice versa)
- can modify the notes from other computers (by installing My Notes and using the same Google Account)
Location
Notes are uploaded to your Google Drive to the folder My Notes. This folder is created automatically. If the folder exists from a previous installation, it is restored, notes are downloaded and uploaded, and the synchronization continues.
Synchronization
Notes are synchronized immediately after you enable Google Drive Sync. Then on every My Notes Open/Close/Refresh, or with the "Sync Now" button. Synchronization works in both ways — to Google Drive, from Google Drive.
Access
My Notes can only access the files it created. It cannot see the other files in your Google Drive.
Implementation
My Notes is implemented in JavaScript. The focus is on simplicity and providing an interface that just works. It is lightweight and very fast. Zero external dependencies. No minification or transpiling is used in the process to avoid any obfuscation. The files you see here, are the same files you get in the extension.
Created using:
-
JavaScript Modules (available since Chrome 61)
-
ECMAScript
Proxy(UI updates) -
Event Driven Background Script (run in background, unloaded when not used)
-
await/async
Storage:
-
chrome.storagechrome.storage.local— Notes and Options (Font type, Font size, etc.), 5MB limitchrome.storage.sync— Text sent with Context menu, 100KB limit
-
localStorage— Collected changes before saving (for optimized saving)
Folder structure
background/
google-drive/ # Everything related to Google Drive Sync
# - File operations (List, Create, Get, Update, Delete)
# - Synchronization (to Google Drive, from Google Drive)
# - Queries (find My Notes folder, list files in My Notes folder)
# - Multipart bodies (create My Notes folder, create file, update file)
# - Tests
init/ # Run when My Notes is installed/updated
# - Sets a Unique ID for My Notes installation (used by Context menu), if not already set
# - Migrates notes and options
# - Creates Context menu and attaches the events
# - Creates a Notification when My Notes is installed/updated
# - Registers the ways to open My Notes (icon click, in every New Tab)
# - Registers events to trigger Google Drive Sync from My Notes
images/ # Images and icons used in My Notes or README
notes/ # Everything related to Notes
# - Create/Rename/Delete notes; Note editing, Note saving
# - Toolbar
# - Every UI init and update when data changes
# - Registers commands (Toggle Focus mode - can be enabled in Options)
options/ # Everything related to Options
# - Font type, Font size, Theme, etc.
# - Every UI init and update when data changes
shared/ # Everything common (used at more places)
# - Date formatting (Last sync)
# - Managing the permissions (Requesting, Removing, Checking)
# - Helpers for Chrome Storage
# - Default values (Notes, Options)
tests/ # Entrypoint for tests
# - Runs every __tests__/index.html in the project
# - Prints "net::ERR_FILE_NOT_FOUND" if the test file is not found
# - Prints "Assertion failed: console.assert" if any assertion failed
.eslintrc # To enforce code quality and same coding style
.gitignore # To exclude any generated files (only .DS_Store at this point)
LICENSE # MIT
manifest.json # Main extension file
background.html # Entrypoint for background script
background.js
notes.html # Entrypoint for notes
notes.css
notes.js
options.html # Entrypoint for options
options.css
options.js
README.md
SUPPORT.md
CONTRIBUTING.md
PERMISSIONS.md
