From 6afdbaccc4b51f112fe04ad08ae0b46e79fb6b61 Mon Sep 17 00:00:00 2001
From: jsnk <jonassnk11@gmail.com>
Date: Sun, 26 Oct 2025 19:10:23 +0100
Subject: [PATCH] cc

---
 README.md                             | 52 +++++++++++++++++++++++++++
 Study/message flow from extension.md  | 36 +++++++++++++++++++
 lib/services/browser_api_service.dart | 25 ++++++++-----
 lib/services/extension_service.dart   | 10 ++++++
 4 files changed, 114 insertions(+), 9 deletions(-)
 create mode 100644 Study/message flow from extension.md

diff --git a/README.md b/README.md
index daa34ce..2fe8b1a 100644
--- a/README.md
+++ b/README.md
@@ -1,4 +1,56 @@
+# Main Commands
+
+flutter run -d chrome
+
+flutter run -d web-server --web-port=8080
+
+flutter devices
+
+flutter run -d chrome --release
+
+flutter run -d chrome --debug
+
+flutter build web
+
+flutter clean
+flutter pub get
+flutter run -d chrome
+
+
+
 # browser_tab_manager
+
+# Extension
+https://drive.google.com/drive/folders/1pAniw90J-cWrH7nMVaxY0pl0TMG63AJA?usp=sharing
+
+Add this folder in developer mode:
+Go To:
+chrome://extensions/
+
+showDialog(
+  context: context,
+  builder: (context) => AlertDialog(
+    title: Text('Manage Extensions'),
+    content: Text(
+      'To manage your Chrome extensions:\n\n'
+      '1. Open Chrome browser\n'
+      '2. Type chrome://extensions/ in the address bar\n'
+      '3. Or click the three dots menu > Extensions > Manage Extensions'
+    ),
+    actions: [
+      TextButton(
+        onPressed: () => Navigator.pop(context),
+        child: Text('OK'),
+      ),
+    ],
+  ),
+);
+
+Start Developer mode: In right corner. 
+Load Unpacked: Add entire folder in left corner.
+
+Start Extension in right corner 
+
 ## Getting Started
 - [Lab: Write your first Flutter app](https://docs.flutter.dev/get-started/codelab)
 - [Cookbook: Useful Flutter samples](https://docs.flutter.dev/cookbook)
diff --git a/Study/message flow from extension.md b/Study/message flow from extension.md
new file mode 100644
index 0000000..52e3792
--- /dev/null
+++ b/Study/message flow from extension.md	
@@ -0,0 +1,36 @@
+### **Message Flow FROM Extension:**
+```
+Browser Extension
+      ↓ postMessage
+window.onMessage
+      ↓ (ExtensionService listening)
+setupListener() receives message
+      ↓ filter by source
+_handleExtensionMessage()
+      ↓ check action type
+Call appropriate callback
+      ↓
+onTabsUpdate() / onTrackingStart() / onTrackingStop()
+      ↓
+TabManagerHome updates UI
+      ↓
+User sees changes!
+```
+
+### **Message Flow TO Extension:**
+```
+User clicks "Track Tabs"
+      ↓
+TabManagerHome calls startTracking()
+      ↓
+ExtensionService.startTracking()
+      ↓
+sendMessage({'action': 'startTracking'})
+      ↓
+window.postMessage
+      ↓
+Extension receives message
+      ↓
+Extension starts tracking
+      ↓
+Extension sends back confirmation
\ No newline at end of file
diff --git a/lib/services/browser_api_service.dart b/lib/services/browser_api_service.dart
index 4073f45..b286ab3 100644
--- a/lib/services/browser_api_service.dart
+++ b/lib/services/browser_api_service.dart
@@ -11,14 +11,12 @@ import '../models/tab_data.dart';
 // ASYNC WAIT
 // return empty if fail
 // try catch no crash
-// final for security, assign once then locked, can't change main data.
+// final for security, assign once then locked, no change main data.
 // API string result
 
 // dynamic list "ANY" Type
 // decode to list of maps so its ready for use
 // objects
-// a map is EXPLAIN
-// .map method DOES
 // .toList adding to a list of objects that can be called for the data
 
 class BrowserApiService {
@@ -70,6 +68,16 @@ class BrowserApiService {
     return [];
   }
 
+
+
+
+// methods for tab_manager_home
+// Future
+// void, no return
+// gets a string 
+// async, await
+// _callBrowserAPI for data
+
   Future<void> switchToTab(String tabId) async {
     await _callBrowserAPI('switchToTab', [tabId]);
   }
@@ -96,18 +104,17 @@ class BrowserApiService {
 // method what to call
 // optional list args for history "100"
 // a check for browser API
+
 // js_util call JavaScript functions
 // promiseToFuture convert
-// html.window global scope
-// extension is a top level javascript
-// extension adds BrowserAPI to window as a global
+// html.window global scope, javascript BrowserAPI
+// ? allow args to be null
 
-// final result check if args is null
+// final result check if args is null or something
 // call function that fits
-// Encode javascript object to drat object
+// Encode convert javascript object to string
 // And that is why json format is fucking genius...
 
-
   Future<String?> _callBrowserAPI(String method, [List<dynamic>? args]) async {
     try {
       if (!js_util.hasProperty(html.window, 'BrowserAPI')) {
diff --git a/lib/services/extension_service.dart b/lib/services/extension_service.dart
index 1d80146..ca56f41 100644
--- a/lib/services/extension_service.dart
+++ b/lib/services/extension_service.dart
@@ -1,6 +1,16 @@
 import 'dart:html' as html;
 import '../models/tab_data.dart';
 
+
+// communication with browser extension
+// Listens for messages
+// callbacks to notify UI
+// start/stop tracking
+// Converts extension
+
+
+
+
 class ExtensionService {
   Function(List<TabData>)? onTabsUpdate;
   Function()? onTrackingStart;