OpenLake · kriptonian1 · Dec 22, 2021 · Dec 26, 2021 · Jan 3, 2022 · Jan 6, 2022
diff --git a/packages/Activity-Tracker-browser-extension/images/icon128.png b/packages/Activity-Tracker-browser-extension/images/icon128.png
diff --git a/packages/Activity-Tracker-browser-extension/images/icon16.png b/packages/Activity-Tracker-browser-extension/images/icon16.png
diff --git a/packages/Activity-Tracker-browser-extension/images/icon32.png b/packages/Activity-Tracker-browser-extension/images/icon32.png
diff --git a/packages/Activity-Tracker-browser-extension/images/icon48.png b/packages/Activity-Tracker-browser-extension/images/icon48.png
diff --git a/packages/Activity-Tracker-browser-extension/manifest.json b/packages/Activity-Tracker-browser-extension/manifest.json
@@ -0,0 +1,26 @@
+{
+	"name": "Browser Activity Tracker",
+	"description": "Shows you your digital time based on your browser activity",
+	"version": "1.0.0",
+	"manifest_version": 3,
+
+	"action": {
+		"default_icon": {
+			"16": "images/icon16.png",
+			"32": "images/icon32.png",
+			"48": "images/icon48.png",
+			"128": "images/icon128.png"
+		},
+		"default_popup": "popup.html"
+	},
+
+	"background": {
+		"service_worker": "src/background.js",
+		"type": "module"
+	},
+
+	"author": "",
+	"homepage_url": "https://github.com/OpenLake/Activity-Tracker#readme",
+
+	"permissions": ["tabs", "activeTab", "storage"]
+}
diff --git a/packages/Activity-Tracker-browser-extension/popup.html b/packages/Activity-Tracker-browser-extension/popup.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" />
+		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<link rel="stylesheet" href="style/popup.css" />
+		<title>Document</title>
+	</head>
+	<body>
+		<script src="src/background.js"></script>
+		<h1 class="textBody">Activity</h1>
+		<div>
+			<a class="textBody" id="activityTitle">Title: Loading ...</a>
+		</div>
+		<a class="textBody" href="" id="activityUrl">URL: Loading ...</a>
+		<div><img id="activityFavicon" src="" alt="Favicon" /></div>
+	</body>
+</html>
diff --git a/packages/Activity-Tracker-browser-extension/src/background.js b/packages/Activity-Tracker-browser-extension/src/background.js
@@ -0,0 +1,127 @@
+// import { saveActivities } from '../storage/server.js';
+
+let tab = null;
+let url = null;
+let favicon = null;
+class ActiveBrowserWatcher {
+	/**
+	 * @param {number} interval Polling interval
+	 * @param {(activity) => void} changeCallback
+	 */
+	constructor(interval = 1000) {
+		this.startTime = null;
+		this.tab = null; //Title
+		this.url = null;
+		this.favicon = null;
+		// this.changeCallback = changeCallback;
+		this.interval = interval;
+	}
+
+	/**
+	 * Storing the start time of the active window
+	 * Collecting data of the window which will be active
+	 */
+	storeTime() {
+		const endTime = Date.now();
+		const startTime = this.startTime;
+
+		const title = this.tab;
+		const url = this.url;
+		const favicon = this.favicon;
+
+		const data = {
+			title,
+			url,
+			favicon,
+			startTime,
+			endTime,
+		};
+
+		// this.changeCallback(data);
+		console.log(data);
+	}
+
+	/**
+	 * Checks the active window is specific time interval
+	 * and whenever the active window changes stores the time difference by calling {@link ActiveWindowWatcher.storeTime} function
+	 */
+	tracker() {
+		setInterval(() => {
+			let queryOptions = { active: true, currentWindow: true }; // to get current active tab from the current window
+			// eslint-disable-next-line no-undef
+			chrome.tabs.query(queryOptions, function currentTab(tabs) {
+				let currentTab = tabs[0]; // take the object from the returned promise
+				let currentTitle = currentTab.title; // take object title
+				let currentUrl = currentTab.url; // take object URL
+				let currentFavIcons = currentTab.favIconUrl;
+				tab = currentTitle;
+				url = currentUrl;
+				favicon = currentFavIcons;
+
+				// Title
+				const activityTitle = document.getElementById('activityTitle');
+				const activityTitleUrl = document.getElementById('activityTitle');
+				activityTitle.innerHTML = 'Title: ' + currentTitle; //format it in html
+				activityTitleUrl.setAttribute('href', currentUrl);
+				console.log(activityTitle);
+
+				// URl
+				const activityUrl = document.getElementById('activityUrl');
+				const activityLink = document.getElementById('activityUrl');
+				activityUrl.innerHTML = 'URL: ' + currentUrl; //format it in html
+				activityLink.setAttribute('href', currentUrl);
+
+				// Favicon
+				const activityFavicon = document.getElementById('activityFavicon');
+				activityFavicon.setAttribute('src', currentFavIcons); //format Favicon in html
+			});
+
+			if (tab === undefined) return;
+
+			if (!this.tab) {
+				this.startTime = Date.now();
+				this.tab = tab;
+				this.url = url;
+				this.favicon = favicon;
+			}
+
+			//If the active window is changed store the used time data.
+			if (tab !== this.tab) {
+				this.storeTime();
+				this.tab = null;
+				this.url = null;
+				this.favicon = null;
+			}
+			console.log(tab, url, favicon, this.startTime);
+		}, this.interval);
+	}
+
+	initialize() {
+		this.tracker();
+	}
+}
+
+// const activityTracker = new ActiveBrowserWatcher(1000);
+
+// const activityTracker = new ActiveBrowserWatcher(1000, activity => {
+// 	saveActivities(activity);
+// });
+
+// fetch('http://localhost:32768/api/browseractivities',{
+// 	method: 'POST',
+// 	body: activityTracker
+// 	)
+// });
+
+const activityTracker = new ActiveBrowserWatcher(1000, activity => {
+	fetch('http://localhost:32768/api/browseractivities', {
+		method: 'POST',
+		body: activity,
+	})
+		.then(console.log('done'))
+		.catch(err => {
+			console.log(err);
+		});
+});
+
+activityTracker.initialize();
diff --git a/packages/Activity-Tracker-browser-extension/storage/server.js b/packages/Activity-Tracker-browser-extension/storage/server.js
@@ -0,0 +1,24 @@
+import { post } from 'axios';
+// const express = require('express');
+
+const saveActivities = activity => {
+	const { title, url, favicon, startTime, endTime } = activity;
+
+	post('http://localhost:32768/api/browseractivities', {
+		title,
+		url,
+		favicon,
+		startTime,
+		endTime,
+	})
+		.then(res => {
+			console.log(`StatusCode: ${res.status}`);
+		})
+		.catch(error => {
+			console.log(error);
+		});
+};
+
+export default {
+	saveActivities,
+};
diff --git a/packages/Activity-Tracker-browser-extension/style/popup.css b/packages/Activity-Tracker-browser-extension/style/popup.css
@@ -0,0 +1,20 @@
+body {
+	width: 300px;
+	height: 300px;
+	text-align: center;
+	background-color: rgb(18, 31, 48);
+}
+
+.textBody {
+	color: aliceblue;
+}
+
+#activityFavicon {
+	margin-top: 50px;
+	margin-bottom: 50px;
+}
+
+img {
+	width: 20%;
+	height: auto;
+}
diff --git a/packages/server/app.js b/packages/server/app.js
@@ -9,6 +9,7 @@ import root from './routes/root.routes.js';
 import user from './routes/user.routes.js';
 import activity from './routes/activity.routes.js';
 import app_usage from './routes/app.routes.js';
+import browser_activity from './routes/browseractivity.routes';
 
 const app = express();
 
@@ -41,6 +42,7 @@ app.use('/api/', root);
 app.use('/api/users', user);
 app.use('/api/activities', activity);
 app.use('/api/apps', app_usage);
+app.use('/api/browseractivities', browser_activity);
 
 app.listen(port, hostname, function () {
 	console.log(`Nodejs server running at http://${hostname}:${port}/`);

diff --git a/packages/server/controllers/index.js b/packages/server/controllers/index.js
@@ -6,6 +6,7 @@ import * as json_app_controller from './json/app.controller.js';
 import * as mongo_activity_controller from './mongo/activity.controller.js';
 import * as mongo_app_controller from './mongo/app.controller.js';
 import * as mongo_user_controller from './mongo/user.controller.js';
+import * as mongo_browser_activity_controller from './mongo/browserTracker.controller.js';
 
 export const activity_controller = useLocal
 	? json_activity_controller
@@ -16,3 +17,7 @@ export const app_controller = useLocal
 	: mongo_app_controller;
 
 export const user_controller = mongo_user_controller;
+
+export const browser_activity_controller = useLocal
+	? json_activity_controller
+	: mongo_browser_activity_controller;
diff --git a/packages/server/controllers/mongo/browserTracker.controller.js b/packages/server/controllers/mongo/browserTracker.controller.js
@@ -0,0 +1,36 @@
+import browserActivity from '../../models/browserTracker.model.js';
+
+export const activity_create = (req, res, next) => {
+	const { title, url, favicon, startTime, endTime } = req.body;
+	const browseractivity = new browserActivity({
+		title,
+		url,
+		favicon,
+		startTime,
+		endTime,
+	});
+	browseractivity.save(err => {
+		if (err) return next(err);
+	});
+
+	res.send('Activity created succecssfully');
+};
+
+export const all_activities = (req, res, next) => {
+	const today = new Date();
+	const yesterday = new Date(today);
+	yesterday.setDate(yesterday.getDate() - 1);
+
+	const after = req.query.after ?? yesterday.toISOString();
+	const before = req.query.before ?? today.toISOString();
+
+	browserActivity.find(
+		{
+			startTime: { $gte: after, $lt: before },
+		},
+		(err, activity) => {
+			if (err) return next(err);
+			res.json(activity);
+		},
+	);
+};
diff --git a/packages/server/models/browserTracker.model.js b/packages/server/models/browserTracker.model.js
@@ -0,0 +1,13 @@
+import mongoose from 'mongoose';
+const Schema = mongoose.Schema;
+
+// Schema
+const browserActivitySchema = new Schema({
+	title: { type: String, required: true },
+	url: { type: String, required: true },
+	favicon: { type: String, required: true },
+	startTime: { type: Date, required: true },
+	endTime: { type: Date, required: true },
+});
+
+export default mongoose.model('browserActivity', browserActivitySchema);
diff --git a/packages/server/routes/browseractivity.routes.js b/packages/server/routes/browseractivity.routes.js
@@ -0,0 +1,10 @@
+import express from 'express';
+import auth from '../middlewares/auth.js';
+import { browser_activity_controller } from '../controllers/index.js';
+
+const router = express.Router();
+
+router.get('/', auth, browser_activity_controller.all_activities);
+router.post('/', auth, browser_activity_controller.activity_create);
+
+export default router;
diff --git a/packages/server/routes/root.routes.js b/packages/server/routes/root.routes.js
@@ -8,6 +8,7 @@ router.get('/', (req, res) => {
 	const routes = {
 		apps: `http://localhost:${port}/api/apps`,
 		activities: `http://localhost:${port}/api/activities`,
+		browseractivities: 'http://localhost:3000/api/browseractivities',
 	};
 	if (!useLocal) routes.users = `http://localhost:${port}/api/users`;
 	res.json(routes);