Sustainability Mirror - Chrome Extension

A Chrome extension that tracks your carbon footprint while browsing in real-time, displaying emissions through an elegant macOS-style cursor tooltip.

Features

• Real-time Carbon Tracking: Monitors clicks, keystrokes, scrolls, mouse movements, and session time
• Device-Specific Calculations: Adjusts emissions based on device type (mobile, desktop, tablet)
• Beautiful Tooltip: Translucent tooltip with blur background showing live emissions
• Smart Unit Conversion: Automatically converts from milligrams to trees killed for better context
• Session Persistence: Tracks data across browser sessions
• Idle Time Detection: Monitors background energy consumption
• Detailed Analytics: Popup interface with comprehensive emission breakdown

Installation

Method 1: Load as Unpacked Extension (Development)

1. Download or clone this repository
2. Open Chrome and navigate to chrome://extensions/
3. Enable "Developer mode" in the top right
4. Click "Load unpacked" and select the extension folder
5. The extension will be installed and active immediately

Method 2: Package for Distribution

1. In Chrome, go to chrome://extensions/
2. Enable "Developer mode"
3. Click "Pack extension" and select the extension folder
4. This will create a .crx file that can be distributed

How It Works

Carbon Emission Calculations

The extension uses the following emission factors:

• Clicks: 0.5mg CO₂ per click
• Keystrokes: 0.3mg CO₂ per keystroke
• Scrolls: 0.2mg CO₂ per scroll event
• Mouse Movement: 0.001mg CO₂ per pixel traveled
• Session Time: 0.05mg CO₂ per second
• Idle Time: 0.1mg CO₂ per second

Device Multipliers

• Mobile: 0.7x (more efficient)
• Desktop: 1.0x (baseline)
• Tablet: 0.8x (moderate efficiency)

Tree Conversion

The extension converts emissions to "trees killed" using the approximation that one tree absorbs ~22kg CO₂ per year.

Testing the Extension

1. Install the extension using Method 1 above
2. Visit any website and start browsing normally
3. Move your mouse to see the tooltip appear
4. Click, type, and scroll to see emissions increase
5. Click the extension icon to view detailed analytics
6. Test on different devices to see device-specific calculations

Test Scenarios

• High Activity: Rapid clicking and scrolling on social media
• Low Activity: Reading a text-heavy article
• Idle Time: Leave a tab open without interaction
• Tab Switching: Switch between multiple tabs
• Form Filling: Fill out forms and search queries

File Structure

sustainability-mirror/
├── manifest.json          # Extension configuration
├── content.js            # Main tracking logic
├── background.js         # Background service worker
├── popup.html           # Extension popup interface
├── popup.js             # Popup functionality
├── styles.css           # Tooltip and UI styling
└── README.md            # This file

Customization

Adjusting Emission Factors

Edit the constants object in content.js:

this.constants = {
    CLICK_EMISSION: 0.5,      // Adjust click emissions
    KEYSTROKE_EMISSION: 0.3,  // Adjust keystroke emissions
    // ... other factors
};

Changing Tooltip Appearance

Modify styles.css to customize the tooltip design:

.sustainability-tooltip {
    width: 200px;           /* Adjust size */
    height: 50px;
    background: rgba(0, 0, 0, 0.8);  /* Change colors */
    /* ... other styles */
}

Adding New Tracking Events

Add new event listeners in the attachEventListeners() method:

document.addEventListener('newEvent', () => {
    this.addEmission('newEventType', emissionAmount);
    this.showTooltip();
});

Browser Compatibility

• Chrome: Fully supported (Manifest V3)
• Edge: Supported with minor modifications
• Firefox: Requires Manifest V2 conversion
• Safari: Requires WebExtensions API adaptation

Privacy & Data

• Local Storage Only: All data is stored locally on the user's device
• No External Requests: No data is sent to external servers
• No Personal Information: Only interaction metrics are tracked
• User Control: Users can reset data at any time

Performance

• Minimal Impact: Lightweight event listeners with debouncing
• Efficient Storage: Periodic data saving to reduce I/O
• Optimized Calculations: Simple arithmetic operations
• Memory Management: Automatic cleanup of old data

Contributing

Feel free to submit issues, feature requests, or pull requests. Key areas for improvement:

• More accurate emission calculations
• Additional device types and contexts
• Better visualization and animations
• Enhanced analytics and reporting
• Carrier-specific calculations
• Website-specific emission factors

License

This project is open source and available under the MIT License.