Calendar Bridge for Obsidian

Bridge your calendars to Obsidian. A powerful plugin that integrates calendar events directly into your workspace. View events from iCloud, Google Calendar, and any calendar service that provides subscription URLs.

Features

📅 Calendar View

• Monthly calendar grid with intuitive navigation
• Day selection to view events for any date
• Event indicators (dots) showing which days have events
• Today highlight and selected day highlight
• Manual refresh button to instantly update events
• Clean, theme-aware design

📋 Event Display

• All-day events displayed in separate section
• Timed events sorted chronologically
• Event details including:
  • Title and description
  • Date and time
  • Location
  • Calendar source
• Click events to see full details in modal

⚙️ Customization

• Calendar subscriptions: Add calendars via subscription URLs
• Calendar filters: Choose which calendars to display
• Time format: 12-hour or 24-hour display
• Auto-refresh: Configurable intervals (1, 5, or 20 minutes)
• All-day events: Toggle visibility
• Multiple calendars: Support for unlimited calendar subscriptions

🔒 Privacy & Security

• Direct subscription access: Fetches events from your calendar URLs
• No credentials stored: Uses public subscription links
• Read-only: Plugin never modifies your calendar data
• Works with any calendar service: iCloud, Google Calendar, Office 365, etc.

Installation

Manual Installation

1. Download the plugin files:

   • main.js
   • manifest.json
   • styles.css

2. Copy to your vault:

   mkdir -p /path/to/your/vault/.obsidian/plugins/calendar-bridge
   cp main.js manifest.json styles.css /path/to/your/vault/.obsidian/plugins/calendar-bridge/
   

3. Enable the plugin:

   • Open Obsidian
   • Go to Settings → Community plugins
   • Enable "Calendar Bridge"

4. Add your calendars:

   • Go to Settings → Calendar Bridge
   • Click "Add Calendar"
   • Enter a name and paste your calendar subscription URL
   • See instructions below for getting subscription URLs

Build from Source

# Clone the repository
git clone https://github.com/iancubus/Calendar_Bridge.git
cd Calendar_Bridge

# Install dependencies
npm install

# Build the plugin
npm run build

# The built files (main.js, manifest.json, styles.css) will be in the root directory

Usage

Getting Calendar Subscription URLs

From Apple Calendar (iCloud)

1. Open Calendar.app
2. Right-click on the calendar you want to add
3. Select "Share Calendar"
4. Check "Public Calendar"
5. Copy the webcal:// URL that appears

From Google Calendar

1. Go to Google Calendar
2. Click the three dots next to the calendar
3. Select "Settings and sharing"
4. Scroll to "Integrate calendar"
5. Copy the "Public address in iCal format" URL

From iCloud.com

1. Go to iCloud.com → Calendar
2. Click the share icon next to your calendar
3. Enable "Public Calendar"
4. Copy the webcal:// URL

Adding Calendars to the Plugin

1. Open Settings → Calendar Bridge
2. Click "Add Calendar" button
3. Enter a friendly name (e.g., "Work", "Personal")
4. Paste the subscription URL (webcal:// or https://)
5. Click "Add Calendar"
6. The calendar will immediately start loading events

Opening the Calendar View

1. Click the calendar icon in the ribbon (left sidebar)
2. Or use the command palette: Open Calendar
3. The calendar will appear in the right sidebar

Viewing Events

1. Select a day on the calendar
2. Events for that day appear below the calendar
3. Click the refresh button (↻) to manually update events
4. Click any event to see full details in a modal
5. Navigate months using the arrow buttons or "Today" button

Managing Calendars

1. Go to Settings → Calendar Bridge
2. Use checkboxes to enable/disable specific calendars
3. Click "Edit" to change calendar name or URL
4. Click "Remove" to delete a calendar subscription
5. Use "Enable All" or "Disable All" for quick changes
6. Settings are saved automatically

Configuration

Settings Options

Setting	Description	Options
Calendar Subscriptions	Add/edit/remove calendar URLs	Name + webcal:// or https:// URL
Refresh Interval	How often to auto-check for updates	1, 5, or 20 minutes
Show All-Day Events	Display all-day events	On/Off
Time Format	Display format for event times	12h or 24h
Calendar Filters	Which calendars to display	Individual checkboxes

Technical Details

Requirements

• Obsidian: Version 0.15.0 or higher
• Platform: Cross-platform (macOS, Windows, Linux)
• Internet: Required to fetch calendar data from subscription URLs
• Node.js: For development only

Architecture

• TypeScript: Full type safety
• Moment.js: Date manipulation
• node-ical: Parse .ics calendar files
• Obsidian requestUrl API: Fetch calendar data over HTTPS
• Vanilla JS/DOM: No framework dependencies
• Bundle size: ~900KB (includes node-ical parser)

File Structure

calendar-events/
├── src/
│   ├── main.ts              # Plugin entry point
│   ├── calendar-view.ts     # Calendar view component
│   ├── calendar-ui.ts       # Calendar UI rendering
│   ├── event-reader.ts      # Fetch calendars from URLs
│   ├── event-parser.ts      # Parse .ics files
│   ├── event-modal.ts       # Event details modal
│   ├── settings.ts          # Settings tab with add/edit modals
│   └── types.ts             # TypeScript types
├── styles.css               # Plugin styling
├── manifest.json            # Plugin metadata
└── README.md                # This file

Troubleshooting

No events showing

• Check URL: Make sure the subscription URL is correct
• Check calendar visibility: Ensure calendar is toggled ON in settings
• Make calendar public: Some services require making calendars public
• Click refresh button: Use the manual refresh button (↻)
• Check filters: Make sure "Show All-Day Events" is enabled if needed
• Wait for auto-refresh: Or reload the plugin

Can't add calendar

• Check URL format: Must start with webcal:// or https://
• Verify URL is accessible: Try opening the URL in a browser
• Check permissions: Make sure calendar is shared/public
• Try different format: Some services provide multiple URL formats

Events not updating

• Click refresh button: Use the manual refresh (↻) next to "Events for..."
• Check refresh interval: Set to shorter interval in settings (1 min)
• Reload plugin: Disable and re-enable in Community Plugins
• Check internet: Plugin needs internet to fetch calendar data

Performance issues

• Disable unused calendars: Toggle off calendars you don't need
• Increase refresh interval: Set to 20 minutes instead of 1
• Remove large calendars: Some calendars have thousands of events

Development

Building

npm install          # Install dependencies
npm run dev          # Watch mode for development
npm run build        # Production build

Code Style

• TypeScript with strict mode
• ESLint for linting
• Obsidian API best practices

Roadmap

• Week view option
• Event search functionality
• Custom event colors per calendar
• Event filtering by keywords
• Export events to notes
• Offline caching
• Multi-day event spanning

Contributing

Contributions are welcome! Please feel free to submit issues or pull requests.

License

MIT License - See LICENSE file for details

Credits

• Author: Rey Ian Cabanganan
• GitHub: @iancubus
• Inspired by: Liam Cain's Calendar Plugin
• Built with: Obsidian API, node-ical, moment.js

Support

If you find this plugin helpful, please consider:

• ⭐ Starring the repository
• 🐛 Reporting bugs
• 💡 Suggesting features
• 📖 Improving documentation

---

Made with ❤️ for the Obsidian community